• Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
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-CalendarExt2

Scheduled Pinned Locked Moved Utilities
484 Posts 82 Posters 666.0k Views 82 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.
  • B Offline
    BKeyport Module Developer @steverichab
    last edited by Oct 20, 2020, 8:39 AM

    @steverichab I’d name the calendar. The example is thus:

    {
        name: "US holiday",
        className: "holiday", // This allows you to modify it in css
        url: "http://www.calendarlabs.com/templates/ical/US-Holidays.ics",
      },
    

    Compare to a working config:

    		{
    			module: "MMM-Block",
    			position: "top_right",
    		},
    		{
    			module: "MMM-CalendarExt2",
    			config: {
    				calendars : [
    					{
    						url: "[private]",
    						name: "Main Calendar", // Optional, Recommended
    						maxItems: 99,
    						scanInterval: 1000*60*1, // every minute, Appt Book, needs this speed
    						beforeDays: 0,
    						afterDays: 999,
    						maxIterations: 999,
    						forceLocalTZ: false,
    					},
    					{
    						url: "http://www.trumba.com/calendars/seattle-seahawks-schedule.ics",
    						name: "Seahawks Calendar",
    						maxItems: 100,
    						scanInterval: 24*60*60*1000,
    						beforeDays: 0,
    						afterDays: 999,
    						maxIterations: 999,
    						forceLocalTZ: false,
    					},
    				],
    				views: [
    					{
    						mode: "daily",
    						position: "top_right",
    						slotCount: 99,
    						timeFormat:"h:mm A",
    						hideOverflow: false,
    						filterPassedEvent: true,
    						name: "Daily View",
    						className: "remove_empty_slot",
    						calendars: ["Main Calendar","Seahawks Calendar"],
    						transform: function(event) {
    							if (event.title.search("Recycle") > -1) {
    								event.icon = "mdi:recycle";
    								event.className = "lemay";
    							}
    							if (event.title.search("Yard Waste") > -1) {
    								event.icon = "entypo-leaf";
    								event.className = "lemay";
    							}
    							if (event.title.search("Seahawks") > -1) {
    								event.icon = "fa-solid:football-ball";
    								event.className = "seahawks";
    							}
    							return event;
    						},
    					},
    				],
    				scenes: [
    					{
    						name: "DEFAULT",
    					},
    				],
    			},
    		},
    

    The "E" in "Javascript" stands for "Easy"

    1 Reply Last reply Reply Quote 0
    • R Offline
      rmcelwee
      last edited by Nov 24, 2020, 6:24 AM

      My calendar flashes every 60 seconds but as far as I can tell, I have all my calendars updating every 180 seconds.

      
      					{
      			  module: 'MMM-CalendarExt2',
      			  config: {
      			   
      				calendars : [
      				  
      				  {
      				    className: "vacation",
      					scanInterval: "1000*180",
      					url: "https://calendar.google.com/calendar/ical/...",
      				  },
      				  {
      				    className: "nights",
      				    scanInterval: "1000*180",
      					url: "https://calendar.google.com/calendar/ical/...",
      				  },
      				  {
      				    className: "days",
      				    scanInterval: "1000*180",
      					url: "https://calendar.google.com/calendar/ical/...",
      				  },
      				  {
      				    className: "bob",
      				    scanInterval: "1000*180",
      					url: "https://calendar.google.com/calendar/ical/...",
      				  },
      				  {
      				    className: "bunny",
      				    scanInterval: "1000*180",
      					url: "https://calendar.google.com/calendar/ical/...",
      				  },
      				{
      				    className: "special",
      				    scanInterval: "1000*180",
      					url: "https://calendar.google.com/calendar/ical/...",
      				  },				    
      						],
      				views: [
      				  {
      					name: "view1",
      					mode: "week",
      					slotCount: 8,
      					maxItems: "1000",
      					hideOverflow: "false",
      					//slotMaxHeight: "64px",
      					slotMaxHeight: "105px",
      					monthFormat: "MMMM YYYY",
      					position: "bottom_bar",
      					updateInterval: "1000*180",
      					calendars: []
      					
      					 
      				  },
      				],
      				scenes: [
      				  {
      					name: "DEFAULT",
      				  },
      				],
      			  },
      			},
      
      
      R 1 Reply Last reply Jan 11, 2021, 1:40 PM Reply Quote 0
      • R Offline
        rmcelwee
        last edited by rmcelwee Nov 24, 2020, 6:48 AM Nov 24, 2020, 6:31 AM

        I would like to center the text on my events (or whatever they are called - the yellow, green, white, etc lines). I’ve tried a few things but it has not worked for me. My calendar position is “bottom_bar”.

        foto.png

        
        body {
          color: #000;
        }
        
        .dimmed {
          color: #000;
        }
        
        .normal {
          color: #000;
        }
        
        .bright {
          color: #000;
        }
        .module.clock {
          background-color:rgba(255,255,255,0.5);
          border-radius:8px;
          padding:56px;
          }
        .module.currentweather {
          background-color:rgba(255,255,255,0.5);
          border-radius:8px;
          padding:22px;
          }
        .module.weatherforecast {
          background-color:rgba(255,255,255,0.5);
          border-radius:8px;
          padding:8px;
          height: 200;
          }/*
         .MMM-GooglePhotos {
          margin-top: -300px;
          margin-left: -123;
            }*/
            #GPHOTO_INFO {
        	display:none;
        }
          #GPHOTO_BACK {
        	display:none;
        }
        .module.MMM-CalendarExt2 {
          background-color:rgba(255,255,255,0.5);
          height: 870px;
            }
        .CX2 .weeksmark {
        display:none;
        }
        .CX2 .vacation.fullday {
        background-color:#00FF00;
        color:#000;
        }
        .CX2 .nights.fullday {
        background-color:#009DFF;
        color:#000;
        }
        .CX2 .special.fullday {
        background-color:#FF0000;
        color:#000;
        }
        .CX2 .days.fullday {
        background-color:#FFFF00;
        color:#000;
        }
        /*.region.bottom_bar {
          text-align: center;
          }
        .CX2 .days.eventTitle {
        text-align:center;
        }*/
          .module.MMM-EventHorizon {
          background-color:rgba(255,255,255,0.5);
          border-radius:8px;
          padding:8px;
          }/*
        body {
          position: absolute;
          margin: 2;
          height: 100%;
          width: 99%;
        }*/
        .region.top.left {
          position: absolute;
          top: -52px;
          left: 0px;
          bottom: -2px;
          width: 270px;
          }
        .region.middle.center {
          width: 100%;
          left: -15px;
          top: 640px;
        }
        body {
          margin: 0;
          height: 100%;
          width: 100%;
        }
        
        
        B 1 Reply Last reply Nov 24, 2020, 7:12 AM Reply Quote 0
        • B Offline
          BKeyport Module Developer @rmcelwee
          last edited by Nov 24, 2020, 7:12 AM

          @rmcelwee

          .CX2 .[view_mode] .eventTitle {
            text-align:center;
          }
          

          eg:

           .CX2 .daily .eventTitle {
            text-align:center;
          }
          

          The "E" in "Javascript" stands for "Easy"

          R 1 Reply Last reply Nov 24, 2020, 7:45 AM Reply Quote 0
          • R Offline
            rmcelwee @BKeyport
            last edited by Nov 24, 2020, 7:45 AM

            @BKeyport said in MMM-CalendarExt2:

             .CX2 .daily .eventTitle {
              text-align:center;
            }
            

            This is not working for me for some reason???

            .CX2 .week .eventTitle {
            text-align:center;
            }

            B 1 Reply Last reply Nov 25, 2020, 12:12 AM Reply Quote 0
            • B Offline
              BKeyport Module Developer @rmcelwee
              last edited by BKeyport Nov 25, 2020, 12:46 AM Nov 25, 2020, 12:12 AM

              @rmcelwee Looks like that’s the only one that isn’t assigned a class for CSS, I can’t find anything in the defaults that’ll do what you want.

              Sorry.

              The "E" in "Javascript" stands for "Easy"

              1 Reply Last reply Reply Quote 0
              • D Offline
                DJ6sTep
                last edited by DJ6sTep Jan 10, 2021, 10:09 PM Jan 10, 2021, 10:05 PM

                20210110_170629.jpg
                I’m a noob to this MM/java stuff, so please be patience with me. I just need help with a few things:

                • How do I move the position of my calendar so it’s above my WIFI-PASSWORD module?
                • How do I remove the weekly count on the left side of the calendar (ie- 1st week, 2nd week, etc)?
                • Is there any way I could make the calendar size smaller? So it doesn’t take up the whole screen?
                • Why did the calendar move my garbage & recycling icons to the far right, covering the temperature?

                Really appreciate the help & this module is so sick!!

                B R 2 Replies Last reply Jan 10, 2021, 10:16 PM Reply Quote 0
                • B Offline
                  BKeyport Module Developer @DJ6sTep
                  last edited by Jan 10, 2021, 10:16 PM

                  @DJ6sTep said in MMM-CalendarExt2:

                  • How do I move the position of my calendar so it’s above my WIFI-PASSWORD module?

                  normally, the order of things coming up is determined by the order in config.js - however, in this case, the module is using a fake container, so it’ll load AFTER everything else. It’s best to use it’s own region for it.

                  see: https://forum.magicmirror.builders/topic/286/regions?_=1610316572966

                  • How do I remove the weekly count on the left side of the calendar (ie- 1st week, 2nd week, etc)?

                  Take a look at https://github.com/MMM-CalendarExt2/MMM-CalendarExt2/blob/master/docs/Configuration/Views/week%2C-month.md

                  in particular weeksFormat

                  • Is there any way I could make the calendar size smaller? So it doesn’t take up the whole screen?

                  Yep. Change your view and/or region.

                  • Why did the calendar move my garbage & recycling icons to the far right?

                  The calendar wedges itself into a region, and expands the region to fit. the icons must be right justified.

                  Be aware that the author of the module has left the project, and nobody has picked it up, so we’re just helping from what we know.

                  Good luck.

                  The "E" in "Javascript" stands for "Easy"

                  D 1 Reply Last reply Jan 11, 2021, 6:06 AM Reply Quote 0
                  • D Offline
                    DJ6sTep @BKeyport
                    last edited by Jan 11, 2021, 6:06 AM

                    @BKeyport I was able to get my calendar in the position I want now. Thanks so much for all the great info man.

                    Still having these issues:

                    • What parameter do I use for weeksFormat? I tried using false & disabled & it still didn’t remove the weekly count on the left. I couldn’t find any of the parameter options in the link you posted.
                    • I’m having issues finding info on how to resize my calendar & how to resize the font size of events inside a date.

                    I really appreciate the support & your quick response to my questions man.

                    B R 2 Replies Last reply Jan 11, 2021, 8:12 AM Reply Quote 0
                    • B Offline
                      BKeyport Module Developer @DJ6sTep
                      last edited by Jan 11, 2021, 8:12 AM

                      @DJ6sTep

                      @DJ6sTep said in MMM-CalendarExt2:

                      @BKeyport I was able to get my calendar in the position I want now. Thanks so much for all the great info man.

                      Still having these issues:

                      • What parameter do I use for weeksFormat? I tried using false & disabled & it still didn’t remove the weekly count on the left. I couldn’t find any of the parameter options in the link you posted.

                      Try

                      weeksFormat: "",
                      

                      in the view section of your config. Effectively, that tells it to display nothing.

                      • I’m having issues finding info on how to resize my calendar & how to resize the font size of events inside a date.

                      That sounds like css, and honestly, even though I’ve written a module, I’m lost when it comes to css, someone else should see this and help, hopefully.

                      The "E" in "Javascript" stands for "Easy"

                      M 1 Reply Last reply Jul 7, 2021, 12:48 AM Reply Quote 0
                      • 1
                      • 2
                      • 34
                      • 35
                      • 36
                      • 37
                      • 38
                      • 48
                      • 49
                      • 36 / 49
                      • 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