@sdetweil that definitely works for the <div> created by the module for when it generates content but not for the surrounding <div> that I’m pretty sure are the standard one generated by any module:

<div id="module_9_MMM-CanadianPublicWeatherAlerts" class="module MMM-CanadianPublicWeatherAlerts hidden" style="transition: opacity; opacity: 0; position: fixed;">
  <header class="module-header" style="display: none;">undefined</header>
    <div class="module-content">
      <div>
        <div></div> <--- This gets display:none applied to it.
      </div>
    </div>
  </div>
</div>

To make MMM-Carousel happy I think I need the top level <div> to not be generated but I’m realizing that implies I would need to modify MMM-CanadianPublicWeatherAlerts to dynamically unregister and register as a module and I don’t see how that can be done.

What might be easier is if I can figure out how to dynamically update the MMM-Carousel settings read from my config.js:

module: 'MMM-Carousel',
position: 'bottom_bar',
config: {
 transitionInterval: 10000,
 ignoreModules: [],
 mode: 'positional',
 top_right: {enabled: true, ignoreModules: ['currentweather']},
 top_center: {enabled: true, ignoreModules: ['updatenotification']}
}

I would need to add/remove MMM-CanadianPublicWeatherAlerts from the ignoreModules list for top_center depending on if it wants to generate content or not. No output - add to the ignoredModules list and MMM-Carousel ignores it for the rotation. Output - remove from the ignoredModules list and now it gets rotated with the rest.

Hi!

I have a nicely working setup with MMM-Carousel and recently discovered MMM-CanadianPublicWeatherAlerts. This modules was rather handy in the last few days when there have been weather alerts.

Now the part I’d like to “fix”. MMM-CanadianPublicWeatherAlerts generates an empty <div> when there are no weather alerts. Unfortunately, this causes MMM-Carousel to still include the empty module output as it cycles through the set of modules in that area (top_center in my case). I know this is likely a limitation of MMM-Carousel.

What is the “correct” way to prevent MMM-CanadianPublicWeatherAlerts from generating the empty <div>?

I had thought I could just muck with getDom() in the module to return nothing, but that doesn’t seem to work. Other thought was to see if there’s a way to dynamically move the generated <div> to some where other than top_center but that’s currently beyond my understanding.

Thoughts?

@siujd2001 you hadn’t mentioned anything about screen.

I recently switched to using start:wayland also and found that in MMM-Pir, the ddcutil mode worked best. Screen control in general seems to vary on RPi depending on the monitor you have.

@siujd2001 in your config you have:

Pir: {
  mode: 1,
  gpio: 21
//   gpio: 4 // <–connected to 4
}

Did you try with mode: 0 ?

Mode 1 uses an external python script and since that’s an external executable, there’s always a chance that the script has locked up the GPIO so when you start MMM-Pir again, it tries to start a new version of the script.

I’m starting to mess around a bit with a custom module and I’d like it to be able to override some styles from an existing 3rd party module.

I know the following options work:

• use custom.css
• put my module after the existing module in config.js

But if I ever wanted to release this module, I’d want it to be able to override the existing css content no matter what order it is put in the user’s config.js.

I was tracing through loader.js and found that bootstrapModule loads the styles for a module but there doesn’t appear to be anyway to delay/reorder this. Then I followed through into main.js and I see that there’s a notification for ALL_MODULES_STARTED but this seems like it’s “too late” to modify the css order.

@sdetweil thanks for the fix! I really appreciate your effort.

Just in case it’s useful for someone else who runs into the same problem, with the fix applied and my calendar configuration that worked in 2.29.0, I see:

[Debug] [Calendar] self update (calendar.js, line 950)
[Debug] pushing 18 events to total with room for 10 (calendar.js, line 695)
[Debug] events for calendar=10 (calendar.js, line 697)
[Debug] pushing 246 events to total with room for 10 (calendar.js, line 695)
[Debug] events for calendar=20 (calendar.js, line 697)
[Info] sorting events count=20 (calendar.js, line 699)
[Info] slicing events total maxcount=10 (calendar.js, line 739)

And when I set a new maximumEntries per calendar I get:

[Debug] pushing 34 events to total with room for 50 (calendar.js, line 695)
[Debug] events for calendar=34 (calendar.js, line 697)
[Debug] pushing 295 events to total with room for 500 (calendar.js, line 695)
[Debug] events for calendar=329 (calendar.js, line 697)
[Info] sorting events count=329 (calendar.js, line 699)

This does result in a different behaviour for users of other calendar modules as of 2.30.0 so might be handy if the authors could update their recommendations in their documentation?

@sdetweil thank you for supporting the calendar module!

For my specific use case, I don’t display the default calendar module, it’s just used to fetch and broadcast events for CalendarExt3. With this in mind, the idea of a sliding window centered on a date (today in most cases) makes the most sense to me.

Is there a reason why the default for maximumEntries is 10? I had assumed performance but it looks like this is actually what’s used to control the number of events displayed.

@sdetweil I saw your note in the other thread about setting maximumEntries per calendar. I guess it means with this change there’s more thought required to determine the “right” values for each of the calendars you want to add.

Example: As of today, Jan 2, this configuration for the calendar will show the “New Year’s Day” event on CalendarExt3:

config: {
	broadcastPastEvents: true,
	calendars: [
	{
		url: "https://ics.calendarlabs.com/39/f7480acf/Canada_Holidays.ics",
		name: "can_holiday",
		maximumEntries: 16,
	},
},

The following configuration will not show the “New Year’s Day” event:

config: {
	broadcastPastEvents: true,
	calendars: [
	{
		url: "https://ics.calendarlabs.com/39/f7480acf/Canada_Holidays.ics",
		name: "can_holiday",
		maximumEntries: 15,
	},
},

If I set maximumNumberOfDays: 180 then it actually changes the start date of the event array sliding window and the “New Year’s Day” event will show if maximumEntries: 15.

Which makes me realize that the combination of:

broadcastPastEvents: true,
maximumNumberOfDays: 365, // default value

will actually return 2 years worth of events (assuming you don’t exceed the maximumEntries setting).

@sdetweil I can confirm that setting maximumEntries:100 allows events to show on CalendarExt3 for the specific “Holiday” calendar in my test config.js.

However, there’s something else that is coming into play. If I switch to a very busy calendar (300+ events) I actually get nothing showing up in CalendarExt3 but I can see that the events are in the calendar module. I used @MMRIZE eventPayload hook to dump to console and the events I’m getting start in Jan 2024.

Note: I switched to maximumEntries:20 for this test.

[Info] sorting events count=20 (calendar.js, line 699)
[Log] Array (20) (config.js, line 308)
0 {title: "Paradigm ", startDate: "1704891600000", endDate: "1704898800000", fullDayEvent: false, recurringEvent: true, …}
1 {title: "Paradigm ", startDate: "1706101200000", endDate: "1706108400000", fullDayEvent: false, recurringEvent: true, …}
2 {title: "Paradigm ", startDate: "1707310800000", endDate: "1707318000000", fullDayEvent: false, recurringEvent: true, …}
3 {title: "Paradigm ", startDate: "1708520400000", endDate: "1708527600000", fullDayEvent: false, recurringEvent: true, …}
4 {title: "Tour", startDate: "1709391600000", endDate: "1709394300000", fullDayEvent: false, recurringEvent: false, …}
5 {title: "Paradigm ", startDate: "1709730000000", endDate: "1709737200000", fullDayEvent: false, recurringEvent: true, …}
6 {title: "Paradigm ", startDate: "1710936000000", endDate: "1710943200000", fullDayEvent: false, recurringEvent: true, …}
7 {title: "Paradigm ", startDate: "1712145600000", endDate: "1712152800000", fullDayEvent: false, recurringEvent: true, …}
8 {title: "Paradigm ", startDate: "1713355200000", endDate: "1713362400000", fullDayEvent: false, recurringEvent: true, …}
9 {title: "Paradigm ", startDate: "1714564800000", endDate: "1714572000000", fullDayEvent: false, recurringEvent: true, …}
10 {title: "Paradigm ", startDate: "1715774400000", endDate: "1715781600000", fullDayEvent: false, recurringEvent: true, …}
11 {title: "Paradigm ", startDate: "1716984000000", endDate: "1716991200000", fullDayEvent: false, recurringEvent: true, …}
12 {title: "Paradigm ", startDate: "1718193600000", endDate: "1718200800000", fullDayEvent: false, recurringEvent: true, …}
13 {title: "Paradigm ", startDate: "1719403200000", endDate: "1719410400000", fullDayEvent: false, recurringEvent: true, …}
14 {title: "Paradigm ", startDate: "1720612800000", endDate: "1720620000000", fullDayEvent: false, recurringEvent: true, …}
15 {title: "Amie and Jeff’s Anniversary ", startDate: "1721116800000", endDate: "1721203200000", fullDayEvent: true, recurringEvent: true, …}
16 {title: "Paradigm ", startDate: "1721822400000", endDate: "1721829600000", fullDayEvent: false, recurringEvent: true, …}
17 {title: "Paradigm ", startDate: "1723032000000", endDate: "1723039200000", fullDayEvent: false, recurringEvent: true, …}
18 {title: "Paradigm ", startDate: "1724241600000", endDate: "1724248800000", fullDayEvent: false, recurringEvent: true, …}
19 {title: "Paradigm ", startDate: "1725451200000", endDate: "1725458400000", fullDayEvent: false, recurringEvent: true, …}

I then set broadcastPastEvents:false and I still get events from Jan 2024.

@MMRIZE I’m running a server-only instance in docker for testing now with this config.js:

let config = {
	address: "0.0.0.0",
	port: 8080,
	basePath: "/",
	ipWhitelist: [],
	useHttps: false,
	httpsPrivateKey: "",
	httpsCertificate: "",
	language: "en",
	locale: "en-US",
	logLevel: ["INFO", "LOG", "WARN", "ERROR"],
	timeFormat: 24,
	units: "metric",

	modules: [
		{
			module: "clock",
			position: "top_left",
			config: {
				timeFormat: 12,
			},
		},
		{
			module: "calendar",
			position: "top_right",
			config: {
				broadcastPastEvents: true, // <= IMPORTANT to see past events
				defaultSymbol: "square",
				calendars: [
					{
						url: "https://ics.calendarlabs.com/39/f7480acf/Canada_Holidays.ics",
						name: "can_holiday", // <= RECOMMENDED to assign name
						color: "crimson", // <= RECOMMENDED to assign color
					},
				],
			},
		},
		{
			module: "MMM-CalendarExt3",
			position: "bottom_bar",
			title: "",
			config: {
				mode: "week",
				weeksInView: 4,
				weekIndex: 0,
				useWeather: false,
				displayEndTime: false,
				instanceId: "basicCalendar",
				maxEventLines: 6,
				fontSize: '24px',
				eventHeight: '26px',
				refreshInterval: 1000 * 60 * 5,
				useMarquee: false,
				calendarSet: ['can_holiday'],
  			}
		},
	]
};

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

Today (Jan 1) should have a full day event on CalendarExt3 for New Year’s Day (as seen in top right calendar output).

Front end logs:

[Info] Initializing MagicMirror². (main.js, line 582)
[Log] Loading core translation file: translations/en.json (translator.js, line 116)
[Log] Loading core translation fallback file: translations/en.json (translator.js, line 132)
[Log] Load script: modules/default/clock/clock.js (loader.js, line 178)
[Log] Module registered: clock (module.js, line 489)
[Info] Bootstrapping module: clock (loader.js, line 151)
[Log] Load script: vendor/node_modules/moment/min/moment-with-locales.js (loader.js, line 178)
[Log] Load script: vendor/node_modules/moment-timezone/builds/moment-timezone-with-data.js (loader.js, line 178)
[Log] Load script: vendor/node_modules/suncalc/suncalc.js (loader.js, line 178)
[Log] Scripts loaded for: clock (loader.js, line 155)
[Log] Load stylesheet: modules/default/clock/clock_styles.css (loader.js, line 194)
[Log] Styles loaded for: clock (loader.js, line 158)
[Log] Translations loaded for: clock (loader.js, line 161)
[Log] Load script: modules/default/calendar/calendar.js (loader.js, line 178)
[Log] Check MagicMirror² version for module 'calendar' - Minimum version:  2.1.0 - Current version: 2.30.0 (module.js, line 481)
[Log] Version is ok! (module.js, line 483)
[Log] Module registered: calendar (module.js, line 489)
[Info] Bootstrapping module: calendar (loader.js, line 151)
[Log] Load script: modules/default/calendar/calendarutils.js (loader.js, line 178)
[Log] File already loaded: moment.js (loader.js, line 254)
[Log] Scripts loaded for: calendar (loader.js, line 155)
[Log] Load stylesheet: modules/default/calendar/calendar.css (loader.js, line 194)
[Log] Load stylesheet: vendor/css/font-awesome.css (loader.js, line 194)
[Log] Styles loaded for: calendar (loader.js, line 158)
[Log] Translations loaded for: calendar (loader.js, line 161)
[Log] Load script: modules/MMM-CalendarExt3/MMM-CalendarExt3.js (loader.js, line 178)
[Log] Module registered: MMM-CalendarExt3 (module.js, line 489)
[Info] Bootstrapping module: MMM-CalendarExt3 (loader.js, line 151)
[Log] Scripts loaded for: MMM-CalendarExt3 (loader.js, line 155)
[Log] Load stylesheet: modules/MMM-CalendarExt3/MMM-CalendarExt3.css (loader.js, line 194)
[Log] Styles loaded for: MMM-CalendarExt3 (loader.js, line 158)
[Log] Translations loaded for: MMM-CalendarExt3 (loader.js, line 161)
[Log] Load stylesheet: css/custom.css (loader.js, line 194)
[Info] Starting module: clock (clock.js, line 43)
[Info] Starting module: calendar (calendar.js, line 96)
[Info] All modules started! (main.js, line 601)
[Info] sorting events count=0 (calendar.js, line 699)
[Info] slicing events total maxcount=10 (calendar.js, line 739)
[Warning] [CX3] Module is not prepared yet, wait a while. (MMM-CalendarExt3.js, line 390)
[Info] sorting events count=10 (calendar.js, line 699)
[Info] sorting events count=10 (calendar.js, line 699)
[Info] slicing events total maxcount=10 (calendar.js, line 739)
[Info] event fullday (calendar.js, line 506, x10)
[Info] sorting events count=10 (calendar.js, line 699)
[Info] sorting events count=10 (calendar.js, line 699)
[Info] slicing events total maxcount=10 (calendar.js, line 739)
[Info] event fullday (calendar.js, line 506, x10)

And for completeness, backend logs:

[2025-01-01 21:05:03.871] [LOG]   Starting MagicMirror: v2.30.0 
[2025-01-01 21:05:03.886] [LOG]   Loading config ... 
[2025-01-01 21:05:03.889] [LOG]   config template file not exists, no envsubst 
[2025-01-01 21:05:04.171] [INFO]  Checking config file /opt/magic_mirror/config/config.js ... 
[2025-01-01 21:05:04.216] [INFO]  Your configuration file doesn't contain syntax errors :) 
[2025-01-01 21:05:04.217] [INFO]  Checking modules structure configuration ... 
[2025-01-01 21:05:04.312] [INFO]  Your modules structure configuration doesn't contain errors :) 
[2025-01-01 21:05:04.412] [LOG]   Loading module helpers ... 
[2025-01-01 21:05:04.415] [LOG]   No helper found for module: clock. 
[2025-01-01 21:05:04.583] [LOG]   Initializing new module helper ... 
[2025-01-01 21:05:04.585] [LOG]   Module helper loaded: calendar 
[2025-01-01 21:05:04.590] [LOG]   No helper found for module: MMM-CalendarExt3. 
[2025-01-01 21:05:04.590] [LOG]   All module helpers loaded. 
[2025-01-01 21:05:04.600] [LOG]   Starting server on port 8080 ...  
[2025-01-01 21:05:04.602] [WARN]  You're using a full whitelist configuration to allow for all IPs 
[2025-01-01 21:05:04.612] [LOG]   Server started ... 
[2025-01-01 21:05:04.613] [LOG]   Connecting socket for: calendar 
[2025-01-01 21:05:04.614] [LOG]   Starting node helper for: calendar 
[2025-01-01 21:05:04.615] [LOG]   Sockets connected & modules started ... 
[2025-01-01 21:05:04.615] [INFO]  
>>>   Ready to go! Please point your browser to: http://0.0.0.0:8080   <<< 
[2025-01-01 21:05:04.744] [INFO]  System information:
### SYSTEM:   manufacturer: ; model: Docker Container; virtual: false
### OS:       platform: linux; distro: Debian GNU/Linux; release: 12; arch: x64; kernel: 5.15.49-linuxkit
### VERSIONS: electron: undefined; used node: 22.12.0; installed node: 22.12.0; npm: 10.9.0; pm2: 
### OTHER:    timeZone: America/Toronto; ELECTRON_ENABLE_GPU: undefined 
[2025-01-01 21:05:18.517] [LOG]   Create new calendarfetcher for url: https://ics.calendarlabs.com/39/f7480acf/Canada_Holidays.ics - Interval: 3600000 
[2025-01-01 21:05:18.779] [INFO]  Calendar-Fetcher: Broadcasting 34 events from https://ics.calendarlabs.com/39/f7480acf/Canada_Holidays.ics. 
[2025-01-01 21:13:12.600] [LOG]   Use existing calendarfetcher for url: https://ics.calendarlabs.com/39/f7480acf/Canada_Holidays.ics 
[2025-01-01 21:13:12.601] [INFO]  Calendar-Fetcher: Broadcasting 34 events from https://ics.calendarlabs.com/39/f7480acf/Canada_Holidays.ics. 
[2025-01-01 21:13:12.837] [INFO]  Calendar-Fetcher: Broadcasting 34 events from https://ics.calendarlabs.com/39/f7480acf/Canada_Holidays.ics.