MMM-CalendarExt3

[1a2a3a]

@MMRIZE hi, can i know how to change eventheight in cx3? whenever i try to custom change the value, it is overwritten by the default element style which i have no access to it…

[MMRIZE]

@1a2a3a
https://github.com/MMRIZE/MMM-CalendarExt3/blob/main/README.md

[1a2a3a]

@MMRIZE read and don’t understand which was what I did.

I input —eventheight into my custom css but nothing seems to change

Edit:
Oh set in config. Let me try

[1a2a3a]

@MMRIZE did something change? i did a git pull update and now my calendar ext 3 is missing.

[sdetweil]

@1a2a3a did you npm install in the module folder again?

[1a2a3a]

@sdetweil yes i deleted it and reinstall. seems to be working fine now

[sdetweil]

@1a2a3a he has a part called a submodule, that needs npm install to connect it

so you didn’t need to clone again, just run npm install

[crisvdn]

Hi there,

Installed your module which is really nice.
I have one question though.
At start up, it fetches all calendar’s I am using. However, it rendered and showed the calendars on the mirror before fetching. So its missing.

Obviously you can fix that by having a faster fetchInterval. But I feel that is kind of unnecessary, since you dont make changes in your agenda by the minute.

Is there a way to Fetch, and only populate the calendar on the mirror after all fetching is done?

Regards, Cris

[MMRIZE]

@crisvdn
There is ‘waifFetch’ config value to wait enough time.

[Splashed]

@MMRIZE

I am having some issues where events show up in my Calendar Module, but don’t always show up in my CalendarExt3 module. For instance, I currently have 5 working calendars displaying the upcoming events via the calendar module. All five calendars are displaying their information.

Currently though, only three of those calendars are showing in my monthly view of CalendarExt3. Sometimes, if I remove one or two of the calendars that do display, then I can get the ones that didnt work to show up on CalendarExt3. Currently however, I have removed all but two calendars, and still only one of them is displaying.

Overall, I have about 8 calendars Id like to link, and Ive never gotten more than about 4-5 to work at once, despite the fact that I can get them all to show in the Calendar module at the same time.

Any suggestions? I can post more details if desired.

[sdetweil]

@Splashed the default calendar clips off the broadcast events using the

maximumEntries

property. the doc says the max is 100, but that is never checked

it can be set above the calendars list
and this value is used for the TOTAL number of events sent
the code

return events.slice(0, this.config.maximumEntries);

or can also be set in a particular calendar

note that this size INCLUDES the PAST events if broadcastPastEvents:true
is set

[MMRIZE]

@Splashed
Maybe one of reason was mentioned by @sdetweil,
The other reason might be fetching finish synchronization issue. When you operate many calendars to fetch, some calendars might not end fetching before drawing CX3 due to hw performance, internet speed, server’s issue, etc.
There would be 2 general solution.

• wait for next refreshing cycle. The fetching of calendars may be completed until then.
• Or you can use ‘waitFetch’ config value to delay the rendering view.

[crisvdn]

@MMRIZE Thanks for your response. That actually did this.

The config name is a bit confusing though. It implies waiting to fetch the calendars?
Anyways, thank you for this awesome module :D

[gonzonia]

I’ve been using MMM-CalendarExt3 for a while now and all is good. Suddenly I’ve got a single event that’s an hour off. The events for the rest of the day are fine, and the time is correct on all other methods (Google Calendar, BusyCal, iOS Calendar).

[MMRIZE]

@gonzonia Could you send me the ice file(or downloadable url) and your config? (eouia0819@gmail.com)

[Splashed]

@MMRIZE Seems like you are correct with the refreshing interval. If I simply exercise patience and give it 5-10 minutes then all of my calendars do load.

[wperry530]

Hello all!

New to building out my magic mirror, and I’m running into a problem. If I understand correctly, this module would allow me to click an event from my google calendar and see the details. When I run the module, I am not getting that feature.

Is it something I’m doing wrong or am I misunderstanding something? Below is my config, and I have installed the lastest version of Electron.

{
  module: "calendar",
  header: "My Calendar",
  config: {
    calendars: [
      {
        symbol: "calendar",
        url: "**super secret**", // Replace with your actual Google Calendar ICS link
		name:"wes",
		color:"red"
      }
    ],
    maximumEntries: 10, // Number of events shown
    maximumNumberOfDays: 365, // Show events up to a year in advance
    displaySymbol: true, // Display the calendar symbol
    defaultSymbol: "calendar", // Default symbol if none specified for calendar
    // Other configuration options can be added here based on your preference
  }
},
{
  module: "MMM-CalendarExt3",
  position: "middle center",
  title: "",
  config: {
    mode: "week",
    instanceId: "basicCalendar",
    maxEventLines: 5,
    firstDayOfWeek: 0,
    calendarSet: ['wes']
  }

[MMRIZE]

@wperry530
Not only popover feature is not abled? Or some other symptom you have?
If only popover doesn’t work, What browser and version do you use? (Electron or Chromium version I need)

[wperry530]

@MMRIZE

I tried a fourth uninstall / reinstall along with rebooting and it started to work. Thank you for the quick response!

[1lolo94]

@MMRIZE - New to MagicMirror and need some help please! I finally got my calendar and google calendar sync’d… but now I lost my weather on the top right of the screen and for some reason the weather is showing for the next 5 days on the calendar - are these related?
Sorry my picture would not upload for some reason :(

	language: "en",
	locale: "en-US",
	logLevel: ["INFO", "LOG", "WARN", "ERROR"], // Add "DEBUG" for even more logging
	timeFormat: 12,
	units: "imperial",

	modules: [
		{
			module: "alert",
		},
		{
			module: "updatenotification",
			position: "top_bar"
		},
		{
			module: "clock",
			position: "top_left"
		},
 {
                        module: "MMM-CalendarExt3",
                        position: "bottom_bar",
                        title: "",
                        config: {
                          mode: "",
                          weekIndex: 0,
                          weeksInView: 4,
                          instanceId: "basicCalendar",
                          locale: 'en-EN',
                          maxEventLines: 5,
                          firstDayOfWeek: 0,
                          refreshInterval: 120000,
                          animationSpeed: 0,
                          useSymbol: false,
                          calendarSet: ['us_holiday','family'],
                }
                },
                {
                        module: "calendar",
                        position: "",
                        config: {
                          broadcastPastEvents: true,
                          calendars: [
                                {
                                  url: "webcal://www.calendarlabs.com/ical-calendar/ics/76/US_Holidays.ics",
                                  name: "us_holiday",
                                  color: "#6699ff"
                                }
                                        ]
                                }
                },
                {
                        module: "calendar",
                        position: "",
                        maximumNumberOfDays: 60,
                        config: {
                          animationSpeed: 0,
                          fetchInterval: 100000,
                          broadcastPastEvents: true,
                          useSymbol: false,
                          calendars: [
                                {
                                  url: "PRIVATE STUFF",                                 
				  name: "family",
                                  color: "yellow",
                                        user: 'xxxxxxxxxxx@gmail.com',
                                        pass: 'x',
                                        method: 'basic'
                                }
                                        ]
                                }
                },

		{
			module: "weather",
			position: "top_center",
			config: {
				weatherProvider: "openweathermap",
				type: "current",
				location: "xxxxx",
				locationID: "5x1x7xxx2xx078", //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find your city
				apiKey: "xxxxxxx",
				roundTemp: true,
			}
		},
		{
			module: "weather",
			position: "top_center",
			//header: "Weather Forecast",
			config: {
				weatherProvider: "openweathermap",
				type: "forecast",
				location: "xxxx",
				locationID: "51x72x0x78", //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find your city
				apiKey: "xxxxxx",
				fade: false,
				colored: "true",
				roundTemp: true,
			}
		},
	]
};

/*************** DO NOT EDIT THE LINE BELOW ***************/
if (type of module !== "undefined") { module.exports = config; }

CSS FILE (weather was working before adding calendar)

 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:8px;
}
.module.weather {
  background-color:rgba(255,255,255,0.5);
  border-radius:8px;
  padding:8px;
}
.module.weather {
  background-color:rgba(255,255,255,0.5);
  border-radius:8px;
  padding:8px;
  color: #000;
}
.dimmed {
/*  color: #666; */
    color: #000;
}
.normal {
/*  color: #999;*/
    color: #000;
}
.bright {
  color: #000;
}
.header {
  color: #000;
}
.MMM-CalendarExt3 {
        margin-bottom: -5px;
        width: 100%;
        height: 575px;
        font-size: 20px;
}
.CX3 .cw {
        display:none
}

.CX3 .event.singleday {
  border-left:4px solid var(--calendarColor);
}

.CX3 .event.singleday:not(.useSymbol)::before {
  content: '';
}