@dinschal das Datum in der CSV kann man nicht umstellen. Für heute, den 18. November, muss es so aussehen: 11/18/2021 Der MM ist auf deutsches Datumsformat eingestellt.

Den Kalendar der Stadtverwaltung habe ich mit https://www.indigoblue.eu/ics2csv/ konvertiert. Die Häkchen bei Notes und Location nehme ich immer raus. Danach wird die CSV mit OpenOffice bearbeitet. Das schaut am Ende dann so aus:

WeekStarting,SaddleBrown,Black,Gold,DarkBlue,Red
11/16/21,0,0,1,0,0
11/20/21,1,0,0,0,0
11/25/21,0,1,0,0,0
11/26/21,1,0,0,1,0
11/30/21,0,0,1,0,0
12/03/21,1,0,0,0,0
12/09/21,0,1,0,0,0
12/10/21,1,0,0,1,0
12/14/21,0,0,1,0,0
12/17/21,1,0,0,0,0
12/23/21,0,1,0,0,0
12/24/21,1,0,0,1,0
12/26/21,0,0,0,0,1
12/28/21,0,0,1,0,0
12/31/21,1,0,0,0,0

Die rote Mülltonne ist für mich die Erinnerung, einen neuen Kalender für das kommende Jahr zu erstellen.

Hier noch meine Zeilen aus der config.js

		{
			module: "MMM-MyGarbage",
			position: "top_left",
			header: "Abfallkalender",
			config: {
				// alert: 4,
				weeksToDisplay: 2,
				limitTo: 3,
				fade: true,
				fadePoint: 0.05,
				dateFormat: "dddd, D. MMMM"
			}
		},

@lebatu Try using fullscreen below at the config.js

	module: "Videoplayer",
	position: "fullscreen_below",
	config: {

@johans With MMM-MyGarbage it will probably be difficult. There you can distinguish the icons only by their color assigned in the CSV.
class=“garbage-icon” style=“fill: green”

Try MMM-MyWastePickup with collectionCalendar: 'Custom'.

@dinschal Ich lade mir die Termine bei der Stadtreinigung runter und bearbeite die Liste noch mit Office (wegen dem benötigten Format).

I download the dates from the city cleaning and still edit the list with Office (because of the required format).

I don’t have the knowledge for plan A. I tried it, but it doesn’t affect the display and it doesn’t show up on MMM-RemoteControl in the Edit View list. What is necessary though.

I can change or add a few lines of code, but I can’t rewrite a module. The gradient stays as it is.

/*

to disable the following class

.MMM-BackgroundSlideshow .gradient background-image: radial-gradient(at center top, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, 0.45) 85%) !important;

 */


Module.register("MMM-BGSs-NoGradient", {
	// define variables used by module, but not in config data
	// some_variable:  true,
	// some_other_variable: "a string",

	// holder for config info from module_name.js
	config:null,

	init: function(){
		Log.log(this.name + " is in init!");
	},

	start: function(){
		Log.log(this.name + " is starting!");
	},

	loaded: function(callback) {
		Log.log(this.name + " is loaded!");
		callback();
	},


	// return list of stylesheet files to use if any
	getStyles: function() {
		return 	[
			// sample of list of files to specify here, if no files, do not use this routine, , or return empty list

			//'script.css', // will try to load it from the vendor folder, otherwise it will load is from the module folder.
			//'font-awesome.css', // this file is available in the vendor folder, so it doesn't need to be avialable in the module folder.
			//this.file('anotherfile.css'), // this file will be loaded straight from the module folder.
			//'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css',  // this file will be loaded from the bootstrapcdn servers.
		]
	},


	// messages received from other modules and the system (NOT from your node helper)
	// payload is a notification dependent data structure
	notificationReceived: function(notification, payload, sender) {
		// once everybody is loaded up
		if(notification==="ALL_MODULES_STARTED"){
			// send our config to our node_helper
			this.sendSocketNotification("CONFIG",this.config)
		}
		if (sender) {
			Log.log(this.name + " received a module notification: " + notification + " from sender: " + sender.name);
		} else {
			Log.log(this.name + " received a system notification: " + notification);
		}
	},

	// system notification your module is being hidden
	// typically you would stop doing UI updates (getDom/updateDom) if the module is hidden
	suspend: function(){

	},

	// system notification your module is being unhidden/shown
	// typically you would resume doing UI updates (getDom/updateDom) if the module is shown
	resume: function(){

	},

	// this is the major worker of the module, it provides the displayable content for this module
	getDom: function() {
		
		var wrapper = document.createElement("div");
		wrapper.className = 'bgss-nogradient_container';
		
		// if user supplied message text in its module config, use it
		if(this.config.hasOwnProperty("message")){
			// using text from module config block in config.js
			wrapper.innerHTML = this.config.message;
		}
		else{
		// use hard coded text
			wrapper.innerHTML = " ";
		}
		
		// change css 
		Object.assign(
			document.querySelector('.MMM-BackgroundSlideshow .gradient').style, 
			{
				display: none
			}
		)

		// pass the created content back to MM to add to DOM.
		return wrapper;
	},

})

@sdetweil said in fix for black screen in 2.16 and later:

did u npm install request in the mm folder, or in a module folder where there was no package.json, the latter ends up putting it in the mm/node_modules, the same as the former

I installed it the way you suggested. In the two module folders with the addition of package.json (npm init -y) and then npm install request. The MMM-DWD-WarnWeather worked on my mirror from the beginning after updating to MM2.17.

A supplement to the development tools. When you open it, you can select “Sources” and pause script execution with the “pause button” or F8 in the lower third. This makes it easier to get through all the style classes, which otherwise update every second.

@sdetweil I understand that some authors do not use the current libs. The “strange” referred to the fact that I have no problems with MMM-DWD-WarnWeather, but others have to install the module “request”.

Open source is both a curse and a blessing. Now everything works again and MM’s layout changes to the clock module were also quickly undone. :slightly_smiling_face:

@sdetweil Thanks, I will use it that way. MMM-OneTracker has the same “request”. Others had this problem with MMM-DWD-WarnWeather - not me. It is strange.

I don’t find the upgrade of MM quite helpful.

In my case under 2.16 one module (MMM-Fuel) did not work and one of my three calendars could not be loaded with MMM-CalendarExt2. In both cases the certificate error was the reason. The certificate had expired. It was, but there are new ones on the servers.

After upgrading to MM 2.17, MMM-Fuel now works, but not MMM-CalendarExt2 and MMM-OneTracker. So there are more problems than before. I definitely did not expect this with an upgrade. Set both modules to

disabled: true

and I’m rid of the black screen for now.

Now I guess I have to work my way through the post-installation.

Here as example the MMM-CalendarExt2 Error:

[24.10.2021 19:48.03.521] [ERROR] App threw an error during load
[24.10.2021 19:48.03.524] [ERROR] Error: Cannot find module 'request'
Require stack:
- /home/pi/MagicMirror/modules/MMM-CalendarExt2/node_helper.js
- /home/pi/MagicMirror/js/app.js
- /home/pi/MagicMirror/js/electron.js
- /home/pi/MagicMirror/node_modules/electron/dist/resources/default_app.asar/main.js
-
at Module._resolveFilename (internal/modules/cjs/loader.js:887:15)
at Function.n._resolveFilename (electron/js2c/browser_init.js:257:1128)
at Function.Module._resolveFilename (/home/pi/MagicMirror/node_modules/module-alias/index.js:49:29)
at Module._load (internal/modules/cjs/loader.js:732:27)
at Function.f._load (electron/js2c/asar_bundle.js:5:12913)
at Module.require (internal/modules/cjs/loader.js:959:19)
at require (internal/modules/cjs/helpers.js:88:18)
at Object.<anonymous> (/home/pi/MagicMirror/modules/MMM-CalendarExt2/node_helper.js:4:17)
at Module._compile (internal/modules/cjs/loader.js:1078:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1108:10)
[24.10.2021 19:48.03.525] [ERROR] Whoops! There was an uncaught exception...
[24.10.2021 19:48.03.531] [ERROR] Error: Cannot find module 'request'
Require stack:
- /home/pi/MagicMirror/modules/MMM-CalendarExt2/node_helper.js
- /home/pi/MagicMirror/js/app.js
- /home/pi/MagicMirror/js/electron.js
- /home/pi/MagicMirror/node_modules/electron/dist/resources/default_app.asar/main.js
-
at Module._resolveFilename (internal/modules/cjs/loader.js:887:15)
at Function.n._resolveFilename (electron/js2c/browser_init.js:257:1128)
at Function.Module._resolveFilename (/home/pi/MagicMirror/node_modules/module-alias/index.js:49:29)
at Module._load (internal/modules/cjs/loader.js:732:27)
at Function.f._load (electron/js2c/asar_bundle.js:5:12913)
at Module.require (internal/modules/cjs/loader.js:959:19)
at require (internal/modules/cjs/helpers.js:88:18)
at Object.<anonymous> (/home/pi/MagicMirror/modules/MMM-CalendarExt2/node_helper.js:4:17)
at Module._compile (internal/modules/cjs/loader.js:1078:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1108:10) {
code: 'MODULE_NOT_FOUND',
requireStack: [
'/home/pi/MagicMirror/modules/MMM-CalendarExt2/node_helper.js',
'/home/pi/MagicMirror/js/app.js',
'/home/pi/MagicMirror/js/electron.js',
'/home/pi/MagicMirror/node_modules/electron/dist/resources/default_app.asar/main.js',
undefined

Cannot find module ‘request’ means now what? I don’t know what to put in place of the “xxx”.

@techlady First of all I would adjust the borders at the custom.css

:root {

  --gap-body-top: 40px;
  --gap-body-right: 40px;
  --gap-body-bottom: 40px;
  --gap-body-left: 40px;
  }

The 40 pixels are examples.

@solelo Just try to set the width higher and higher, eventually nothing will overlap anymore. But it will probably be quite wide, with the cities next to the time. Maybe that’s why style: ‘top’ is the better choice.

@solelo Adjust the width to 200px

 .MMM-Worldclock .world {
       width: 200px;
 }

The module may also have an alignment problem on the right side. Further customization of custom.css may be required.

@solelo Actually, no. For completeness here are my settings from config.js:

		{
			module: 'MMM-Worldclock',
			position: 'top_left', // This can be any of the regions, best in top_left or top_right regions
			config: {
			// See 'Configuration options' for more information.
				timeFormat: 'HH:mm', //Global time format, as defined in moment.js format()
				style: 'top', // Which way do you want the flag and description from the clock? choices are 'top', 'left','right','bottom'
				offsetTimezone: null, // Timezone you want to show the difference from. null, "", or omitted from config will be UTC.
				clocks: [
					{
						title: "Weltzeit",
						timezone: "UTC",
						// timeFormat: "HH:mm MM/DD", // Time format override. 
						// altflag: "world.png" // if you'd like a flag from a file on your mirror device. 
					},
					{
						title: "Vancouver", // Too long of a title could cause bad text align.
						timezone: "America/Vancouver",
						flag: "ca", // If you'd like a flag from the standard library 
					},
					{
						title: "Boca Chica", // Too long of a title could cause bad text align.
						timezone: "America/Chicago", //When omitted, Local time will be displayed. 
						flag: "us", // If you'd like a flag from the standard library 
					},
					{
						title: "Sydney", // Too long of a title could cause bad text align.
						timezone: "Australia/Sydney",
						flag: "au", // If you'd like a flag from the standard library 
					},
				]
			},
		},

Did you restart MM or do a reload (Ctrl-R)?

I use the gradient function of MMM-BackgroundSlideshow and have made many adjustments in custom.css. First of all, I made the dimmed text colors a bit lighter:

:root {
  --color-text: #e6e6e6;
  --color-text-dimmed: #f5f5f5;
  --color-text-bright: #ffffff;

}

They can also all three be given the same bright color, e.g. #ffffff for white.

Then I checked each module to see if it used the default fonts, font-weight, and text colors. If not this was changed. For the default calendar, the times were a little darker than the event title. Here are my adjustments:

.calendar .time {
      color: var(--color-text-bright);
      font-weight: 400;
}

@krynn72 I have similar problems with live streams from Youtube and MMM-SmartWebDisplay. A starting point would probably be the graphics card (GPU) hardware acceleration at the browser. Without this, everything is calculated via the CPU.

However, I have not yet addressed the problem. The keywords for finding a solution are: chromium hardware acceleration raspberry pi

@harmzj I don’t see any errors, but I use the OpenWeatherMap and it works fine here. The option feels like can be turned off with:

showFeelsLike: false,

Add it under the type.

If you use Ctrl-Shift-I, does the weather module show an error message?

@solelo With the first eight lines of the posted snippet of my custom.css, you get the horizontal representation. Copy them into your custom.css and adjust the pixel width.

@BKeyport Pick Vancouver or the time zone itself (PST8PDT). :winking_face: That’s why I found the list of possibilities so helpful.

@sdetweil Yes, I had chosen the Windy City then, too.

@bkeyport By updating all of a second, I didn’t get to all the style classes with Chromium’s developer tools. But luckily you had already posted the essential ones.

I cared about the horizontal layout and yours has been tweaked a bit. The first clock with UTC time didn’t get a flag or globe, so it didn’t need to be as wide as the others. The text color and size were adjusted with MM variables. The size is 6px smaller than my standard (24px). The time difference to UTC time was hidden. With “display: none” I had no success, therefore my way over the transparent text.

At the config.js is:
style: ‘top’,
offsetTimezone: null,

And here al my lines for the custom.css:

/* Arrange clocks horizontally */
.MMM-Worldclock .worldtime {
      display: flex;
      flex-direction: row;
}
.MMM-Worldclock .world{
      width: 100px;
}
.MMM-Worldclock .world-0{  /* 1st clock = UTC clock */
      width: 70px;
}

/* Time title font color and size */
.MMM-Worldclock .zone {
      font-size: calc(var(--font-size) - 6px);
      color: var(--color-text-bright);
}

/* Hide time difference to UTC */
.MMM-Worldclock .gap {
      font-size: 1px;
      color: transparent;

The screenshot of this is in my previous post.

For the time zones, I looked here to see which ones are accepted. At first, I thought that America/Texas or America/Houston would be possible. But this is not the case.

@sdetweil The timeFormat is relative by default. I used getRelative: 0 without changes at the display. Also with timeFormat: “absolute” only the display changed since hours instead of remaining hours. But with an additional urgency: 0 it works. Thank you, Sam!

Oh yes, an adjustment of the format was also necessary. The dateFormat was no longer applied.

Before:

{
	module: "calendar",
	header: "Feiertage",
	position: "top_left",
	config: {
		dateFormat: "D. MMM",
		displaySymbol: false,
		broadcastEvents: false,
		hideTime: true,
		fadePoint: 0.05,
		fetchInterval: 24 * 60 * 60 * 1000,    // 1 day
		calendars: [
			{
			maximumEntries: 3,
			url: "webcal://localhost:8080/modules/calendar/feiertage.ics"
			}
		]
	}
},

After changes:

{
	module: "calendar",
	header: "Feiertage",
	position: "top_left",
	config: {
		dateFormat: "D. MMM",
		displaySymbol: false,
		broadcastEvents: false,
		hideTime: true,
		timeFormat: "absolute",
		getRelative: 0,
		urgency: 0,
		fullDayEventDateFormat: "D. MMM",
		nextDaysRelative: true,   // shows Tomorrow and Today
		fadePoint: 0.05,
		fetchInterval: 24 * 60 * 60 * 1000,    // 1 day
		calendars: [
			{
			maximumEntries: 3,
			url: "webcal://localhost:8080/modules/calendar/feiertage.ics"
			}
		]
	}
},

I can well do without the “today”.

Edit: The “Today” comes with the setting: nextDaysRelative: true.