Posts made by BKeyport

BKeyport

BKeyport

Sam: Here’s a live example of no-event item, and an event item. The count don’t show unless it’s got 1 event. Module_4 is blank, Module_5 is showing one event.

<div id="module_4_MMM-CalendarExt3Agenda" class="module MMM-CalendarExt3Agenda MMM-CalendarExt3Agenda" style="order: 0;">
    <header class="module-header" style="display: none;">undefined</header>
    <div class="module-content">
        <div class="bodice CX3A_undefined CX3A">
            <div class="agenda"></div>
        </div>
    </div>
</div>

<div id="module_5_MMM-CalendarExt3Agenda" class="module MMM-CalendarExt3Agenda MMM-CalendarExt3Agenda" style="order: 0;">
    <header class="module-header" style="display: none;">undefined</header>
    <div class="module-content">
        <div class="bodice CX3A_undefined CX3A">
            <div class="agenda">
                <div class="cell thisMonth thisYear year_2025 month_8 date_10 weekday_0 seq_0 week_32 weekend weekend_2" data-events-counts="1">
                    <div class="cellHeader">
                        <div class="cellHeaderMain">
                            <div class="cellDay relativeDay relativeNamedDay relativeDayGap_1"><span class="dateParts literal seq_0 unit_none">tomorrow</span></div>
                            <div class="cellDate"><span class="dateParts weekday seq_0">Sunday</span><span class="dateParts literal seq_1">, </span><span class="dateParts month seq_2">Aug</span><span class="dateParts literal seq_3"> </span><span class="dateParts day seq_4">10</span></div>
                            <div class="cw">32</div>
                        </div>
                        <div class="cellHeaderSub"></div>
                    </div>
                    <div class="cellBody">
                        <div class="fullday"></div>
                        <div class="single">
                            <div class="event calendar_Sounders future singleday" data-calendar-seq="1" data-calendar-name="Sounders" data-color="#5D9741" data-description="Calendar not up to date? Check https://fixtur.es/up-to-date" data-title="Los Angeles Galaxy - Seattle Sounders FC" data-full-day-event="false" data-geo="false" data-location="" data-start-date="1754877600000" data-end-date="1754883900000" data-today="false" data-symbol="fas fa-fw fa-futbol" style="--calendarColor: #5D9741; --oppositeColor: white;">
                                <div class="headline useSymbol"><span class="symbol"><span class="fas fa-fw fa-futbol"></span></span>
                                    <div class="time startTime inDay"><span class="eventTimeParts hour seq_0">7</span><span class="eventTimeParts literal seq_1">:</span><span class="eventTimeParts minute seq_2">00</span><span class="eventTimeParts literal seq_3"> </span><span class="eventTimeParts dayPeriod seq_4">PM</span></div>
                                    <div class="time endTime inDay"><span class="eventTimeParts hour seq_0">8</span><span class="eventTimeParts literal seq_1">:</span><span class="eventTimeParts minute seq_2">45</span><span class="eventTimeParts literal seq_3"> </span><span class="eventTimeParts dayPeriod seq_4">PM</span></div>
                                    <div class="title">Los Angeles Galaxy - Seattle Sounders FC</div>
                                </div>
                                <div class="description">Calendar not up to date? Check https://fixtur.es/up-to-date</div>
                                <div class="location"></div>
                            </div>
                        </div>
                    </div>
                    <div class="cellFooter"></div>
                </div>
            </div>
        </div>
    </div>
</div>

BKeyport

@sdetweil yeah, I put it back… both it, and the target I wrote up don’t target it.

BKeyport

@sdetweil ~~both are set low, and it worked before. -~~ – whoops - forgot I moved refresh up on those as they don’t change very much. Restored them to 1 minute for testing.

– and it don’t seem to be targeting correctly. does nothing.

BKeyport

@sdetweil I added it, and it seemed to delete all the calendars, so I removed it, and they’re still gone.

They are broadcasting correctly from calendar.
I’ve restarted both the server and the client.

ACK!

BKeyport

here’s how I did it.

Set up SAMBA on the pi, and include a mapping to your photos drive (I wouldn’t recommend keeping them locally)
magic mirror’s config, using MMM-Backgroundslideshow

/* Magic Mirror Config by Brendan Keyport. */
/* Office - Certificate Display */
var config = {
	address: "0.0.0.0",
	port: 8082,  // port is 8082 as I use a server/client style setup. 
	ipWhitelist: [], 
	language: "en",
	timeFormat: 12,
	units: "imperial",
	//logLevel: ["INFO", "LOG", "WARN", "ERROR", "DEBUG"],
	customCss: "css/custom3.css",
	modules:
	 [
		{
    		module: 'MMM-BackgroundSlideshow',
    		position: 'fullscreen_below',
    		config: {
      			imagePaths: ['<path to shared folder>'],
      			transitionImages: true,
      			randomizeImageOrder: true,
      			showAllImagesBeforeRestart: true,
      			//transitionSpeed: 0,
      			gradient: [0],
      			horizontalGradient: [0],
      			backgroundSize: "contain"
  			 }
  		}
/*************** DO NOT EDIT BELOW ***************/
	]
};

if (typeof module !== "undefined") {
	module.exports = config;
}

Easy as Pi.

BKeyport

@UncleRoger No, it wasn’t that. I forgot about that code. I might go back in and grab it and offer it to the other version once updated.

BKeyport

@sdetweil I’m not understanding, and I can’t find anything that makes sense to me when I search the same.

Here’s what I know - CX3A generates exactly 3 DIVs inside the module div when empty:

<div id="module_4_MMM-CalendarExt3Agenda" class="module MMM-CalendarExt3Agenda MMM-CalendarExt3Agenda" style="order: 0;">
    <header class="module-header" style="display: none;">undefined</header>
    <div class="module-content">
        <div class="bodice CX3A_undefined CX3A">
            <div class="agenda"></div>
        </div>
    </div>
</div>

It generates more when visible.

Should I be targeting like

.MMM-CalendarExt3Agenda:has(div:nth-child(3):last-child) {

?

BKeyport

Anyone know how to get CX3A to completely hide when not in use? Example:

The blank space is a CX3A instance that the earliest event is 47 days away as of writing - I have calendar set to only get 30 days ahead.

relevant code:

	module: "calendar", // Built in
			// position: "top_left",  // Curr7ently hidden
			config: {
				animationSpeed: 0,
				broadcastEvents: true,
				broadcastPastEvents: true,
				fetchInterval: 60000, // minimum 1 minute. 
				maximumNumberOfDays: 30,
				maximumEntries: 999999,
				calendars: [
                                     (insert calendar list here)

		{
			module: "MMM-CalendarExt3Agenda", // https://github.com/MMRIZE/MMM-CalendarExt3Agenda
			position: "bottom_left",
			config: {
				showMiniMonthCalendar: false,
				calendarSet: ["Kraken"],
				instanceId: "2",
				refreshInterval: 3600000, // Should be one hour
				waitFetch: 1,
				firstDayOfWeek: 0,
				startDayIndex: 1,
				endDayIndex: 30,
				animationSpeed: 0,
				useSymbol: true,
				useWeather: false,
				onlyEventDays: 1,
			},
		},

:root {
  --color-text: #999;
  --color-text-dimmed: #666;
  --color-text-bright: #fff;
  --color-background: #000;
  --font-primary: "Roboto Condensed";
  --font-secondary: "Roboto";
  --font-size: 24px;
  --font-size-xsmall: .75rem;
  --font-size-small: 1rem;
  --font-size-medium: 1rem;
  --font-size-large: 1rem;
  --font-size-xlarge: 1rem;
  --gap-body-top: 60px;
  --gap-body-right: 60px;
  --gap-body-bottom: 60px;
  --gap-body-left: 60px;
  --gap-modules: 30px;
}

.region .container {
  display: block;
}

/* adjust modules to display side by side */
.MMM-CalendarExt3Agenda {
  display: inline-flex;
  margin-right: 5px;
  margin-left: 5px;
}

(plus font-size adjustments to use the variables, and elimination of the description field, not shown)

BKeyport

My version of the module developed a fatal bug that I couldn’t get rid of… The best move was to shut it down.

BKeyport

@redux703 Assuming each person has a separatee calendar, there’s the “calendarset” keyword.

If not https://github.com/MMRIZE/MMM-CalendarExt3?tab=readme-ov-file#filtering

Very powerful. Once you have a base idea, we’ll help write the filters if you can’t get it…

BKeyport

@British_Kiwi Like they said, vnc, a SSH client, or, the best solution, IMO, Raspberry Connect (https://connect.raspberrypi.com/)

Also, you could use https://pimylifeup.com/raspberry-pi-samba/ - and network serve your magic mirror directories to your internal lan, then any editor in a more user friendly style (I recommend sublime text)

If you choose to go the samba route via pimylifeup, you can read the section where you create a shared path, but instead change the “homes” section this way - and you’ll gain access to your entire user directory on the Pi.

#======================= Share Definitions =======================

[homes]
   comment = Home Directories
   browseable = yes

# By default, the home directories are exported read-only. Change the
# next parameter to 'no' if you want to be able to write to them.
   read only = no

# File creation mask is set to 0700 for security reasons. If you want to
# create files with group=rw permissions, set next parameter to 0775.
   create mask = 0700

# Directory creation mask is set to 0700 for security reasons. If you want to
# create dirs. with group=rw permissions, set next parameter to 0775.
   directory mask = 0700

# By default, \\server\username shares can be connected to by anyone
# with access to the samba server.
# The following parameter makes sure that only "username" can connect
# to \\server\username
# This might need tweaking when using external authentication schemes
   valid users = %S

BKeyport

@sdetweil I couldn’t get it right. It would either be offscreen to the far right and not able to pull back, or otherwise messed up. MMM-EmbedURL for what it’s worth. Gave up. Chose the top bar working the way I wanted, and got rid of middle_center screen and simplified.

BKeyport

@sdetweil doh. I missed that comment.

Works now. Course, Middle_center don’t. 🤣

BKeyport

@sdetweil Ahh, gotcha. Changing the container display to inline-flex fixes centering issue on middle-center, but does not fix being able to set modules side by side.

I currently have:

.region .container {
  display: inline-flex;
}


/* adjust modules to display side by side */
.clock, .MMM-Worldclock {
	display: inline-flex;
	margin-right: 5px;
	margin-left: 5px;
}

in my custom.css for that screen.

Thanks!

BKeyport

@sdetweil Yep. that fixed it.

BKeyport

If the answer appears to be frank’s solution in that other thread, I don’t understand what to do or how to fix it. without knowledge of where he’s working I have no idea where to touch.

BKeyport

I’m having a few problems with CSS that I think is all related.

Middle Center zone is left aligned when it should be centered.
I used to be able to stack modules sideways in the top bar using:

/* adjust modules to display side by side */
.MMM-ValuesByNotification, .MMM-OpenWeatherForecast {
	display: inline-flex;
	margin-right: 5px;
	margin-left: 5px;
}

Now it seems the modules are forced to left-align (rather than center) and are contained in a 100% width container.

Any clue what’s going on?

BKeyport

@sdetweil

ViewNotification doesn’t show anything…

When I load the mirror in chrome/brave I get this in console:

BKeyport

@sdetweil

Browser is whatever node uses - same problem occurs on other sessions through chrome like browser on my Main PC (Brave)

One magic mirror folder - all configs in MM/Config just numbered.
Refresh does nothing. (Via Chrome/Brave).

Start MM using this:

export MM_CONFIG_FILE=config/config2.js
export MM_PORT=8081
export ELECTRON_DISABLE_GPU=1
DISPLAY=:0 node clientonly --address mirrorserv.local --port 8081