Show events of a configurable amount of past days (#3046)

Hi,

want to include a birthday calendar to my mirror which shows upcoming
birthdays and as a reminder birthdays of the last two days.
I used
[MMM-CalendarExt2](https://github.com/MMM-CalendarExt2/MMM-CalendarExt2)
for this job in the past but the module is not supported any more and
very complicated to configure.
I managed to style the default calendar module to my needs but what i am
missing is to display already past events within a configurable time
range.

I included the translations of "YESTERDAY" and "DAYBEFOREYESTERDAY" to
all translation files and modified the code to accept a new option
`pastDaysCount` which controls of how many days past events should be
displayed.

---------

Co-authored-by: Veeck <github@veeck.de>

CHANGELOG.md

@@ -18,6 +18,7 @@ _This release is scheduled to be released on 2023-04-01._
 - Added possibility to use your own templates in Alert module
 - Added error message if `<modulename>.js` file is missing in module folder to get a hint in the logs (#2403)
 - Added possibility to use environment variables in `config.js` (#1756)
+- Added option `pastDaysCount` to default calendar module to control of how many days past events should be displayed
 - Added thai language to alert module
 
 ### Removed

modules/default/calendar/calendar.js

@@ -12,6 +12,7 @@ Module.register("calendar", {
 		maximumEntries: 10, // Total Maximum Entries
 		maximumNumberOfDays: 365,
 		limitDays: 0, // Limit the number of days shown, 0 = no limit
+		pastDaysCount: 0,
 		displaySymbol: true,
 		defaultSymbol: "calendar-alt", // Fontawesome Symbol see https://fontawesome.com/cheatsheet?from=io
 		defaultSymbolClassName: "fas fa-fw fa-",
@@ -121,6 +122,7 @@ Module.register("calendar", {
 			const calendarConfig = {
 				maximumEntries: calendar.maximumEntries,
 				maximumNumberOfDays: calendar.maximumNumberOfDays,
+				pastDaysCount: calendar.pastDaysCount,
 				broadcastPastEvents: calendar.broadcastPastEvents,
 				selfSignedCert: calendar.selfSignedCert
 			};
@@ -232,7 +234,10 @@ Module.register("calendar", {
 					const dateRow = document.createElement("tr");
 					dateRow.className = "dateheader normal";
 					if (event.today) dateRow.className += " today";
+					else if (event.dayBeforeYesterday) dateRow.className += " dayBeforeYesterday";
+					else if (event.yesterday) dateRow.className += " yesterday";
 					else if (event.tomorrow) dateRow.className += " tomorrow";
+					else if (event.dayAfterTomorrow) dateRow.className += " dayAfterTomorrow";
 
 					const dateCell = document.createElement("td");
 					dateCell.colSpan = "3";
@@ -267,7 +272,10 @@ Module.register("calendar", {
 
 			eventWrapper.className = "event-wrapper normal event";
 			if (event.today) eventWrapper.className += " today";
+			else if (event.dayBeforeYesterday) eventWrapper.className += " dayBeforeYesterday";
+			else if (event.yesterday) eventWrapper.className += " yesterday";
 			else if (event.tomorrow) eventWrapper.className += " tomorrow";
+			else if (event.dayAfterTomorrow) eventWrapper.className += " dayAfterTomorrow";
 
 			const symbolWrapper = document.createElement("td");
 
@@ -397,6 +405,8 @@ Module.register("calendar", {
 						// Full days events within the next two days
 						if (event.today) {
 							timeWrapper.innerHTML = this.capFirst(this.translate("TODAY"));
+						} else if (event.yesterday) {
+							timeWrapper.innerHTML = this.capFirst(this.translate("YESTERDAY"));
 						} else if (event.startDate - now < ONE_DAY && event.startDate - now > 0) {
 							timeWrapper.innerHTML = this.capFirst(this.translate("TOMORROW"));
 						} else if (event.startDate - now < 2 * ONE_DAY && event.startDate - now > 0) {
@@ -425,6 +435,12 @@ Module.register("calendar", {
 							// Full days events within the next two days
 							if (event.today) {
 								timeWrapper.innerHTML = this.capFirst(this.translate("TODAY"));
+							} else if (event.dayBeforeYesterday) {
+								if (this.translate("DAYBEFOREYESTERDAY") !== "DAYBEFOREYESTERDAY") {
+									timeWrapper.innerHTML = this.capFirst(this.translate("DAYBEFOREYESTERDAY"));
+								}
+							} else if (event.yesterday) {
+								timeWrapper.innerHTML = this.capFirst(this.translate("YESTERDAY"));
 							} else if (event.startDate - now < ONE_DAY && event.startDate - now > 0) {
 								timeWrapper.innerHTML = this.capFirst(this.translate("TOMORROW"));
 							} else if (event.startDate - now < 2 * ONE_DAY && event.startDate - now > 0) {
@@ -462,7 +478,10 @@ Module.register("calendar", {
 					const locationRow = document.createElement("tr");
 					locationRow.className = "event-wrapper-location normal xsmall light";
 					if (event.today) locationRow.className += " today";
+					else if (event.dayBeforeYesterday) locationRow.className += " dayBeforeYesterday";
+					else if (event.yesterday) locationRow.className += " yesterday";
 					else if (event.tomorrow) locationRow.className += " tomorrow";
+					else if (event.dayAfterTomorrow) locationRow.className += " dayAfterTomorrow";
 
 					if (this.config.displaySymbol) {
 						const symbolCell = document.createElement("td");
@@ -558,6 +577,7 @@ Module.register("calendar", {
 		for (const calendarUrl in this.calendarData) {
 			const calendar = this.calendarData[calendarUrl];
 			let remainingEntries = this.maximumEntriesForUrl(calendarUrl);
+			let maxPastDaysCompare = now - this.maximumPastDaysForUrl(calendarUrl) * ONE_DAY;
 			for (const e in calendar) {
 				const event = JSON.parse(JSON.stringify(calendar[e])); // clone object
 
@@ -566,7 +586,7 @@ Module.register("calendar", {
 					continue;
 				}
 				if (limitNumberOfEntries) {
-					if (event.endDate < now) {
+					if (event.endDate < maxPastDaysCompare) {
 						continue;
 					}
 					if (this.config.hideOngoing && event.startDate < now) {
@@ -581,7 +601,10 @@ Module.register("calendar", {
 				}
 				event.url = calendarUrl;
 				event.today = event.startDate >= today && event.startDate < today + ONE_DAY;
+				event.dayBeforeYesterday = event.startDate >= today - ONE_DAY * 2 && event.startDate < today - ONE_DAY;
+				event.yesterday = event.startDate >= today - ONE_DAY && event.startDate < today;
 				event.tomorrow = !event.today && event.startDate >= today + ONE_DAY && event.startDate < today + 2 * ONE_DAY;
+				event.dayAfterTomorrow = !event.tomorrow && event.startDate >= today + ONE_DAY * 2 && event.startDate < today + 3 * ONE_DAY;
 
 				/* if sliceMultiDayEvents is set to true, multiday events (events exceeding at least one midnight) are sliced into days,
 				 * otherwise, esp. in dateheaders mode it is not clear how long these events are.
@@ -681,6 +704,7 @@ Module.register("calendar", {
 			excludedEvents: calendarConfig.excludedEvents || this.config.excludedEvents,
 			maximumEntries: calendarConfig.maximumEntries || this.config.maximumEntries,
 			maximumNumberOfDays: calendarConfig.maximumNumberOfDays || this.config.maximumNumberOfDays,
+			pastDaysCount: calendarConfig.pastDaysCount || this.config.pastDaysCount,
 			fetchInterval: this.config.fetchInterval,
 			symbolClass: calendarConfig.symbolClass,
 			titleClass: calendarConfig.titleClass,
@@ -803,6 +827,16 @@ Module.register("calendar", {
 		return this.getCalendarProperty(url, "maximumEntries", this.config.maximumEntries);
 	},
 
+	/**
+	 * Retrieves the maximum count of past days which events of should be displayed for a specific calendar url.
+	 *
+	 * @param {string} url The calendar url
+	 * @returns {number} The maximum past days count
+	 */
+	maximumPastDaysForUrl: function (url) {
+		return this.getCalendarProperty(url, "pastDaysCount", this.config.pastDaysCount);
+	},
+
 	/**
 	 * Helper method to retrieve the property for a specific calendar url.
 	 *

tests/electron/modules/calendar_spec.js

@@ -16,6 +16,16 @@ describe("Calendar module", () => {
 	});
 
 	describe("Test css classes", () => {
+		it("has css class dayBeforeYesterday", async () => {
+			await helpers.startApplication("tests/configs/modules/calendar/custom.js", "03 Jan 2030 12:30:00 GMT");
+			await doTest(".dayBeforeYesterday");
+		});
+
+		it("has css class yesterday", async () => {
+			await helpers.startApplication("tests/configs/modules/calendar/custom.js", "02 Jan 2030 12:30:00 GMT");
+			await doTest(".yesterday");
+		});
+
 		it("has css class today", async () => {
 			await helpers.startApplication("tests/configs/modules/calendar/custom.js", "01 Jan 2030 12:30:00 GMT");
 			await doTest(".today");
@@ -25,5 +35,10 @@ describe("Calendar module", () => {
 			await helpers.startApplication("tests/configs/modules/calendar/custom.js", "31 Dec 2029 12:30:00 GMT");
 			await doTest(".tomorrow");
 		});
+
+		it("has css class dayAfterTomorrow", async () => {
+			await helpers.startApplication("tests/configs/modules/calendar/custom.js", "30 Dec 2029 12:30:00 GMT");
+			await doTest(".dayAfterTomorrow");
+		});
 	});
 });

translations/af.json

@@ -1,6 +1,7 @@
 {
 	"LOADING": "Besig om te laai …",
 
+	"YESTERDAY": "Gister",
 	"TODAY": "Vandag",
 	"TOMORROW": "Môre",
 	"DAYAFTERTOMORROW": "Oormôre",

translations/bg.json

@@ -1,6 +1,8 @@
 {
 	"LOADING": "Зареждане на …",
 
+	"DAYBEFOREYESTERDAY": "Завчера",
+	"YESTERDAY": "Вчера",
 	"TODAY": "Днес",
 	"TOMORROW": "Утре",
 	"DAYAFTERTOMORROW": "Вдругиден",

translations/ca.json

@@ -1,6 +1,7 @@
 {
 	"LOADING": "Carregant …",
 
+	"YESTERDAY": "Ahir",
 	"TODAY": "Avui",
 	"TOMORROW": "Demà",
 	"DAYAFTERTOMORROW": "Demà passat",

translations/cs.json

@@ -1,6 +1,8 @@
 {
 	"LOADING": "Načítání …",
 
+	"DAYBEFOREYESTERDAY": "Předevčírem",
+	"YESTERDAY": "Včera",
 	"TODAY": "Dnes",
 	"TOMORROW": "Zítra",
 	"DAYAFTERTOMORROW": "Pozítří",

translations/cv.json

@@ -1,6 +1,7 @@
 {
 	"LOADING": "Тиенет …",
 
+	"YESTERDAY": "Знон",
 	"TODAY": "Паян",
 	"TOMORROW": "Ыран",
 	"DAYAFTERTOMORROW": "Виҫмине",

translations/cy.json

@@ -1,6 +1,7 @@
 {
 	"LOADING": "Llwytho …",
 
+	"YESTERDAY": "Ddoe",
 	"TODAY": "Heddiw",
 	"TOMORROW": "Yfory",
 	"DAYAFTERTOMORROW": "Drennydd",

translations/da.json

@@ -1,6 +1,8 @@
 {
 	"LOADING": "Indlæser …",
 
+	"DAYBEFOREYESTERDAY": "Forgårs",
+	"YESTERDAY": "I går",
 	"TODAY": "I dag",
 	"TOMORROW": "I morgen",
 	"DAYAFTERTOMORROW": "I overmorgen",

translations/de.json

@@ -1,6 +1,8 @@
 {
 	"LOADING": "Lade …",
 
+	"DAYBEFOREYESTERDAY": "Vorgestern",
+	"YESTERDAY": "Gestern",
 	"TODAY": "Heute",
 	"TOMORROW": "Morgen",
 	"DAYAFTERTOMORROW": "Übermorgen",

translations/el.json

@@ -1,6 +1,8 @@
 {
 	"LOADING": "Φόρτωση …",
 
+	"DAYBEFOREYESTERDAY": "Προχθές",
+	"YESTERDAY": "Εχθές",
 	"TODAY": "Σήμερα",
 	"TOMORROW": "Αύριο",
 	"RUNNING": "Λήγει σε",

translations/en.json

@@ -1,6 +1,7 @@
 {
 	"LOADING": "Loading …",
 
+	"YESTERDAY": "Yesterday",
 	"TODAY": "Today",
 	"TOMORROW": "Tomorrow",
 	"RUNNING": "Ends in",

translations/es.json

@@ -1,6 +1,8 @@
 {
 	"LOADING": "Cargando …",
 
+	"DAYBEFOREYESTERDAY": "Anteayer",
+	"YESTERDAY": "Ayer",
 	"TODAY": "Hoy",
 	"TOMORROW": "Mañana",
 	"DAYAFTERTOMORROW": "Pasado mañana",

translations/et.json

@@ -1,6 +1,8 @@
 {
 	"LOADING": "Laen …",
 
+	"DAYBEFOREYESTERDAY": "Üleeile",
+	"YESTERDAY": "Eile",
 	"TODAY": "Täna",
 	"TOMORROW": "Homme",
 	"DAYAFTERTOMORROW": "Ülehomme",

translations/fi.json

@@ -1,6 +1,8 @@
 {
 	"LOADING": "Lataa …",
 
+	"DAYBEFOREYESTERDAY": "Toissapäivänä",
+	"YESTERDAY": "Eilen",
 	"TODAY": "Tänään",
 	"TOMORROW": "Huomenna",
 	"DAYAFTERTOMORROW": "Ylihuomenna",

translations/fr.json

@@ -1,6 +1,8 @@
 {
 	"LOADING": "Chargement…",
 
+	"DAYBEFOREYESTERDAY": "Avant-hier",
+	"YESTERDAY": "Hier",
 	"TODAY": "Aujourd'hui",
 	"TOMORROW": "Demain",
 	"DAYAFTERTOMORROW": "Après-demain",

translations/fy.json

@@ -1,6 +1,7 @@
 {
 	"LOADING": "Bezich mei laden …",
 
+	"YESTERDAY": "Juster",
 	"TODAY": "Hjoed",
 	"TOMORROW": "Moarn",
 	"DAYAFTERTOMORROW": "Oaremoarn",

translations/gl.json

@@ -1,6 +1,7 @@
 {
 	"LOADING": "Cargando …",
 
+	"YESTERDAY": "Onte",
 	"TODAY": "Hoxe",
 	"TOMORROW": "Mañá",
 	"DAYAFTERTOMORROW": "Pasado mañá",

translations/gu.json

@@ -1,6 +1,7 @@
 {
 	"LOADING": "લોડ થઈ રહ્યું છે …",
 
+	"YESTERDAY": "ગઇકાલે",
 	"TODAY": "આજે",
 	"TOMORROW": "આવતી કાલે",
 	"DAYAFTERTOMORROW": "પરમ દિવસે",

translations/he.json

@@ -1,6 +1,8 @@
 {
 	"LOADING": "טוען...",
 
+	"DAYBEFOREYESTERDAY": "שלשום",
+	"YESTERDAY": "אתמול",
 	"TODAY": "היום",
 	"TOMORROW": "מחר",
 	"DAYAFTERTOMORROW": "בעוד יומיים",

translations/hi.json

@@ -1,6 +1,8 @@
 {
 	"LOADING": "लोड हो रहा है …",
 
+	"DAYBEFOREYESTERDAY": "परसों",
+	"YESTERDAY": "कल",
 	"TODAY": "आज",
 	"TOMORROW": "आने वाला कल",
 	"DAYAFTERTOMORROW": "2 दिनों में",

translations/hr.json

@@ -1,6 +1,8 @@
 {
 	"LOADING": "Učitavanje …",
 
+	"DAYBEFOREYESTERDAY": "Prekjučer",
+	"YESTERDAY": "Jučer",
 	"TODAY": "Danas",
 	"TOMORROW": "Sutra",
 	"DAYAFTERTOMORROW": "Prekosutra",

translations/id.json

@@ -1,6 +1,7 @@
 {
 	"LOADING": "Memuat …",
 
+	"YESTERDAY": "Kemarin",
 	"TODAY": "Hari ini",
 	"TOMORROW": "Besok",
 	"DAYAFTERTOMORROW": "Lusa",

translations/is.json

@@ -1,6 +1,8 @@
 {
 	"LOADING": "Hleð upp …",
 
+	"DAYBEFOREYESTERDAY": "Í fyrradag",
+	"YESTERDAY": "Í gær",
 	"TODAY": "Í dag",
 	"TOMORROW": "Á morgun",
 	"DAYAFTERTOMORROW": "Ekki á morgun, heldur hinn",

translations/it.json

@@ -1,6 +1,7 @@
 {
 	"LOADING": "Caricamento in corso …",
 
+	"YESTERDAY": "Ieri",
 	"TODAY": "Oggi",
 	"TOMORROW": "Domani",
 	"DAYAFTERTOMORROW": "Dopodomani",

translations/ja.json

@@ -1,6 +1,8 @@
 {
 	"LOADING": "ローディング …",
 
+	"DAYBEFOREYESTERDAY": "おととい",
+	"YESTERDAY": "昨日",
 	"TODAY": "今日",
 	"TOMORROW": "明日",
 	"RUNNING": "で終わります",

translations/ko.json

@@ -1,6 +1,7 @@
 {
 	"LOADING": "로드 중 …",
 
+	"YESTERDAY": "어제",
 	"TODAY": "오늘",
 	"TOMORROW": "내일",
 	"DAYAFTERTOMORROW": "모레",

translations/lt.json

@@ -1,6 +1,8 @@
 {
 	"LOADING": "Kraunasi …",
 
+	"DAYBEFOREYESTERDAY": "Užvakar",
+	"YESTERDAY": "Vakar",
 	"TODAY": "Šiandien",
 	"TOMORROW": "Rytoj",
 	"DAYAFTERTOMORROW": "Už 2 dienų",

translations/ms-my.json

@@ -1,6 +1,7 @@
 {
 	"LOADING": "Tunggu Sebentar …",
 
+	"YESTERDAY": "Semalam",
 	"TODAY": "Hari ini",
 	"TOMORROW": "Esok",
 	"DAYAFTERTOMORROW": "Lusa",

translations/nb.json

@@ -1,6 +1,8 @@
 {
 	"LOADING": "Laster …",
 
+	"DAYBEFOREYESTERDAY": "I forgårs",
+	"YESTERDAY": "I går",
 	"TODAY": "I dag",
 	"TOMORROW": "I morgen",
 	"DAYAFTERTOMORROW": "I overmorgen",