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.8m 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.
    • S Do not disturb
      sdetweil @p1lspeda
      last edited by sdetweil

      @p1lspeda I see the same bug, but not sure where it is

      a temp fix is to add this line to the CX3 config section

                minimalDaysOfNewYear:1,  // week number of 1st week in your country (should be 0 or 1) 
      

      there was an open issue on this inthe CX3 repo
      https://github.com/MMRIZE/MMM-CalendarExt3/issues/215

      I posted this workaround there too

      Sam

      How to add modules

      learning how to use browser developers window for css changes

      P 1 Reply Last reply Reply Quote 0
      • P Offline
        p1lspeda @sdetweil
        last edited by

        @sdetweil
        Great.
        Thanks for help (again!)

        1 Reply Last reply Reply Quote 0
        • K Offline
          kribbitykrab
          last edited by

          Hi folks,

          Trying to get MMM-CalendarExt3 working on my Pi Zero W running MM v2.30.0 and running into an issue where the calendar is blank. Relevant config.js below:

          {
             module: "calendar",
             config: {
                broadcastPastEvents: true,
                maximumEntries: 10000,
                colored: true,
                calendars: [
                    {
                         fetchInterval: 1* 60 * 1000,
                         symbol: "calendar-check",
                         name: "p_and_b",
                         color: "rgba(255, 0, 0, 1)",
                         url: "..."
                    },
                    {
                         fetchInterval: 1* 60 * 1000,
                         name: "cal2",
                         color: "rgba(0, 0, 255, 1)",
                         url: "..."
                    }
                 [
             }
          },
          {
             module: "MMM-CaendarExt3",
             position: "bottom_bar",
             title: "family dashboard",
             config: {
                mode: "month"
                instanceID: "basicCalendar",
                locale: 'en-US'
                maxEventLines: 5,
                firstDayOfWeek: 1,
                calendarSet: ["p_and_b", "cal2"]
             }
          },
          

          Can anyone help me understand why my monthly calendar is coming up blank and a workaround?

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

            @kribbitykrab ok, this is worse on pi 0w

            Ext3 gets the calendar events from the default calendar

            the calendar module fetches each url separately and broadcasts the events to other modules if they want to use them

            but EXT3 doesn’t want to flash redraw the cal each time a block of events show up

            so it also has a

            refreshInterval
            

            take whatever events have arrived since last time and display ( default 30 minutes)

            now there is another tuning thing
            if it drew immediately on startup it would be empty, cause startup is faster than fetch. but EXT3 doesn’t know how many cal urls might supply events.
            so there is the

            waitFetch 
            

            config parm (default 5 seconds)
            wait that long after startup before displaying any events
            then next will be updateinterval

            pi0w is SOOOOOOO slow ,no events arrive before waitFetch
            so next time is updateInterval time

            so you can adjust these some

            you are probably
            impacted by this bug too, timeout on the connection between front and back ends
            see https://forum.magicmirror.builders/post/127456

            Sam

            How to add modules

            learning how to use browser developers window for css changes

            K 1 Reply Last reply Reply Quote 0
            • K Offline
              kribbitykrab @sdetweil
              last edited by

              @sdetweil As always, thank you for the response!

              I added the pingInterval and pingTimeout lines to both MagicMirror/js/server.js and MagicMirror/js/socketclient.js as described in your link.

              I have also moved my fetchInterval into the config portion of my calendar module as you requested, and increased it to 10minutes. I added a waitFetch of 10sec into my MMM-CalendarExt3 module config, along with a refreshInterval of 10minutes.

              When I run MM now however, I am unable to reach localhost. I get an error on Midori booth that says Could not connect: Connection refused. Potentially something to do with the server.js and socketclient.js fiddling? Appreciate further guidance!

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

                @kribbitykrab i think you made a typo

                do

                npm run server
                

                Sam

                How to add modules

                learning how to use browser developers window for css changes

                1 Reply Last reply Reply Quote 0
                • T Offline
                  thegooroo
                  last edited by

                  Default CW display shows on desktop Firefox but not on Chrome/Electron when using the rpi as a display. It only show “CW 1” for each week.

                  Firefox shows the correct week number “CW 32” in this weeks case. My search-fu is not finding a fix for this.

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

                    @thegooroo see
                    https://forum.magicmirror.builders/post/127160

                    Sam

                    How to add modules

                    learning how to use browser developers window for css changes

                    T 1 Reply Last reply Reply Quote 0
                    • 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

                                            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
                                            • 3
                                            • 4
                                            • 5
                                            • 6
                                            • 7
                                            • 8
                                            • 34
                                            • 35
                                            • 6 / 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