MagicMirror Forum
    • Recent
    • Tags
    • Unsolved
    • Solved
    • MagicMirror² Repository
    • Documentation
    • 3rd-Party-Modules
    • Donate
    • Discord
    • Register
    • Login
    A New Chapter for MagicMirror: The Community Takes the Lead
    Read the statement by Michael Teeuw here.

    MMM-CalendarExt3

    Scheduled Pinned Locked Moved Utilities
    689 Posts 82 Posters 2.9m Views 86 Watching
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • T Offline
      thegooroo @sdetweil
      last edited by

      @sdetweil Awesome! Many thanks!

      1 Reply Last reply Reply Quote 0
      • A Offline
        almightyyoshi
        last edited by

        Is there a way to remove the space where a symbol would be only for calendars not using a symbol?

        S 1 Reply Last reply Reply Quote 0
        • S Do not disturb
          sdetweil @almightyyoshi
          last edited by

          @almightyyoshi yes

          add

          classes:"........ some_arbitrary_string "
          //like this
          classes:"foo",
          

          after the module: line
          to the instance you dont want the symbols to show

          then use

          .arbitrary_string .symbol {
               display:none;
          }
          /*like this */
          .foo .symbol {
               display:none;
          }
          

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          S 1 Reply Last reply Reply Quote 0
          • S Do not disturb
            sdetweil @sdetweil
            last edited by

            I think you can add the caledar_name selector too
            from the ext3 doc

            .event` : Every event has this selector. Each event could have these class names together by its condition.
              - `.continueFromPreviousWeek`, `.continueToNextWeek`
              - `.calendar_{calendarName}`    <------- 
            

            Sam

            How to add modules

            learning how to use browser developers window for css changes

            1 Reply Last reply Reply Quote 0
            • S Offline
              S374n
              last edited by

              Hello,

              Is it possible to scroll this calendar with a button on GPIO, next month or prev month? Where can i find more details on this please, found some ideas but not this specific calendar.

              Thank you.

              S 1 Reply Last reply Reply Quote 0
              • S Do not disturb
                sdetweil @S374n
                last edited by sdetweil

                @S374n you can use mmm-pages, create three pages
                Three instances of ext3. One on each page,

                mode:“month”
                monthIndex: 0/1/2. For this month, next month and month after that (-1 for month before current)

                Mmm-page-indicator creates buttons you can customize look w css, and will let you Move between pages on demand , pages also rotates

                Sam

                How to add modules

                learning how to use browser developers window for css changes

                S 1 Reply Last reply Reply Quote 0
                • S Offline
                  S374n @sdetweil
                  last edited by

                  @sdetweil Thank you for the idea. I’ll look into it.

                  1 Reply Last reply Reply Quote 0
                  • B Offline
                    bicolorbore586 @MMRIZE
                    last edited by

                    Hi,
                    My MagicMirror has been out of action for a few months now, mainly due to a kitchen renovation, but am looking at getting it back up and running.

                    I’d previously had MMM-CalendarExt3 working with a few different calendars, notably a birthday calendar, where it would show an icon in the cell header.
                    1e6a70c5-279b-4b18-8103-21e4b439440d-image.png
                    However since updating the MagicMirror software it no longer seems possible to do. Below is the module extract from config.js, and is what has been previously used. Now upon starting MM with this in place I’m told [ERROR] Your configuration file contains syntax errors :( ‘document’ is not defined.

                    Anyone able to assist with what the issue is and how to resolve it?

                    	{
                    
                    		module: "MMM-CalendarExt3", //https://github.com/MMRIZE/MMM-CalendarExt3
                    
                    		position: "lower_third",
                    
                    		//header: "FamCal",
                    
                    		config: {
                    
                    			mode: "month",
                    
                    			useWeather: false,
                    
                    			weekIndex: 0,
                    
                    			weeksInView: 5,
                    
                    			instanceId: "basicCalendar",
                    
                    			locale: "en-GB",
                    
                    			maxEventLines: 6,
                    
                    			firstDayOfWeek: 1,
                    
                    			headerWeekDayOptions: {weekday: "short"},
                    
                    			refreshInterval: 60 * 10 * 1000, // 3600000, // every hour // 60 * 10 * 1000, // too frequent refresh. 10 minutes is enough.
                    
                    			calendarSet: ["Family Calendar", "UK Holidays", "Birthday",],
                    
                    			manipulateDateCell: (cellDom, events) => {
                    
                    				if (Array.isArray(events) && events.some(e => e.calendarName === 'Birthday')) {
                    
                    					let dateIcon = document.createElement ('span')
                    
                    					dateIcon.classList.add ('fa', 'fa-fas', 'fa-fw', 'fa-gift')
                    
                    					dateIcon.style.color = 'cornflowerblue'
                    
                    					let header = cellDom.querySelector ('.cellHeader')
                    
                    					let celldate = header.querySelector ('.cellDate')
                    
                    					header.insertBefore (dateIcon, celldate)
                    
                    				}
                    
                    			},
                    
                    			eventTransformer: (ev) => 	{
                    
                    				if (ev.calendarName === 'Birthday') ev.skip = true
                    
                    				else if (ev.title.search("B -") > -1) ev.color = "brown"
                    
                    				else if (ev.title.search("C -") > -1) ev.color = "hotpink"
                    
                    				else if (ev.title.search("E -") > -1) ev.color = "orange"
                    
                    				else if (ev.title.search("I -") > -1) ev.color = "green"
                    
                    				else if (ev.title.search("G") > -1) ev.color = "white"
                    
                    				else if (ev.title.search("Bday") > -1) ev.title = ""
                    
                    				return ev
                    
                    										},
                    
                    			eventPayload: (payload) => {
                    
                    				for (let ev of payload) {
                    
                    					if (ev.fullDayEvent) {
                    
                    						let gap = +ev.endDate - +ev.startDate
                    
                    						if (gap % (1000 * 60 * 60 * 24) === 0) {
                    
                    							ev.startDate = new Date(+ev.startDate).setHours(0, 0, 0, 0)
                    
                    							ev.endDate = new Date(+ev.startDate + gap).setMilliseconds(-1)
                    
                    						}
                    
                    					}
                    
                    				}
                    
                    				return payload
                    
                    			},
                    
                    
                    
                    		},
                    
                    	},
                    
                    S 2 Replies Last reply Reply Quote 0
                    • S Do not disturb
                      sdetweil @bicolorbore586
                      last edited by sdetweil

                      @bicolorbore586 can you do

                      cd ~/MagicMirror
                      npm run config:check
                      

                      does it produce the same error?
                      also do

                      node -c config/config.js
                      

                      if it returns and displays nothing, then node did not detect any syntax errors.

                      edit: I can reproduce this

                      Sam

                      How to add modules

                      learning how to use browser developers window for css changes

                      1 Reply Last reply Reply Quote 0
                      • S Do not disturb
                        sdetweil @bicolorbore586
                        last edited by sdetweil

                        @bicolorbore586 add this to the top of config.js, very first line

                        var document;

                        I’ll open a bug report
                        I opened https://github.com/MagicMirrorOrg/MagicMirror/issues/3990

                        Sam

                        How to add modules

                        learning how to use browser developers window for css changes

                        B 1 Reply Last reply Reply Quote 1
                        • B Offline
                          bicolorbore586 @sdetweil
                          last edited by

                          @sdetweil config:check returns the same error
                          The node one doesn’t produce anything

                          Adding var document; to the config.js gives parsing error unexpected keyword ‘var’

                          S 1 Reply Last reply Reply Quote 0
                          • S Do not disturb
                            sdetweil @bicolorbore586
                            last edited by

                            @bicolorbore586 very first line
                            Right?

                            Sam

                            How to add modules

                            learning how to use browser developers window for css changes

                            B 1 Reply Last reply Reply Quote 0
                            • B Offline
                              bicolorbore586 @sdetweil
                              last edited by

                              @sdetweil it wasn’t. Does it need to be before let config = { or the fist line after that?

                              S 1 Reply Last reply Reply Quote 0
                              • S Do not disturb
                                sdetweil @bicolorbore586
                                last edited by sdetweil

                                @bicolorbore586 very first line of the file, all by itself
                                Before any comments

                                Sam

                                How to add modules

                                learning how to use browser developers window for css changes

                                B 1 Reply Last reply Reply Quote 0
                                • B Offline
                                  bicolorbore586 @sdetweil
                                  last edited by

                                  @sdetweil that appears to have worked. Out of interest. What does that do?

                                  S 2 Replies Last reply Reply Quote 0
                                  • S Do not disturb
                                    sdetweil @bicolorbore586
                                    last edited by sdetweil

                                    @bicolorbore586 the module code you have used the global variable document to examine the web page contents

                                    The syntax checker found the use, but didn’t know that this code (config.js is a JavaScript file) was loaded in a browser
                                    So it reported use of an undeclared variable

                                    The fix was to declare the variable as a global so the checker will be happy

                                    Sam

                                    How to add modules

                                    learning how to use browser developers window for css changes

                                    1 Reply Last reply Reply Quote 1
                                    • S Do not disturb
                                      sdetweil @bicolorbore586
                                      last edited by

                                      @bicolorbore586 there is a fix for this in the next release.

                                      Sam

                                      How to add modules

                                      learning how to use browser developers window for css changes

                                      1 Reply Last reply Reply Quote 1

                                      Hello! It looks like you're interested in this conversation, but you don't have an account yet.

                                      Getting fed up of having to scroll through the same posts each visit? When you register for an account, you'll always come back to exactly where you were before, and choose to be notified of new replies (either via email, or push notification). You'll also be able to save bookmarks and upvote posts to show your appreciation to other community members.

                                      With your input, this post could be even better 💗

                                      Register Login
                                      • 1
                                      • 2
                                      • 13
                                      • 14
                                      • 15
                                      • 16
                                      • 17
                                      • 34
                                      • 35
                                      • 15 / 35
                                      • First post
                                        Last post
                                      Enjoying MagicMirror? Please consider a donation!
                                      MagicMirror created by Michael Teeuw.
                                      Forum managed by Sam, technical setup by Karsten.
                                      This forum is using NodeBB as its core | Contributors
                                      Contact | Privacy Policy