Marquee not working with MMM-Pages

[beardedtech79]

I'm having an issue where I have the calendar module enabled on one page with MMM-Pages; however, marquee is not working. I've tried this outside of pages, and the marquee is enabled and working. Looking for some guidance on how to make marquee work when displaying within pages. I've tried multiple positions as it seems that fullscreen_above (or below) cause issues with marquee.
Separate issue: I'd also welcome any support on copying this module to display a separate view of the calendar with a different source. I've copied and installed npm in a directory with a different name; however, one of the modules seems to still overwrite the other when attempting to display both on two different pages.

[KristjanESPERANTO]

Issue 1: Marquee not working with MMM-Pages

This is now fixed in v1.11.4. The root cause was that offsetWidth/scrollWidth measurements are 0 when a module lives on a hidden MMM-Pages page (display:none), so the marquee condition was never met. The fix re-runs the marquee calculation on the NEW_PAGE notification, once the module is actually visible.

Please update the module and it should work out of the box. Feedback would be nice 🙂

---

Issue 2: Running two independent instances

No need to copy and reinstall the module. MMM-CalendarExt3 supports multiple instances natively via the instanceId config option. Just add two separate module entries in your config.js:

{
  module: "MMM-CalendarExt3",
  config: {
    instanceId: "calendar-page1",
    // ... your settings
  }
},
{
  module: "MMM-CalendarExt3",
  config: {
    instanceId: "calendar-page2",
    // ... different settings
  }
}

[KristjanESPERANTO]

Glad that helped! 🙂

instanceId is optional for your use case. MagicMirror automatically assigns a unique identifier to each module instance, so two separate entries in config.js will work independently without any extra configuration.

You only need an explicit instanceId if you want to control a specific instance via notifications (e.g. CX3_SET_CONFIG to change the view programmatically). For simply showing different calendar views on different pages, just having two entries is enough:

{ module: "MMM-CalendarExt3", config: { mode: "week", /* weekly activities */ } },
{ module: "MMM-CalendarExt3", config: { mode: "month", /* meal planning */ } },

[beardedtech79]

Thanks for the help! I got the two instances to display (one with two weeks, one with a month view), but I'm having some issues separating the two calendar sources now, even using CalendarSet. Each instance should pull from two separate iCloud calendars.

[KristjanESPERANTO]

calendarSet filters by the name property of each calendar entry in MagicMirror's built-in calendar module config. Make sure each of your iCloud calendars has a distinct name:

// MagicMirror calendar module config
{
  module: "calendar",
  config: {
    calendars: [
      { name: "weekly-activities", url: "https://...icloud.com/...ical1.ics" },
      { name: "meal-planning",     url: "https://...icloud.com/...ical2.ics" },
    ]
  }
},

// MMM-CalendarExt3 instance 1 (weekly view)
{
  module: "MMM-CalendarExt3",
  config: {
    mode: "week",
    calendarSet: ["weekly-activities"],
  }
},

// MMM-CalendarExt3 instance 2 (month view)
{
  module: "MMM-CalendarExt3",
  config: {
    mode: "month",
    calendarSet: ["meal-planning"],
  }
},

If calendarSet is [] or omitted, all calendars are shown in that instance — so setting it explicitly is the key step.

[beardedtech79]

Yeah, for some reason, I have the individual urls set with the name as above and then they are referenced in the calendarSet for each as you show, but I am still getting all calendars in each instance. I'm not getting any syntax errors, so I'm checking where I could have accidentally omitted calendarSet to null or omitted it elsewhere.

ETA: idiot here. Had it in the celldateoptions rather than the larger config. Thanks for the help! I'll close this out!

[KristjanESPERANTO]

Nice! Enjoy your project 😃