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
    486 Posts 83 Posters 943.0k Views 83 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.
    • A Offline
      andyriot
      last edited by

      while using the “month” view is it possible to hide the previous/next month day slots?

      I would like to only show this month Day 1 - Day 30/1

      1 Reply Last reply Reply Quote 0
      • J Offline
        JohnBachini @Doudy
        last edited by

        @Doudy
        Hi,

        Did you manage to work out how to change from MM/DD to DD/MM ? As I have same problem.

        Thanks

        @Doudy Great, ill give that a go Thanks

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

          Hi everybody,
          first of all. Great Work with MM and the calendarExt2 Module.

          I was wondering, is there a way to hide those date informations on fullday events in daily and upcoming view.
          Crawled the through the topic, put didn’t found something.

          9037bea7-4554-4b19-bde8-a4ab91bcf06e-image.png

          I’m pretty sure, u have to do it with css. but i can’t figure it out. can anybody pls help me?

          P 1 Reply Last reply Reply Quote 0
          • S Offline
            SARCux @vulkandosii
            last edited by

            @vulkandosii your screen looks very well. Can you send me your background?

            1 Reply Last reply Reply Quote 0
            • B Offline
              BenGregg01
              last edited by

              @Sean Is there a way to move the time to the bottom right of the event cell like in daily view, instead of it being on the left of the event title for monthly view

              1 Reply Last reply Reply Quote 0
              • P Offline
                pillbug22 @SuperSense
                last edited by pillbug22

                @SuperSense
                In case you haven’t found this yet, try looking in MMM-CalendarExt2.css , then look for the CSS block for

                .CX2 .period.daily .event.fullday.oneday .startDate {
                  display:inline;
                }
                

                Change the “inline” to “none” and see if that does what you are looking for.

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

                  @Sean got a question if you could help
                  I set up my magic mirror following all documentation. But I am having an issue with the MMM-Calendarext2 module.

                  I configured it how I want, the top left calendar works and shows where it should, but I can’t seem to get the monthly calendar in the bottom_bar, it just covers the whole screen layered on top of the other modules.
                  I have been trying on my own for a month, any help or direction would be helpful. Thanks!

                  I want it to look exactly like the example here: https://github.com/MMM-CalendarExt2/MMM-CalendarExt2/blob/master/doc/Configuration.md

                  Here is my code:

                  module: ‘MMM-CalendarExt2’,
                  config: {
                  calendars : [
                  {
                  name: “Jolliffe Activities”,
                  url: "https://calendar.google.com/calendar/ical/ //took out the rest of url.
                  },
                  ],
                  views: [
                  {
                  mode: “upcoming”,
                  position:“top_left”,
                  title: “Jolliffe Upcoming Activities”,
                  },
                  {
                  mode: “month”,
                  position: “bottom_bar”,
                  title: “Jolliffe Monthly Activities”,
                  slotSubTitleFormat: “dddd”,
                  slotMaxHeight: “120px”,
                  monthFormat: “[Month:]MM”,},],scenes: [ { name: “DEFAULT”,views: [], },],},
                  },

                  1 Reply Last reply Reply Quote 0
                  • S Offline
                    SuperSense @pillbug22
                    last edited by

                    @pillbug22 thanks for the advice. works fine! :)
                    (and sry for the late response)

                    1 Reply Last reply Reply Quote 0
                    • BKeyportB Offline
                      BKeyport Module Developer
                      last edited by

                      If anyone is working on this module anymore - I’m having an interesting bug. It appears that just having the module installed is causing an issue with MM - if I don’t have MMM-CalendarExt2 enabled or in the config.js - the mirror will come up blank.

                      Any ideas why?

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

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

                        @BKeyport i believe no-one is working on the module at this time.

                        Sam

                        How to add modules

                        learning how to use browser developers window for css changes

                        1 Reply Last reply Reply Quote 0
                        • V Offline
                          Vauxdvihl
                          last edited by

                          Hello all,
                          one question
                          I was trying to filter from an ics datas and sign them to other icons, colors and so on…
                          But unfortunately nothing happend and i am really confused because i am sitting here for days and i really do not know the bug

                          {//MMM-CalendarExt2
                          		  module: 'MMM-CalendarExt2',
                          		  config: {
                          			locale: "de-DE",
                          			calendars : [
                          				  {
                          					name: "Ferien Bayern",
                          					url: "http://www.ecoline-media.de/ics/bayern_gf.ics",
                          					className: "Ferien",
                          					icon: "noto-v1:flag-for-germany",
                          				  },
                          				 {
                          					name: "Müllabfuhr",
                          					url: "http://localhost:8080/modules/abfallkalender.ics",
                          					transform: (event)=>{
                          										  if (event.title.search("Biotonne") > -1) { // If the event might include "Birthday" in its title,
                          											event.icon = "mdi-bio" // Set icon of that event to "fxemoji-birthdaycake"
                          											event.className = "AbfallBio"
                          										  }
                          										 
                          										  if (event.title.search("Restmuelltonne") > -1) { // If the event might include "Birthday" in its title,
                          											event.icon = "fa-solid:trash" // Set icon of that event to "fxemoji-birthdaycake"
                          											event.className = "AbfallRest"
                          										  } 
                          										  
                          										  if (event.title.search("Problemabfaelle") > -1) { // If the event might include "Birthday" in its title,
                          											event.icon = "emojione-monotone:biohazard" // Set icon of that event to "fxemoji-birthdaycake"
                          											event.className = "AbfallProb"
                          										  } 
                          										  
                          										  if (event.title.search("Papiertonne") > -1) { // If the event might include "Birthday" in its title,
                          											event.icon = "emojione-monotone:newspaper" // Set icon of that event to "fxemoji-birthdaycake"
                          											event.className = "AbfallPap"
                          										  } 
                          										  
                          										  if (event.title.search("Gelber Sack") > -1) { // If the event might include "Birthday" in its title,
                          											event.icon = "fa-solid:trash" // Set icon of that event to "fxemoji-birthdaycake"
                          											event.className = "AbfallGelb"
                          										  } 
                          										  
                          										  return event // Return that event.
                          											},//transform*/
                          					},
                          

                          Can please somebody help me
                          Thanks a lot

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

                            Hello,
                            I understand that this module currently has no one supporting it but this is a general question concerning this module(I am a total new bee)
                            Here is my entry into config.js and everything works fine except I see no entry from MMM-CalendarExt2. Can anyone tell me what I’m doing wrong ? The default calendar works fine with these google calendars.

                            {
                              module: 'MMM-CalendarExt2',
                              position: "top_left",
                              rotateInterval: 1000*60,
                              config: {
                                calendars : [
                                  {
                                    url:"webcal://www.calendarlabs.com/ical-calendar/ics/76/US_Holidays.ics",
                                  },
                                ],
                            views: [
                                      { 
                                        name: "view1",
                                        mode: "month",
                                        slotCount: "7",
                                        maxItems: "1000",
                                        hideOverflow: false,
                                        slotMaxHeight: "95px",
                                        monthFormat: "MMMM YYYY",
                                        position: "top_left",
                                        calendars: []
                                      },
                                    ],
                                scenes: [
                                  {
                                    name: "DEFAULT",
                                  },
                                ],
                              },
                            },
                            
                            BKeyportB 1 Reply Last reply Reply Quote -1
                            • BKeyportB Offline
                              BKeyport Module Developer @steverichab
                              last edited by

                              @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

                                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 Reply Quote 0
                                • R Offline
                                  rmcelwee
                                  last edited by rmcelwee

                                  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%;
                                  }
                                  
                                  
                                  BKeyportB 1 Reply Last reply Reply Quote 0
                                  • BKeyportB Offline
                                    BKeyport Module Developer @rmcelwee
                                    last edited by

                                    @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 Reply Quote 0
                                    • R Offline
                                      rmcelwee @BKeyport
                                      last edited by

                                      @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;
                                      }

                                      BKeyportB 1 Reply Last reply Reply Quote 0
                                      • BKeyportB Offline
                                        BKeyport Module Developer @rmcelwee
                                        last edited by BKeyport

                                        @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

                                          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!!

                                          BKeyportB R 2 Replies Last reply Reply Quote 0
                                          • BKeyportB Offline
                                            BKeyport Module Developer @DJ6sTep
                                            last edited by

                                            @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 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
                                            • 7
                                            • 8
                                            • 9
                                            • 10
                                            • 11
                                            • 24
                                            • 25
                                            • 9 / 25
                                            • 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