Would it be possible to combine the calendar color indicator at the time using just CSS?

Right now, it’s a colored circle and the time next to it and I was wondering if it would somehow be possible to have the time be inside the circle, or have the time be a different background color.

My display is quite small, and saving a few extra pixels would be nice.

Thanks, I ended up doing this in my custom.css

#module_4_MMM-CalendarExt3
{
    margin-left: -40px;
    margin-right: -40px;
}

It doesn’t seem like the best approach, but it works.

I am using MMM-CalendarExt3 with some fairly limited width. I’d like to remove any margins from it and have it go from edge to edge. In the past, I did this using custom.css, but it seemed hacky. I just tried setting the position to “fullscreen_below” and it removed the margins, but it’s sitting at the very top of the screen. How do I make it appear at the bottom of my screen with no margins or padding?

If you were to build a magic mirror from scratch, what display technology would you pick? My MagicMirror is running on an old LCD TV with a two way mirror in front of it and the glare make it almost unreadable during the day.

If I were to rebuild it, what kind of a TV should I use to make it easier to read during the day?

@sdetweil really appreciate your support on this!

@sdetweil That did it. Thank you so much. I spent two hours this morning trying to fix this.
How did you know that this was an issue? I need to get better at learning how to troubleshoot this mirror myself.

@sdetweil ok, that makes sense.

My issue is really strange where my two recurring weekly events only show up during the first two weeks of the month, and are ignored the rest of the time until the next month. I even tested installed thunderbird to open the ICS file to check that the issue isn’t with google calendar. Thunderbird displays the recurring events just fine.

It’s making me think if I should hack together some kind a pre-processor to only return events that are relevant to the view.

@sdetweil, would you mind sharing how you set up a filter for the events? I have a suspicion that too many events are causing some items to now show up on calendar.

My current MagicMirror is an old 40" LCD TV. It’s positioned in area that get a lot of light and is quite hard to read. I am considering rebuilding it with something might brighter. What TV would recommend? Something around 55" would be fantastic.

@sdetweil yeah, i probably just did a git pull

@sdetweil while messing with raspi-config over ssh, magicmirror lost connection to my wifi. I had to connect a keyboard and reconnect. But, before going back to your last suggestion I did two other things. I updated pm2 (as suggested by some other post). And in the browser console I noticed that I had an error about not being able to locate “CX3_shared.mjs”. I checked the MMM-CalendarExt3 repo, and found that file CX3_Shared/CX3_shared.mjs, which for some reason wasn’t getting pulled by a git pull. I manually copied it in, and the calendar sort of started working.

I should have paid better attention to the documentation, because I would have seen that I needed to run git submodule update --init --recursive to update the submodule.

The reason I say “sort of” is because my family calendar doesn’t show some repeating events, but I need to dig deeper into that.

I really appreciate all your help.

@sdetweil

1: lo: <LOOPBACK,UP,LOWER_UP> mtu 65536 qdisc noqueue state UNKNOWN group default qlen 1000
    link/loopback 00:00:00:00:00:00 brd 00:00:00:00:00:00
    inet 127.0.0.1/8 scope host lo
       valid_lft forever preferred_lft forever
    inet6 ::1/128 scope host
       valid_lft forever preferred_lft forever
2: eth0: <NO-CARRIER,BROADCAST,MULTICAST,UP> mtu 1500 qdisc pfifo_fast state DOWN group default qlen 1000
    link/ether b8:27:eb:ee:09:64 brd ff:ff:ff:ff:ff:ff
3: wlan0: <BROADCAST,MULTICAST,UP,LOWER_UP> mtu 1500 qdisc mq state UP group default qlen 1000
    link/ether 00:0f:60:04:20:d4 brd ff:ff:ff:ff:ff:ff
    inet 192.168.1.100/24 brd 192.168.1.255 scope global dynamic noprefixroute wlan0
       valid_lft 45176sec preferred_lft 34376sec
    inet6 fe80::3e7d:5421:775:6ad0/64 scope link
       valid_lft forever preferred_lft forever

@sdetweil thanks for taking the time. It’s sent.

@sdetweil Thank you, but that didn’t seem to help. I use this script to update MM https://raw.githubusercontent.com/sdetweil/MagicMirror_scripts/master/upgrade-script.sh

So, I wonder if something isn’t getting updated.

@sdetweil I must be missing something, I don’t see what file this code should go in.

I updated Magic Mirror today and my calendar is no longer working.

Here’s the error that I get

[02.01.2024 17:08.23.640] [ERROR] Calendar Error. Could not fetch calendar:  https://calendar.google.com/calendar/ical/xxxxx/basic.ics TypeError: fetch failed
    at Object.fetch (node:internal/deps/undici/undici:11576:11)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
  cause: ConnectTimeoutError: Connect Timeout Error
      at onConnectTimeout (node:internal/deps/undici/undici:8522:28)
      at node:internal/deps/undici/undici:8480:50
      at Immediate._onImmediate (node:internal/deps/undici/undici:8511:13)
      at process.processImmediate (node:internal/timers:476:21) {
    code: 'UND_ERR_CONNECT_TIMEOUT'

And here’s my config

  {
    module: "MMM-CalendarExt3",
    position: "bottom_bar",
    title: "",
    config: {
      mode: "week",
      instanceId: "basicCalendar",
      locale: 'en-EN',
      weekIndex: 0,
      weeksInView: 4,
      maxEventLines: 5,
      firstDayOfWeek: 0,
      fontSize: "22px",
      eventTimeOptions: {
        hour12: false,
        hour: "2-digit",
        minute: "2-digit"
      },
      useSymbol: false,
      calendarSet: ['School', 'Family'],
    }
  },


  {
    module: "calendar",
    config: {
      broadcastPastEvents: true, // <= IMPORTANT to see past events
      calendars: [
        {
          name: "Family",
          url: "https://calendar.google.com/calendar/ical/xxxxxxxxxxxx/basic.ics",
          color: "green"

        },
        {
          name: "School",
          url: "https://calendar.google.com/calendar/ical/xxxxxxxxxx%40group.calendar.google.com/public/basic.ics",
          color: "blue",
          filter: (event) =>{
            if (event.title.search("......") > -1) {
              return true
            } else {
              return false
            }
          },
        }
      ]
    },
  },

I tested both calendar URLs and they do download the ICS file just fine. I’d appreciate any help.

I am trying to get MMM-AQI running, but it’s not displaying correctly. It’s showing the wrong location, not matter what I try. The most recent thread on this module is a few years old, so I am starting a new one.

@MMRIZE Perfect! Thank you so much.

Can anyone help me make one last tweak? I would like to get rid of the icon next to the event name and display the event time in just a 24 hour format (23:30 instead of 11:30 PM). Here’s my current config

{
  module: "MMM-CalendarExt3",
  position: "bottom_bar",
  title: "",
  config: {
    mode: "week",
    instanceId: "basicCalendar",
    locale: 'en-EN',
    weekIndex: 0,
    weeksInView: 4,
    maxEventLines: 5,
    firstDayOfWeek: 0,
    fontSize: "22px",
    eventTimeOptions: {
      hour: "2-digit",
      minute : "2-digit"
    }, 
    useSymbol: false,
    calendarSet: ['School', 'Family'],
  }
},

@sdetweil What I kept trying to do is get node and npm updated, but I royally screwed things up where nothing is working anymore. I can’t use the PM2 command to start and stop things or see the status. So, I just nuked the SD card and am starting from scratch. I will use your scripts.