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
    687 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 Offline
      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 Offline
            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 Offline
              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 Offline
                  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 Offline
                        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
                        • 1
                        • 2
                        • 65
                        • 66
                        • 67
                        • 68
                        • 69
                        • 68 / 69
                        • 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