MMM-CalendarExt3

[kasperinline]

@kasperinline said in MMM-CalendarExt3:

@fedale
I’m not able to get rid of the text “CW”. Can you help me, by sharing your lines.

Regards

Got i’t by myself, and learned a little more :-)

.CX3 .cw::before {
content: "CW ";
display: none;
}

[MMRIZE]

@kasperinline
Do that in your ‘custom.css’ not in the ‘MMM-CalendarExt3.css’

[kasperinline]

@MMRIZE said in MMM-CalendarExt3:

@kasperinline
Do that in your ‘custom.css’ not in the ‘MMM-CalendarExt3.css’

Yes of course :-)

Always in the ‘custom.css’

[Studio472]

I have an MLB calendar displaying my favorite team. West coast evening games span 2 days in my calendar (which looks goofy).

Is there a way to transform an event to only run 1 hour so it displays in a single day?

[MMRIZE]

@Studio472
I think it could be possible with preProcessor, but I’m not in front of my computer, so cannot show example at this moment.

[MMRIZE]

@Studio472
Config:

eventTransformer: (event) => {
  if (event.calendarName === 'MLB') { // I assume you assigned 'MLB' as a calendar name.
    event.endDate = event.startDate + 1000 // I think 1000ms is safer than 1 hour
  }
  return event
},

Before:

After:

[Fjerdrumsmoen]

Hi

Need some help here.
Trying to get this module to work, but only the “header” of the month is showing. No events is listing, and no dates are showing. In the GoogleCalender module I can see the events, so I know that the GoogleCalender is working.

Do someone know what is wrong? My config file is like this:

		{
			module: 'MMM-GoogleCalendar',
			header: "Familie Kalender",
			position: "top_left",
			config: {
				calendars: [
					{
						color: "red",
						name: "FK",
						broadcastPastEvents: true, // <= IMPORTANT to see past events
						calendarID: "GOOGLE ID_ deleted from the code"
					}
						// add another calendar HERE if needed
				]
			}
		},
		{
			 module: "MMM-CalendarExt3",
			 position: "bottom_center",
			 title: "Familie kalenderen",
			 config: {
				mode: "month",
				instanceId: "basicCalendar",
				locale: 'de-DE',
				maxEventLines: 5,
				firstDayOfWeek: 1,
				calendarSet: ['FK']
			  }
			},

[sdetweil]

@Fjerdrumsmoen calendarExt3 gets its data from the default calendar module…

so you have to configure it, and just comment out the position: setting…

[sdetweil]

@Fjerdrumsmoen said in MMM-CalendarExt3:

module: ‘MMM-GoogleCalendar’,

no, use

module: "calendar"

[Fjerdrumsmoen]

Hmm. All empty when I use the calendar module, also. Tested with the US holidays, and everything stays blank. (Without the heading)

Any other tips?

[sdetweil]

@Fjerdrumsmoen 1st
w default cal module, does the calendar display?
(before u comment out position)

did u try the default ext3 config?

I used the default ext3 config from doc, with the holidays
commented out calendarSet, and locale…

{
  module: "MMM-CalendarExt3",
  position: "bottom_bar",
  title: "",
  config: {
    mode: "month",
    instanceId: "basicCalendar",
   // locale: 'de-DE',
    maxEventLines: 5,
    firstDayOfWeek: 1,
    //calendarSet: ['us_holiday', 'abfall', 'mytest'],

  }
},

got

[MMRIZE]

@Fjerdrumsmoen
For google calendar you need some additional config. See the readme.md more.

[Fjerdrumsmoen]

Thanks. Now it shows :-)

But not with Google account.
Should i put in this code in the config.js?

preProcessor: (e) => {
  e.startDate = new Date(e.start?.date || e.start?.dateTime).valueOf()
  e.endDate = new Date(e.end?.date || e.end?.dateTime).valueOf()
  e.title = e.summary
  e.fullDayEvent = (e.start?.date) ? true : false
  return e
}

[sdetweil]

@Fjerdrumsmoen just use the Google url instead of the holidays… does it show in default calendar?
no… fix that

[MMRIZE]

@Fjerdrumsmoen
In CX3 module config not global or calendar module.

[MMRIZE]

1.4.0 (2023-06-04)

• ADDED (Experimental) Show popover of event details on click/touch (Chrome 114 or Electron 25 needed)

See https://github.com/MMRIZE/MMM-CalendarExt3/discussions/80

• FIXED Clarify code for using MMM-GoogleCalendar module #78 (Thanks to @jcherniak)
• UPDATED Updated CX3_Shared submodule #76 / More robust oppositeColor calculation. (Thanks to @btastic)

Preview video is here: https://github.com/MMRIZE/public_ext_storage/issues/1

[luisestrada]

@MMRIZE This is awesome!! Congrats!!!
Unfortunately I don’t have a touch screen but this opens a new world of possibilities for those who have.

[MM19198]

How do I use MMM-CalendarExt3 to show events from MMM-GoogleCalendar? I have MMM-GoogleCalendar setup and it’s displaying events. However, I tried adding MMM-CalendarExt3 to the config and it won’t display anything. Any help is much appreciated.

My config file…

{
	module: "MMM-GoogleCalendar",
	header: "Family Calendar",
	position: "top_left",
	classes: "calendar-agenda",
	config: {
		calendars: [
			{
				symbol: "calendar-week",
				calendarID: "myemail@gmail.com",
				name: "mycalendar"
			},
		],
		fade: false,
		maximumNumberOfDays: 5,
		showlocation: true,
		tableClass: "medium",
		
	}
},
{
	module: "MMM-CalendarExt3",
	position: "top_left",
	config: {
		instanceID: "I-calendar-month",
		calendarSet: ['mycalendar'],
		weeksInView: 3
	}
},

[BKeyport]

@MM19198 https://github.com/MMRIZE/MMM-CalendarExt3#compatible-with-randombrainstormermmm-googlecalendar

There’s a config snippet there to make it work.

[MM19198]

@BKeyport I appreciate the quick reply. I tried adding that but unfortunately it didn’t change anything.

Is there anything I need to do with eventNotification?

{
	module: "MMM-GoogleCalendar",
	header: "Family Calendar",
	position: "top_left",
	classes: "calendar-agenda",
	config: {
		calendars: [
			{
				symbol: "calendar-week",
				calendarID: "myemail@gmail.com",
				name: "mycalendar"
			},
		],
		fade: false,
		maximumNumberOfDays: 5,
		showlocation: true,
		tableClass: "medium",
		
	}
},
{
	module: "MMM-CalendarExt3",
	position: "top_left",
	title: "Family Calendar EXT3",
	config: {
		mode: "week",
		instanceID: "I-calendar-month",
		calendarSet: ['mycalendar'],
		weeksInView: 3,
		preProcessor: (e) => {
			if (e.start?.dateTime) {
				  e.startDate = new Date(e.start.dateTime).valueOf()
			} else if (e.start?.date) {
				  e.startDate = new Date(`${e.start.date}T00:00:00`).valueOf()
			}

			if (e.end?.dateTime) {
				  e.endDate = new Date(e.end.dateTime).valueOf()
			} else if (e.end?.date) {
				  e.endDate = new Date(`${e.end.date}T00:00:00`).valueOf()
			}

			e.title = e.summary
			e.fullDayEvent = (e.start?.date) ? true : false
			return e
		}
	}
},