MMM-CalendarExt3

[sdetweil]

@thegooroo see
https://forum.magicmirror.builders/post/127160

[thegooroo]

@sdetweil Awesome! Many thanks!

[almightyyoshi]

Is there a way to remove the space where a symbol would be only for calendars not using a symbol?

[sdetweil]

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

[sdetweil]

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}`    <------- 

[S374n]

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.

[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

[S374n]

@sdetweil Thank you for the idea. I’ll look into it.

[bicolorbore586]

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.

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

			},



		},

	},

[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

[sdetweil]

@bicolorbore586 add this to the top of config.js, very first line

var document;

I’ll open a bug report
I opened https://github.com/MagicMirrorOrg/MagicMirror/issues/3990

[bicolorbore586]

@sdetweil config:check returns the same error
The node one doesn’t produce anything

Adding var document; to the config.js gives parsing error unexpected keyword ‘var’

[sdetweil]

@bicolorbore586 very first line
Right?

[bicolorbore586]

@sdetweil it wasn’t. Does it need to be before let config = { or the fist line after that?

[sdetweil]

@bicolorbore586 very first line of the file, all by itself
Before any comments

[bicolorbore586]

@sdetweil that appears to have worked. Out of interest. What does that do?

[sdetweil]

@bicolorbore586 the module code you have used the global variable document to examine the web page contents

The syntax checker found the use, but didn’t know that this code (config.js is a JavaScript file) was loaded in a browser
So it reported use of an undeclared variable

The fix was to declare the variable as a global so the checker will be happy

[sdetweil]

@bicolorbore586 there is a fix for this in the next release.