@Kobose
Sorry, That module uses some state-of-the-art ECMA standard scripts, and Pi0 is too old. I cannot promise Pi0 could handle the module.

@monark
Unfortunately, those calendars are not widget so you cannot insert them into your website or MagicMirror.
And those are not providing ics or json format directly so you cannot use calendar module also.
A dedicated module to access the data with their own API should be needed.

@BKeyport
Your DOM might not be rendered yet on “start” imo. I think manipulating DOM after “DOM_OBJECT_CREATED” notification would be safer.

How about this? not tested.

start: function () {
  this.dailyTimer = null
  const moment = new Date()
  const midnight = new Date(moment.getFullYear(), moment.getMonth(), moment.getDate() + 1, 0, 0, 0, 0)
  const toMidnight = midnight - moment
  setTimeout(() => {
    this.doSomething()
  }, toMidnight)
},


doSomething: function () {
  clearTimeout(this.dailyTimer)
  this.dailyTimer = null
  // Do your job here.
  this.dailyTimer = setTimeout(() => {
    this.doSomething()
  }, 24 * 60 * 60 * 1000)
}

MMM-CountEvents

Countdown or countup for events

This module is revamped from the scratch. If you are using the previous version, you may need reinstall again.

Screenshots

Features

• Count up / down to specific date/time
• Various formatting & custom template
• Auto repeat : yearly, monthly, daily, hourly.
• Callback functions for updating or passing the event. (You can make an alarm with this module)

History

2.0.0 (2024-08-07)

• Revamped

Author

• Author: Seongnoh Sean Yi eouia0819@gmail.com
• Repository : https://github.com/MMRIZE/MMM-CountEvents

@movingfish
Secret ics URL is easier to handle. But your config.js is weaker for peeping. (There is another alternative MMM-CalDAV)

@movingfish
MMM-GoogleCalendar is incompatible with the standard default MM’s calendar module. It spits out incompatible broadcasting notifications, so you should convert it with preProcessor of MMM-CalendarExt3.

Let’s check something in your config.

1. preProcessor should be located in config block of MMM-CalendarExt3

{
  module: "MMM-CalendarExt3",
  position: "bottom_center",
  title: "Events Calendar",
  config: {
    preProcessor: (e) => {
      if (e.startDate) return e // when event coming from default module, skip conversion.
      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
    },
    ... // Your other configuration
  }
},

2. You may need broadcastEvents: true, in MMM-GoogleCalendar module. I don’t know why, but that option is disabled by default unlike the default calendar module.

{
  module: 'MMM-GoogleCalendar',
  header: "My Google Calendar",
  position: "top_left",
  config: {
    broadcastEvents: true, // <-- You may need this
    calendars: [
...

3. Not related to this issue, but you did something wrong.

• in mode: "month", weekIndex and weeksInView are out of sense. It has meaning only in mode: "week".
• en-EN is not a proper locale. Use en-US or just en. (Of course, it depends on where you live, en-GB, en-IN, en-AU, …)
• If you set a proper locale, you don’t need to declare firstDayOfWeek. That value will be assigned automatically by your locale.
• You are refreshing the module every 2 minutes. Is it really needed?

@movingfish
To collaborate with GooglCalendar, see this; https://github.com/MMRIZE/MMM-CalendarExt3/wiki/Examples-%26-Tips

@almightyyoshi

/* css/custom.css */
.CX3_currentMonth .event.singleday .headline .time {
  display: none;
}

Before

After

@almightyyoshi
For the second question, I cannot understand. More details for TO-BE and AS-IS be needed. (Show me the example)

@almightyyoshi
For removing calendarWeek number;
https://github.com/MMRIZE/MMM-CalendarExt3/wiki/Examples-%26-Tips

@almightyyoshi

eventTransformer: (ev) => {
  ev.title = ev.title.replace("All:", "")
  return ev
},

MMM-Hotword2

MagicMirror module withPicovoice’s Porcupine for Hotword detector. My previous MMM-Hotword module is deprecated due to that snowboy hot-word detecting engine closed its service. Fortunately, PICOVOICE’s Porcupine and its siblings would be good enough alternative. So I rebuilt the hot-word detector again.

I know, there is other Porcupine modules already, but they may lack some features which I need to use. So I revamped my old one for my demands.

Features

• Multi Hotwords/ Custom Hotwords supported
• Individual Hotword setting
• On detection, various works possible;
  • Control other modules with custom notification
  • Execute Shell command or scripts and get the result.
• Not only hotword, but also continuous utterance could be acauired.(as recorded wav file)
  • The recorded file could be consumed on other STT / voice handling modules
• No need to rebuild for electron

For more details; https://github.com/MMRIZE/MMM-Hotword2

@capedbuffethero

1. Make a GITHUB account
2. Fork the original target repository to your account.
3. git-clone forked repo into your local dev pc.
4. Do your modifications in your local repo.
5. Commit your modified version to your GitHub.
6. Make PR to the original target repo.
7. Wait for confirmation and merging by original owner.

@ijoshea
Anyway, It looks so interesting, So I tried something. I simply did monkey patching to get dominant color from MMM-GooglePhotos’s image on load.

You can do your job with this code without modifying the source codes itselfs.

/* config/config.js */
{
	module: "MMM-ModuleMonkeyPatch",
	config: {
		patches: [
			{
				module: "MMM-GooglePhotos",
				method: "ready",
				patch: async function (original, [ url, target ]) {
					const ret = original(url, target)
					let color = null
					const process = async () => {
						const { resolve, promise } = Promise.withResolvers()
						const img = new Image()
						img.crossOrigin = 'Anonymous'
						img.src = 'https://corsproxy.io/?' + url
						img.onload = () => {
							const colorThief = new ColorThief()
							const color = colorThief.getColor(img)
							resolve(color)
						}
						return promise
					}
					if (typeof ColorThief === 'undefined') {
						const loadScript = async (src) => {
							const { resolve, promise } = Promise.withResolvers()
							const script = document.createElement('script')
							script.src = src
							document.head.appendChild(script)
							script.onload = () => resolve()
							return promise
						}
						await loadScript('https://cdn.jsdelivr.net/npm/colorthief@2/dist/color-thief.min.js')
						color = await process()

					} else {
						color = await process()
					}

					console.log(color) // It will show [R, G, B] array
					// doYourJob(color)

					return ret
				},
			},
		],
	},
},

@mmmmh
useDisplay: false,

@ijoshea
I had the same needs on building modules. (btw, GooglePhotos and CX3 were built by me :D )

Sometimes I suggested other module’s background for the readability. Sometimes, I made an auto-calculated contrast color(e.g. CX3)

My final conclusion is… waiting for new CSS feature contrast-color(). It will be introduced later this year in the most modern browsers.
https://drafts.csswg.org/css-color-5/#contrast-color

@ijoshea
It seems weird to import JS in css.

@Bungle68
If you don’t need, you don’t have to update.
You don’t know whether it will be better to do update, you don’t have to.
If you decide to do update, I recommend to start over from formatting SD card. It will be easier.

@Ix
Install recent nodejs.
I don’t know how you have installed the current version of nodejs. So I cannot give you an exact advice.
Generally I prefer to manage node version with nvm