first commit

.editorconfig

@@ -0,0 +1,15 @@
+# editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+indent_size = 2
+indent_style = space
+insert_final_newline = true
+max_line_length = 250
+trim_trailing_whitespace = true
+
+[*.{js,json}]
+indent_size = 4
+indent_style = tab

.eslintignore

@@ -0,0 +1 @@
+modules/default/calendar/vendor/*

.eslintrc.json

@@ -0,0 +1,34 @@
+{
+	"extends": ["eslint:recommended", "plugin:prettier/recommended", "plugin:jsdoc/recommended"],
+	"plugins": ["prettier", "import", "jsdoc", "jest"],
+	"env": {
+		"browser": true,
+		"es2022": true,
+		"jest/globals": true,
+		"node": true
+	},
+	"globals": {
+		"config": true,
+		"Log": true,
+		"MM": true,
+		"Module": true,
+		"moment": true
+	},
+	"parserOptions": {
+		"sourceType": "module",
+		"ecmaVersion": 2022,
+		"ecmaFeatures": {
+			"globalReturn": true
+		}
+	},
+	"rules": {
+		"eqeqeq": "error",
+		"import/order": "error",
+		"no-param-reassign": "error",
+		"no-prototype-builtins": "off",
+		"no-throw-literal": "error",
+		"no-unused-vars": "off",
+		"no-useless-return": "error",
+		"prefer-template": "error"
+	}
+}

.gitattributes

@@ -0,0 +1,56 @@
+# .gitattributes snippet to force users to use same line endings for project.
+# 
+# Handle line endings automatically for files detected as text
+# and leave all files detected as binary untouched.
+* text=auto
+
+#
+# The above will handle all files NOT found below
+# https://help.github.com/articles/dealing-with-line-endings/
+# https://github.com/Danimoth/gitattributes/blob/master/Web.gitattributes
+
+
+
+# These files are text and should be normalized (Convert crlf => lf)
+*.php text
+*.css text
+*.scss text
+*.js text
+*.json text
+*.htm text
+*.html text
+*.xml text
+*.txt text
+*.ini text
+*.inc text
+*.pl text
+*.rb text
+*.py text
+*.scm text
+*.sql text
+.htaccess text
+*.sh text
+Dockerfile* text
+*.yml text
+*.yaml text
+*.md text
+*.markdown text
+
+# These files are binary and should be left untouched
+# (binary is a macro for -text -diff)
+*.png binary
+*.jpg binary
+*.jpeg binary
+*.gif binary
+*.ico binary
+*.mov binary
+*.mp4 binary
+*.mp3 binary
+*.flv binary
+*.fla binary
+*.swf binary
+*.gz binary
+*.zip binary
+*.7z binary
+*.ttf binary
+*.pyc binary

.gitignore

@@ -0,0 +1,81 @@
+# Various Node ignoramuses.
+logs
+*.log
+npm-debug.log*
+pids
+*.pid
+*.seed
+lib-cov
+coverage
+.lock-wscript
+build/Release
+/node_modules/**/*
+fonts/node_modules/**/*
+vendor/node_modules/**/*
+!/tests/node_modules/**/*
+jspm_modules
+.npm
+.node_repl_history
+
+# Visual Studio Code ignoramuses.
+.vscode/
+
+# IDE Code ignoramuses.
+.idea/
+
+# Various Windows ignoramuses.
+Thumbs.db
+ehthumbs.db
+Desktop.ini
+$RECYCLE.BIN/
+*.cab
+*.msi
+*.msm
+*.msp
+*.lnk
+
+# Various OSX ignoramuses.
+.DS_Store
+.AppleDouble
+.LSOverride
+Icon
+._*
+.DocumentRevisions-V100
+.fseventsd
+.Spotlight-V100
+.TemporaryItems
+.Trashes
+.VolumeIcon.icns
+.AppleDB
+.AppleDesktop
+Network Trash Folder
+Temporary Items
+.apdisk
+
+# Various Linux ignoramuses.
+.fuse_hidden*
+.directory
+.Trash-*
+
+# Ignore all modules except the default modules.
+/modules/**
+!/modules/default
+!/modules/default/**
+!/modules/README.md**
+
+# Ignore changes to the custom css files.
+/css/custom.css
+
+# Ignore users config file but keep the sample.
+/config/*
+!/config/config.js.sample
+
+# Vim
+## swap
+[._]*.s[a-w][a-z]
+[._]s[a-w][a-z]
+
+## diff patch
+*.orig
+*.rej
+*.bak

.husky/pre-commit

@@ -0,0 +1,7 @@
+#!/bin/sh
+
+[ -f "$(dirname "$0")/_/husky.sh" ] && . "$(dirname "$0")/_/husky.sh"
+
+if command -v npm &> /dev/null; then
+  npm run lint:staged
+fi

.prettierignore

@@ -0,0 +1,3 @@
+/config
+/coverage
+package-lock.json

.prettierrc.json

@@ -0,0 +1,3 @@
+{
+	"trailingComma": "none"
+}

.stylelintrc.json

@@ -0,0 +1,7 @@
+{
+	"extends": ["stylelint-config-standard"],
+	"plugins": ["stylelint-prettier"],
+	"rules": {
+		"prettier/prettier": true
+	}
+}

Collaboration.md

@@ -0,0 +1,18 @@
+This document describes how collaborators of this repository should work together.
+
+## Pull Requests
+
+- never merge your own PR's
+- never merge without someone having approved (approving and merging from same person is allowed)
+- wait for all approvals requested (or the author decides something different in the comments)
+- never merge to `master`, except for releases (because of update notification)
+- merges to master should be tagged with the "mastermerge" label so that the test runs through
+
+## Issues
+
+- "real" Issues are closed if the problem is solved and the fix is released
+- unrelated Issues (e.g. related to a foreign module) are closed immediately with a comment to open an issue in the module repository or to discuss this further in the forum or discord
+
+## Releases
+
+- are done by @MichMich only

LICENSE.md

@@ -0,0 +1,17 @@
+# The MIT License (MIT)
+
+Copyright © 2016-2022 Michael Teeuw
+
+Permission is hereby granted, free of charge, to any person
+obtaining a copy of this software and associated documentation
+files (the “Software”), to deal in the Software without
+restriction, including without limitation the rights to use,
+copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the
+Software is furnished to do so, subject to the following
+conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+**The software is provided “as is”, without warranty of any kind, express or implied, including but not limited to the warranties of merchantability, fitness for a particular purpose and noninfringement. In no event shall the authors or copyright holders be liable for any claim, damages or other liability, whether in an action of contract, tort or otherwise, arising from, out of or in connection with the software or the use or other dealings in the software.**

README.md

@@ -0,0 +1,56 @@
+![MagicMirror²: The open source modular smart mirror platform. ](.github/header.png)
+
+<p style="text-align: center">
+  <a href="https://choosealicense.com/licenses/mit">
+		<img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="License">
+	</a>
+	<img src="https://img.shields.io/github/actions/workflow/status/michmich/magicmirror/automated-tests.yaml" alt="GitHub Actions">
+	<img src="https://img.shields.io/github/checks-status/michmich/magicmirror/master" alt="Build Status">
+	<a href="https://codecov.io/gh/MichMich/MagicMirror">
+		<img src="https://codecov.io/gh/MichMich/MagicMirror/branch/master/graph/badge.svg?token=LEG1KitZR6" alt="CodeCov Status"/>
+	</a>
+	<a href="https://github.com/MichMich/MagicMirror">
+		<img src="https://img.shields.io/github/stars/michmich/magicmirror?style=social">
+	</a>
+</p>
+
+**MagicMirror²** is an open source modular smart mirror platform. With a growing list of installable modules, the **MagicMirror²** allows you to convert your hallway or bathroom mirror into your personal assistant. **MagicMirror²** is built by the creator of [the original MagicMirror](https://michaelteeuw.nl/tagged/magicmirror) with the incredible help of a [growing community of contributors](https://github.com/MichMich/MagicMirror/graphs/contributors).
+
+MagicMirror² focuses on a modular plugin system and uses [Electron](https://www.electronjs.org/) as an application wrapper. So no more web server or browser installs necessary!
+
+## Documentation
+
+For the full documentation including **[installation instructions](https://docs.magicmirror.builders/getting-started/installation.html)**, please visit our dedicated documentation website: [https://docs.magicmirror.builders](https://docs.magicmirror.builders).
+
+## Links
+
+- Website: [https://magicmirror.builders](https://magicmirror.builders)
+- Documentation: [https://docs.magicmirror.builders](https://docs.magicmirror.builders)
+- Forum: [https://forum.magicmirror.builders](https://forum.magicmirror.builders)
+  - Technical discussions: https://forum.magicmirror.builders/category/11/core-system
+- Discord: [https://discord.gg/J5BAtvx](https://discord.gg/J5BAtvx)
+- Blog: [https://michaelteeuw.nl/tagged/magicmirror](https://michaelteeuw.nl/tagged/magicmirror)
+- Donations: [https://magicmirror.builders/#donate](https://magicmirror.builders/#donate)
+
+## Contributing Guidelines
+
+Contributions of all kinds are welcome, not only in the form of code but also with regards to
+
+- bug reports
+- documentation
+- translations
+
+For the full contribution guidelines, check out: [https://docs.magicmirror.builders/about/contributing.html](https://docs.magicmirror.builders/about/contributing.html)
+
+## Enjoying MagicMirror? Consider a donation!
+
+MagicMirror² is opensource and free. That doesn't mean we don't need any money.
+
+Please consider a donation to help us cover the ongoing costs like webservers and email services.
+If we receive enough donations we might even be able to free up some working hours and spend some extra time improving the MagicMirror² core.
+
+To donate, please follow [this](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=G5D8E9MR5DTD2&source=url) link.
+
+<p style="text-align: center">
+	<a href="https://forum.magicmirror.builders/topic/728/magicmirror-is-voted-number-1-in-the-magpi-top-50"><img src="https://magicmirror.builders/img/magpi-best-watermark-custom.png" width="150" alt="MagPi Top 50"></a>
+</p>

clientonly/index.js

@@ -0,0 +1,123 @@
+"use strict";
+
+// Use separate scope to prevent global scope pollution
+(function () {
+	const config = {};
+
+	/**
+	 * Helper function to get server address/hostname from either the commandline or env
+	 */
+	function getServerAddress() {
+		/**
+		 * Get command line parameters
+		 * Assumes that a cmdline parameter is defined with `--key [value]`
+		 * @param {string} key key to look for at the command line
+		 * @param {string} defaultValue value if no key is given at the command line
+		 * @returns {string} the value of the parameter
+		 */
+		function getCommandLineParameter(key, defaultValue = undefined) {
+			const index = process.argv.indexOf(`--${key}`);
+			const value = index > -1 ? process.argv[index + 1] : undefined;
+			return value !== undefined ? String(value) : defaultValue;
+		}
+
+		// Prefer command line arguments over environment variables
+		["address", "port"].forEach((key) => {
+			config[key] = getCommandLineParameter(key, process.env[key.toUpperCase()]);
+		});
+
+		// determine if "--use-tls"-flag was provided
+		config["tls"] = process.argv.indexOf("--use-tls") > 0;
+	}
+
+	/**
+	 * Gets the config from the specified server url
+	 * @param {string} url location where the server is running.
+	 * @returns {Promise} the config
+	 */
+	function getServerConfig(url) {
+		// Return new pending promise
+		return new Promise((resolve, reject) => {
+			// Select http or https module, depending on requested url
+			const lib = url.startsWith("https") ? require("https") : require("http");
+			const request = lib.get(url, (response) => {
+				let configData = "";
+
+				// Gather incoming data
+				response.on("data", function (chunk) {
+					configData += chunk;
+				});
+				// Resolve promise at the end of the HTTP/HTTPS stream
+				response.on("end", function () {
+					resolve(JSON.parse(configData));
+				});
+			});
+
+			request.on("error", function (error) {
+				reject(new Error(`Unable to read config from server (${url} (${error.message}`));
+			});
+		});
+	}
+
+	/**
+	 * Print a message to the console in case of errors
+	 * @param {string} message error message to print
+	 * @param {number} code error code for the exit call
+	 */
+	function fail(message, code = 1) {
+		if (message !== undefined && typeof message === "string") {
+			console.log(message);
+		} else {
+			console.log("Usage: 'node clientonly --address 192.168.1.10 --port 8080 [--use-tls]'");
+		}
+		process.exit(code);
+	}
+
+	getServerAddress();
+
+	(config.address && config.port) || fail();
+	const prefix = config.tls ? "https://" : "http://";
+
+	// Only start the client if a non-local server was provided
+	if (["localhost", "127.0.0.1", "::1", "::ffff:127.0.0.1", undefined].indexOf(config.address) === -1) {
+		getServerConfig(`${prefix}${config.address}:${config.port}/config/`)
+			.then(function (configReturn) {
+				// Pass along the server config via an environment variable
+				const env = Object.create(process.env);
+				const options = { env: env };
+				configReturn.address = config.address;
+				configReturn.port = config.port;
+				configReturn.tls = config.tls;
+				env.config = JSON.stringify(configReturn);
+
+				// Spawn electron application
+				const electron = require("electron");
+				const child = require("child_process").spawn(electron, ["js/electron.js"], options);
+
+				// Pipe all child process output to current stdout
+				child.stdout.on("data", function (buf) {
+					process.stdout.write(`Client: ${buf}`);
+				});
+
+				// Pipe all child process errors to current stderr
+				child.stderr.on("data", function (buf) {
+					process.stderr.write(`Client: ${buf}`);
+				});
+
+				child.on("error", function (err) {
+					process.stdout.write(`Client: ${err}`);
+				});
+
+				child.on("close", (code) => {
+					if (code !== 0) {
+						console.log(`There something wrong. The clientonly is not running code ${code}`);
+					}
+				});
+			})
+			.catch(function (reason) {
+				fail(`Unable to connect to server: (${reason})`);
+			});
+	} else {
+		fail();
+	}
+})();

css/custom.css.sample

@@ -0,0 +1,31 @@
+/* MagicMirror² Custom CSS Sample
+ *
+ * Change color and fonts here.
+ *
+ * Beware that properties cannot be unitless, so for example write '--gap-body: 0px;' instead of just '--gap-body: 0;'
+ *
+ * MIT Licensed.
+ */
+
+/* Uncomment and adjust accordingly if you want to import another font from the google-fonts-api: */
+/* @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;300;400;700&display=swap'); */
+
+:root {
+  --color-text: #999;
+  --color-text-dimmed: #666;
+  --color-text-bright: #fff;
+  --color-background: black;
+
+  --font-primary: "Roboto Condensed";
+  --font-secondary: "Roboto";
+  
+  --font-size: 20px;
+  --font-size-small: 0.75rem;
+
+  --gap-body-top: 60px;
+  --gap-body-right: 60px;
+  --gap-body-bottom: 60px;
+  --gap-body-left: 60px;
+  
+  --gap-modules: 30px;
+}

css/main.css

@@ -0,0 +1,241 @@
+:root {
+  --color-text: #999;
+  --color-text-dimmed: #666;
+  --color-text-bright: #fff;
+  --color-background: #000;
+  --font-primary: "Roboto Condensed";
+  --font-secondary: "Roboto";
+  --font-size: 20px;
+  --font-size-xsmall: 0.75rem;
+  --font-size-small: 1rem;
+  --font-size-medium: 1.5rem;
+  --font-size-large: 3.25rem;
+  --font-size-xlarge: 3.75rem;
+  --gap-body-top: 60px;
+  --gap-body-right: 60px;
+  --gap-body-bottom: 60px;
+  --gap-body-left: 60px;
+  --gap-modules: 30px;
+}
+
+html {
+  cursor: none;
+  overflow: hidden;
+  background: var(--color-background);
+  user-select: none;
+  font-size: var(--font-size);
+}
+
+::-webkit-scrollbar {
+  display: none;
+}
+
+body {
+  margin: var(--gap-body-top) var(--gap-body-right) var(--gap-body-bottom) var(--gap-body-left);
+  position: absolute;
+  height: calc(100% - var(--gap-body-top) - var(--gap-body-bottom));
+  width: calc(100% - var(--gap-body-right) - var(--gap-body-left));
+  background: var(--color-background);
+  color: var(--color-text);
+  font-family: var(--font-primary), sans-serif;
+  font-weight: 400;
+  line-height: 1.5;
+  -webkit-font-smoothing: antialiased;
+}
+
+/**
+ * Default styles.
+ */
+
+.dimmed {
+  color: var(--color-text-dimmed);
+}
+
+.normal {
+  color: var(--color-text);
+}
+
+.bright {
+  color: var(--color-text-bright);
+}
+
+.xsmall {
+  font-size: var(--font-size-xsmall);
+  line-height: 1.275;
+}
+
+.small {
+  font-size: var(--font-size-small);
+  line-height: 1.25;
+}
+
+.medium {
+  font-size: var(--font-size-medium);
+  line-height: 1.225;
+}
+
+.large {
+  font-size: var(--font-size-large);
+  line-height: 1;
+}
+
+.xlarge {
+  font-size: var(--font-size-xlarge);
+  line-height: 1;
+  letter-spacing: -3px;
+}
+
+.thin {
+  font-family: var(--font-secondary), sans-serif;
+  font-weight: 100;
+}
+
+.light {
+  font-family: var(--font-primary), sans-serif;
+  font-weight: 300;
+}
+
+.regular {
+  font-family: var(--font-primary), sans-serif;
+  font-weight: 400;
+}
+
+.bold {
+  font-family: var(--font-primary), sans-serif;
+  font-weight: 700;
+}
+
+.align-right {
+  text-align: right;
+}
+
+.align-left {
+  text-align: left;
+}
+
+header {
+  text-transform: uppercase;
+  font-size: var(--font-size-xsmall);
+  font-family: var(--font-primary), Arial, Helvetica, sans-serif;
+  font-weight: 400;
+  border-bottom: 1px solid var(--color-text-dimmed);
+  line-height: 15px;
+  padding-bottom: 5px;
+  margin-bottom: 10px;
+  color: var(--color-text);
+}
+
+sup {
+  font-size: 50%;
+  line-height: 50%;
+}
+
+/**
+ * Module styles.
+ */
+
+.module {
+  margin-bottom: var(--gap-modules);
+}
+
+.module.hidden {
+  pointer-events: none;
+}
+
+.module:not(.hidden) {
+  pointer-events: auto;
+}
+
+.region.bottom .module {
+  margin-top: var(--gap-modules);
+  margin-bottom: 0;
+}
+
+.no-wrap {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.pre-line {
+  white-space: pre-line;
+}
+
+/**
+ * Region Definitions.
+ */
+
+.region {
+  position: absolute;
+}
+
+.region.fullscreen {
+  position: absolute;
+  inset: calc(-1 * var(--gap-body-top)) calc(-1 * var(--gap-body-right)) calc(-1 * var(--gap-body-bottom)) calc(-1 * var(--gap-body-left));
+  pointer-events: none;
+}
+
+.region.right {
+  right: 0;
+  text-align: right;
+}
+
+.region.top {
+  top: 0;
+}
+
+.region.top.center,
+.region.bottom.center {
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+.region.top.right,
+.region.top.left,
+.region.top.center {
+  top: 100%;
+}
+
+.region.bottom {
+  bottom: 0;
+}
+
+.region.bottom.right,
+.region.bottom.center,
+.region.bottom.left {
+  bottom: 100%;
+}
+
+.region.bar {
+  width: 100%;
+  text-align: center;
+}
+
+.region.third,
+.region.middle.center {
+  width: 100%;
+  text-align: center;
+  transform: translateY(-50%);
+}
+
+.region.upper.third {
+  top: 33%;
+}
+
+.region.middle.center {
+  top: 50%;
+}
+
+.region.lower.third {
+  top: 66%;
+}
+
+.region.left {
+  text-align: left;
+}
+
+.region table {
+  width: 100%;
+  border-spacing: 0;
+  border-collapse: separate;
+}

fonts/package-lock.json

@@ -0,0 +1,37 @@
+{
+	"name": "magicmirror-fonts",
+	"lockfileVersion": 2,
+	"requires": true,
+	"packages": {
+		"": {
+			"name": "magicmirror-fonts",
+			"license": "MIT",
+			"dependencies": {
+				"@fontsource/roboto": "^4.5.8",
+				"@fontsource/roboto-condensed": "^4.5.9"
+			}
+		},
+		"node_modules/@fontsource/roboto": {
+			"version": "4.5.8",
+			"resolved": "https://registry.npmjs.org/@fontsource/roboto/-/roboto-4.5.8.tgz",
+			"integrity": "sha512-CnD7zLItIzt86q4Sj3kZUiLcBk1dSk81qcqgMGaZe7SQ1P8hFNxhMl5AZthK1zrDM5m74VVhaOpuMGIL4gagaA=="
+		},
+		"node_modules/@fontsource/roboto-condensed": {
+			"version": "4.5.9",
+			"resolved": "https://registry.npmjs.org/@fontsource/roboto-condensed/-/roboto-condensed-4.5.9.tgz",
+			"integrity": "sha512-ql4sQq+h8puBVildZ5ssjYf8DWDONYDe3PD3Bu/p1ZW9GnRETRNPPcCTs/q62HIl3QimwwkiKWynn6wZhQaetg=="
+		}
+	},
+	"dependencies": {
+		"@fontsource/roboto": {
+			"version": "4.5.8",
+			"resolved": "https://registry.npmjs.org/@fontsource/roboto/-/roboto-4.5.8.tgz",
+			"integrity": "sha512-CnD7zLItIzt86q4Sj3kZUiLcBk1dSk81qcqgMGaZe7SQ1P8hFNxhMl5AZthK1zrDM5m74VVhaOpuMGIL4gagaA=="
+		},
+		"@fontsource/roboto-condensed": {
+			"version": "4.5.9",
+			"resolved": "https://registry.npmjs.org/@fontsource/roboto-condensed/-/roboto-condensed-4.5.9.tgz",
+			"integrity": "sha512-ql4sQq+h8puBVildZ5ssjYf8DWDONYDe3PD3Bu/p1ZW9GnRETRNPPcCTs/q62HIl3QimwwkiKWynn6wZhQaetg=="
+		}
+	}
+}

fonts/package.json

@@ -0,0 +1,16 @@
+{
+	"name": "magicmirror-fonts",
+	"description": "Package for fonts use by MagicMirror² Core.",
+	"repository": {
+		"type": "git",
+		"url": "git+https://github.com/MichMich/MagicMirror.git"
+	},
+	"license": "MIT",
+	"bugs": {
+		"url": "https://github.com/MichMich/MagicMirror/issues"
+	},
+	"dependencies": {
+		"@fontsource/roboto": "^4.5.8",
+		"@fontsource/roboto-condensed": "^4.5.9"
+	}
+}

fonts/roboto.css

@@ -0,0 +1,55 @@
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-weight: 100;
+  src: local("Roboto Thin"), local("Roboto-Thin"), url("node_modules/@fontsource/roboto/files/roboto-all-100-normal.woff") format("woff");
+}
+
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-weight: 300;
+  src: local("Roboto Condensed Light"), local("RobotoCondensed-Light"), url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-all-300-normal.woff") format("woff");
+}
+
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-weight: 400;
+  src: local("Roboto Condensed"), local("RobotoCondensed-Regular"), url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-all-400-normal.woff") format("woff");
+}
+
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-weight: 700;
+  src: local("Roboto Condensed Bold"), local("RobotoCondensed-Bold"), url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-all-700-normal.woff") format("woff");
+}
+
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-weight: 400;
+  src: local("Roboto"), local("Roboto-Regular"), url("node_modules/@fontsource/roboto/files/roboto-all-400-normal.woff") format("woff");
+}
+
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-weight: 500;
+  src: local("Roboto Medium"), local("Roboto-Medium"), url("node_modules/@fontsource/roboto/files/roboto-all-500-normal.woff") format("woff");
+}
+
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-weight: 700;
+  src: local("Roboto Bold"), local("Roboto-Bold"), url("node_modules/@fontsource/roboto/files/roboto-all-700-normal.woff") format("woff");
+}
+
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-weight: 300;
+  src: local("Roboto Light"), local("Roboto-Light"), url("node_modules/@fontsource/roboto/files/roboto-all-300-normal.woff") format("woff");
+}

index.html

@@ -0,0 +1,57 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>MagicMirror²</title>
+    <meta name="google" content="notranslate" />
+    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
+
+    <meta name="apple-mobile-web-app-capable" content="yes" />
+    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
+    <meta name="format-detection" content="telephone=no" />
+    <meta name="mobile-web-app-capable" content="yes" />
+
+    <link rel="icon" href="data:;base64,iVBORw0KGgo=" />
+    <link rel="stylesheet" type="text/css" href="css/main.css" />
+    <link rel="stylesheet" type="text/css" href="fonts/roboto.css" />
+    <!-- custom.css is loaded by the loader.js to make sure it's loaded after the module css files. -->
+
+    <script type="text/javascript">
+      window.mmVersion = "#VERSION#";
+    </script>
+  </head>
+  <body>
+    <div class="region fullscreen below"><div class="container"></div></div>
+    <div class="region top bar">
+      <div class="container"></div>
+      <div class="region top left"><div class="container"></div></div>
+      <div class="region top center"><div class="container"></div></div>
+      <div class="region top right"><div class="container"></div></div>
+    </div>
+    <div class="region upper third"><div class="container"></div></div>
+    <div class="region middle center"><div class="container"></div></div>
+    <div class="region lower third">
+      <div class="container"><br /></div>
+    </div>
+    <div class="region bottom bar">
+      <div class="container"></div>
+      <div class="region bottom left"><div class="container"></div></div>
+      <div class="region bottom center"><div class="container"></div></div>
+      <div class="region bottom right"><div class="container"></div></div>
+    </div>
+    <div class="region fullscreen above"><div class="container"></div></div>
+    <script type="text/javascript" src="socket.io/socket.io.js"></script>
+    <script type="text/javascript" src="vendor/node_modules/nunjucks/browser/nunjucks.min.js"></script>
+    <script type="text/javascript" src="js/defaults.js"></script>
+    <script type="text/javascript" src="#CONFIG_FILE#"></script>
+    <script type="text/javascript" src="vendor/vendor.js"></script>
+    <script type="text/javascript" src="modules/default/defaultmodules.js"></script>
+    <script type="text/javascript" src="js/logger.js"></script>
+    <script type="text/javascript" src="translations/translations.js"></script>
+    <script type="text/javascript" src="js/translator.js"></script>
+    <script type="text/javascript" src="js/class.js"></script>
+    <script type="text/javascript" src="js/module.js"></script>
+    <script type="text/javascript" src="js/loader.js"></script>
+    <script type="text/javascript" src="js/socketclient.js"></script>
+    <script type="text/javascript" src="js/main.js"></script>
+  </body>
+</html>

installers/mm.sh

@@ -0,0 +1,4 @@
+#!/bin/bash
+# This file is still here to keep PM2 working on older installations.
+cd ~/MagicMirror
+DISPLAY=:0 npm start

jest.config.js

@@ -0,0 +1,33 @@
+module.exports = async () => {
+	return {
+		verbose: true,
+		testTimeout: 20000,
+		testSequencer: "<rootDir>/tests/utils/test_sequencer.js",
+		projects: [
+			{
+				displayName: "unit",
+				globalSetup: "<rootDir>/tests/unit/helpers/global-setup.js",
+				moduleNameMapper: {
+					logger: "<rootDir>/js/logger.js"
+				},
+				testMatch: ["**/tests/unit/**/*.[jt]s?(x)"],
+				testPathIgnorePatterns: ["<rootDir>/tests/unit/mocks", "<rootDir>/tests/unit/helpers"]
+			},
+			{
+				displayName: "electron",
+				testMatch: ["**/tests/electron/**/*.[jt]s?(x)"],
+				testPathIgnorePatterns: ["<rootDir>/tests/electron/helpers"]
+			},
+			{
+				displayName: "e2e",
+				setupFilesAfterEnv: ["<rootDir>/tests/e2e/helpers/mock-console.js"],
+				testMatch: ["**/tests/e2e/**/*.[jt]s?(x)"],
+				modulePaths: ["<rootDir>/js/"],
+				testPathIgnorePatterns: ["<rootDir>/tests/e2e/helpers", "<rootDir>/tests/e2e/mocks"]
+			}
+		],
+		collectCoverageFrom: ["./clientonly/**/*.js", "./js/**/*.js", "./modules/default/**/*.js", "./serveronly/**/*.js"],
+		coverageReporters: ["lcov", "text"],
+		coverageProvider: "v8"
+	};
+};

js/app.js

@@ -0,0 +1,362 @@
+/* MagicMirror²
+ * The Core App (Server)
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ */
+
+// Alias modules mentioned in package.js under _moduleAliases.
+require("module-alias/register");
+
+const fs = require("fs");
+const path = require("path");
+const envsub = require("envsub");
+const Log = require("logger");
+const Server = require(`${__dirname}/server`);
+const Utils = require(`${__dirname}/utils`);
+const defaultModules = require(`${__dirname}/../modules/default/defaultmodules`);
+
+// Get version number.
+global.version = require(`${__dirname}/../package.json`).version;
+Log.log(`Starting MagicMirror: v${global.version}`);
+
+// global absolute root path
+global.root_path = path.resolve(`${__dirname}/../`);
+
+if (process.env.MM_CONFIG_FILE) {
+	global.configuration_file = process.env.MM_CONFIG_FILE;
+}
+
+// FIXME: Hotfix Pull Request
+// https://github.com/MichMich/MagicMirror/pull/673
+if (process.env.MM_PORT) {
+	global.mmPort = process.env.MM_PORT;
+}
+
+// The next part is here to prevent a major exception when there
+// is no internet connection. This could probable be solved better.
+process.on("uncaughtException", function (err) {
+	Log.error("Whoops! There was an uncaught exception...");
+	Log.error(err);
+	Log.error("MagicMirror² will not quit, but it might be a good idea to check why this happened. Maybe no internet connection?");
+	Log.error("If you think this really is an issue, please open an issue on GitHub: https://github.com/MichMich/MagicMirror/issues");
+});
+
+/**
+ * The core app.
+ * @class
+ */
+function App() {
+	let nodeHelpers = [];
+	let httpServer;
+
+	/**
+	 * Loads the config file. Combines it with the defaults and returns the config
+	 * @async
+	 * @returns {Promise<object>} the loaded config or the defaults if something goes wrong
+	 */
+	async function loadConfig() {
+		Log.log("Loading config ...");
+		const defaults = require(`${__dirname}/defaults`);
+
+		// For this check proposed to TestSuite
+		// https://forum.magicmirror.builders/topic/1456/test-suite-for-magicmirror/8
+		const configFilename = path.resolve(global.configuration_file || `${global.root_path}/config/config.js`);
+		let templateFile = `${configFilename}.template`;
+
+		// check if templateFile exists
+		try {
+			fs.accessSync(templateFile, fs.F_OK);
+		} catch (err) {
+			templateFile = null;
+			Log.debug("config template file not exists, no envsubst");
+		}
+
+		if (templateFile) {
+			// save current config.js
+			try {
+				if (fs.existsSync(configFilename)) {
+					fs.copyFileSync(configFilename, `${configFilename}-old`);
+				}
+			} catch (err) {
+				Log.warn(`Could not copy ${configFilename}: ${err.message}`);
+			}
+
+			// check if config.env exists
+			const envFiles = [];
+			const configEnvFile = `${configFilename.substr(0, configFilename.lastIndexOf("."))}.env`;
+			try {
+				if (fs.existsSync(configEnvFile)) {
+					envFiles.push(configEnvFile);
+				}
+			} catch (err) {
+				Log.debug(`${configEnvFile} does not exist. ${err.message}`);
+			}
+
+			let options = {
+				all: true,
+				diff: false,
+				envFiles: envFiles,
+				protect: false,
+				syntax: "default",
+				system: true
+			};
+
+			// envsubst variables in templateFile and create new config.js
+			// naming for envsub must be templateFile and outputFile
+			const outputFile = configFilename;
+			try {
+				await envsub({ templateFile, outputFile, options });
+			} catch (err) {
+				Log.error(`Could not envsubst variables: ${err.message}`);
+			}
+		}
+
+		try {
+			fs.accessSync(configFilename, fs.F_OK);
+			const c = require(configFilename);
+			checkDeprecatedOptions(c);
+			return Object.assign(defaults, c);
+		} catch (e) {
+			if (e.code === "ENOENT") {
+				Log.error(Utils.colors.error("WARNING! Could not find config file. Please create one. Starting with default configuration."));
+			} else if (e instanceof ReferenceError || e instanceof SyntaxError) {
+				Log.error(Utils.colors.error(`WARNING! Could not validate config file. Starting with default configuration. Please correct syntax errors at or above this line: ${e.stack}`));
+			} else {
+				Log.error(Utils.colors.error(`WARNING! Could not load config file. Starting with default configuration. Error found: ${e}`));
+			}
+		}
+
+		return defaults;
+	}
+
+	/**
+	 * Checks the config for deprecated options and throws a warning in the logs
+	 * if it encounters one option from the deprecated.js list
+	 * @param {object} userConfig The user config
+	 */
+	function checkDeprecatedOptions(userConfig) {
+		const deprecated = require(`${global.root_path}/js/deprecated`);
+		const deprecatedOptions = deprecated.configs;
+
+		const usedDeprecated = deprecatedOptions.filter((option) => userConfig.hasOwnProperty(option));
+		if (usedDeprecated.length > 0) {
+			Log.warn(Utils.colors.warn(`WARNING! Your config is using deprecated options: ${usedDeprecated.join(", ")}. Check README and CHANGELOG for more up-to-date ways of getting the same functionality.`));
+		}
+	}
+
+	/**
+	 * Loads a specific module.
+	 * @param {string} module The name of the module (including subpath).
+	 */
+	function loadModule(module) {
+		const elements = module.split("/");
+		const moduleName = elements[elements.length - 1];
+		let moduleFolder = `${__dirname}/../modules/${module}`;
+
+		if (defaultModules.includes(moduleName)) {
+			moduleFolder = `${__dirname}/../modules/default/${module}`;
+		}
+
+		const moduleFile = `${moduleFolder}/${module}.js`;
+
+		try {
+			fs.accessSync(moduleFile, fs.R_OK);
+		} catch (e) {
+			Log.warn(`No ${moduleFile} found for module: ${moduleName}.`);
+		}
+
+		const helperPath = `${moduleFolder}/node_helper.js`;
+
+		let loadHelper = true;
+		try {
+			fs.accessSync(helperPath, fs.R_OK);
+		} catch (e) {
+			loadHelper = false;
+			Log.log(`No helper found for module: ${moduleName}.`);
+		}
+
+		if (loadHelper) {
+			const Module = require(helperPath);
+			let m = new Module();
+
+			if (m.requiresVersion) {
+				Log.log(`Check MagicMirror² version for node helper '${moduleName}' - Minimum version: ${m.requiresVersion} - Current version: ${global.version}`);
+				if (cmpVersions(global.version, m.requiresVersion) >= 0) {
+					Log.log("Version is ok!");
+				} else {
+					Log.warn(`Version is incorrect. Skip module: '${moduleName}'`);
+					return;
+				}
+			}
+
+			m.setName(moduleName);
+			m.setPath(path.resolve(moduleFolder));
+			nodeHelpers.push(m);
+
+			m.loaded();
+		}
+	}
+
+	/**
+	 * Loads all modules.
+	 * @param {Module[]} modules All modules to be loaded
+	 * @returns {Promise} A promise that is resolved when all modules been loaded
+	 */
+	async function loadModules(modules) {
+		Log.log("Loading module helpers ...");
+
+		for (let module of modules) {
+			await loadModule(module);
+		}
+
+		Log.log("All module helpers loaded.");
+	}
+
+	/**
+	 * Compare two semantic version numbers and return the difference.
+	 * @param {string} a Version number a.
+	 * @param {string} b Version number b.
+	 * @returns {number} A positive number if a is larger than b, a negative
+	 * number if a is smaller and 0 if they are the same
+	 */
+	function cmpVersions(a, b) {
+		let i, diff;
+		const regExStrip0 = /(\.0+)+$/;
+		const segmentsA = a.replace(regExStrip0, "").split(".");
+		const segmentsB = b.replace(regExStrip0, "").split(".");
+		const l = Math.min(segmentsA.length, segmentsB.length);
+
+		for (i = 0; i < l; i++) {
+			diff = parseInt(segmentsA[i], 10) - parseInt(segmentsB[i], 10);
+			if (diff) {
+				return diff;
+			}
+		}
+		return segmentsA.length - segmentsB.length;
+	}
+
+	/**
+	 * Start the core app.
+	 *
+	 * It loads the config, then it loads all modules.
+	 * @async
+	 * @returns {Promise<object>} the config used
+	 */
+	this.start = async function () {
+		config = await loadConfig();
+
+		Log.setLogLevel(config.logLevel);
+
+		let modules = [];
+		for (const module of config.modules) {
+			if (!modules.includes(module.module) && !module.disabled) {
+				modules.push(module.module);
+			}
+		}
+
+		await loadModules(modules);
+
+		httpServer = new Server(config);
+		const { app, io } = await httpServer.open();
+		Log.log("Server started ...");
+
+		const nodePromises = [];
+		for (let nodeHelper of nodeHelpers) {
+			nodeHelper.setExpressApp(app);
+			nodeHelper.setSocketIO(io);
+
+			try {
+				nodePromises.push(nodeHelper.start());
+			} catch (error) {
+				Log.error(`Error when starting node_helper for module ${nodeHelper.name}:`);
+				Log.error(error);
+			}
+		}
+
+		const results = await Promise.allSettled(nodePromises);
+
+		// Log errors that happened during async node_helper startup
+		results.forEach((result) => {
+			if (result.status === "rejected") {
+				Log.error(result.reason);
+			}
+		});
+
+		Log.log("Sockets connected & modules started ...");
+
+		return config;
+	};
+
+	/**
+	 * Stops the core app. This calls each node_helper's STOP() function, if it
+	 * exists.
+	 *
+	 * Added to fix #1056
+	 * @returns {Promise} A promise that is resolved when all node_helpers and
+	 * the http server has been closed
+	 */
+	this.stop = async function () {
+		const nodePromises = [];
+		for (let nodeHelper of nodeHelpers) {
+			try {
+				if (typeof nodeHelper.stop === "function") {
+					nodePromises.push(nodeHelper.stop());
+				}
+			} catch (error) {
+				Log.error(`Error when stopping node_helper for module ${nodeHelper.name}:`);
+				console.error(error);
+			}
+		}
+
+		const results = await Promise.allSettled(nodePromises);
+
+		// Log errors that happened during async node_helper stopping
+		results.forEach((result) => {
+			if (result.status === "rejected") {
+				Log.error(result.reason);
+			}
+		});
+
+		Log.log("Node_helpers stopped ...");
+
+		// To be able to stop the app even if it hasn't been started (when
+		// running with Electron against another server)
+		if (!httpServer) {
+			return Promise.resolve();
+		}
+
+		return httpServer.close();
+	};
+
+	/**
+	 * Listen for SIGINT signal and call stop() function.
+	 *
+	 * Added to fix #1056
+	 * Note: this is only used if running `server-only`. Otherwise
+	 * this.stop() is called by app.on("before-quit"... in `electron.js`
+	 */
+	process.on("SIGINT", async () => {
+		Log.log("[SIGINT] Received. Shutting down server...");
+		setTimeout(() => {
+			process.exit(0);
+		}, 3000); // Force quit after 3 seconds
+		await this.stop();
+		process.exit(0);
+	});
+
+	/**
+	 * Listen to SIGTERM signals so we can stop everything when we
+	 * are asked to stop by the OS.
+	 */
+	process.on("SIGTERM", async () => {
+		Log.log("[SIGTERM] Received. Shutting down server...");
+		setTimeout(() => {
+			process.exit(0);
+		}, 3000); // Force quit after 3 seconds
+		await this.stop();
+		process.exit(0);
+	});
+}
+
+module.exports = new App();

js/check_config.js

@@ -0,0 +1,72 @@
+/* MagicMirror²
+ *
+ * Check the configuration file for errors
+ *
+ * By Rodrigo Ramírez Norambuena https://rodrigoramirez.com
+ * MIT Licensed.
+ */
+const path = require("path");
+const fs = require("fs");
+const { Linter } = require("eslint");
+
+const linter = new Linter();
+
+const rootPath = path.resolve(`${__dirname}/../`);
+const Log = require(`${rootPath}/js/logger.js`);
+const Utils = require(`${rootPath}/js/utils.js`);
+
+/**
+ * Returns a string with path of configuration file.
+ * Check if set by environment variable MM_CONFIG_FILE
+ * @returns {string} path and filename of the config file
+ */
+function getConfigFile() {
+	// FIXME: This function should be in core. Do you want refactor me ;) ?, be good!
+	return path.resolve(process.env.MM_CONFIG_FILE || `${rootPath}/config/config.js`);
+}
+
+/**
+ * Checks the config file using eslint.
+ */
+function checkConfigFile() {
+	const configFileName = getConfigFile();
+
+	// Check if file is present
+	if (fs.existsSync(configFileName) === false) {
+		Log.error(Utils.colors.error("File not found: "), configFileName);
+		throw new Error("No config file present!");
+	}
+
+	// Check permission
+	try {
+		fs.accessSync(configFileName, fs.F_OK);
+	} catch (e) {
+		Log.error(Utils.colors.error(e));
+		throw new Error("No permission to access config file!");
+	}
+
+	// Validate syntax of the configuration file.
+	Log.info(Utils.colors.info("Checking file... "), configFileName);
+
+	// I'm not sure if all ever is utf-8
+	const configFile = fs.readFileSync(configFileName, "utf-8");
+
+	// Explicitly tell linter that he might encounter es6 syntax ("let config = {...}")
+	const errors = linter.verify(configFile, {
+		env: {
+			es6: true
+		}
+	});
+
+	if (errors.length === 0) {
+		Log.info(Utils.colors.pass("Your configuration file doesn't contain syntax errors :)"));
+	} else {
+		Log.error(Utils.colors.error("Your configuration file contains syntax errors :("));
+
+		for (const error of errors) {
+			Log.error(`Line ${error.line} column ${error.column}: ${error.message}`);
+		}
+	}
+}
+
+checkConfigFile();

js/class.js

@@ -0,0 +1,108 @@
+/* global Class, xyz */
+
+/* Simple JavaScript Inheritance
+ * By John Resig https://johnresig.com/
+ *
+ * Inspired by base2 and Prototype
+ *
+ * MIT Licensed.
+ */
+(function () {
+	let initializing = false;
+	const fnTest = /xyz/.test(function () {
+		xyz;
+	})
+		? /\b_super\b/
+		: /.*/;
+
+	// The base Class implementation (does nothing)
+	this.Class = function () {};
+
+	// Create a new Class that inherits from this class
+	Class.extend = function (prop) {
+		let _super = this.prototype;
+
+		// Instantiate a base class (but only create the instance,
+		// don't run the init constructor)
+		initializing = true;
+		const prototype = new this();
+		initializing = false;
+
+		// Make a copy of all prototype properties, to prevent reference issues.
+		for (const p in prototype) {
+			prototype[p] = cloneObject(prototype[p]);
+		}
+
+		// Copy the properties over onto the new prototype
+		for (const name in prop) {
+			// Check if we're overwriting an existing function
+			prototype[name] =
+				typeof prop[name] === "function" && typeof _super[name] === "function" && fnTest.test(prop[name])
+					? (function (name, fn) {
+							return function () {
+								const tmp = this._super;
+
+								// Add a new ._super() method that is the same method
+								// but on the super-class
+								this._super = _super[name];
+
+								// The method only need to be bound temporarily, so we
+								// remove it when we're done executing
+								const ret = fn.apply(this, arguments);
+								this._super = tmp;
+
+								return ret;
+							};
+					  })(name, prop[name])
+					: prop[name];
+		}
+
+		/**
+		 * The dummy class constructor
+		 */
+		function Class() {
+			// All construction is actually done in the init method
+			if (!initializing && this.init) {
+				this.init.apply(this, arguments);
+			}
+		}
+
+		// Populate our constructed prototype object
+		Class.prototype = prototype;
+
+		// Enforce the constructor to be what we expect
+		Class.prototype.constructor = Class;
+
+		// And make this class extendable
+		Class.extend = arguments.callee;
+
+		return Class;
+	};
+})();
+
+/**
+ * Define the clone method for later use. Helper Method.
+ * @param {object} obj Object to be cloned
+ * @returns {object} the cloned object
+ */
+function cloneObject(obj) {
+	if (obj === null || typeof obj !== "object") {
+		return obj;
+	}
+
+	const temp = obj.constructor(); // give temp the original obj's constructor
+	for (const key in obj) {
+		temp[key] = cloneObject(obj[key]);
+
+		if (key === "lockStrings") {
+			Log.log(key);
+		}
+	}
+
+	return temp;
+}
+
+/*************** DO NOT EDIT THE LINE BELOW ***************/
+if (typeof module !== "undefined") {
+	module.exports = Class;
+}

js/defaults.js

@@ -0,0 +1,87 @@
+/* global mmPort */
+
+/* MagicMirror²
+ * Config Defaults
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ */
+const address = "localhost";
+let port = 8080;
+if (typeof mmPort !== "undefined") {
+	port = mmPort;
+}
+const defaults = {
+	address: address,
+	port: port,
+	basePath: "/",
+	kioskmode: false,
+	electronOptions: {},
+	ipWhitelist: ["127.0.0.1", "::ffff:127.0.0.1", "::1"],
+
+	language: "en",
+	logLevel: ["INFO", "LOG", "WARN", "ERROR"],
+	timeFormat: 24,
+	units: "metric",
+	zoom: 1,
+	customCss: "css/custom.css",
+	// httpHeaders used by helmet, see https://helmetjs.github.io/. You can add other/more object values by overriding this in config.js,
+	// e.g. you need to add `frameguard: false` for embedding MagicMirror in another website, see https://github.com/MichMich/MagicMirror/issues/2847
+	httpHeaders: { contentSecurityPolicy: false, crossOriginOpenerPolicy: false, crossOriginEmbedderPolicy: false, crossOriginResourcePolicy: false, originAgentCluster: false },
+
+	modules: [
+		{
+			module: "updatenotification",
+			position: "top_center"
+		},
+		{
+			module: "helloworld",
+			position: "upper_third",
+			classes: "large thin",
+			config: {
+				text: "MagicMirror²"
+			}
+		},
+		{
+			module: "helloworld",
+			position: "middle_center",
+			config: {
+				text: "Please create a config file or check the existing one for errors."
+			}
+		},
+		{
+			module: "helloworld",
+			position: "middle_center",
+			classes: "small dimmed",
+			config: {
+				text: "See README for more information."
+			}
+		},
+		{
+			module: "helloworld",
+			position: "middle_center",
+			classes: "xsmall",
+			config: {
+				text: "If you get this message while your config file is already created,<br>" + "it probably contains an error. To validate your config file run in your MagicMirror² directory<br>" + "<pre>npm run config:check</pre>"
+			}
+		},
+		{
+			module: "helloworld",
+			position: "bottom_bar",
+			classes: "xsmall dimmed",
+			config: {
+				text: "www.michaelteeuw.nl"
+			}
+		}
+	],
+
+	paths: {
+		modules: "modules",
+		vendor: "vendor"
+	}
+};
+
+/*************** DO NOT EDIT THE LINE BELOW ***************/
+if (typeof module !== "undefined") {
+	module.exports = defaults;
+}

js/deprecated.js

@@ -0,0 +1,11 @@
+/* MagicMirror² Deprecated Config Options List
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ *
+ * Olex S. original idea this deprecated option
+ */
+
+module.exports = {
+	configs: ["kioskmode"]
+};

js/electron.js

@@ -0,0 +1,181 @@
+"use strict";
+
+const electron = require("electron");
+const core = require("./app");
+const Log = require("./logger");
+
+// Config
+let config = process.env.config ? JSON.parse(process.env.config) : {};
+// Module to control application life.
+const app = electron.app;
+// If ELECTRON_DISABLE_GPU is set electron is started with --disable-gpu flag.
+// See https://www.electronjs.org/docs/latest/tutorial/offscreen-rendering for more info.
+if (process.env.ELECTRON_DISABLE_GPU !== undefined) {
+	app.disableHardwareAcceleration();
+}
+
+// Module to create native browser window.
+const BrowserWindow = electron.BrowserWindow;
+
+// Keep a global reference of the window object, if you don't, the window will
+// be closed automatically when the JavaScript object is garbage collected.
+let mainWindow;
+
+/**
+ *
+ */
+function createWindow() {
+	let electronSwitchesDefaults = ["autoplay-policy", "no-user-gesture-required"];
+	app.commandLine.appendSwitch(...new Set(electronSwitchesDefaults, config.electronSwitches));
+	let electronOptionsDefaults = {
+		width: 800,
+		height: 600,
+		x: 0,
+		y: 0,
+		darkTheme: true,
+		webPreferences: {
+			contextIsolation: true,
+			nodeIntegration: false,
+			zoomFactor: config.zoom
+		},
+		backgroundColor: "#000000"
+	};
+
+	// DEPRECATED: "kioskmode" backwards compatibility, to be removed
+	// settings these options directly instead provides cleaner interface
+	if (config.kioskmode) {
+		electronOptionsDefaults.kiosk = true;
+	} else {
+		electronOptionsDefaults.show = false;
+		electronOptionsDefaults.frame = false;
+		electronOptionsDefaults.transparent = true;
+		electronOptionsDefaults.hasShadow = false;
+	}
+
+	const electronOptions = Object.assign({}, electronOptionsDefaults, config.electronOptions);
+
+	// Create the browser window.
+	mainWindow = new BrowserWindow(electronOptions);
+
+	// and load the index.html of the app.
+	// If config.address is not defined or is an empty string (listening on all interfaces), connect to localhost
+
+	let prefix;
+	if ((config["tls"] !== null && config["tls"]) || config.useHttps) {
+		prefix = "https://";
+	} else {
+		prefix = "http://";
+	}
+
+	let address = (config.address === void 0) | (config.address === "") ? (config.address = "localhost") : config.address;
+	mainWindow.loadURL(`${prefix}${address}:${config.port}`);
+
+	// Open the DevTools if run with "npm start dev"
+	if (process.argv.includes("dev")) {
+		if (process.env.JEST_WORKER_ID !== undefined) {
+			// if we are running with jest
+			const devtools = new BrowserWindow(electronOptions);
+			mainWindow.webContents.setDevToolsWebContents(devtools.webContents);
+		}
+		mainWindow.webContents.openDevTools();
+	}
+
+	// simulate mouse move to hide black cursor on start
+	mainWindow.webContents.on("dom-ready", (event) => {
+		mainWindow.webContents.sendInputEvent({ type: "mouseMove", x: 0, y: 0 });
+	});
+
+	// Set responders for window events.
+	mainWindow.on("closed", function () {
+		mainWindow = null;
+	});
+
+	if (config.kioskmode) {
+		mainWindow.on("blur", function () {
+			mainWindow.focus();
+		});
+
+		mainWindow.on("leave-full-screen", function () {
+			mainWindow.setFullScreen(true);
+		});
+
+		mainWindow.on("resize", function () {
+			setTimeout(function () {
+				mainWindow.reload();
+			}, 1000);
+		});
+	}
+
+	//remove response headers that prevent sites of being embedded into iframes if configured
+	mainWindow.webContents.session.webRequest.onHeadersReceived((details, callback) => {
+		let curHeaders = details.responseHeaders;
+		if (config["ignoreXOriginHeader"] || false) {
+			curHeaders = Object.fromEntries(Object.entries(curHeaders).filter((header) => !/x-frame-options/i.test(header[0])));
+		}
+
+		if (config["ignoreContentSecurityPolicy"] || false) {
+			curHeaders = Object.fromEntries(Object.entries(curHeaders).filter((header) => !/content-security-policy/i.test(header[0])));
+		}
+
+		callback({ responseHeaders: curHeaders });
+	});
+
+	mainWindow.once("ready-to-show", () => {
+		mainWindow.setFullScreen(true);
+		mainWindow.show();
+	});
+}
+
+// Quit when all windows are closed.
+app.on("window-all-closed", function () {
+	if (process.env.JEST_WORKER_ID !== undefined) {
+		// if we are running with jest
+		app.quit();
+	} else {
+		createWindow();
+	}
+});
+
+app.on("activate", function () {
+	// On OS X it's common to re-create a window in the app when the
+	// dock icon is clicked and there are no other windows open.
+	if (mainWindow === null) {
+		createWindow();
+	}
+});
+
+/* This method will be called when SIGINT is received and will call
+ * each node_helper's stop function if it exists. Added to fix #1056
+ *
+ * Note: this is only used if running Electron. Otherwise
+ * core.stop() is called by process.on("SIGINT"... in `app.js`
+ */
+app.on("before-quit", async (event) => {
+	Log.log("Shutting down server...");
+	event.preventDefault();
+	setTimeout(() => {
+		process.exit(0);
+	}, 3000); // Force-quit after 3 seconds.
+	await core.stop();
+	process.exit(0);
+});
+
+/**
+ * Handle errors from self-signed certificates
+ */
+app.on("certificate-error", (event, webContents, url, error, certificate, callback) => {
+	event.preventDefault();
+	callback(true);
+});
+
+// Start the core application if server is run on localhost
+// This starts all node helpers and starts the webserver.
+if (["localhost", "127.0.0.1", "::1", "::ffff:127.0.0.1", undefined].includes(config.address)) {
+	core.start().then((c) => {
+		config = c;
+		app.whenReady().then(() => {
+			Log.log("Launching application.");
+			createWindow();
+		});
+	});
+}

js/fetch.js

@@ -0,0 +1,27 @@
+/**
+ * Helper class to provide either third party fetch library or (if node >= 18)
+ * return internal node fetch implementation.
+ *
+ * Attention: After some discussion we always return the third party
+ * implementation until the node implementation is stable and more tested
+ * @see https://github.com/MichMich/MagicMirror/pull/2952
+ * @see https://github.com/MichMich/MagicMirror/issues/2649
+ * @param {string} url to be fetched
+ * @param {object} options object e.g. for headers
+ * @class
+ */
+async function fetch(url, options = {}) {
+	// const nodeVersion = process.version.match(/^v(\d+)\.*/)[1];
+	// if (nodeVersion >= 18) {
+	// 	// node version >= 18
+	// 	return global.fetch(url, options);
+	// } else {
+	// 	// node version < 18
+	// 	const nodefetch = require("node-fetch");
+	// 	return nodefetch(url, options);
+	// }
+	const nodefetch = require("node-fetch");
+	return nodefetch(url, options);
+}
+
+module.exports = fetch;

js/loader.js

@@ -0,0 +1,257 @@
+/* global defaultModules, vendor */
+
+/* MagicMirror²
+ * Module and File loaders.
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ */
+const Loader = (function () {
+	/* Create helper variables */
+
+	const loadedModuleFiles = [];
+	const loadedFiles = [];
+	const moduleObjects = [];
+
+	/* Private Methods */
+
+	/**
+	 * Loops through all modules and requests start for every module.
+	 */
+	const startModules = async function () {
+		const modulePromises = [];
+		for (const module of moduleObjects) {
+			try {
+				modulePromises.push(module.start());
+			} catch (error) {
+				Log.error(`Error when starting node_helper for module ${module.name}:`);
+				Log.error(error);
+			}
+		}
+
+		const results = await Promise.allSettled(modulePromises);
+
+		// Log errors that happened during async node_helper startup
+		results.forEach((result) => {
+			if (result.status === "rejected") {
+				Log.error(result.reason);
+			}
+		});
+
+		// Notify core of loaded modules.
+		MM.modulesStarted(moduleObjects);
+
+		// Starting modules also hides any modules that have requested to be initially hidden
+		for (const thisModule of moduleObjects) {
+			if (thisModule.data.hiddenOnStartup) {
+				Log.info(`Initially hiding ${thisModule.name}`);
+				thisModule.hide();
+			}
+		}
+	};
+
+	/**
+	 * Retrieve list of all modules.
+	 * @returns {object[]} module data as configured in config
+	 */
+	const getAllModules = function () {
+		return config.modules;
+	};
+
+	/**
+	 * Generate array with module information including module paths.
+	 * @returns {object[]} Module information.
+	 */
+	const getModuleData = function () {
+		const modules = getAllModules();
+		const moduleFiles = [];
+
+		modules.forEach(function (moduleData, index) {
+			const module = moduleData.module;
+
+			const elements = module.split("/");
+			const moduleName = elements[elements.length - 1];
+			let moduleFolder = `${config.paths.modules}/${module}`;
+
+			if (defaultModules.indexOf(moduleName) !== -1) {
+				moduleFolder = `${config.paths.modules}/default/${module}`;
+			}
+
+			if (moduleData.disabled === true) {
+				return;
+			}
+
+			moduleFiles.push({
+				index: index,
+				identifier: `module_${index}_${module}`,
+				name: moduleName,
+				path: `${moduleFolder}/`,
+				file: `${moduleName}.js`,
+				position: moduleData.position,
+				hiddenOnStartup: moduleData.hiddenOnStartup,
+				header: moduleData.header,
+				configDeepMerge: typeof moduleData.configDeepMerge === "boolean" ? moduleData.configDeepMerge : false,
+				config: moduleData.config,
+				classes: typeof moduleData.classes !== "undefined" ? `${moduleData.classes} ${module}` : module
+			});
+		});
+
+		return moduleFiles;
+	};
+
+	/**
+	 * Load modules via ajax request and create module objects.
+	 * @param {object} module Information about the module we want to load.
+	 * @returns {Promise<void>} resolved when module is loaded
+	 */
+	const loadModule = async function (module) {
+		const url = module.path + module.file;
+
+		/**
+		 * @returns {Promise<void>}
+		 */
+		const afterLoad = async function () {
+			const moduleObject = Module.create(module.name);
+			if (moduleObject) {
+				await bootstrapModule(module, moduleObject);
+			}
+		};
+
+		if (loadedModuleFiles.indexOf(url) !== -1) {
+			await afterLoad();
+		} else {
+			await loadFile(url);
+			loadedModuleFiles.push(url);
+			await afterLoad();
+		}
+	};
+
+	/**
+	 * Bootstrap modules by setting the module data and loading the scripts & styles.
+	 * @param {object} module Information about the module we want to load.
+	 * @param {Module} mObj Modules instance.
+	 */
+	const bootstrapModule = async function (module, mObj) {
+		Log.info(`Bootstrapping module: ${module.name}`);
+		mObj.setData(module);
+
+		await mObj.loadScripts();
+		Log.log(`Scripts loaded for: ${module.name}`);
+
+		await mObj.loadStyles();
+		Log.log(`Styles loaded for: ${module.name}`);
+
+		await mObj.loadTranslations();
+		Log.log(`Translations loaded for: ${module.name}`);
+
+		moduleObjects.push(mObj);
+	};
+
+	/**
+	 * Load a script or stylesheet by adding it to the dom.
+	 * @param {string} fileName Path of the file we want to load.
+	 * @returns {Promise} resolved when the file is loaded
+	 */
+	const loadFile = async function (fileName) {
+		const extension = fileName.slice((Math.max(0, fileName.lastIndexOf(".")) || Infinity) + 1);
+		let script, stylesheet;
+
+		switch (extension.toLowerCase()) {
+			case "js":
+				return new Promise((resolve) => {
+					Log.log(`Load script: ${fileName}`);
+					script = document.createElement("script");
+					script.type = "text/javascript";
+					script.src = fileName;
+					script.onload = function () {
+						resolve();
+					};
+					script.onerror = function () {
+						Log.error("Error on loading script:", fileName);
+						resolve();
+					};
+					document.getElementsByTagName("body")[0].appendChild(script);
+				});
+			case "css":
+				return new Promise((resolve) => {
+					Log.log(`Load stylesheet: ${fileName}`);
+
+					stylesheet = document.createElement("link");
+					stylesheet.rel = "stylesheet";
+					stylesheet.type = "text/css";
+					stylesheet.href = fileName;
+					stylesheet.onload = function () {
+						resolve();
+					};
+					stylesheet.onerror = function () {
+						Log.error("Error on loading stylesheet:", fileName);
+						resolve();
+					};
+					document.getElementsByTagName("head")[0].appendChild(stylesheet);
+				});
+		}
+	};
+
+	/* Public Methods */
+	return {
+		/**
+		 * Load all modules as defined in the config.
+		 */
+		loadModules: async function () {
+			let moduleData = getModuleData();
+
+			/**
+			 * @returns {Promise<void>} when all modules are loaded
+			 */
+			const loadNextModule = async function () {
+				if (moduleData.length > 0) {
+					const nextModule = moduleData[0];
+					await loadModule(nextModule);
+					moduleData = moduleData.slice(1);
+					await loadNextModule();
+				} else {
+					// All modules loaded. Load custom.css
+					// This is done after all the modules so we can
+					// overwrite all the defined styles.
+					await loadFile(config.customCss);
+					// custom.css loaded. Start all modules.
+					await startModules();
+				}
+			};
+			await loadNextModule();
+		},
+
+		/**
+		 * Load a file (script or stylesheet).
+		 * Prevent double loading and search for files in the vendor folder.
+		 * @param {string} fileName Path of the file we want to load.
+		 * @param {Module} module The module that calls the loadFile function.
+		 * @returns {Promise} resolved when the file is loaded
+		 */
+		loadFileForModule: async function (fileName, module) {
+			if (loadedFiles.indexOf(fileName.toLowerCase()) !== -1) {
+				Log.log(`File already loaded: ${fileName}`);
+				return;
+			}
+
+			if (fileName.indexOf("http://") === 0 || fileName.indexOf("https://") === 0 || fileName.indexOf("/") !== -1) {
+				// This is an absolute or relative path.
+				// Load it and then return.
+				loadedFiles.push(fileName.toLowerCase());
+				return loadFile(fileName);
+			}
+
+			if (vendor[fileName] !== undefined) {
+				// This file is available in the vendor folder.
+				// Load it from this vendor folder.
+				loadedFiles.push(fileName.toLowerCase());
+				return loadFile(`${config.paths.vendor}/${vendor[fileName]}`);
+			}
+
+			// File not loaded yet.
+			// Load it based on the module path.
+			loadedFiles.push(fileName.toLowerCase());
+			return loadFile(module.file(fileName));
+		}
+	};
+})();

js/logger.js

@@ -0,0 +1,79 @@
+/* MagicMirror²
+ * Log
+ *
+ * This logger is very simple, but needs to be extended.
+ * This system can eventually be used to push the log messages to an external target.
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ */
+(function (root, factory) {
+	if (typeof exports === "object") {
+		if (process.env.JEST_WORKER_ID === undefined) {
+			// add timestamps in front of log messages
+			require("console-stamp")(console, {
+				pattern: "yyyy-mm-dd HH:MM:ss.l",
+				include: ["debug", "log", "info", "warn", "error"]
+			});
+		}
+		// Node, CommonJS-like
+		module.exports = factory(root.config);
+	} else {
+		// Browser globals (root is window)
+		root.Log = factory(root.config);
+	}
+})(this, function (config) {
+	let logLevel;
+	let enableLog;
+	if (typeof exports === "object") {
+		// in nodejs and not running with jest
+		enableLog = process.env.JEST_WORKER_ID === undefined;
+	} else {
+		// in browser and not running with jsdom
+		enableLog = typeof window === "object" && window.name !== "jsdom";
+	}
+
+	if (enableLog) {
+		logLevel = {
+			debug: Function.prototype.bind.call(console.debug, console),
+			log: Function.prototype.bind.call(console.log, console),
+			info: Function.prototype.bind.call(console.info, console),
+			warn: Function.prototype.bind.call(console.warn, console),
+			error: Function.prototype.bind.call(console.error, console),
+			group: Function.prototype.bind.call(console.group, console),
+			groupCollapsed: Function.prototype.bind.call(console.groupCollapsed, console),
+			groupEnd: Function.prototype.bind.call(console.groupEnd, console),
+			time: Function.prototype.bind.call(console.time, console),
+			timeEnd: Function.prototype.bind.call(console.timeEnd, console),
+			timeStamp: Function.prototype.bind.call(console.timeStamp, console)
+		};
+
+		logLevel.setLogLevel = function (newLevel) {
+			if (newLevel) {
+				Object.keys(logLevel).forEach(function (key, index) {
+					if (!newLevel.includes(key.toLocaleUpperCase())) {
+						logLevel[key] = function () {};
+					}
+				});
+			}
+		};
+	} else {
+		logLevel = {
+			debug: function () {},
+			log: function () {},
+			info: function () {},
+			warn: function () {},
+			error: function () {},
+			group: function () {},
+			groupCollapsed: function () {},
+			groupEnd: function () {},
+			time: function () {},
+			timeEnd: function () {},
+			timeStamp: function () {}
+		};
+
+		logLevel.setLogLevel = function () {};
+	}
+
+	return logLevel;
+});

js/main.js

@@ -0,0 +1,593 @@
+/* global Loader, defaults, Translator */
+
+/* MagicMirror²
+ * Main System
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ */
+const MM = (function () {
+	let modules = [];
+
+	/* Private Methods */
+
+	/**
+	 * Create dom objects for all modules that are configured for a specific position.
+	 */
+	const createDomObjects = function () {
+		const domCreationPromises = [];
+
+		modules.forEach(function (module) {
+			if (typeof module.data.position !== "string") {
+				return;
+			}
+
+			const wrapper = selectWrapper(module.data.position);
+
+			const dom = document.createElement("div");
+			dom.id = module.identifier;
+			dom.className = module.name;
+
+			if (typeof module.data.classes === "string") {
+				dom.className = `module ${dom.className} ${module.data.classes}`;
+			}
+
+			dom.opacity = 0;
+			wrapper.appendChild(dom);
+
+			const moduleHeader = document.createElement("header");
+			moduleHeader.innerHTML = module.getHeader();
+			moduleHeader.className = "module-header";
+			dom.appendChild(moduleHeader);
+
+			if (typeof module.getHeader() === "undefined" || module.getHeader() !== "") {
+				moduleHeader.style.display = "none;";
+			} else {
+				moduleHeader.style.display = "block;";
+			}
+
+			const moduleContent = document.createElement("div");
+			moduleContent.className = "module-content";
+			dom.appendChild(moduleContent);
+
+			const domCreationPromise = updateDom(module, 0);
+			domCreationPromises.push(domCreationPromise);
+			domCreationPromise
+				.then(function () {
+					sendNotification("MODULE_DOM_CREATED", null, null, module);
+				})
+				.catch(Log.error);
+		});
+
+		updateWrapperStates();
+
+		Promise.all(domCreationPromises).then(function () {
+			sendNotification("DOM_OBJECTS_CREATED");
+		});
+	};
+
+	/**
+	 * Select the wrapper dom object for a specific position.
+	 * @param {string} position The name of the position.
+	 * @returns {HTMLElement | void} the wrapper element
+	 */
+	const selectWrapper = function (position) {
+		const classes = position.replace("_", " ");
+		const parentWrapper = document.getElementsByClassName(classes);
+		if (parentWrapper.length > 0) {
+			const wrapper = parentWrapper[0].getElementsByClassName("container");
+			if (wrapper.length > 0) {
+				return wrapper[0];
+			}
+		}
+	};
+
+	/**
+	 * Send a notification to all modules.
+	 * @param {string} notification The identifier of the notification.
+	 * @param {*} payload The payload of the notification.
+	 * @param {Module} sender The module that sent the notification.
+	 * @param {Module} [sendTo] The (optional) module to send the notification to.
+	 */
+	const sendNotification = function (notification, payload, sender, sendTo) {
+		for (const m in modules) {
+			const module = modules[m];
+			if (module !== sender && (!sendTo || module === sendTo)) {
+				module.notificationReceived(notification, payload, sender);
+			}
+		}
+	};
+
+	/**
+	 * Update the dom for a specific module.
+	 * @param {Module} module The module that needs an update.
+	 * @param {number} [speed] The (optional) number of microseconds for the animation.
+	 * @returns {Promise} Resolved when the dom is fully updated.
+	 */
+	const updateDom = function (module, speed) {
+		return new Promise(function (resolve) {
+			const newHeader = module.getHeader();
+			let newContentPromise = module.getDom();
+
+			if (!(newContentPromise instanceof Promise)) {
+				// convert to a promise if not already one to avoid if/else's everywhere
+				newContentPromise = Promise.resolve(newContentPromise);
+			}
+
+			newContentPromise
+				.then(function (newContent) {
+					const updatePromise = updateDomWithContent(module, speed, newHeader, newContent);
+
+					updatePromise.then(resolve).catch(Log.error);
+				})
+				.catch(Log.error);
+		});
+	};
+
+	/**
+	 * Update the dom with the specified content
+	 * @param {Module} module The module that needs an update.
+	 * @param {number} [speed] The (optional) number of microseconds for the animation.
+	 * @param {string} newHeader The new header that is generated.
+	 * @param {HTMLElement} newContent The new content that is generated.
+	 * @returns {Promise} Resolved when the module dom has been updated.
+	 */
+	const updateDomWithContent = function (module, speed, newHeader, newContent) {
+		return new Promise(function (resolve) {
+			if (module.hidden || !speed) {
+				updateModuleContent(module, newHeader, newContent);
+				resolve();
+				return;
+			}
+
+			if (!moduleNeedsUpdate(module, newHeader, newContent)) {
+				resolve();
+				return;
+			}
+
+			if (!speed) {
+				updateModuleContent(module, newHeader, newContent);
+				resolve();
+				return;
+			}
+
+			hideModule(module, speed / 2, function () {
+				updateModuleContent(module, newHeader, newContent);
+				if (!module.hidden) {
+					showModule(module, speed / 2);
+				}
+				resolve();
+			});
+		});
+	};
+
+	/**
+	 * Check if the content has changed.
+	 * @param {Module} module The module to check.
+	 * @param {string} newHeader The new header that is generated.
+	 * @param {HTMLElement} newContent The new content that is generated.
+	 * @returns {boolean} True if the module need an update, false otherwise
+	 */
+	const moduleNeedsUpdate = function (module, newHeader, newContent) {
+		const moduleWrapper = document.getElementById(module.identifier);
+		if (moduleWrapper === null) {
+			return false;
+		}
+
+		const contentWrapper = moduleWrapper.getElementsByClassName("module-content");
+		const headerWrapper = moduleWrapper.getElementsByClassName("module-header");
+
+		let headerNeedsUpdate = false;
+		let contentNeedsUpdate;
+
+		if (headerWrapper.length > 0) {
+			headerNeedsUpdate = newHeader !== headerWrapper[0].innerHTML;
+		}
+
+		const tempContentWrapper = document.createElement("div");
+		tempContentWrapper.appendChild(newContent);
+		contentNeedsUpdate = tempContentWrapper.innerHTML !== contentWrapper[0].innerHTML;
+
+		return headerNeedsUpdate || contentNeedsUpdate;
+	};
+
+	/**
+	 * Update the content of a module on screen.
+	 * @param {Module} module The module to check.
+	 * @param {string} newHeader The new header that is generated.
+	 * @param {HTMLElement} newContent The new content that is generated.
+	 */
+	const updateModuleContent = function (module, newHeader, newContent) {
+		const moduleWrapper = document.getElementById(module.identifier);
+		if (moduleWrapper === null) {
+			return;
+		}
+		const headerWrapper = moduleWrapper.getElementsByClassName("module-header");
+		const contentWrapper = moduleWrapper.getElementsByClassName("module-content");
+
+		contentWrapper[0].innerHTML = "";
+		contentWrapper[0].appendChild(newContent);
+
+		headerWrapper[0].innerHTML = newHeader;
+		if (headerWrapper.length > 0 && newHeader) {
+			headerWrapper[0].style.display = "block";
+		} else {
+			headerWrapper[0].style.display = "none";
+		}
+	};
+
+	/**
+	 * Hide the module.
+	 * @param {Module} module The module to hide.
+	 * @param {number} speed The speed of the hide animation.
+	 * @param {Function} callback Called when the animation is done.
+	 * @param {object} [options] Optional settings for the hide method.
+	 */
+	const hideModule = function (module, speed, callback, options = {}) {
+		// set lockString if set in options.
+		if (options.lockString) {
+			// Log.log("Has lockstring: " + options.lockString);
+			if (module.lockStrings.indexOf(options.lockString) === -1) {
+				module.lockStrings.push(options.lockString);
+			}
+		}
+
+		const moduleWrapper = document.getElementById(module.identifier);
+		if (moduleWrapper !== null) {
+			moduleWrapper.style.transition = `opacity ${speed / 1000}s`;
+			moduleWrapper.style.opacity = 0;
+			moduleWrapper.classList.add("hidden");
+
+			clearTimeout(module.showHideTimer);
+			module.showHideTimer = setTimeout(function () {
+				// To not take up any space, we just make the position absolute.
+				// since it's fade out anyway, we can see it lay above or
+				// below other modules. This works way better than adjusting
+				// the .display property.
+				moduleWrapper.style.position = "fixed";
+
+				updateWrapperStates();
+
+				if (typeof callback === "function") {
+					callback();
+				}
+			}, speed);
+		} else {
+			// invoke callback even if no content, issue 1308
+			if (typeof callback === "function") {
+				callback();
+			}
+		}
+	};
+
+	/**
+	 * Show the module.
+	 * @param {Module} module The module to show.
+	 * @param {number} speed The speed of the show animation.
+	 * @param {Function} callback Called when the animation is done.
+	 * @param {object} [options] Optional settings for the show method.
+	 */
+	const showModule = function (module, speed, callback, options = {}) {
+		// remove lockString if set in options.
+		if (options.lockString) {
+			const index = module.lockStrings.indexOf(options.lockString);
+			if (index !== -1) {
+				module.lockStrings.splice(index, 1);
+			}
+		}
+
+		// Check if there are no more lockstrings set, or the force option is set.
+		// Otherwise cancel show action.
+		if (module.lockStrings.length !== 0 && options.force !== true) {
+			Log.log(`Will not show ${module.name}. LockStrings active: ${module.lockStrings.join(",")}`);
+			if (typeof options.onError === "function") {
+				options.onError(new Error("LOCK_STRING_ACTIVE"));
+			}
+			return;
+		}
+
+		module.hidden = false;
+
+		// If forced show, clean current lockstrings.
+		if (module.lockStrings.length !== 0 && options.force === true) {
+			Log.log(`Force show of module: ${module.name}`);
+			module.lockStrings = [];
+		}
+
+		const moduleWrapper = document.getElementById(module.identifier);
+		if (moduleWrapper !== null) {
+			moduleWrapper.style.transition = `opacity ${speed / 1000}s`;
+			// Restore the position. See hideModule() for more info.
+			moduleWrapper.style.position = "static";
+			moduleWrapper.classList.remove("hidden");
+
+			updateWrapperStates();
+
+			// Waiting for DOM-changes done in updateWrapperStates before we can start the animation.
+			const dummy = moduleWrapper.parentElement.parentElement.offsetHeight;
+			moduleWrapper.style.opacity = 1;
+
+			clearTimeout(module.showHideTimer);
+			module.showHideTimer = setTimeout(function () {
+				if (typeof callback === "function") {
+					callback();
+				}
+			}, speed);
+		} else {
+			// invoke callback
+			if (typeof callback === "function") {
+				callback();
+			}
+		}
+	};
+
+	/**
+	 * Checks for all positions if it has visible content.
+	 * If not, if will hide the position to prevent unwanted margins.
+	 * This method should be called by the show and hide methods.
+	 *
+	 * Example:
+	 * If the top_bar only contains the update notification. And no update is available,
+	 * the update notification is hidden. The top bar still occupies space making for
+	 * an ugly top margin. By using this function, the top bar will be hidden if the
+	 * update notification is not visible.
+	 */
+	const updateWrapperStates = function () {
+		const positions = ["top_bar", "top_left", "top_center", "top_right", "upper_third", "middle_center", "lower_third", "bottom_left", "bottom_center", "bottom_right", "bottom_bar", "fullscreen_above", "fullscreen_below"];
+
+		positions.forEach(function (position) {
+			const wrapper = selectWrapper(position);
+			const moduleWrappers = wrapper.getElementsByClassName("module");
+
+			let showWrapper = false;
+			Array.prototype.forEach.call(moduleWrappers, function (moduleWrapper) {
+				if (moduleWrapper.style.position === "" || moduleWrapper.style.position === "static") {
+					showWrapper = true;
+				}
+			});
+
+			wrapper.style.display = showWrapper ? "block" : "none";
+		});
+	};
+
+	/**
+	 * Loads the core config and combines it with the system defaults.
+	 */
+	const loadConfig = function () {
+		// FIXME: Think about how to pass config around without breaking tests
+		/* eslint-disable */
+		if (typeof config === "undefined") {
+			config = defaults;
+			Log.error("Config file is missing! Please create a config file.");
+			return;
+		}
+
+		config = Object.assign({}, defaults, config);
+		/* eslint-enable */
+	};
+
+	/**
+	 * Adds special selectors on a collection of modules.
+	 * @param {Module[]} modules Array of modules.
+	 */
+	const setSelectionMethodsForModules = function (modules) {
+		/**
+		 * Filter modules with the specified classes.
+		 * @param {string|string[]} className one or multiple classnames (array or space divided).
+		 * @returns {Module[]} Filtered collection of modules.
+		 */
+		const withClass = function (className) {
+			return modulesByClass(className, true);
+		};
+
+		/**
+		 * Filter modules without the specified classes.
+		 * @param {string|string[]} className one or multiple classnames (array or space divided).
+		 * @returns {Module[]} Filtered collection of modules.
+		 */
+		const exceptWithClass = function (className) {
+			return modulesByClass(className, false);
+		};
+
+		/**
+		 * Filters a collection of modules based on classname(s).
+		 * @param {string|string[]} className one or multiple classnames (array or space divided).
+		 * @param {boolean} include if the filter should include or exclude the modules with the specific classes.
+		 * @returns {Module[]} Filtered collection of modules.
+		 */
+		const modulesByClass = function (className, include) {
+			let searchClasses = className;
+			if (typeof className === "string") {
+				searchClasses = className.split(" ");
+			}
+
+			const newModules = modules.filter(function (module) {
+				const classes = module.data.classes.toLowerCase().split(" ");
+
+				for (const searchClass of searchClasses) {
+					if (classes.indexOf(searchClass.toLowerCase()) !== -1) {
+						return include;
+					}
+				}
+
+				return !include;
+			});
+
+			setSelectionMethodsForModules(newModules);
+			return newModules;
+		};
+
+		/**
+		 * Removes a module instance from the collection.
+		 * @param {object} module The module instance to remove from the collection.
+		 * @returns {Module[]} Filtered collection of modules.
+		 */
+		const exceptModule = function (module) {
+			const newModules = modules.filter(function (mod) {
+				return mod.identifier !== module.identifier;
+			});
+
+			setSelectionMethodsForModules(newModules);
+			return newModules;
+		};
+
+		/**
+		 * Walks thru a collection of modules and executes the callback with the module as an argument.
+		 * @param {Function} callback The function to execute with the module as an argument.
+		 */
+		const enumerate = function (callback) {
+			modules.map(function (module) {
+				callback(module);
+			});
+		};
+
+		if (typeof modules.withClass === "undefined") {
+			Object.defineProperty(modules, "withClass", { value: withClass, enumerable: false });
+		}
+		if (typeof modules.exceptWithClass === "undefined") {
+			Object.defineProperty(modules, "exceptWithClass", { value: exceptWithClass, enumerable: false });
+		}
+		if (typeof modules.exceptModule === "undefined") {
+			Object.defineProperty(modules, "exceptModule", { value: exceptModule, enumerable: false });
+		}
+		if (typeof modules.enumerate === "undefined") {
+			Object.defineProperty(modules, "enumerate", { value: enumerate, enumerable: false });
+		}
+	};
+
+	return {
+		/* Public Methods */
+
+		/**
+		 * Main init method.
+		 */
+		init: async function () {
+			Log.info("Initializing MagicMirror².");
+			loadConfig();
+
+			Log.setLogLevel(config.logLevel);
+
+			await Translator.loadCoreTranslations(config.language);
+			await Loader.loadModules();
+		},
+
+		/**
+		 * Gets called when all modules are started.
+		 * @param {Module[]} moduleObjects All module instances.
+		 */
+		modulesStarted: function (moduleObjects) {
+			modules = [];
+			moduleObjects.forEach((module) => modules.push(module));
+
+			Log.info("All modules started!");
+			sendNotification("ALL_MODULES_STARTED");
+
+			createDomObjects();
+		},
+
+		/**
+		 * Send a notification to all modules.
+		 * @param {string} notification The identifier of the notification.
+		 * @param {*} payload The payload of the notification.
+		 * @param {Module} sender The module that sent the notification.
+		 */
+		sendNotification: function (notification, payload, sender) {
+			if (arguments.length < 3) {
+				Log.error("sendNotification: Missing arguments.");
+				return;
+			}
+
+			if (typeof notification !== "string") {
+				Log.error("sendNotification: Notification should be a string.");
+				return;
+			}
+
+			if (!(sender instanceof Module)) {
+				Log.error("sendNotification: Sender should be a module.");
+				return;
+			}
+
+			// Further implementation is done in the private method.
+			sendNotification(notification, payload, sender);
+		},
+
+		/**
+		 * Update the dom for a specific module.
+		 * @param {Module} module The module that needs an update.
+		 * @param {number} [speed] The number of microseconds for the animation.
+		 */
+		updateDom: function (module, speed) {
+			if (!(module instanceof Module)) {
+				Log.error("updateDom: Sender should be a module.");
+				return;
+			}
+
+			if (!module.data.position) {
+				Log.warn("module tries to update the DOM without being displayed.");
+				return;
+			}
+
+			// Further implementation is done in the private method.
+			updateDom(module, speed);
+		},
+
+		/**
+		 * Returns a collection of all modules currently active.
+		 * @returns {Module[]} A collection of all modules currently active.
+		 */
+		getModules: function () {
+			setSelectionMethodsForModules(modules);
+			return modules;
+		},
+
+		/**
+		 * Hide the module.
+		 * @param {Module} module The module to hide.
+		 * @param {number} speed The speed of the hide animation.
+		 * @param {Function} callback Called when the animation is done.
+		 * @param {object} [options] Optional settings for the hide method.
+		 */
+		hideModule: function (module, speed, callback, options) {
+			module.hidden = true;
+			hideModule(module, speed, callback, options);
+		},
+
+		/**
+		 * Show the module.
+		 * @param {Module} module The module to show.
+		 * @param {number} speed The speed of the show animation.
+		 * @param {Function} callback Called when the animation is done.
+		 * @param {object} [options] Optional settings for the show method.
+		 */
+		showModule: function (module, speed, callback, options) {
+			// do not change module.hidden yet, only if we really show it later
+			showModule(module, speed, callback, options);
+		}
+	};
+})();
+
+// Add polyfill for Object.assign.
+if (typeof Object.assign !== "function") {
+	(function () {
+		Object.assign = function (target) {
+			"use strict";
+			if (target === undefined || target === null) {
+				throw new TypeError("Cannot convert undefined or null to object");
+			}
+			const output = Object(target);
+			for (let index = 1; index < arguments.length; index++) {
+				const source = arguments[index];
+				if (source !== undefined && source !== null) {
+					for (const nextKey in source) {
+						if (source.hasOwnProperty(nextKey)) {
+							output[nextKey] = source[nextKey];
+						}
+					}
+				}
+			}
+			return output;
+		};
+	})();
+}
+
+MM.init();

js/module.js

@@ -0,0 +1,507 @@
+/* global Class, cloneObject, Loader, MMSocket, nunjucks, Translator */
+
+/* MagicMirror²
+ * Module Blueprint.
+ * @typedef {Object} Module
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ */
+const Module = Class.extend({
+	/*********************************************************
+	 * All methods (and properties) below can be subclassed. *
+	 *********************************************************/
+
+	// Set the minimum MagicMirror² module version for this module.
+	requiresVersion: "2.0.0",
+
+	// Module config defaults.
+	defaults: {},
+
+	// Timer reference used for showHide animation callbacks.
+	showHideTimer: null,
+
+	// Array to store lockStrings. These strings are used to lock
+	// visibility when hiding and showing module.
+	lockStrings: [],
+
+	// Storage of the nunjucks Environment,
+	// This should not be referenced directly.
+	// Use the nunjucksEnvironment() to get it.
+	_nunjucksEnvironment: null,
+
+	/**
+	 * Called when the module is instantiated.
+	 */
+	init: function () {
+		//Log.log(this.defaults);
+	},
+
+	/**
+	 * Called when the module is started.
+	 */
+	start: async function () {
+		Log.info(`Starting module: ${this.name}`);
+	},
+
+	/**
+	 * Returns a list of scripts the module requires to be loaded.
+	 * @returns {string[]} An array with filenames.
+	 */
+	getScripts: function () {
+		return [];
+	},
+
+	/**
+	 * Returns a list of stylesheets the module requires to be loaded.
+	 * @returns {string[]} An array with filenames.
+	 */
+	getStyles: function () {
+		return [];
+	},
+
+	/**
+	 * Returns a map of translation files the module requires to be loaded.
+	 *
+	 * return Map<String, String> -
+	 * @returns {*} A map with langKeys and filenames.
+	 */
+	getTranslations: function () {
+		return false;
+	},
+
+	/**
+	 * Generates the dom which needs to be displayed. This method is called by the MagicMirror² core.
+	 * This method can to be subclassed if the module wants to display info on the mirror.
+	 * Alternatively, the getTemplate method could be subclassed.
+	 * @returns {HTMLElement|Promise} The dom or a promise with the dom to display.
+	 */
+	getDom: function () {
+		return new Promise((resolve) => {
+			const div = document.createElement("div");
+			const template = this.getTemplate();
+			const templateData = this.getTemplateData();
+
+			// Check to see if we need to render a template string or a file.
+			if (/^.*((\.html)|(\.njk))$/.test(template)) {
+				// the template is a filename
+				this.nunjucksEnvironment().render(template, templateData, function (err, res) {
+					if (err) {
+						Log.error(err);
+					}
+
+					div.innerHTML = res;
+
+					resolve(div);
+				});
+			} else {
+				// the template is a template string.
+				div.innerHTML = this.nunjucksEnvironment().renderString(template, templateData);
+
+				resolve(div);
+			}
+		});
+	},
+
+	/**
+	 * Generates the header string which needs to be displayed if a user has a header configured for this module.
+	 * This method is called by the MagicMirror² core, but only if the user has configured a default header for the module.
+	 * This method needs to be subclassed if the module wants to display modified headers on the mirror.
+	 * @returns {string} The header to display above the header.
+	 */
+	getHeader: function () {
+		return this.data.header;
+	},
+
+	/**
+	 * Returns the template for the module which is used by the default getDom implementation.
+	 * This method needs to be subclassed if the module wants to use a template.
+	 * It can either return a template sting, or a template filename.
+	 * If the string ends with '.html' it's considered a file from within the module's folder.
+	 * @returns {string} The template string of filename.
+	 */
+	getTemplate: function () {
+		return `<div class="normal">${this.name}</div><div class="small dimmed">${this.identifier}</div>`;
+	},
+
+	/**
+	 * Returns the data to be used in the template.
+	 * This method needs to be subclassed if the module wants to use a custom data.
+	 * @returns {object} The data for the template
+	 */
+	getTemplateData: function () {
+		return {};
+	},
+
+	/**
+	 * Called by the MagicMirror² core when a notification arrives.
+	 * @param {string} notification The identifier of the notification.
+	 * @param {*} payload The payload of the notification.
+	 * @param {Module} sender The module that sent the notification.
+	 */
+	notificationReceived: function (notification, payload, sender) {
+		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);
+		}
+	},
+
+	/**
+	 * Returns the nunjucks environment for the current module.
+	 * The environment is checked in the _nunjucksEnvironment instance variable.
+	 * @returns {object} The Nunjucks Environment
+	 */
+	nunjucksEnvironment: function () {
+		if (this._nunjucksEnvironment !== null) {
+			return this._nunjucksEnvironment;
+		}
+
+		this._nunjucksEnvironment = new nunjucks.Environment(new nunjucks.WebLoader(this.file(""), { async: true }), {
+			trimBlocks: true,
+			lstripBlocks: true
+		});
+
+		this._nunjucksEnvironment.addFilter("translate", (str, variables) => {
+			return nunjucks.runtime.markSafe(this.translate(str, variables));
+		});
+
+		return this._nunjucksEnvironment;
+	},
+
+	/**
+	 * Called when a socket notification arrives.
+	 * @param {string} notification The identifier of the notification.
+	 * @param {*} payload The payload of the notification.
+	 */
+	socketNotificationReceived: function (notification, payload) {
+		Log.log(`${this.name} received a socket notification: ${notification} - Payload: ${payload}`);
+	},
+
+	/**
+	 * Called when the module is hidden.
+	 */
+	suspend: function () {
+		Log.log(`${this.name} is suspended.`);
+	},
+
+	/**
+	 * Called when the module is shown.
+	 */
+	resume: function () {
+		Log.log(`${this.name} is resumed.`);
+	},
+
+	/*********************************************
+	 * The methods below don"t need subclassing. *
+	 *********************************************/
+
+	/**
+	 * Set the module data.
+	 * @param {object} data The module data
+	 */
+	setData: function (data) {
+		this.data = data;
+		this.name = data.name;
+		this.identifier = data.identifier;
+		this.hidden = false;
+
+		this.setConfig(data.config, data.configDeepMerge);
+	},
+
+	/**
+	 * Set the module config and combine it with the module defaults.
+	 * @param {object} config The combined module config.
+	 * @param {boolean} deep Merge module config in deep.
+	 */
+	setConfig: function (config, deep) {
+		this.config = deep ? configMerge({}, this.defaults, config) : Object.assign({}, this.defaults, config);
+	},
+
+	/**
+	 * Returns a socket object. If it doesn't exist, it's created.
+	 * It also registers the notification callback.
+	 * @returns {MMSocket} a socket object
+	 */
+	socket: function () {
+		if (typeof this._socket === "undefined") {
+			this._socket = new MMSocket(this.name);
+		}
+
+		this._socket.setNotificationCallback((notification, payload) => {
+			this.socketNotificationReceived(notification, payload);
+		});
+
+		return this._socket;
+	},
+
+	/**
+	 * Retrieve the path to a module file.
+	 * @param {string} file Filename
+	 * @returns {string} the file path
+	 */
+	file: function (file) {
+		return `${this.data.path}/${file}`.replace("//", "/");
+	},
+
+	/**
+	 * Load all required stylesheets by requesting the MM object to load the files.
+	 * @returns {Promise<void>}
+	 */
+	loadStyles: function () {
+		return this.loadDependencies("getStyles");
+	},
+
+	/**
+	 * Load all required scripts by requesting the MM object to load the files.
+	 * @returns {Promise<void>}
+	 */
+	loadScripts: function () {
+		return this.loadDependencies("getScripts");
+	},
+
+	/**
+	 * Helper method to load all dependencies.
+	 * @param {string} funcName Function name to call to get scripts or styles.
+	 * @returns {Promise<void>}
+	 */
+	loadDependencies: async function (funcName) {
+		let dependencies = this[funcName]();
+
+		const loadNextDependency = async () => {
+			if (dependencies.length > 0) {
+				const nextDependency = dependencies[0];
+				await Loader.loadFileForModule(nextDependency, this);
+				dependencies = dependencies.slice(1);
+				await loadNextDependency();
+			} else {
+				return Promise.resolve();
+			}
+		};
+
+		await loadNextDependency();
+	},
+
+	/**
+	 * Load all translations.
+	 * @returns {Promise<void>}
+	 */
+	loadTranslations: async function () {
+		const translations = this.getTranslations() || {};
+		const language = config.language.toLowerCase();
+
+		const languages = Object.keys(translations);
+		const fallbackLanguage = languages[0];
+
+		if (languages.length === 0) {
+			return;
+		}
+
+		const translationFile = translations[language];
+		const translationsFallbackFile = translations[fallbackLanguage];
+
+		if (!translationFile) {
+			return Translator.load(this, translationsFallbackFile, true);
+		}
+
+		await Translator.load(this, translationFile, false);
+
+		if (translationFile !== translationsFallbackFile) {
+			return Translator.load(this, translationsFallbackFile, true);
+		}
+	},
+
+	/**
+	 * Request the translation for a given key with optional variables and default value.
+	 * @param {string} key The key of the string to translate
+	 * @param {string|object} [defaultValueOrVariables] The default value or variables for translating.
+	 * @param {string} [defaultValue] The default value with variables.
+	 * @returns {string} the translated key
+	 */
+	translate: function (key, defaultValueOrVariables, defaultValue) {
+		if (typeof defaultValueOrVariables === "object") {
+			return Translator.translate(this, key, defaultValueOrVariables) || defaultValue || "";
+		}
+		return Translator.translate(this, key) || defaultValueOrVariables || "";
+	},
+
+	/**
+	 * Request an (animated) update of the module.
+	 * @param {number} [speed] The speed of the animation.
+	 */
+	updateDom: function (speed) {
+		MM.updateDom(this, speed);
+	},
+
+	/**
+	 * Send a notification to all modules.
+	 * @param {string} notification The identifier of the notification.
+	 * @param {*} payload The payload of the notification.
+	 */
+	sendNotification: function (notification, payload) {
+		MM.sendNotification(notification, payload, this);
+	},
+
+	/**
+	 * Send a socket notification to the node helper.
+	 * @param {string} notification The identifier of the notification.
+	 * @param {*} payload The payload of the notification.
+	 */
+	sendSocketNotification: function (notification, payload) {
+		this.socket().sendNotification(notification, payload);
+	},
+
+	/**
+	 * Hide this module.
+	 * @param {number} speed The speed of the hide animation.
+	 * @param {Function} callback Called when the animation is done.
+	 * @param {object} [options] Optional settings for the hide method.
+	 */
+	hide: function (speed, callback, options = {}) {
+		let usedCallback = callback || function () {};
+		let usedOptions = options;
+
+		if (typeof callback === "object") {
+			Log.error("Parameter mismatch in module.hide: callback is not an optional parameter!");
+			usedOptions = callback;
+			usedCallback = function () {};
+		}
+
+		MM.hideModule(
+			this,
+			speed,
+			() => {
+				this.suspend();
+				usedCallback();
+			},
+			usedOptions
+		);
+	},
+
+	/**
+	 * Show this module.
+	 * @param {number} speed The speed of the show animation.
+	 * @param {Function} callback Called when the animation is done.
+	 * @param {object} [options] Optional settings for the show method.
+	 */
+	show: function (speed, callback, options) {
+		let usedCallback = callback || function () {};
+		let usedOptions = options;
+
+		if (typeof callback === "object") {
+			Log.error("Parameter mismatch in module.show: callback is not an optional parameter!");
+			usedOptions = callback;
+			usedCallback = function () {};
+		}
+
+		MM.showModule(
+			this,
+			speed,
+			() => {
+				this.resume();
+				usedCallback();
+			},
+			usedOptions
+		);
+	}
+});
+
+/**
+ * Merging MagicMirror² (or other) default/config script by @bugsounet
+ * Merge 2 objects or/with array
+ *
+ * Usage:
+ * -------
+ * this.config = configMerge({}, this.defaults, this.config)
+ * -------
+ * arg1: initial object
+ * arg2: config model
+ * arg3: config to merge
+ * -------
+ * why using it ?
+ * Object.assign() function don't to all job
+ * it don't merge all thing in deep
+ * -> object in object and array is not merging
+ * -------
+ *
+ * Todo: idea of Mich determinate what do you want to merge or not
+ * @param {object} result the initial object
+ * @returns {object} the merged config
+ */
+function configMerge(result) {
+	const stack = Array.prototype.slice.call(arguments, 1);
+	let item, key;
+
+	while (stack.length) {
+		item = stack.shift();
+		for (key in item) {
+			if (item.hasOwnProperty(key)) {
+				if (typeof result[key] === "object" && result[key] && Object.prototype.toString.call(result[key]) !== "[object Array]") {
+					if (typeof item[key] === "object" && item[key] !== null) {
+						result[key] = configMerge({}, result[key], item[key]);
+					} else {
+						result[key] = item[key];
+					}
+				} else {
+					result[key] = item[key];
+				}
+			}
+		}
+	}
+	return result;
+}
+
+Module.definitions = {};
+
+Module.create = function (name) {
+	// Make sure module definition is available.
+	if (!Module.definitions[name]) {
+		return;
+	}
+
+	const moduleDefinition = Module.definitions[name];
+	const clonedDefinition = cloneObject(moduleDefinition);
+
+	// Note that we clone the definition. Otherwise the objects are shared, which gives problems.
+	const ModuleClass = Module.extend(clonedDefinition);
+
+	return new ModuleClass();
+};
+
+Module.register = function (name, moduleDefinition) {
+	if (moduleDefinition.requiresVersion) {
+		Log.log(`Check MagicMirror² version for module '${name}' - Minimum version:  ${moduleDefinition.requiresVersion} - Current version: ${window.mmVersion}`);
+		if (cmpVersions(window.mmVersion, moduleDefinition.requiresVersion) >= 0) {
+			Log.log("Version is ok!");
+		} else {
+			Log.warn(`Version is incorrect. Skip module: '${name}'`);
+			return;
+		}
+	}
+	Log.log(`Module registered: ${name}`);
+	Module.definitions[name] = moduleDefinition;
+};
+
+window.Module = Module;
+
+/**
+ * Compare two semantic version numbers and return the difference.
+ * @param {string} a Version number a.
+ * @param {string} b Version number b.
+ * @returns {number} A positive number if a is larger than b, a negative
+ * number if a is smaller and 0 if they are the same
+ */
+function cmpVersions(a, b) {
+	const regExStrip0 = /(\.0+)+$/;
+	const segmentsA = a.replace(regExStrip0, "").split(".");
+	const segmentsB = b.replace(regExStrip0, "").split(".");
+	const l = Math.min(segmentsA.length, segmentsB.length);
+
+	for (let i = 0; i < l; i++) {
+		let diff = parseInt(segmentsA[i], 10) - parseInt(segmentsB[i], 10);
+		if (diff) {
+			return diff;
+		}
+	}
+	return segmentsA.length - segmentsB.length;
+}

js/node_helper.js

@@ -0,0 +1,140 @@
+/* MagicMirror²
+ * Node Helper Superclass
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ */
+const express = require("express");
+const Log = require("logger");
+const Class = require("./class");
+
+const NodeHelper = Class.extend({
+	init() {
+		Log.log("Initializing new module helper ...");
+	},
+
+	loaded() {
+		Log.log(`Module helper loaded: ${this.name}`);
+	},
+
+	start() {
+		Log.log(`Starting module helper: ${this.name}`);
+	},
+
+	/**
+	 * Called when the MagicMirror² server receives a `SIGINT`
+	 * Close any open connections, stop any sub-processes and
+	 * gracefully exit the module.
+	 */
+	stop() {
+		Log.log(`Stopping module helper: ${this.name}`);
+	},
+
+	/**
+	 * This method is called when a socket notification arrives.
+	 * @param {string} notification The identifier of the notification.
+	 * @param {*}  payload The payload of the notification.
+	 */
+	socketNotificationReceived(notification, payload) {
+		Log.log(`${this.name} received a socket notification: ${notification} - Payload: ${payload}`);
+	},
+
+	/**
+	 * Set the module name.
+	 * @param {string} name Module name.
+	 */
+	setName(name) {
+		this.name = name;
+	},
+
+	/**
+	 * Set the module path.
+	 * @param {string} path Module path.
+	 */
+	setPath(path) {
+		this.path = path;
+	},
+
+	/* sendSocketNotification(notification, payload)
+	 * Send a socket notification to the node helper.
+	 *
+	 * argument notification string - The identifier of the notification.
+	 * argument payload mixed - The payload of the notification.
+	 */
+	sendSocketNotification(notification, payload) {
+		this.io.of(this.name).emit(notification, payload);
+	},
+
+	/* setExpressApp(app)
+	 * Sets the express app object for this module.
+	 * This allows you to host files from the created webserver.
+	 *
+	 * argument app Express app - The Express app object.
+	 */
+	setExpressApp(app) {
+		this.expressApp = app;
+
+		app.use(`/${this.name}`, express.static(`${this.path}/public`));
+	},
+
+	/* setSocketIO(io)
+	 * Sets the socket io object for this module.
+	 * Binds message receiver.
+	 *
+	 * argument io Socket.io - The Socket io object.
+	 */
+	setSocketIO(io) {
+		this.io = io;
+
+		Log.log(`Connecting socket for: ${this.name}`);
+
+		io.of(this.name).on("connection", (socket) => {
+			// add a catch all event.
+			const onevent = socket.onevent;
+			socket.onevent = function (packet) {
+				const args = packet.data || [];
+				onevent.call(this, packet); // original call
+				packet.data = ["*"].concat(args);
+				onevent.call(this, packet); // additional call to catch-all
+			};
+
+			// register catch all.
+			socket.on("*", (notification, payload) => {
+				if (notification !== "*") {
+					this.socketNotificationReceived(notification, payload);
+				}
+			});
+		});
+	}
+});
+
+NodeHelper.checkFetchStatus = function (response) {
+	// response.status >= 200 && response.status < 300
+	if (response.ok) {
+		return response;
+	} else {
+		throw Error(response.statusText);
+	}
+};
+
+/**
+ * Look at the specified error and return an appropriate error type, that
+ * can be translated to a detailed error message
+ * @param {Error} error the error from fetching something
+ * @returns {string} the string of the detailed error message in the translations
+ */
+NodeHelper.checkFetchError = function (error) {
+	let error_type = "MODULE_ERROR_UNSPECIFIED";
+	if (error.code === "EAI_AGAIN") {
+		error_type = "MODULE_ERROR_NO_CONNECTION";
+	} else if (error.message === "Unauthorized") {
+		error_type = "MODULE_ERROR_UNAUTHORIZED";
+	}
+	return error_type;
+};
+
+NodeHelper.create = function (moduleDefinition) {
+	return NodeHelper.extend(moduleDefinition);
+};
+
+module.exports = NodeHelper;

js/server.js

@@ -0,0 +1,119 @@
+/* MagicMirror²
+ * Server
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ */
+const fs = require("fs");
+const http = require("http");
+const https = require("https");
+const path = require("path");
+const express = require("express");
+const ipfilter = require("express-ipfilter").IpFilter;
+const helmet = require("helmet");
+const socketio = require("socket.io");
+
+const Log = require("logger");
+const Utils = require("./utils");
+const { cors, getConfig, getHtml, getVersion } = require("./server_functions");
+
+/**
+ * Server
+ * @param {object} config The MM config
+ * @class
+ */
+function Server(config) {
+	const app = express();
+	const port = process.env.MM_PORT || config.port;
+	const serverSockets = new Set();
+	let server = null;
+
+	/**
+	 * Opens the server for incoming connections
+	 * @returns {Promise} A promise that is resolved when the server listens to connections
+	 */
+	this.open = function () {
+		return new Promise((resolve) => {
+			if (config.useHttps) {
+				const options = {
+					key: fs.readFileSync(config.httpsPrivateKey),
+					cert: fs.readFileSync(config.httpsCertificate)
+				};
+				server = https.Server(options, app);
+			} else {
+				server = http.Server(app);
+			}
+			const io = socketio(server, {
+				cors: {
+					origin: /.*$/,
+					credentials: true
+				},
+				allowEIO3: true
+			});
+
+			server.on("connection", (socket) => {
+				serverSockets.add(socket);
+				socket.on("close", () => {
+					serverSockets.delete(socket);
+				});
+			});
+
+			Log.log(`Starting server on port ${port} ... `);
+			server.listen(port, config.address || "localhost");
+
+			if (config.ipWhitelist instanceof Array && config.ipWhitelist.length === 0) {
+				Log.warn(Utils.colors.warn("You're using a full whitelist configuration to allow for all IPs"));
+			}
+
+			app.use(function (req, res, next) {
+				ipfilter(config.ipWhitelist, { mode: config.ipWhitelist.length === 0 ? "deny" : "allow", log: false })(req, res, function (err) {
+					if (err === undefined) {
+						res.header("Access-Control-Allow-Origin", "*");
+						return next();
+					}
+					Log.log(err.message);
+					res.status(403).send("This device is not allowed to access your mirror. <br> Please check your config.js or config.js.sample to change this.");
+				});
+			});
+
+			app.use(helmet(config.httpHeaders));
+			app.use("/js", express.static(__dirname));
+
+			// TODO add tests directory only when running tests?
+			const directories = ["/config", "/css", "/fonts", "/modules", "/vendor", "/translations", "/tests/configs", "/tests/mocks"];
+			for (const directory of directories) {
+				app.use(directory, express.static(path.resolve(global.root_path + directory)));
+			}
+
+			app.get("/cors", async (req, res) => await cors(req, res));
+
+			app.get("/version", (req, res) => getVersion(req, res));
+
+			app.get("/config", (req, res) => getConfig(req, res));
+
+			app.get("/", (req, res) => getHtml(req, res));
+
+			server.on("listening", () => {
+				resolve({
+					app,
+					io
+				});
+			});
+		});
+	};
+
+	/**
+	 * Closes the server and destroys all lingering connections to it.
+	 * @returns {Promise} A promise that resolves when server has successfully shut down
+	 */
+	this.close = function () {
+		return new Promise((resolve) => {
+			for (const socket of serverSockets.values()) {
+				socket.destroy();
+			}
+			server.close(resolve);
+		});
+	};
+}
+
+module.exports = Server;

js/server_functions.js

@@ -0,0 +1,121 @@
+const fs = require("fs");
+const path = require("path");
+const Log = require("logger");
+const fetch = require("./fetch");
+
+/**
+ * Gets the config.
+ * @param {Request} req - the request
+ * @param {Response} res - the result
+ */
+function getConfig(req, res) {
+	res.send(config);
+}
+
+/**
+ * A method that forwards HTTP Get-methods to the internet to avoid CORS-errors.
+ *
+ * Example input request url: /cors?sendheaders=header1:value1,header2:value2&expectedheaders=header1,header2&url=http://www.test.com/path?param1=value1
+ *
+ * Only the url-param of the input request url is required. It must be the last parameter.
+ * @param {Request} req - the request
+ * @param {Response} res - the result
+ */
+async function cors(req, res) {
+	try {
+		const urlRegEx = "url=(.+?)$";
+		let url;
+
+		const match = new RegExp(urlRegEx, "g").exec(req.url);
+		if (!match) {
+			url = `invalid url: ${req.url}`;
+			Log.error(url);
+			res.send(url);
+		} else {
+			url = match[1];
+
+			const headersToSend = getHeadersToSend(req.url);
+			const expectedRecievedHeaders = geExpectedRecievedHeaders(req.url);
+
+			Log.log(`cors url: ${url}`);
+			const response = await fetch(url, { headers: headersToSend });
+
+			for (const header of expectedRecievedHeaders) {
+				const headerValue = response.headers.get(header);
+				if (header) res.set(header, headerValue);
+			}
+			const data = await response.text();
+			res.send(data);
+		}
+	} catch (error) {
+		Log.error(error);
+		res.send(error);
+	}
+}
+
+/**
+ * Gets headers and values to attach to the web request.
+ * @param {string} url - The url containing the headers and values to send.
+ * @returns {object} An object specifying name and value of the headers.
+ */
+function getHeadersToSend(url) {
+	const headersToSend = { "User-Agent": `Mozilla/5.0 MagicMirror/${global.version}` };
+	const headersToSendMatch = new RegExp("sendheaders=(.+?)(&|$)", "g").exec(url);
+	if (headersToSendMatch) {
+		const headers = headersToSendMatch[1].split(",");
+		for (const header of headers) {
+			const keyValue = header.split(":");
+			if (keyValue.length !== 2) {
+				throw new Error(`Invalid format for header ${header}`);
+			}
+			headersToSend[keyValue[0]] = decodeURIComponent(keyValue[1]);
+		}
+	}
+	return headersToSend;
+}
+
+/**
+ * Gets the headers expected from the response.
+ * @param {string} url - The url containing the expected headers from the response.
+ * @returns {string[]} headers - The name of the expected headers.
+ */
+function geExpectedRecievedHeaders(url) {
+	const expectedRecievedHeaders = ["Content-Type"];
+	const expectedRecievedHeadersMatch = new RegExp("expectedheaders=(.+?)(&|$)", "g").exec(url);
+	if (expectedRecievedHeadersMatch) {
+		const headers = expectedRecievedHeadersMatch[1].split(",");
+		for (const header of headers) {
+			expectedRecievedHeaders.push(header);
+		}
+	}
+	return expectedRecievedHeaders;
+}
+
+/**
+ * Gets the HTML to display the magic mirror.
+ * @param {Request} req - the request
+ * @param {Response} res - the result
+ */
+function getHtml(req, res) {
+	let html = fs.readFileSync(path.resolve(`${global.root_path}/index.html`), { encoding: "utf8" });
+	html = html.replace("#VERSION#", global.version);
+
+	let configFile = "config/config.js";
+	if (typeof global.configuration_file !== "undefined") {
+		configFile = global.configuration_file;
+	}
+	html = html.replace("#CONFIG_FILE#", configFile);
+
+	res.send(html);
+}
+
+/**
+ * Gets the MagicMirror version.
+ * @param {Request} req - the request
+ * @param {Response} res - the result
+ */
+function getVersion(req, res) {
+	res.send(global.version);
+}
+
+module.exports = { cors, getConfig, getHtml, getVersion };

js/socketclient.js

@@ -0,0 +1,50 @@
+/* global io */
+
+/* MagicMirror²
+ * TODO add description
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ */
+const MMSocket = function (moduleName) {
+	if (typeof moduleName !== "string") {
+		throw new Error("Please set the module name for the MMSocket.");
+	}
+
+	this.moduleName = moduleName;
+
+	// Private Methods
+	let base = "/";
+	if (typeof config !== "undefined" && typeof config.basePath !== "undefined") {
+		base = config.basePath;
+	}
+	this.socket = io(`/${this.moduleName}`, {
+		path: `${base}socket.io`
+	});
+
+	let notificationCallback = function () {};
+
+	const onevent = this.socket.onevent;
+	this.socket.onevent = (packet) => {
+		const args = packet.data || [];
+		onevent.call(this.socket, packet); // original call
+		packet.data = ["*"].concat(args);
+		onevent.call(this.socket, packet); // additional call to catch-all
+	};
+
+	// register catch all.
+	this.socket.on("*", (notification, payload) => {
+		if (notification !== "*") {
+			notificationCallback(notification, payload);
+		}
+	});
+
+	// Public Methods
+	this.setNotificationCallback = (callback) => {
+		notificationCallback = callback;
+	};
+
+	this.sendNotification = (notification, payload = {}) => {
+		this.socket.emit(notification, payload);
+	};
+};

js/translator.js

@@ -0,0 +1,143 @@
+/* global translations */
+
+/* MagicMirror²
+ * Translator (l10n)
+ *
+ * By Christopher Fenner https://github.com/CFenner
+ * MIT Licensed.
+ */
+const Translator = (function () {
+	/**
+	 * Load a JSON file via XHR.
+	 * @param {string} file Path of the file we want to load.
+	 * @returns {Promise<object>} the translations in the specified file
+	 */
+	async function loadJSON(file) {
+		const xhr = new XMLHttpRequest();
+		return new Promise(function (resolve) {
+			xhr.overrideMimeType("application/json");
+			xhr.open("GET", file, true);
+			xhr.onreadystatechange = function () {
+				if (xhr.readyState === 4 && xhr.status === 200) {
+					// needs error handler try/catch at least
+					let fileinfo = null;
+					try {
+						fileinfo = JSON.parse(xhr.responseText);
+					} catch (exception) {
+						// nothing here, but don't die
+						Log.error(` loading json file =${file} failed`);
+					}
+					resolve(fileinfo);
+				}
+			};
+			xhr.send(null);
+		});
+	}
+
+	return {
+		coreTranslations: {},
+		coreTranslationsFallback: {},
+		translations: {},
+		translationsFallback: {},
+
+		/**
+		 * Load a translation for a given key for a given module.
+		 * @param {Module} module The module to load the translation for.
+		 * @param {string} key The key of the text to translate.
+		 * @param {object} variables The variables to use within the translation template (optional)
+		 * @returns {string} the translated key
+		 */
+		translate: function (module, key, variables = {}) {
+			/**
+			 * Combines template and variables like:
+			 * template: "Please wait for {timeToWait} before continuing with {work}."
+			 * variables: {timeToWait: "2 hours", work: "painting"}
+			 * to: "Please wait for 2 hours before continuing with painting."
+			 * @param {string} template Text with placeholder
+			 * @param {object} variables Variables for the placeholder
+			 * @returns {string} the template filled with the variables
+			 */
+			function createStringFromTemplate(template, variables) {
+				if (Object.prototype.toString.call(template) !== "[object String]") {
+					return template;
+				}
+				let templateToUse = template;
+				if (variables.fallback && !template.match(new RegExp("{.+}"))) {
+					templateToUse = variables.fallback;
+				}
+				return templateToUse.replace(new RegExp("{([^}]+)}", "g"), function (_unused, varName) {
+					return varName in variables ? variables[varName] : `{${varName}}`;
+				});
+			}
+
+			if (this.translations[module.name] && key in this.translations[module.name]) {
+				// Log.log("Got translation for " + key + " from module translation: ");
+				return createStringFromTemplate(this.translations[module.name][key], variables);
+			}
+
+			if (key in this.coreTranslations) {
+				// Log.log("Got translation for " + key + " from core translation.");
+				return createStringFromTemplate(this.coreTranslations[key], variables);
+			}
+
+			if (this.translationsFallback[module.name] && key in this.translationsFallback[module.name]) {
+				// Log.log("Got translation for " + key + " from module translation fallback.");
+				return createStringFromTemplate(this.translationsFallback[module.name][key], variables);
+			}
+
+			if (key in this.coreTranslationsFallback) {
+				// Log.log("Got translation for " + key + " from core translation fallback.");
+				return createStringFromTemplate(this.coreTranslationsFallback[key], variables);
+			}
+
+			return key;
+		},
+
+		/**
+		 * Load a translation file (json) and remember the data.
+		 * @param {Module} module The module to load the translation file for.
+		 * @param {string} file Path of the file we want to load.
+		 * @param {boolean} isFallback Flag to indicate fallback translations.
+		 */
+		async load(module, file, isFallback) {
+			Log.log(`${module.name} - Load translation${isFallback ? " fallback" : ""}: ${file}`);
+
+			if (this.translationsFallback[module.name]) {
+				return;
+			}
+
+			const json = await loadJSON(module.file(file));
+			const property = isFallback ? "translationsFallback" : "translations";
+			this[property][module.name] = json;
+		},
+
+		/**
+		 * Load the core translations.
+		 * @param {string} lang The language identifier of the core language.
+		 */
+		loadCoreTranslations: async function (lang) {
+			if (lang in translations) {
+				Log.log(`Loading core translation file: ${translations[lang]}`);
+				this.coreTranslations = await loadJSON(translations[lang]);
+			} else {
+				Log.log("Configured language not found in core translations.");
+			}
+
+			await this.loadCoreTranslationsFallback();
+		},
+
+		/**
+		 * Load the core translations' fallback.
+		 * The first language defined in translations.js will be used.
+		 */
+		loadCoreTranslationsFallback: async function () {
+			let first = Object.keys(translations)[0];
+			if (first) {
+				Log.log(`Loading core translation fallback file: ${translations[first]}`);
+				this.coreTranslationsFallback = await loadJSON(translations[first]);
+			}
+		}
+	};
+})();
+
+window.Translator = Translator;

js/utils.js

@@ -0,0 +1,16 @@
+/* MagicMirror²
+ * Utils
+ *
+ * By Rodrigo Ramírez Norambuena https://rodrigoramirez.com
+ * MIT Licensed.
+ */
+const colors = require("colors/safe");
+
+module.exports = {
+	colors: {
+		warn: colors.yellow,
+		error: colors.red,
+		info: colors.blue,
+		pass: colors.green
+	}
+};

jsconfig.json

@@ -0,0 +1,10 @@
+{
+	// See https://go.microsoft.com/fwlink/?LinkId=759670
+	// for the documentation about the jsconfig.json format
+	"compilerOptions": {
+		"target": "es6",
+		"module": "commonjs",
+		"allowSyntheticDefaultImports": true
+	},
+	"exclude": ["modules", "node_modules"]
+}

module-types.ts

@@ -0,0 +1,31 @@
+type ModuleProperties = {
+  defaults?: object;
+  start?(): void;
+  getHeader?(): string;
+  getTemplate?(): string;
+  getTemplateData?(): object;
+  notificationReceived?(notification: string, payload: any, sender: object): void;
+  socketNotificationReceived?(notification: string, payload: any): void;
+  suspend?(): void;
+  resume?(): void;
+  getDom?(): HTMLElement;
+  getStyles?(): string[];
+  [key: string]: any;
+};
+
+export declare const Module: {
+  register(moduleName: string, moduleProperties: ModuleProperties): void;
+};
+
+export declare const Log: {
+  info(message?: any, ...optionalParams: any[]): void;
+  log(message?: any, ...optionalParams: any[]): void;
+  error(message?: any, ...optionalParams: any[]): void;
+  warn(message?: any, ...optionalParams: any[]): void;
+  group(groupTitle?: string, ...optionalParams: any[]): void;
+  groupCollapsed(groupTitle?: string, ...optionalParams: any[]): void;
+  groupEnd(): void;
+  time(timerName?: string): void;
+  timeEnd(timerName?: string): void;
+  timeStamp(timerName?: string): void;
+};

modules/default/alert/README.md

@@ -0,0 +1,5 @@
+# Module: Alert
+
+The alert module is one of the default modules of the MagicMirror². This module displays notifications from other modules.
+
+For configuration options, please check the [MagicMirror² documentation](https://docs.magicmirror.builders/modules/alert.html).

modules/default/alert/alert.js

@@ -0,0 +1,147 @@
+/* global NotificationFx */
+
+/* MagicMirror²
+ * Module: alert
+ *
+ * By Paul-Vincent Roll https://paulvincentroll.com/
+ * MIT Licensed.
+ */
+Module.register("alert", {
+	alerts: {},
+
+	defaults: {
+		effect: "slide", // scale|slide|genie|jelly|flip|bouncyflip|exploader
+		alert_effect: "jelly", // scale|slide|genie|jelly|flip|bouncyflip|exploader
+		display_time: 3500, // time a notification is displayed in seconds
+		position: "center",
+		welcome_message: false // shown at startup
+	},
+
+	getScripts() {
+		return ["notificationFx.js"];
+	},
+
+	getStyles() {
+		return ["font-awesome.css", this.file(`./styles/notificationFx.css`), this.file(`./styles/${this.config.position}.css`)];
+	},
+
+	getTranslations() {
+		return {
+			bg: "translations/bg.json",
+			da: "translations/da.json",
+			de: "translations/de.json",
+			en: "translations/en.json",
+			es: "translations/es.json",
+			fr: "translations/fr.json",
+			hu: "translations/hu.json",
+			nl: "translations/nl.json",
+			ru: "translations/ru.json",
+			th: "translations/th.json"
+		};
+	},
+
+	getTemplate(type) {
+		return `templates/${type}.njk`;
+	},
+
+	async start() {
+		Log.info(`Starting module: ${this.name}`);
+
+		if (this.config.effect === "slide") {
+			this.config.effect = `${this.config.effect}-${this.config.position}`;
+		}
+
+		if (this.config.welcome_message) {
+			const message = this.config.welcome_message === true ? this.translate("welcome") : this.config.welcome_message;
+			await this.showNotification({ title: this.translate("sysTitle"), message });
+		}
+	},
+
+	notificationReceived(notification, payload, sender) {
+		if (notification === "SHOW_ALERT") {
+			if (payload.type === "notification") {
+				this.showNotification(payload);
+			} else {
+				this.showAlert(payload, sender);
+			}
+		} else if (notification === "HIDE_ALERT") {
+			this.hideAlert(sender);
+		}
+	},
+
+	async showNotification(notification) {
+		const message = await this.renderMessage(notification.templateName || "notification", notification);
+
+		new NotificationFx({
+			message,
+			layout: "growl",
+			effect: this.config.effect,
+			ttl: notification.timer || this.config.display_time
+		}).show();
+	},
+
+	async showAlert(alert, sender) {
+		// If module already has an open alert close it
+		if (this.alerts[sender.name]) {
+			this.hideAlert(sender, false);
+		}
+
+		// Add overlay
+		if (!Object.keys(this.alerts).length) {
+			this.toggleBlur(true);
+		}
+
+		const message = await this.renderMessage(alert.templateName || "alert", alert);
+
+		// Store alert in this.alerts
+		this.alerts[sender.name] = new NotificationFx({
+			message,
+			effect: this.config.alert_effect,
+			ttl: alert.timer,
+			onClose: () => this.hideAlert(sender),
+			al_no: "ns-alert"
+		});
+
+		// Show alert
+		this.alerts[sender.name].show();
+
+		// Add timer to dismiss alert and overlay
+		if (alert.timer) {
+			setTimeout(() => {
+				this.hideAlert(sender);
+			}, alert.timer);
+		}
+	},
+
+	hideAlert(sender, close = true) {
+		// Dismiss alert and remove from this.alerts
+		if (this.alerts[sender.name]) {
+			this.alerts[sender.name].dismiss(close);
+			delete this.alerts[sender.name];
+			// Remove overlay
+			if (!Object.keys(this.alerts).length) {
+				this.toggleBlur(false);
+			}
+		}
+	},
+
+	renderMessage(type, data) {
+		return new Promise((resolve) => {
+			this.nunjucksEnvironment().render(this.getTemplate(type), data, function (err, res) {
+				if (err) {
+					Log.error("Failed to render alert", err);
+				}
+
+				resolve(res);
+			});
+		});
+	},
+
+	toggleBlur(add = false) {
+		const method = add ? "add" : "remove";
+		const modules = document.querySelectorAll(".module");
+		for (const module of modules) {
+			module.classList[method]("alert-blur");
+		}
+	}
+});

modules/default/alert/notificationFx.js

@@ -0,0 +1,156 @@
+/**
+ * Based on work by
+ *
+ * notificationFx.js v1.0.0
+ * https://tympanus.net/codrops/
+ *
+ * Licensed under the MIT license.
+ * https://opensource.org/licenses/mit-license.php
+ *
+ * Copyright 2014, Codrops
+ * https://tympanus.net/codrops/
+ * @param {object} window The window object
+ */
+(function (window) {
+	/**
+	 * Extend one object with another one
+	 * @param {object} a The object to extend
+	 * @param {object} b The object which extends the other, overwrites existing keys
+	 * @returns {object} The merged object
+	 */
+	function extend(a, b) {
+		for (let key in b) {
+			if (b.hasOwnProperty(key)) {
+				a[key] = b[key];
+			}
+		}
+		return a;
+	}
+
+	/**
+	 * NotificationFx constructor
+	 * @param {object} options The configuration options
+	 * @class
+	 */
+	function NotificationFx(options) {
+		this.options = extend({}, this.options);
+		extend(this.options, options);
+		this._init();
+	}
+
+	/**
+	 * NotificationFx options
+	 */
+	NotificationFx.prototype.options = {
+		// element to which the notification will be appended
+		// defaults to the document.body
+		wrapper: document.body,
+		// the message
+		message: "yo!",
+		// layout type: growl|attached|bar|other
+		layout: "growl",
+		// effects for the specified layout:
+		// for growl layout: scale|slide|genie|jelly
+		// for attached layout: flip|bouncyflip
+		// for other layout: boxspinner|cornerexpand|loadingcircle|thumbslider
+		// ...
+		effect: "slide",
+		// notice, warning, error, success
+		// will add class ns-type-warning, ns-type-error or ns-type-success
+		type: "notice",
+		// if the user doesn´t close the notification then we remove it
+		// after the following time
+		ttl: 6000,
+		al_no: "ns-box",
+		// callbacks
+		onClose: function () {
+			return false;
+		},
+		onOpen: function () {
+			return false;
+		}
+	};
+
+	/**
+	 * Initialize and cache some vars
+	 */
+	NotificationFx.prototype._init = function () {
+		// create HTML structure
+		this.ntf = document.createElement("div");
+		this.ntf.className = `${this.options.al_no} ns-${this.options.layout} ns-effect-${this.options.effect} ns-type-${this.options.type}`;
+		let strinner = '<div class="ns-box-inner">';
+		strinner += this.options.message;
+		strinner += "</div>";
+		this.ntf.innerHTML = strinner;
+
+		// append to body or the element specified in options.wrapper
+		this.options.wrapper.insertBefore(this.ntf, this.options.wrapper.nextSibling);
+
+		// dismiss after [options.ttl]ms
+		if (this.options.ttl) {
+			this.dismissttl = setTimeout(() => {
+				if (this.active) {
+					this.dismiss();
+				}
+			}, this.options.ttl);
+		}
+
+		// init events
+		this._initEvents();
+	};
+
+	/**
+	 * Init events
+	 */
+	NotificationFx.prototype._initEvents = function () {
+		// dismiss notification by tapping on it if someone has a touchscreen
+		this.ntf.querySelector(".ns-box-inner").addEventListener("click", () => {
+			this.dismiss();
+		});
+	};
+
+	/**
+	 * Show the notification
+	 */
+	NotificationFx.prototype.show = function () {
+		this.active = true;
+		this.ntf.classList.remove("ns-hide");
+		this.ntf.classList.add("ns-show");
+		this.options.onOpen();
+	};
+
+	/**
+	 * Dismiss the notification
+	 * @param {boolean} [close] call the onClose callback at the end
+	 */
+	NotificationFx.prototype.dismiss = function (close = true) {
+		this.active = false;
+		clearTimeout(this.dismissttl);
+		this.ntf.classList.remove("ns-show");
+		setTimeout(() => {
+			this.ntf.classList.add("ns-hide");
+
+			// callback
+			if (close) this.options.onClose();
+		}, 25);
+
+		// after animation ends remove ntf from the DOM
+		const onEndAnimationFn = (ev) => {
+			if (ev.target !== this.ntf) {
+				return false;
+			}
+			this.ntf.removeEventListener("animationend", onEndAnimationFn);
+
+			if (ev.target.parentNode === this.options.wrapper) {
+				this.options.wrapper.removeChild(this.ntf);
+			}
+		};
+
+		this.ntf.addEventListener("animationend", onEndAnimationFn);
+	};
+
+	/**
+	 * Add to global namespace
+	 */
+	window.NotificationFx = NotificationFx;
+})(window);

modules/default/alert/styles/center.css

@@ -0,0 +1,5 @@
+.ns-box {
+  margin-left: auto;
+  margin-right: auto;
+  text-align: center;
+}

modules/default/alert/styles/left.css

@@ -0,0 +1,4 @@
+.ns-box {
+  margin-right: auto;
+  text-align: left;
+}

modules/default/alert/styles/notificationFx.css

@@ -0,0 +1,929 @@
+/* Based on work by https://tympanus.net/codrops/licensing/ */
+
+.ns-box {
+  background-color: rgb(0 0 0 / 93%);
+  padding: 17px;
+  line-height: 1.4;
+  margin-bottom: 10px;
+  z-index: 1;
+  font-size: 70%;
+  position: relative;
+  display: table;
+  word-wrap: break-word;
+  max-width: 100%;
+  border-width: 1px;
+  border-radius: 5px;
+  border-style: solid;
+  border-color: var(--color-text-dimmed);
+}
+
+.ns-alert {
+  border-style: solid;
+  border-color: var(--color-text-bright);
+  padding: 17px;
+  line-height: 1.4;
+  margin-bottom: 10px;
+  z-index: 3;
+  color: var(--color-text-bright);
+  font-size: 70%;
+  position: fixed;
+  text-align: center;
+  right: 0;
+  left: 0;
+  margin-right: auto;
+  margin-left: auto;
+  top: 40%;
+  width: 40%;
+  height: auto;
+  word-wrap: break-word;
+  border-radius: 20px;
+}
+
+.alert-blur {
+  filter: blur(2px) brightness(50%);
+}
+
+[class^="ns-effect-"].ns-growl.ns-hide,
+[class*=" ns-effect-"].ns-growl.ns-hide {
+  animation-direction: reverse;
+}
+
+.ns-effect-flip {
+  transform-origin: 50% 100%;
+  backface-visibility: hidden;
+}
+
+.ns-effect-flip.ns-show,
+.ns-effect-flip.ns-hide {
+  animation-name: anim-flip-front;
+  animation-duration: 0.3s;
+}
+
+.ns-effect-flip.ns-hide {
+  animation-name: anim-flip-back;
+}
+
+@keyframes anim-flip-front {
+  0% {
+    transform: perspective(1000px) rotate3d(1, 0, 0, -90deg);
+  }
+
+  100% {
+    transform: perspective(1000px);
+  }
+}
+
+@keyframes anim-flip-back {
+  0% {
+    transform: perspective(1000px) rotate3d(1, 0, 0, 90deg);
+  }
+
+  100% {
+    transform: perspective(1000px);
+  }
+}
+
+.ns-effect-bouncyflip.ns-show,
+.ns-effect-bouncyflip.ns-hide {
+  animation-name: flip-in-x;
+  animation-duration: 0.8s;
+}
+
+@keyframes flip-in-x {
+  0% {
+    transform: perspective(400px) rotate3d(1, 0, 0, -90deg);
+    transition-timing-function: ease-in;
+  }
+
+  40% {
+    transform: perspective(400px) rotate3d(1, 0, 0, 20deg);
+    transition-timing-function: ease-out;
+  }
+
+  60% {
+    transform: perspective(400px) rotate3d(1, 0, 0, -10deg);
+    transition-timing-function: ease-in;
+    opacity: 1;
+  }
+
+  80% {
+    transform: perspective(400px) rotate3d(1, 0, 0, 5deg);
+    transition-timing-function: ease-out;
+  }
+
+  100% {
+    transform: perspective(400px);
+  }
+}
+
+.ns-effect-bouncyflip.ns-hide {
+  animation-name: flip-in-x-simple;
+  animation-duration: 0.3s;
+}
+
+@keyframes flip-in-x-simple {
+  0% {
+    transform: perspective(400px) rotate3d(1, 0, 0, -90deg);
+    transition-timing-function: ease-in;
+  }
+
+  100% {
+    transform: perspective(400px);
+  }
+}
+
+.ns-effect-exploader {
+  transform-origin: 0 0;
+}
+
+.ns-effect-exploader p {
+  padding: 0.25em 2em 0.25em 3em;
+}
+
+.ns-effect-exploader.ns-show {
+  animation-name: anim-load;
+  animation-duration: 1s;
+}
+
+@keyframes anim-load {
+  0% {
+    opacity: 1;
+    transform: scale3d(0, 0.3, 1);
+  }
+
+  100% {
+    opacity: 1;
+    transform: scale3d(1, 1, 1);
+  }
+}
+
+.ns-effect-exploader.ns-hide {
+  animation-name: anim-fade;
+  animation-duration: 0.3s;
+}
+
+.ns-effect-exploader.ns-show .ns-box-inner,
+.ns-effect-exploader.ns-show .ns-close {
+  animation-fill-mode: both;
+  animation-duration: 0.3s;
+  animation-delay: 0.6s;
+}
+
+.ns-effect-exploader.ns-show .ns-close {
+  animation-name: anim-fade;
+}
+
+.ns-effect-exploader.ns-show .ns-box-inner {
+  animation-name: anim-fade-move;
+  animation-timing-function: ease-out;
+}
+
+@keyframes anim-fade-move {
+  0% {
+    opacity: 0;
+    transform: translate3d(0, 10px, 0);
+  }
+
+  100% {
+    opacity: 1;
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+@keyframes anim-fade {
+  0% {
+    opacity: 0;
+  }
+
+  100% {
+    opacity: 1;
+  }
+}
+
+.ns-effect-scale.ns-show,
+.ns-effect-scale.ns-hide {
+  animation-name: anim-scale;
+  animation-duration: 0.25s;
+}
+
+@keyframes anim-scale {
+  0% {
+    opacity: 0;
+    transform: translate3d(0, 40px, 0) scale3d(0.1, 0.6, 1);
+  }
+
+  100% {
+    opacity: 1;
+    transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
+  }
+}
+
+.ns-effect-jelly.ns-show {
+  animation-name: anim-jelly;
+  animation-duration: 1s;
+  animation-timing-function: linear;
+}
+
+.ns-effect-jelly.ns-hide {
+  animation-name: anim-fade;
+  animation-duration: 0.3s;
+}
+
+@keyframes anim-fade {
+  0% {
+    opacity: 0;
+  }
+
+  100% {
+    opacity: 1;
+  }
+}
+
+@keyframes anim-jelly {
+  0% {
+    transform: matrix3d(0.7, 0, 0, 0, 0, 0.7, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  2.083333% {
+    transform: matrix3d(0.7527, 0, 0, 0, 0, 0.7634, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  4.166667% {
+    transform: matrix3d(0.8107, 0, 0, 0, 0, 0.8454, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  6.25% {
+    transform: matrix3d(0.8681, 0, 0, 0, 0, 0.929, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  8.333333% {
+    transform: matrix3d(0.9204, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  10.416667% {
+    transform: matrix3d(0.9648, 0, 0, 0, 0, 1.052, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  12.5% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1.082, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  14.583333% {
+    transform: matrix3d(1.0256, 0, 0, 0, 0, 1.0915, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  16.666667% {
+    transform: matrix3d(1.0423, 0, 0, 0, 0, 1.0845, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  18.75% {
+    transform: matrix3d(1.051, 0, 0, 0, 0, 1.0667, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  20.833333% {
+    transform: matrix3d(1.0533, 0, 0, 0, 0, 1.0436, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  22.916667% {
+    transform: matrix3d(1.0508, 0, 0, 0, 0, 1.0201, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  25% {
+    transform: matrix3d(1.0449, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  27.083333% {
+    transform: matrix3d(1.037, 0, 0, 0, 0, 0.9853, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  29.166667% {
+    transform: matrix3d(1.0283, 0, 0, 0, 0, 0.9769, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  31.25% {
+    transform: matrix3d(1.0197, 0, 0, 0, 0, 0.9742, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  33.333333% {
+    transform: matrix3d(1.0119, 0, 0, 0, 0, 0.9762, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  35.416667% {
+    transform: matrix3d(1.0053, 0, 0, 0, 0, 0.9812, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  37.5% {
+    transform: matrix3d(1, 0, 0, 0, 0, 0.9877, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  39.583333% {
+    transform: matrix3d(0.9962, 0, 0, 0, 0, 0.9943, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  41.666667% {
+    transform: matrix3d(0.9937, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  43.75% {
+    transform: matrix3d(0.9924, 0, 0, 0, 0, 1.0041, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  45.833333% {
+    transform: matrix3d(0.992, 0, 0, 0, 0, 1.0065, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  47.916667% {
+    transform: matrix3d(0.9924, 0, 0, 0, 0, 1.0073, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  50% {
+    transform: matrix3d(0.9933, 0, 0, 0, 0, 1.0067, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  52.083333% {
+    transform: matrix3d(0.9945, 0, 0, 0, 0, 1.0053, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  54.166667% {
+    transform: matrix3d(0.9958, 0, 0, 0, 0, 1.0035, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  56.25% {
+    transform: matrix3d(0.997, 0, 0, 0, 0, 1.002, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  58.333333% {
+    transform: matrix3d(0.9982, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  60.416667% {
+    transform: matrix3d(0.9992, 0, 0, 0, 0, 0.9989, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  62.5% {
+    transform: matrix3d(1, 0, 0, 0, 0, 0.9982, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  64.583333% {
+    transform: matrix3d(1.0006, 0, 0, 0, 0, 0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  66.666667% {
+    transform: matrix3d(1.001, 0, 0, 0, 0, 0.9981, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  68.75% {
+    transform: matrix3d(1.0011, 0, 0, 0, 0, 0.9985, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  70.833333% {
+    transform: matrix3d(1.0012, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  72.916667% {
+    transform: matrix3d(1.0011, 0, 0, 0, 0, 0.9996, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  75% {
+    transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  77.083333% {
+    transform: matrix3d(1.0008, 0, 0, 0, 0, 1.0003, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  79.166667% {
+    transform: matrix3d(1.0006, 0, 0, 0, 0, 1.0005, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  81.25% {
+    transform: matrix3d(1.0004, 0, 0, 0, 0, 1.0006, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  83.333333% {
+    transform: matrix3d(1.0003, 0, 0, 0, 0, 1.0005, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  85.416667% {
+    transform: matrix3d(1.0001, 0, 0, 0, 0, 1.0004, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  87.5% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1.0003, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  89.583333% {
+    transform: matrix3d(0.9999, 0, 0, 0, 0, 1.0001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  91.666667% {
+    transform: matrix3d(0.9999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  93.75% {
+    transform: matrix3d(0.9998, 0, 0, 0, 0, 0.9999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  95.833333% {
+    transform: matrix3d(0.9998, 0, 0, 0, 0, 0.9999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  97.916667% {
+    transform: matrix3d(0.9998, 0, 0, 0, 0, 0.9998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  100% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+}
+
+.ns-effect-slide-left.ns-show {
+  animation-name: anim-slide-elastic-left;
+  animation-duration: 1s;
+  animation-timing-function: linear;
+}
+
+@keyframes anim-slide-elastic-left {
+  0% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -1000, 0, 0, 1);
+  }
+
+  1.666667% {
+    transform: matrix3d(1.9293, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -739.2681, 0, 0, 1);
+  }
+
+  3.333333% {
+    transform: matrix3d(1.9699, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -521.8255, 0, 0, 1);
+  }
+
+  5% {
+    transform: matrix3d(1.709, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -349.2612, 0, 0, 1);
+  }
+
+  6.666667% {
+    transform: matrix3d(1.424, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -218.324, 0, 0, 1);
+  }
+
+  8.333333% {
+    transform: matrix3d(1.2107, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -123.2985, 0, 0, 1);
+  }
+
+  10% {
+    transform: matrix3d(1.0817, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -57.5927, 0, 0, 1);
+  }
+
+  11.666667% {
+    transform: matrix3d(1.017, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -14.7237, 0, 0, 1);
+  }
+
+  13.333333% {
+    transform: matrix3d(0.9906, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 11.1279, 0, 0, 1);
+  }
+
+  15% {
+    transform: matrix3d(0.9848, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 24.8634, 0, 0, 1);
+  }
+
+  16.666667% {
+    transform: matrix3d(0.9872, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 30.405, 0, 0, 1);
+  }
+
+  18.333333% {
+    transform: matrix3d(0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 30.7528, 0, 0, 1);
+  }
+
+  20% {
+    transform: matrix3d(0.9954, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 28.1014, 0, 0, 1);
+  }
+
+  21.666667% {
+    transform: matrix3d(0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 23.9827, 0, 0, 1);
+  }
+
+  23.333333% {
+    transform: matrix3d(0.9994, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 19.4075, 0, 0, 1);
+  }
+
+  25% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 14.9956, 0, 0, 1);
+  }
+
+  26.666667% {
+    transform: matrix3d(1.0002, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 11.0858, 0, 0, 1);
+  }
+
+  28.333333% {
+    transform: matrix3d(1.0002, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 7.8251, 0, 0, 1);
+  }
+
+  30% {
+    transform: matrix3d(1.0002, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 5.2374, 0, 0, 1);
+  }
+
+  31.666667% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 3.2739, 0, 0, 1);
+  }
+
+  33.333333% {
+    transform: matrix3d(1.0001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 1.8489, 0, 0, 1);
+  }
+
+  35% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.8636, 0, 0, 1);
+  }
+
+  36.666667% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.2208, 0, 0, 1);
+  }
+
+  38.333333% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.1669, 0, 0, 1);
+  }
+
+  40% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.3728, 0, 0, 1);
+  }
+
+  41.666667% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.4559, 0, 0, 1);
+  }
+
+  43.333333% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.4612, 0, 0, 1);
+  }
+
+  45% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.421, 0, 0, 1);
+  }
+
+  46.666667% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.3596, 0, 0, 1);
+  }
+
+  48.333333% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.291, 0, 0, 1);
+  }
+
+  50% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.2249, 0, 0, 1);
+  }
+
+  51.666667% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.1662, 0, 0, 1);
+  }
+
+  53.333333% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.1173, 0, 0, 1);
+  }
+
+  55% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.0785, 0, 0, 1);
+  }
+
+  56.666667% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.0491, 0, 0, 1);
+  }
+
+  58.333333% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.0277, 0, 0, 1);
+  }
+
+  60% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.013, 0, 0, 1);
+  }
+
+  61.666667% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.0033, 0, 0, 1);
+  }
+
+  63.333333% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.0025, 0, 0, 1);
+  }
+
+  65% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.0056, 0, 0, 1);
+  }
+
+  66.666667% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.0068, 0, 0, 1);
+  }
+
+  68.333333% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.0069, 0, 0, 1);
+  }
+
+  70% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.0063, 0, 0, 1);
+  }
+
+  71.666667% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.0054, 0, 0, 1);
+  }
+
+  73.333333% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.0044, 0, 0, 1);
+  }
+
+  75% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.0034, 0, 0, 1);
+  }
+
+  76.666667% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.0025, 0, 0, 1);
+  }
+
+  78.333333% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.0018, 0, 0, 1);
+  }
+
+  80% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.0012, 0, 0, 1);
+  }
+
+  81.666667% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.0007, 0, 0, 1);
+  }
+
+  83.333333% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.0004, 0, 0, 1);
+  }
+
+  85% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.0002, 0, 0, 1);
+  }
+
+  86.666667% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.0001, 0, 0, 1);
+  }
+
+  88.333333% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.0001, 0, 0, 1);
+  }
+
+  90% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.0001, 0, 0, 1);
+  }
+
+  91.666667% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.0001, 0, 0, 1);
+  }
+
+  93.333333% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.0001, 0, 0, 1);
+  }
+
+  95% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.0001, 0, 0, 1);
+  }
+
+  96.666667% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.0001, 0, 0, 1);
+  }
+
+  98.333333% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.0001, 0, 0, 1);
+  }
+
+  100% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+}
+
+.ns-effect-slide-left.ns-hide {
+  animation-name: anim-slide-left;
+  animation-duration: 0.25s;
+}
+
+@keyframes anim-slide-left {
+  0% {
+    transform: translate3d(-30px, 0, 0) translate3d(-100%, 0, 0);
+  }
+
+  100% {
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.ns-effect-slide-right.ns-show {
+  animation: anim-slide-elastic-right 2000ms linear both;
+}
+
+@keyframes anim-slide-elastic-right {
+  0% {
+    transform: matrix3d(2, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 1000, 0, 0, 1);
+  }
+
+  2.15% {
+    transform: matrix3d(1.486, 0, 0, 0, 0, 0.514, 0, 0, 0, 0, 1, 0, 664.594, 0, 0, 1);
+  }
+
+  4.1% {
+    transform: matrix3d(1.147, 0, 0, 0, 0, 0.853, 0, 0, 0, 0, 1, 0, 419.708, 0, 0, 1);
+  }
+
+  4.3% {
+    transform: matrix3d(1.121, 0, 0, 0, 0, 0.879, 0, 0, 0, 0, 1, 0, 398.136, 0, 0, 1);
+  }
+
+  6.46% {
+    transform: matrix3d(0.948, 0, 0, 0, 0, 1.052, 0, 0, 0, 0, 1, 0, 206.714, 0, 0, 1);
+  }
+
+  8.11% {
+    transform: matrix3d(0.908, 0, 0, 0, 0, 1.092, 0, 0, 0, 0, 1, 0, 105.491, 0, 0, 1);
+  }
+
+  8.61% {
+    transform: matrix3d(0.907, 0, 0, 0, 0, 1.093, 0, 0, 0, 0, 1, 0, 81.572, 0, 0, 1);
+  }
+
+  12.11% {
+    transform: matrix3d(0.95, 0, 0, 0, 0, 1.05, 0, 0, 0, 0, 1, 0, -18.434, 0, 0, 1);
+  }
+
+  14.16% {
+    transform: matrix3d(0.979, 0, 0, 0, 0, 1.021, 0, 0, 0, 0, 1, 0, -38.734, 0, 0, 1);
+  }
+
+  16.12% {
+    transform: matrix3d(0.997, 0, 0, 0, 0, 1.003, 0, 0, 0, 0, 1, 0, -43.356, 0, 0, 1);
+  }
+
+  19.72% {
+    transform: matrix3d(1.006, 0, 0, 0, 0, 0.994, 0, 0, 0, 0, 1, 0, -34.155, 0, 0, 1);
+  }
+
+  27.23% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -7.839, 0, 0, 1);
+  }
+
+  30.83% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -1.951, 0, 0, 1);
+  }
+
+  38.34% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 1.037, 0, 0, 1);
+  }
+
+  41.99% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.812, 0, 0, 1);
+  }
+
+  50% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.159, 0, 0, 1);
+  }
+
+  60.56% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.025, 0, 0, 1);
+  }
+
+  82.78% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.001, 0, 0, 1);
+  }
+
+  100% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+}
+
+.ns-effect-slide-right.ns-hide {
+  animation-name: anim-slide-right;
+  animation-duration: 0.25s;
+}
+
+@keyframes anim-slide-right {
+  0% {
+    transform: translate3d(30px, 0, 0) translate3d(100%, 0, 0);
+  }
+
+  100% {
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.ns-effect-slide-center.ns-show {
+  animation: anim-slide-elastic-center 2000ms linear both;
+}
+
+@keyframes anim-slide-elastic-center {
+  0% {
+    transform: matrix3d(1, 0, 0, 0, 0, 3, 0, 0, 0, 0, 1, 0, 0, -300, 0, 1);
+  }
+
+  2.15% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1.971, 0, 0, 0, 0, 1, 0, 0, -199.378, 0, 1);
+  }
+
+  4.1% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1.294, 0, 0, 0, 0, 1, 0, 0, -125.912, 0, 1);
+  }
+
+  4.3% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1.243, 0, 0, 0, 0, 1, 0, 0, -119.441, 0, 1);
+  }
+
+  6.46% {
+    transform: matrix3d(1, 0, 0, 0, 0, 0.895, 0, 0, 0, 0, 1, 0, 0, -62.014, 0, 1);
+  }
+
+  8.11% {
+    transform: matrix3d(1, 0, 0, 0, 0, 0.817, 0, 0, 0, 0, 1, 0, 0, -31.647, 0, 1);
+  }
+
+  8.61% {
+    transform: matrix3d(1, 0, 0, 0, 0, 0.813, 0, 0, 0, 0, 1, 0, 0, -24.472, 0, 1);
+  }
+
+  12.11% {
+    transform: matrix3d(1, 0, 0, 0, 0, 0.9, 0, 0, 0, 0, 1, 0, 0, 5.53, 0, 1);
+  }
+
+  14.16% {
+    transform: matrix3d(1, 0, 0, 0, 0, 0.959, 0, 0, 0, 0, 1, 0, 0, 11.62, 0, 1);
+  }
+
+  16.12% {
+    transform: matrix3d(1, 0, 0, 0, 0, 0.994, 0, 0, 0, 0, 1, 0, 0, 13.007, 0, 1);
+  }
+
+  19.72% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1.012, 0, 0, 0, 0, 1, 0, 0, 10.247, 0, 1);
+  }
+
+  27.23% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 2.352, 0, 1);
+  }
+
+  30.83% {
+    transform: matrix3d(1, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0.585, 0, 1);
+  }
+
+  38.34% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, -0.311, 0, 1);
+  }
+
+  41.99% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, -0.244, 0, 1);
+  }
+
+  50% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, -0.048, 0, 1);
+  }
+
+  60.56% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0.007, 0, 1);
+  }
+
+  82.78% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+
+  100% {
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+  }
+}
+
+.ns-effect-slide-center.ns-hide {
+  animation-name: anim-slide-center;
+  animation-duration: 0.25s;
+}
+
+@keyframes anim-slide-center {
+  0% {
+    transform: translate3d(0, -30px, 0) translate3d(0, -100%, 0);
+  }
+
+  100% {
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.ns-effect-genie.ns-show,
+.ns-effect-genie.ns-hide {
+  animation-name: anim-genie;
+  animation-duration: 0.4s;
+}
+
+@keyframes anim-genie {
+  0% {
+    opacity: 0;
+    transform: translate3d(0, calc(200% + 30px), 0) scale3d(0, 1, 1);
+    animation-timing-function: ease-in;
+  }
+
+  40% {
+    opacity: 0.5;
+    transform: translate3d(0, 0, 0) scale3d(0.02, 1.1, 1);
+    animation-timing-function: ease-out;
+  }
+
+  70% {
+    opacity: 0.6;
+    transform: translate3d(0, -40px, 0) scale3d(0.8, 1.1, 1);
+  }
+
+  100% {
+    opacity: 1;
+    transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
+  }
+}

modules/default/alert/styles/right.css

@@ -0,0 +1,4 @@
+.ns-box {
+  margin-left: auto;
+  text-align: right;
+}

modules/default/alert/templates/alert.njk

@@ -0,0 +1,18 @@
+{% if imageUrl or imageFA %}
+  {% set imageHeight = imageHeight if imageHeight else "80px" %}
+  {% if imageUrl %}
+    <img src="{{ imageUrl }}" height="{{ imageHeight }}" style="margin-bottom: 10px;"/>
+  {% else %}
+    <span class="bright fas fa-{{ imageFA }}" style='margin-bottom: 10px; font-size: {{ imageHeight }};'/></span>
+  {% endif %}
+  <br/>
+{% endif %}
+{% if title %}
+  <span class="thin dimmed medium">{{ title if titleType == 'text' else title | safe }}</span>
+{% endif %}
+{% if message %}
+  {% if title %}
+    <br/>
+  {% endif %}
+  <span class="light bright small">{{ message if messageType == 'text' else message | safe }}</span>
+{% endif %}

modules/default/alert/templates/notification.njk

@@ -0,0 +1,9 @@
+{% if title %}
+  <span class="thin dimmed medium">{{ title if titleType == 'text' else title | safe }}</span>
+{% endif %}
+{% if message %}
+  {% if title %}
+    <br/>
+  {% endif %}
+  <span class="light bright small">{{ message if messageType == 'text' else message | safe }}</span>
+{% endif %}

modules/default/alert/translations/bg.json

@@ -0,0 +1,4 @@
+{
+	"sysTitle": "MagicMirror² нотификация",
+	"welcome": "Добре дошли, стартирането беше успешно"
+}

modules/default/alert/translations/da.json

@@ -0,0 +1,4 @@
+{
+	"sysTitle": "MagicMirror² Notifikation",
+	"welcome": "Velkommen, modulet er succesfuldt startet!"
+}

modules/default/alert/translations/de.json

@@ -0,0 +1,4 @@
+{
+	"sysTitle": "MagicMirror² Benachrichtigung",
+	"welcome": "Willkommen, Start war erfolgreich!"
+}

modules/default/alert/translations/en.json

@@ -0,0 +1,4 @@
+{
+	"sysTitle": "MagicMirror² Notification",
+	"welcome": "Welcome, start was successful!"
+}

modules/default/alert/translations/es.json

@@ -0,0 +1,4 @@
+{
+	"sysTitle": "MagicMirror² Notificaciones",
+	"welcome": "Bienvenido, ¡se iniciado correctamente!"
+}

modules/default/alert/translations/fr.json

@@ -0,0 +1,4 @@
+{
+	"sysTitle": "MagicMirror² Notification",
+	"welcome": "Bienvenue, le démarrage a été un succès!"
+}

modules/default/alert/translations/hu.json

@@ -0,0 +1,4 @@
+{
+	"sysTitle": "MagicMirror² értesítés",
+	"welcome": "Üdvözöljük, indulás sikeres!"
+}

modules/default/alert/translations/nl.json

@@ -0,0 +1,4 @@
+{
+	"sysTitle": "MagicMirror² Notificatie",
+	"welcome": "Welkom, Succesvol gestart!"
+}

modules/default/alert/translations/ru.json

@@ -0,0 +1,4 @@
+{
+	"sysTitle": "MagicMirror² Уведомление",
+	"welcome": "Добро пожаловать, старт был успешным!"
+}

modules/default/alert/translations/th.json

@@ -0,0 +1,4 @@
+{
+	"sysTitle": "การแจ้งเตือน MagicMirror²",
+	"welcome": "ยินดีต้อนรับ การเริ่มต้นสำเร็จแล้ว!"
+}

modules/default/calendar/README.md

@@ -0,0 +1,6 @@
+# Module: Calendar
+
+The `calendar` module is one of the default modules of the MagicMirror².
+This module displays events from a public .ical calendar. It can combine multiple calendars.
+
+For configuration options, please check the [MagicMirror² documentation](https://docs.magicmirror.builders/modules/calendar.html).

modules/default/calendar/calendar.css

@@ -0,0 +1,24 @@
+.calendar .symbol {
+  display: flex;
+  flex-direction: row;
+  justify-content: flex-end;
+  padding-left: 0;
+  padding-right: 10px;
+  font-size: var(--font-size-small);
+}
+
+.calendar .symbol span {
+  padding-top: 4px;
+}
+
+.calendar .title {
+  padding-left: 0;
+  padding-right: 0;
+  vertical-align: top;
+}
+
+.calendar .time {
+  padding-left: 30px;
+  text-align: right;
+  vertical-align: top;
+}

modules/default/calendar/calendar.js

@@ -0,0 +1,856 @@
+/* global CalendarUtils, cloneObject */
+
+/* MagicMirror²
+ * Module: Calendar
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ */
+Module.register("calendar", {
+	// Define module defaults
+	defaults: {
+		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-",
+		showLocation: false,
+		displayRepeatingCountTitle: false,
+		defaultRepeatingCountTitle: "",
+		maxTitleLength: 25,
+		maxLocationTitleLength: 25,
+		wrapEvents: false, // Wrap events to multiple lines breaking at maxTitleLength
+		wrapLocationEvents: false,
+		maxTitleLines: 3,
+		maxEventTitleLines: 3,
+		fetchInterval: 60 * 60 * 1000, // Update every hour
+		animationSpeed: 2000,
+		fade: true,
+		urgency: 7,
+		timeFormat: "relative",
+		dateFormat: "MMM Do",
+		dateEndFormat: "LT",
+		fullDayEventDateFormat: "MMM Do",
+		showEnd: false,
+		getRelative: 6,
+		fadePoint: 0.25, // Start on 1/4th of the list.
+		hidePrivate: false,
+		hideOngoing: false,
+		hideTime: false,
+		showTimeToday: false,
+		colored: false,
+		customEvents: [], // Array of {keyword: "", symbol: "", color: ""} where Keyword is a regexp and symbol/color are to be applied for matched
+		tableClass: "small",
+		calendars: [
+			{
+				symbol: "calendar-alt",
+				url: "https://www.calendarlabs.com/templates/ical/US-Holidays.ics"
+			}
+		],
+		titleReplace: {
+			"De verjaardag van ": "",
+			"'s birthday": ""
+		},
+		locationTitleReplace: {
+			"street ": ""
+		},
+		broadcastEvents: true,
+		excludedEvents: [],
+		sliceMultiDayEvents: false,
+		broadcastPastEvents: false,
+		nextDaysRelative: false,
+		selfSignedCert: false,
+		coloredText: false,
+		coloredBorder: false,
+		coloredSymbol: false,
+		coloredBackground: false,
+		limitDaysNeverSkip: false,
+		flipDateHeaderTitle: false
+	},
+
+	requiresVersion: "2.1.0",
+
+	// Define required scripts.
+	getStyles: function () {
+		return ["calendar.css", "font-awesome.css"];
+	},
+
+	// Define required scripts.
+	getScripts: function () {
+		return ["calendarutils.js", "moment.js"];
+	},
+
+	// Define required translations.
+	getTranslations: function () {
+		// The translations for the default modules are defined in the core translation files.
+		// Therefore we can just return false. Otherwise we should have returned a dictionary.
+		// If you're trying to build your own module including translations, check out the documentation.
+		return false;
+	},
+
+	// Override start method.
+	start: function () {
+		const ONE_MINUTE = 60 * 1000;
+
+		Log.info(`Starting module: ${this.name}`);
+
+		if (this.config.colored) {
+			Log.warn("Your are using the deprecated config values 'colored'. Please switch to  'coloredSymbol' & 'coloredText'!");
+			this.config.coloredText = true;
+			this.config.coloredSymbol = true;
+		}
+		if (this.config.coloredSymbolOnly) {
+			Log.warn("Your are using the deprecated config values 'coloredSymbolOnly'. Please switch to  'coloredSymbol' & 'coloredText'!");
+			this.config.coloredText = false;
+			this.config.coloredSymbol = true;
+		}
+
+		// Set locale.
+		moment.updateLocale(config.language, CalendarUtils.getLocaleSpecification(config.timeFormat));
+
+		// clear data holder before start
+		this.calendarData = {};
+
+		// indicate no data available yet
+		this.loaded = false;
+
+		this.config.calendars.forEach((calendar) => {
+			calendar.url = calendar.url.replace("webcal://", "http://");
+
+			const calendarConfig = {
+				maximumEntries: calendar.maximumEntries,
+				maximumNumberOfDays: calendar.maximumNumberOfDays,
+				pastDaysCount: calendar.pastDaysCount,
+				broadcastPastEvents: calendar.broadcastPastEvents,
+				selfSignedCert: calendar.selfSignedCert
+			};
+
+			if (calendar.symbolClass === "undefined" || calendar.symbolClass === null) {
+				calendarConfig.symbolClass = "";
+			}
+			if (calendar.titleClass === "undefined" || calendar.titleClass === null) {
+				calendarConfig.titleClass = "";
+			}
+			if (calendar.timeClass === "undefined" || calendar.timeClass === null) {
+				calendarConfig.timeClass = "";
+			}
+
+			// we check user and password here for backwards compatibility with old configs
+			if (calendar.user && calendar.pass) {
+				Log.warn("Deprecation warning: Please update your calendar authentication configuration.");
+				Log.warn("https://github.com/MichMich/MagicMirror/tree/v2.1.2/modules/default/calendar#calendar-authentication-options");
+				calendar.auth = {
+					user: calendar.user,
+					pass: calendar.pass
+				};
+			}
+
+			// tell helper to start a fetcher for this calendar
+			// fetcher till cycle
+			this.addCalendar(calendar.url, calendar.auth, calendarConfig);
+		});
+
+		// Refresh the DOM every minute if needed: When using relative date format for events that start
+		// or end in less than an hour, the date shows minute granularity and we want to keep that accurate.
+		setTimeout(() => {
+			setInterval(() => {
+				this.updateDom(1);
+			}, ONE_MINUTE);
+		}, ONE_MINUTE - (new Date() % ONE_MINUTE));
+	},
+
+	// Override socket notification handler.
+	socketNotificationReceived: function (notification, payload) {
+		if (notification === "FETCH_CALENDAR") {
+			this.sendSocketNotification(notification, { url: payload.url, id: this.identifier });
+		}
+
+		if (this.identifier !== payload.id) {
+			return;
+		}
+
+		if (notification === "CALENDAR_EVENTS") {
+			if (this.hasCalendarURL(payload.url)) {
+				this.calendarData[payload.url] = payload.events;
+				this.error = null;
+				this.loaded = true;
+
+				if (this.config.broadcastEvents) {
+					this.broadcastEvents();
+				}
+			}
+		} else if (notification === "CALENDAR_ERROR") {
+			let error_message = this.translate(payload.error_type);
+			this.error = this.translate("MODULE_CONFIG_ERROR", { MODULE_NAME: this.name, ERROR: error_message });
+			this.loaded = true;
+		}
+
+		this.updateDom(this.config.animationSpeed);
+	},
+
+	// Override dom generator.
+	getDom: function () {
+		const ONE_SECOND = 1000; // 1,000 milliseconds
+		const ONE_MINUTE = ONE_SECOND * 60;
+		const ONE_HOUR = ONE_MINUTE * 60;
+		const ONE_DAY = ONE_HOUR * 24;
+
+		const events = this.createEventList(true);
+		const wrapper = document.createElement("table");
+		wrapper.className = this.config.tableClass;
+
+		if (this.error) {
+			wrapper.innerHTML = this.error;
+			wrapper.className = `${this.config.tableClass} dimmed`;
+			return wrapper;
+		}
+
+		if (events.length === 0) {
+			wrapper.innerHTML = this.loaded ? this.translate("EMPTY") : this.translate("LOADING");
+			wrapper.className = `${this.config.tableClass} dimmed`;
+			return wrapper;
+		}
+
+		let currentFadeStep = 0;
+		let startFade;
+		let fadeSteps;
+
+		if (this.config.fade && this.config.fadePoint < 1) {
+			if (this.config.fadePoint < 0) {
+				this.config.fadePoint = 0;
+			}
+			startFade = events.length * this.config.fadePoint;
+			fadeSteps = events.length - startFade;
+		}
+
+		let lastSeenDate = "";
+
+		events.forEach((event, index) => {
+			const dateAsString = moment(event.startDate, "x").format(this.config.dateFormat);
+			if (this.config.timeFormat === "dateheaders") {
+				if (lastSeenDate !== dateAsString) {
+					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";
+					dateCell.innerHTML = dateAsString;
+					dateCell.style.paddingTop = "10px";
+					dateRow.appendChild(dateCell);
+					wrapper.appendChild(dateRow);
+
+					if (this.config.fade && index >= startFade) {
+						//fading
+						currentFadeStep = index - startFade;
+						dateRow.style.opacity = 1 - (1 / fadeSteps) * currentFadeStep;
+					}
+
+					lastSeenDate = dateAsString;
+				}
+			}
+
+			const eventWrapper = document.createElement("tr");
+
+			if (this.config.coloredText) {
+				eventWrapper.style.cssText = `color:${this.colorForUrl(event.url, false)}`;
+			}
+
+			if (this.config.coloredBackground) {
+				eventWrapper.style.backgroundColor = this.colorForUrl(event.url, true);
+			}
+
+			if (this.config.coloredBorder) {
+				eventWrapper.style.borderColor = this.colorForUrl(event.url, false);
+			}
+
+			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");
+
+			if (this.config.displaySymbol) {
+				if (this.config.coloredSymbol) {
+					symbolWrapper.style.cssText = `color:${this.colorForUrl(event.url, false)}`;
+				}
+
+				const symbolClass = this.symbolClassForUrl(event.url);
+				symbolWrapper.className = `symbol align-right ${symbolClass}`;
+
+				const symbols = this.symbolsForEvent(event);
+				symbols.forEach((s, index) => {
+					const symbol = document.createElement("span");
+					symbol.className = s;
+					if (index > 0) {
+						symbol.style.paddingLeft = "5px";
+					}
+					symbolWrapper.appendChild(symbol);
+				});
+				eventWrapper.appendChild(symbolWrapper);
+			} else if (this.config.timeFormat === "dateheaders") {
+				const blankCell = document.createElement("td");
+				blankCell.innerHTML = "&nbsp;&nbsp;&nbsp;";
+				eventWrapper.appendChild(blankCell);
+			}
+
+			const titleWrapper = document.createElement("td");
+			let repeatingCountTitle = "";
+
+			if (this.config.displayRepeatingCountTitle && event.firstYear !== undefined) {
+				repeatingCountTitle = this.countTitleForUrl(event.url);
+
+				if (repeatingCountTitle !== "") {
+					const thisYear = new Date(parseInt(event.startDate)).getFullYear(),
+						yearDiff = thisYear - event.firstYear;
+
+					repeatingCountTitle = `, ${yearDiff} ${repeatingCountTitle}`;
+				}
+			}
+
+			// Color events if custom color is specified
+			if (this.config.customEvents.length > 0) {
+				for (let ev in this.config.customEvents) {
+					if (typeof this.config.customEvents[ev].color !== "undefined" && this.config.customEvents[ev].color !== "") {
+						let needle = new RegExp(this.config.customEvents[ev].keyword, "gi");
+						if (needle.test(event.title)) {
+							// Respect parameter ColoredSymbolOnly also for custom events
+							if (this.config.coloredText) {
+								eventWrapper.style.cssText = `color:${this.config.customEvents[ev].color}`;
+								titleWrapper.style.cssText = `color:${this.config.customEvents[ev].color}`;
+							}
+							if (this.config.displaySymbol && this.config.coloredSymbol) {
+								symbolWrapper.style.cssText = `color:${this.config.customEvents[ev].color}`;
+							}
+							break;
+						}
+					}
+				}
+			}
+
+			const transformedTitle = CalendarUtils.titleTransform(event.title, this.config.titleReplace);
+			titleWrapper.innerHTML = CalendarUtils.shorten(transformedTitle, this.config.maxTitleLength, this.config.wrapEvents, this.config.maxTitleLines) + repeatingCountTitle;
+
+			const titleClass = this.titleClassForUrl(event.url);
+
+			if (!this.config.coloredText) {
+				titleWrapper.className = `title bright ${titleClass}`;
+			} else {
+				titleWrapper.className = `title ${titleClass}`;
+			}
+
+			if (this.config.timeFormat === "dateheaders") {
+				if (this.config.flipDateHeaderTitle) eventWrapper.appendChild(titleWrapper);
+
+				if (event.fullDayEvent) {
+					titleWrapper.colSpan = "2";
+					titleWrapper.classList.add("align-left");
+				} else {
+					const timeWrapper = document.createElement("td");
+					timeWrapper.className = `time light ${this.config.flipDateHeaderTitle ? "align-right " : "align-left "}${this.timeClassForUrl(event.url)}`;
+					timeWrapper.style.paddingLeft = "2px";
+					timeWrapper.style.textAlign = this.config.flipDateHeaderTitle ? "right" : "left";
+					timeWrapper.innerHTML = moment(event.startDate, "x").format("LT");
+
+					// Add endDate to dataheaders if showEnd is enabled
+					if (this.config.showEnd) {
+						timeWrapper.innerHTML += ` - ${CalendarUtils.capFirst(moment(event.endDate, "x").format("LT"))}`;
+					}
+
+					eventWrapper.appendChild(timeWrapper);
+
+					if (!this.config.flipDateHeaderTitle) titleWrapper.classList.add("align-right");
+				}
+				if (!this.config.flipDateHeaderTitle) eventWrapper.appendChild(titleWrapper);
+			} else {
+				const timeWrapper = document.createElement("td");
+
+				eventWrapper.appendChild(titleWrapper);
+				const now = new Date();
+
+				if (this.config.timeFormat === "absolute") {
+					// Use dateFormat
+					timeWrapper.innerHTML = CalendarUtils.capFirst(moment(event.startDate, "x").format(this.config.dateFormat));
+					// Add end time if showEnd
+					if (this.config.showEnd) {
+						timeWrapper.innerHTML += "-";
+						timeWrapper.innerHTML += CalendarUtils.capFirst(moment(event.endDate, "x").format(this.config.dateEndFormat));
+					}
+					// For full day events we use the fullDayEventDateFormat
+					if (event.fullDayEvent) {
+						//subtract one second so that fullDayEvents end at 23:59:59, and not at 0:00:00 one the next day
+						event.endDate -= ONE_SECOND;
+						timeWrapper.innerHTML = CalendarUtils.capFirst(moment(event.startDate, "x").format(this.config.fullDayEventDateFormat));
+					} else if (this.config.getRelative > 0 && event.startDate < now) {
+						// Ongoing and getRelative is set
+						timeWrapper.innerHTML = CalendarUtils.capFirst(
+							this.translate("RUNNING", {
+								fallback: `${this.translate("RUNNING")} {timeUntilEnd}`,
+								timeUntilEnd: moment(event.endDate, "x").fromNow(true)
+							})
+						);
+					} else if (this.config.urgency > 0 && event.startDate - now < this.config.urgency * ONE_DAY) {
+						// Within urgency days
+						timeWrapper.innerHTML = CalendarUtils.capFirst(moment(event.startDate, "x").fromNow());
+					}
+					if (event.fullDayEvent && this.config.nextDaysRelative) {
+						// Full days events within the next two days
+						if (event.today) {
+							timeWrapper.innerHTML = CalendarUtils.capFirst(this.translate("TODAY"));
+						} else if (event.yesterday) {
+							timeWrapper.innerHTML = CalendarUtils.capFirst(this.translate("YESTERDAY"));
+						} else if (event.startDate - now < ONE_DAY && event.startDate - now > 0) {
+							timeWrapper.innerHTML = CalendarUtils.capFirst(this.translate("TOMORROW"));
+						} else if (event.startDate - now < 2 * ONE_DAY && event.startDate - now > 0) {
+							if (this.translate("DAYAFTERTOMORROW") !== "DAYAFTERTOMORROW") {
+								timeWrapper.innerHTML = CalendarUtils.capFirst(this.translate("DAYAFTERTOMORROW"));
+							}
+						}
+					}
+				} else {
+					// Show relative times
+					if (event.startDate >= now || (event.fullDayEvent && event.today)) {
+						// Use relative time
+						if (!this.config.hideTime && !event.fullDayEvent) {
+							timeWrapper.innerHTML = CalendarUtils.capFirst(moment(event.startDate, "x").calendar(null, { sameElse: this.config.dateFormat }));
+						} else {
+							timeWrapper.innerHTML = CalendarUtils.capFirst(
+								moment(event.startDate, "x").calendar(null, {
+									sameDay: this.config.showTimeToday ? "LT" : `[${this.translate("TODAY")}]`,
+									nextDay: `[${this.translate("TOMORROW")}]`,
+									nextWeek: "dddd",
+									sameElse: event.fullDayEvent ? this.config.fullDayEventDateFormat : this.config.dateFormat
+								})
+							);
+						}
+						if (event.fullDayEvent) {
+							// Full days events within the next two days
+							if (event.today) {
+								timeWrapper.innerHTML = CalendarUtils.capFirst(this.translate("TODAY"));
+							} else if (event.dayBeforeYesterday) {
+								if (this.translate("DAYBEFOREYESTERDAY") !== "DAYBEFOREYESTERDAY") {
+									timeWrapper.innerHTML = CalendarUtils.capFirst(this.translate("DAYBEFOREYESTERDAY"));
+								}
+							} else if (event.yesterday) {
+								timeWrapper.innerHTML = CalendarUtils.capFirst(this.translate("YESTERDAY"));
+							} else if (event.startDate - now < ONE_DAY && event.startDate - now > 0) {
+								timeWrapper.innerHTML = CalendarUtils.capFirst(this.translate("TOMORROW"));
+							} else if (event.startDate - now < 2 * ONE_DAY && event.startDate - now > 0) {
+								if (this.translate("DAYAFTERTOMORROW") !== "DAYAFTERTOMORROW") {
+									timeWrapper.innerHTML = CalendarUtils.capFirst(this.translate("DAYAFTERTOMORROW"));
+								}
+							}
+						} else if (event.startDate - now < this.config.getRelative * ONE_HOUR) {
+							// If event is within getRelative hours, display 'in xxx' time format or moment.fromNow()
+							timeWrapper.innerHTML = CalendarUtils.capFirst(moment(event.startDate, "x").fromNow());
+						}
+					} else {
+						// Ongoing event
+						timeWrapper.innerHTML = CalendarUtils.capFirst(
+							this.translate("RUNNING", {
+								fallback: `${this.translate("RUNNING")} {timeUntilEnd}`,
+								timeUntilEnd: moment(event.endDate, "x").fromNow(true)
+							})
+						);
+					}
+				}
+				timeWrapper.className = `time light ${this.timeClassForUrl(event.url)}`;
+				eventWrapper.appendChild(timeWrapper);
+			}
+
+			// Create fade effect.
+			if (index >= startFade) {
+				currentFadeStep = index - startFade;
+				eventWrapper.style.opacity = 1 - (1 / fadeSteps) * currentFadeStep;
+			}
+			wrapper.appendChild(eventWrapper);
+
+			if (this.config.showLocation) {
+				if (event.location !== false) {
+					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");
+						locationRow.appendChild(symbolCell);
+					}
+
+					if (this.config.coloredText) {
+						locationRow.style.cssText = `color:${this.colorForUrl(event.url, false)}`;
+					}
+
+					if (this.config.coloredBackground) {
+						locationRow.style.backgroundColor = this.colorForUrl(event.url, true);
+					}
+
+					if (this.config.coloredBorder) {
+						locationRow.style.borderColor = this.colorForUrl(event.url, false);
+					}
+
+					const descCell = document.createElement("td");
+					descCell.className = "location";
+					descCell.colSpan = "2";
+
+					const transformedTitle = CalendarUtils.titleTransform(event.location, this.config.locationTitleReplace);
+					descCell.innerHTML = CalendarUtils.shorten(transformedTitle, this.config.maxLocationTitleLength, this.config.wrapLocationEvents, this.config.maxEventTitleLines);
+					locationRow.appendChild(descCell);
+
+					wrapper.appendChild(locationRow);
+
+					if (index >= startFade) {
+						currentFadeStep = index - startFade;
+						locationRow.style.opacity = 1 - (1 / fadeSteps) * currentFadeStep;
+					}
+				}
+			}
+		});
+
+		return wrapper;
+	},
+
+	/**
+	 * Checks if this config contains the calendar url.
+	 * @param {string} url The calendar url
+	 * @returns {boolean} True if the calendar config contains the url, False otherwise
+	 */
+	hasCalendarURL: function (url) {
+		for (const calendar of this.config.calendars) {
+			if (calendar.url === url) {
+				return true;
+			}
+		}
+
+		return false;
+	},
+
+	/**
+	 * Creates the sorted list of all events.
+	 * @param {boolean} limitNumberOfEntries Whether to filter returned events for display.
+	 * @returns {object[]} Array with events.
+	 */
+	createEventList: function (limitNumberOfEntries) {
+		const ONE_SECOND = 1000; // 1,000 milliseconds
+		const ONE_MINUTE = ONE_SECOND * 60;
+		const ONE_HOUR = ONE_MINUTE * 60;
+		const ONE_DAY = ONE_HOUR * 24;
+
+		const now = new Date();
+		const today = moment().startOf("day");
+		const future = moment().startOf("day").add(this.config.maximumNumberOfDays, "days").toDate();
+		let events = [];
+
+		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
+
+				if (this.config.hidePrivate && event.class === "PRIVATE") {
+					// do not add the current event, skip it
+					continue;
+				}
+				if (limitNumberOfEntries) {
+					if (event.endDate < maxPastDaysCompare) {
+						continue;
+					}
+					if (this.config.hideOngoing && event.startDate < now) {
+						continue;
+					}
+					if (this.listContainsEvent(events, event)) {
+						continue;
+					}
+					if (--remainingEntries < 0) {
+						break;
+					}
+				}
+				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.
+				 */
+				const maxCount = Math.ceil((event.endDate - 1 - moment(event.startDate, "x").endOf("day").format("x")) / ONE_DAY) + 1;
+				if (this.config.sliceMultiDayEvents && maxCount > 1) {
+					const splitEvents = [];
+					let midnight = moment(event.startDate, "x").clone().startOf("day").add(1, "day").format("x");
+					let count = 1;
+					while (event.endDate > midnight) {
+						const thisEvent = JSON.parse(JSON.stringify(event)); // clone object
+						thisEvent.today = thisEvent.startDate >= today && thisEvent.startDate < today + ONE_DAY;
+						thisEvent.tomorrow = !thisEvent.today && thisEvent.startDate >= today + ONE_DAY && thisEvent.startDate < today + 2 * ONE_DAY;
+						thisEvent.endDate = midnight;
+						thisEvent.title += ` (${count}/${maxCount})`;
+						splitEvents.push(thisEvent);
+
+						event.startDate = midnight;
+						count += 1;
+						midnight = moment(midnight, "x").add(1, "day").format("x"); // next day
+					}
+					// Last day
+					event.title += ` (${count}/${maxCount})`;
+					event.today += event.startDate >= today && event.startDate < today + ONE_DAY;
+					event.tomorrow = !event.today && event.startDate >= today + ONE_DAY && event.startDate < today + 2 * ONE_DAY;
+					splitEvents.push(event);
+
+					for (let splitEvent of splitEvents) {
+						if (splitEvent.endDate > now && splitEvent.endDate <= future) {
+							events.push(splitEvent);
+						}
+					}
+				} else {
+					events.push(event);
+				}
+			}
+		}
+
+		events.sort(function (a, b) {
+			return a.startDate - b.startDate;
+		});
+
+		if (!limitNumberOfEntries) {
+			return events;
+		}
+
+		// Limit the number of days displayed
+		// If limitDays is set > 0, limit display to that number of days
+		if (this.config.limitDays > 0) {
+			let newEvents = [];
+			let lastDate = today.clone().subtract(1, "days").format("YYYYMMDD");
+			let days = 0;
+			for (const ev of events) {
+				let eventDate = moment(ev.startDate, "x").format("YYYYMMDD");
+				// if date of event is later than lastdate
+				// check if we already are showing max unique days
+				if (eventDate > lastDate) {
+					// if the only entry in the first day is a full day event that day is not counted as unique
+					if (!this.config.limitDaysNeverSkip && newEvents.length === 1 && days === 1 && newEvents[0].fullDayEvent) {
+						days--;
+					}
+					days++;
+					if (days > this.config.limitDays) {
+						continue;
+					} else {
+						lastDate = eventDate;
+					}
+				}
+				newEvents.push(ev);
+			}
+			events = newEvents;
+		}
+
+		return events.slice(0, this.config.maximumEntries);
+	},
+
+	listContainsEvent: function (eventList, event) {
+		for (const evt of eventList) {
+			if (evt.title === event.title && parseInt(evt.startDate) === parseInt(event.startDate)) {
+				return true;
+			}
+		}
+		return false;
+	},
+
+	/**
+	 * Requests node helper to add calendar url.
+	 * @param {string} url The calendar url to add
+	 * @param {object} auth The authentication method and credentials
+	 * @param {object} calendarConfig The config of the specific calendar
+	 */
+	addCalendar: function (url, auth, calendarConfig) {
+		this.sendSocketNotification("ADD_CALENDAR", {
+			id: this.identifier,
+			url: url,
+			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: calendarConfig.fetchInterval || this.config.fetchInterval,
+			symbolClass: calendarConfig.symbolClass,
+			titleClass: calendarConfig.titleClass,
+			timeClass: calendarConfig.timeClass,
+			auth: auth,
+			broadcastPastEvents: calendarConfig.broadcastPastEvents || this.config.broadcastPastEvents,
+			selfSignedCert: calendarConfig.selfSignedCert || this.config.selfSignedCert
+		});
+	},
+
+	/**
+	 * Retrieves the symbols for a specific event.
+	 * @param {object} event Event to look for.
+	 * @returns {string[]} The symbols
+	 */
+	symbolsForEvent: function (event) {
+		let symbols = this.getCalendarPropertyAsArray(event.url, "symbol", this.config.defaultSymbol);
+
+		if (event.recurringEvent === true && this.hasCalendarProperty(event.url, "recurringSymbol")) {
+			symbols = this.mergeUnique(this.getCalendarPropertyAsArray(event.url, "recurringSymbol", this.config.defaultSymbol), symbols);
+		}
+
+		if (event.fullDayEvent === true && this.hasCalendarProperty(event.url, "fullDaySymbol")) {
+			symbols = this.mergeUnique(this.getCalendarPropertyAsArray(event.url, "fullDaySymbol", this.config.defaultSymbol), symbols);
+		}
+
+		// If custom symbol is set, replace event symbol
+		for (let ev of this.config.customEvents) {
+			if (typeof ev.symbol !== "undefined" && ev.symbol !== "") {
+				let needle = new RegExp(ev.keyword, "gi");
+				if (needle.test(event.title)) {
+					// Get the default prefix for this class name and add to the custom symbol provided
+					const className = this.getCalendarProperty(event.url, "symbolClassName", this.config.defaultSymbolClassName);
+					symbols[0] = className + ev.symbol;
+					break;
+				}
+			}
+		}
+
+		return symbols;
+	},
+
+	mergeUnique: function (arr1, arr2) {
+		return arr1.concat(
+			arr2.filter(function (item) {
+				return arr1.indexOf(item) === -1;
+			})
+		);
+	},
+
+	/**
+	 * Retrieves the symbolClass for a specific calendar url.
+	 * @param {string} url The calendar url
+	 * @returns {string} The class to be used for the symbols of the calendar
+	 */
+	symbolClassForUrl: function (url) {
+		return this.getCalendarProperty(url, "symbolClass", "");
+	},
+
+	/**
+	 * Retrieves the titleClass for a specific calendar url.
+	 * @param {string} url The calendar url
+	 * @returns {string} The class to be used for the title of the calendar
+	 */
+	titleClassForUrl: function (url) {
+		return this.getCalendarProperty(url, "titleClass", "");
+	},
+
+	/**
+	 * Retrieves the timeClass for a specific calendar url.
+	 * @param {string} url The calendar url
+	 * @returns {string} The class to be used for the time of the calendar
+	 */
+	timeClassForUrl: function (url) {
+		return this.getCalendarProperty(url, "timeClass", "");
+	},
+
+	/**
+	 * Retrieves the calendar name for a specific calendar url.
+	 * @param {string} url The calendar url
+	 * @returns {string} The name of the calendar
+	 */
+	calendarNameForUrl: function (url) {
+		return this.getCalendarProperty(url, "name", "");
+	},
+
+	/**
+	 * Retrieves the color for a specific calendar url.
+	 * @param {string} url The calendar url
+	 * @param {boolean} isBg Determines if we fetch the bgColor or not
+	 * @returns {string} The color
+	 */
+	colorForUrl: function (url, isBg) {
+		return this.getCalendarProperty(url, isBg ? "bgColor" : "color", "#fff");
+	},
+
+	/**
+	 * Retrieves the count title for a specific calendar url.
+	 * @param {string} url The calendar url
+	 * @returns {string} The title
+	 */
+	countTitleForUrl: function (url) {
+		return this.getCalendarProperty(url, "repeatingCountTitle", this.config.defaultRepeatingCountTitle);
+	},
+
+	/**
+	 * Retrieves the maximum entry count for a specific calendar url.
+	 * @param {string} url The calendar url
+	 * @returns {number} The maximum entry count
+	 */
+	maximumEntriesForUrl: function (url) {
+		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.
+	 * @param {string} url The calendar url
+	 * @param {string} property The property to look for
+	 * @param {string} defaultValue The value if the property is not found
+	 * @returns {*} The property
+	 */
+	getCalendarProperty: function (url, property, defaultValue) {
+		for (const calendar of this.config.calendars) {
+			if (calendar.url === url && calendar.hasOwnProperty(property)) {
+				return calendar[property];
+			}
+		}
+
+		return defaultValue;
+	},
+
+	getCalendarPropertyAsArray: function (url, property, defaultValue) {
+		let p = this.getCalendarProperty(url, property, defaultValue);
+		if (property === "symbol" || property === "recurringSymbol" || property === "fullDaySymbol") {
+			const className = this.getCalendarProperty(url, "symbolClassName", this.config.defaultSymbolClassName);
+			p = className + p;
+		}
+
+		if (!(p instanceof Array)) p = [p];
+		return p;
+	},
+
+	hasCalendarProperty: function (url, property) {
+		return !!this.getCalendarProperty(url, property, undefined);
+	},
+
+	/**
+	 * Broadcasts the events to all other modules for reuse.
+	 * The all events available in one array, sorted on startdate.
+	 */
+	broadcastEvents: function () {
+		const eventList = this.createEventList(false);
+		for (const event of eventList) {
+			event.symbol = this.symbolsForEvent(event);
+			event.calendarName = this.calendarNameForUrl(event.url);
+			event.color = this.colorForUrl(event.url, false);
+			delete event.url;
+		}
+
+		this.sendNotification("CALENDAR_EVENTS", eventList);
+	}
+});

modules/default/calendar/calendarfetcher.js

@@ -0,0 +1,155 @@
+/* MagicMirror²
+ * Node Helper: Calendar - CalendarFetcher
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ */
+
+const https = require("https");
+const digest = require("digest-fetch");
+const ical = require("node-ical");
+const fetch = require("fetch");
+const Log = require("logger");
+const NodeHelper = require("node_helper");
+const CalendarFetcherUtils = require("./calendarfetcherutils");
+
+/**
+ *
+ * @param {string} url The url of the calendar to fetch
+ * @param {number} reloadInterval Time in ms the calendar is fetched again
+ * @param {string[]} excludedEvents An array of words / phrases from event titles that will be excluded from being shown.
+ * @param {number} maximumEntries The maximum number of events fetched.
+ * @param {number} maximumNumberOfDays The maximum number of days an event should be in the future.
+ * @param {object} auth The object containing options for authentication against the calendar.
+ * @param {boolean} includePastEvents If true events from the past maximumNumberOfDays will be fetched too
+ * @param {boolean} selfSignedCert If true, the server certificate is not verified against the list of supplied CAs.
+ * @class
+ */
+const CalendarFetcher = function (url, reloadInterval, excludedEvents, maximumEntries, maximumNumberOfDays, auth, includePastEvents, selfSignedCert) {
+	let reloadTimer = null;
+	let events = [];
+
+	let fetchFailedCallback = function () {};
+	let eventsReceivedCallback = function () {};
+
+	/**
+	 * Initiates calendar fetch.
+	 */
+	const fetchCalendar = () => {
+		clearTimeout(reloadTimer);
+		reloadTimer = null;
+		const nodeVersion = Number(process.version.match(/^v(\d+\.\d+)/)[1]);
+		let fetcher = null;
+		let httpsAgent = null;
+		let headers = {
+			"User-Agent": `Mozilla/5.0 (Node.js ${nodeVersion}) MagicMirror/${global.version}`
+		};
+
+		if (selfSignedCert) {
+			httpsAgent = new https.Agent({
+				rejectUnauthorized: false
+			});
+		}
+		if (auth) {
+			if (auth.method === "bearer") {
+				headers.Authorization = `Bearer ${auth.pass}`;
+			} else if (auth.method === "digest") {
+				fetcher = new digest(auth.user, auth.pass).fetch(url, { headers: headers, agent: httpsAgent });
+			} else {
+				headers.Authorization = `Basic ${Buffer.from(`${auth.user}:${auth.pass}`).toString("base64")}`;
+			}
+		}
+		if (fetcher === null) {
+			fetcher = fetch(url, { headers: headers, agent: httpsAgent });
+		}
+
+		fetcher
+			.then(NodeHelper.checkFetchStatus)
+			.then((response) => response.text())
+			.then((responseData) => {
+				let data = [];
+
+				try {
+					data = ical.parseICS(responseData);
+					Log.debug(`parsed data=${JSON.stringify(data)}`);
+					events = CalendarFetcherUtils.filterEvents(data, {
+						excludedEvents,
+						includePastEvents,
+						maximumEntries,
+						maximumNumberOfDays
+					});
+				} catch (error) {
+					fetchFailedCallback(this, error);
+					scheduleTimer();
+					return;
+				}
+				this.broadcastEvents();
+				scheduleTimer();
+			})
+			.catch((error) => {
+				fetchFailedCallback(this, error);
+				scheduleTimer();
+			});
+	};
+
+	/**
+	 * Schedule the timer for the next update.
+	 */
+	const scheduleTimer = function () {
+		clearTimeout(reloadTimer);
+		reloadTimer = setTimeout(function () {
+			fetchCalendar();
+		}, reloadInterval);
+	};
+
+	/* public methods */
+
+	/**
+	 * Initiate fetchCalendar();
+	 */
+	this.startFetch = function () {
+		fetchCalendar();
+	};
+
+	/**
+	 * Broadcast the existing events.
+	 */
+	this.broadcastEvents = function () {
+		Log.info(`Calendar-Fetcher: Broadcasting ${events.length} events.`);
+		eventsReceivedCallback(this);
+	};
+
+	/**
+	 * Sets the on success callback
+	 * @param {Function} callback The on success callback.
+	 */
+	this.onReceive = function (callback) {
+		eventsReceivedCallback = callback;
+	};
+
+	/**
+	 * Sets the on error callback
+	 * @param {Function} callback The on error callback.
+	 */
+	this.onError = function (callback) {
+		fetchFailedCallback = callback;
+	};
+
+	/**
+	 * Returns the url of this fetcher.
+	 * @returns {string} The url of this fetcher.
+	 */
+	this.url = function () {
+		return url;
+	};
+
+	/**
+	 * Returns current available events for this fetcher.
+	 * @returns {object[]} The current available events for this fetcher.
+	 */
+	this.events = function () {
+		return events;
+	};
+};
+
+module.exports = CalendarFetcher;

modules/default/calendar/calendarfetcherutils.js

@@ -0,0 +1,605 @@
+/* MagicMirror²
+ * Calendar Fetcher Util Methods
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ */
+
+/**
+ * @external Moment
+ */
+const path = require("path");
+const moment = require("moment");
+const zoneTable = require(path.join(__dirname, "windowsZones.json"));
+const Log = require("../../../js/logger");
+
+const CalendarFetcherUtils = {
+	/**
+	 * Calculate the time correction, either dst/std or full day in cases where
+	 * utc time is day before plus offset
+	 * @param {object} event the event which needs adjustment
+	 * @param {Date} date the date on which this event happens
+	 * @returns {number} the necessary adjustment in hours
+	 */
+	calculateTimezoneAdjustment: function (event, date) {
+		let adjustHours = 0;
+		// if a timezone was specified
+		if (!event.start.tz) {
+			Log.debug(" if no tz, guess based on now");
+			event.start.tz = moment.tz.guess();
+		}
+		Log.debug(`initial tz=${event.start.tz}`);
+
+		// if there is a start date specified
+		if (event.start.tz) {
+			// if this is a windows timezone
+			if (event.start.tz.includes(" ")) {
+				// use the lookup table to get theIANA name as moment and date don't know MS timezones
+				let tz = CalendarFetcherUtils.getIanaTZFromMS(event.start.tz);
+				Log.debug(`corrected TZ=${tz}`);
+				// watch out for unregistered windows timezone names
+				// if we had a successful lookup
+				if (tz) {
+					// change the timezone to the IANA name
+					event.start.tz = tz;
+					// Log.debug("corrected timezone="+event.start.tz)
+				}
+			}
+			Log.debug(`corrected tz=${event.start.tz}`);
+			let current_offset = 0; // offset  from TZ string or calculated
+			let mm = 0; // date with tz or offset
+			let start_offset = 0; // utc offset of created with tz
+			// if there is still an offset, lookup failed, use it
+			if (event.start.tz.startsWith("(")) {
+				const regex = /[+|-]\d*:\d*/;
+				const start_offsetString = event.start.tz.match(regex).toString().split(":");
+				let start_offset = parseInt(start_offsetString[0]);
+				start_offset *= event.start.tz[1] === "-" ? -1 : 1;
+				adjustHours = start_offset;
+				Log.debug(`defined offset=${start_offset} hours`);
+				current_offset = start_offset;
+				event.start.tz = "";
+				Log.debug(`ical offset=${current_offset} date=${date}`);
+				mm = moment(date);
+				let x = parseInt(moment(new Date()).utcOffset());
+				Log.debug(`net mins=${current_offset * 60 - x}`);
+
+				mm = mm.add(x - current_offset * 60, "minutes");
+				adjustHours = (current_offset * 60 - x) / 60;
+				event.start = mm.toDate();
+				Log.debug(`adjusted date=${event.start}`);
+			} else {
+				// get the start time in that timezone
+				let es = moment(event.start);
+				// check for start date prior to start of daylight changing date
+				if (es.format("YYYY") < 2007) {
+					es.set("year", 2013); // if so, use a closer date
+				}
+				Log.debug(`start date/time=${es.toDate()}`);
+				start_offset = moment.tz(es, event.start.tz).utcOffset();
+				Log.debug(`start offset=${start_offset}`);
+
+				Log.debug(`start date/time w tz =${moment.tz(moment(event.start), event.start.tz).toDate()}`);
+
+				// get the specified date in that timezone
+				mm = moment.tz(moment(date), event.start.tz);
+				Log.debug(`event date=${mm.toDate()}`);
+				current_offset = mm.utcOffset();
+			}
+			Log.debug(`event offset=${current_offset} hour=${mm.format("H")} event date=${mm.toDate()}`);
+
+			// if the offset is greater than 0, east of london
+			if (current_offset !== start_offset) {
+				// big offset
+				Log.debug("offset");
+				let h = parseInt(mm.format("H"));
+				// check if the event time is less than the offset
+				if (h > 0 && h < Math.abs(current_offset) / 60) {
+					// if so, rrule created a wrong date (utc day, oops, with utc yesterday adjusted time)
+					// we need to fix that
+					//adjustHours = 24;
+					// Log.debug("adjusting date")
+				}
+				//-300 > -240
+				//if (Math.abs(current_offset) > Math.abs(start_offset)){
+				if (current_offset > start_offset) {
+					adjustHours -= 1;
+					Log.debug("adjust down 1 hour dst change");
+					//} else if (Math.abs(current_offset) < Math.abs(start_offset)) {
+				} else if (current_offset < start_offset) {
+					adjustHours += 1;
+					Log.debug("adjust up 1 hour dst change");
+				}
+			}
+		}
+		Log.debug(`adjustHours=${adjustHours}`);
+		return adjustHours;
+	},
+
+	/**
+	 * Filter the events from ical according to the given config
+	 * @param {object} data the calendar data from ical
+	 * @param {object} config The configuration object
+	 * @returns {string[]} the filtered events
+	 */
+	filterEvents: function (data, config) {
+		const newEvents = [];
+
+		// limitFunction doesn't do much limiting, see comment re: the dates
+		// array in rrule section below as to why we need to do the filtering
+		// ourselves
+		const limitFunction = function (date, i) {
+			return true;
+		};
+
+		const eventDate = function (event, time) {
+			return CalendarFetcherUtils.isFullDayEvent(event) ? moment(event[time], "YYYYMMDD") : moment(new Date(event[time]));
+		};
+
+		Log.debug(`There are ${Object.entries(data).length} calendar entries.`);
+		Object.entries(data).forEach(([key, event]) => {
+			Log.debug("Processing entry...");
+			const now = new Date();
+			const today = moment().startOf("day").toDate();
+			const future = moment().startOf("day").add(config.maximumNumberOfDays, "days").subtract(1, "seconds").toDate(); // Subtract 1 second so that events that start on the middle of the night will not repeat.
+			let past = today;
+
+			if (config.includePastEvents) {
+				past = moment().startOf("day").subtract(config.maximumNumberOfDays, "days").toDate();
+			}
+
+			// FIXME: Ugly fix to solve the facebook birthday issue.
+			// Otherwise, the recurring events only show the birthday for next year.
+			let isFacebookBirthday = false;
+			if (typeof event.uid !== "undefined") {
+				if (event.uid.indexOf("@facebook.com") !== -1) {
+					isFacebookBirthday = true;
+				}
+			}
+
+			if (event.type === "VEVENT") {
+				Log.debug(`Event:\n${JSON.stringify(event)}`);
+				let startDate = eventDate(event, "start");
+				let endDate;
+
+				if (typeof event.end !== "undefined") {
+					endDate = eventDate(event, "end");
+				} else if (typeof event.duration !== "undefined") {
+					endDate = startDate.clone().add(moment.duration(event.duration));
+				} else {
+					if (!isFacebookBirthday) {
+						// make copy of start date, separate storage area
+						endDate = moment(startDate.format("x"), "x");
+					} else {
+						endDate = moment(startDate).add(1, "days");
+					}
+				}
+
+				Log.debug(`start: ${startDate.toDate()}`);
+				Log.debug(`end:: ${endDate.toDate()}`);
+
+				// Calculate the duration of the event for use with recurring events.
+				let duration = parseInt(endDate.format("x")) - parseInt(startDate.format("x"));
+				Log.debug(`duration: ${duration}`);
+
+				// FIXME: Since the parsed json object from node-ical comes with time information
+				// this check could be removed (?)
+				if (event.start.length === 8) {
+					startDate = startDate.startOf("day");
+				}
+
+				const title = CalendarFetcherUtils.getTitleFromEvent(event);
+				Log.debug(`title: ${title}`);
+
+				let excluded = false,
+					dateFilter = null;
+
+				for (let f in config.excludedEvents) {
+					let filter = config.excludedEvents[f],
+						testTitle = title.toLowerCase(),
+						until = null,
+						useRegex = false,
+						regexFlags = "g";
+
+					if (filter instanceof Object) {
+						if (typeof filter.until !== "undefined") {
+							until = filter.until;
+						}
+
+						if (typeof filter.regex !== "undefined") {
+							useRegex = filter.regex;
+						}
+
+						// If additional advanced filtering is added in, this section
+						// must remain last as we overwrite the filter object with the
+						// filterBy string
+						if (filter.caseSensitive) {
+							filter = filter.filterBy;
+							testTitle = title;
+						} else if (useRegex) {
+							filter = filter.filterBy;
+							testTitle = title;
+							regexFlags += "i";
+						} else {
+							filter = filter.filterBy.toLowerCase();
+						}
+					} else {
+						filter = filter.toLowerCase();
+					}
+
+					if (CalendarFetcherUtils.titleFilterApplies(testTitle, filter, useRegex, regexFlags)) {
+						if (until) {
+							dateFilter = until;
+						} else {
+							excluded = true;
+						}
+						break;
+					}
+				}
+
+				if (excluded) {
+					return;
+				}
+
+				const location = event.location || false;
+				const geo = event.geo || false;
+				const description = event.description || false;
+
+				if (typeof event.rrule !== "undefined" && event.rrule !== null && !isFacebookBirthday) {
+					const rule = event.rrule;
+					let addedEvents = 0;
+
+					const pastMoment = moment(past);
+					const futureMoment = moment(future);
+
+					// can cause problems with e.g. birthdays before 1900
+					if ((rule.options && rule.origOptions && rule.origOptions.dtstart && rule.origOptions.dtstart.getFullYear() < 1900) || (rule.options && rule.options.dtstart && rule.options.dtstart.getFullYear() < 1900)) {
+						rule.origOptions.dtstart.setYear(1900);
+						rule.options.dtstart.setYear(1900);
+					}
+
+					// For recurring events, get the set of start dates that fall within the range
+					// of dates we're looking for.
+					// kblankenship1989 - to fix issue #1798, converting all dates to locale time first, then converting back to UTC time
+					let pastLocal = 0;
+					let futureLocal = 0;
+					if (CalendarFetcherUtils.isFullDayEvent(event)) {
+						Log.debug("fullday");
+						// if full day event, only use the date part of the ranges
+						pastLocal = pastMoment.toDate();
+						futureLocal = futureMoment.toDate();
+
+						Log.debug(`pastLocal: ${pastLocal}`);
+						Log.debug(`futureLocal: ${futureLocal}`);
+					} else {
+						// if we want past events
+						if (config.includePastEvents) {
+							// use the calculated past time for the between from
+							pastLocal = pastMoment.toDate();
+						} else {
+							// otherwise use NOW.. cause we shouldn't use any before now
+							pastLocal = moment().toDate(); //now
+						}
+						futureLocal = futureMoment.toDate(); // future
+					}
+					Log.debug(`Search for recurring events between: ${pastLocal} and ${futureLocal}`);
+					const dates = rule.between(pastLocal, futureLocal, true, limitFunction);
+					Log.debug(`Title: ${event.summary}, with dates: ${JSON.stringify(dates)}`);
+					// The "dates" array contains the set of dates within our desired date range range that are valid
+					// for the recurrence rule. *However*, it's possible for us to have a specific recurrence that
+					// had its date changed from outside the range to inside the range.  For the time being,
+					// we'll handle this by adding *all* recurrence entries into the set of dates that we check,
+					// because the logic below will filter out any recurrences that don't actually belong within
+					// our display range.
+					// Would be great if there was a better way to handle this.
+					Log.debug(`event.recurrences: ${event.recurrences}`);
+					if (event.recurrences !== undefined) {
+						for (let r in event.recurrences) {
+							// Only add dates that weren't already in the range we added from the rrule so that
+							// we don"t double-add those events.
+							if (moment(new Date(r)).isBetween(pastMoment, futureMoment) !== true) {
+								dates.push(new Date(r));
+							}
+						}
+					}
+					// Loop through the set of date entries to see which recurrences should be added to our event list.
+					for (let d in dates) {
+						let date = dates[d];
+						// Remove the time information of each date by using its substring, using the following method:
+						// .toISOString().substring(0,10).
+						// since the date is given as ISOString with YYYY-MM-DDTHH:MM:SS.SSSZ
+						// (see https://momentjs.com/docs/#/displaying/as-iso-string/).
+						const dateKey = date.toISOString().substring(0, 10);
+						let curEvent = event;
+						let showRecurrence = true;
+
+						// Get the offset of today where we are processing
+						// This will be the correction, we need to apply.
+						let nowOffset = new Date().getTimezoneOffset();
+						// For full day events, the time might be off from RRULE/Luxon problem
+						// Get time zone offset of the rule calculated event
+						let dateoffset = date.getTimezoneOffset();
+
+						// Reduce the time by the following offset.
+						Log.debug(` recurring date is ${date} offset is ${dateoffset}`);
+
+						let dh = moment(date).format("HH");
+						Log.debug(` recurring date is ${date} offset is ${dateoffset / 60} Hour is ${dh}`);
+
+						if (CalendarFetcherUtils.isFullDayEvent(event)) {
+							Log.debug("Fullday");
+							// If the offset is negative (east of GMT), where the problem is
+							if (dateoffset < 0) {
+								if (dh < Math.abs(dateoffset / 60)) {
+									// if the rrule byweekday WAS explicitly set , correct it
+									// reduce the time by the offset
+									if (curEvent.rrule.origOptions.byweekday !== undefined) {
+										// Apply the correction to the date/time to get it UTC relative
+										date = new Date(date.getTime() - Math.abs(24 * 60) * 60000);
+									}
+									// the duration was calculated way back at the top before we could correct the start time..
+									// fix it for this event entry
+									//duration = 24 * 60 * 60 * 1000;
+									Log.debug(`new recurring date1 fulldate is ${date}`);
+								}
+							} else {
+								// if the timezones are the same, correct date if needed
+								//if (event.start.tz === moment.tz.guess()) {
+								// if the date hour is less than the offset
+								if (24 - dh <= Math.abs(dateoffset / 60)) {
+									// if the rrule byweekday WAS explicitly set , correct it
+									if (curEvent.rrule.origOptions.byweekday !== undefined) {
+										// apply the correction to the date/time back to right day
+										date = new Date(date.getTime() + Math.abs(24 * 60) * 60000);
+									}
+									// the duration was calculated way back at the top before we could correct the start time..
+									// fix it for this event entry
+									//duration = 24 * 60 * 60 * 1000;
+									Log.debug(`new recurring date2 fulldate is ${date}`);
+								}
+								//}
+							}
+						} else {
+							// not full day, but luxon can still screw up the date on the rule processing
+							// we need to correct the date to get back to the right event for
+							if (dateoffset < 0) {
+								// if the date hour is less than the offset
+								if (dh <= Math.abs(dateoffset / 60)) {
+									// if the rrule byweekday WAS explicitly set , correct it
+									if (curEvent.rrule.origOptions.byweekday !== undefined) {
+										// Reduce the time by t:
+										// Apply the correction to the date/time to get it UTC relative
+										date = new Date(date.getTime() - Math.abs(24 * 60) * 60000);
+									}
+									// the duration was calculated way back at the top before we could correct the start time..
+									// fix it for this event entry
+									//duration = 24 * 60 * 60 * 1000;
+									Log.debug(`new recurring date1 is ${date}`);
+								}
+							} else {
+								// if the timezones are the same, correct date if needed
+								//if (event.start.tz === moment.tz.guess()) {
+								// if the date hour is less than the offset
+								if (24 - dh <= Math.abs(dateoffset / 60)) {
+									// if the rrule byweekday WAS explicitly set , correct it
+									if (curEvent.rrule.origOptions.byweekday !== undefined) {
+										// apply the correction to the date/time back to right day
+										date = new Date(date.getTime() + Math.abs(24 * 60) * 60000);
+									}
+									// the duration was calculated way back at the top before we could correct the start time..
+									// fix it for this event entry
+									//duration = 24 * 60 * 60 * 1000;
+									Log.debug(`new recurring date2 is ${date}`);
+								}
+								//}
+							}
+						}
+						startDate = moment(date);
+						Log.debug(`Corrected startDate: ${startDate.toDate()}`);
+
+						let adjustDays = CalendarFetcherUtils.calculateTimezoneAdjustment(event, date);
+
+						// For each date that we're checking, it's possible that there is a recurrence override for that one day.
+						if (curEvent.recurrences !== undefined && curEvent.recurrences[dateKey] !== undefined) {
+							// We found an override, so for this recurrence, use a potentially different title, start date, and duration.
+							curEvent = curEvent.recurrences[dateKey];
+							startDate = moment(curEvent.start);
+							duration = parseInt(moment(curEvent.end).format("x")) - parseInt(startDate.format("x"));
+						}
+						// If there's no recurrence override, check for an exception date.  Exception dates represent exceptions to the rule.
+						else if (curEvent.exdate !== undefined && curEvent.exdate[dateKey] !== undefined) {
+							// This date is an exception date, which means we should skip it in the recurrence pattern.
+							showRecurrence = false;
+						}
+						Log.debug(`duration: ${duration}`);
+
+						endDate = moment(parseInt(startDate.format("x")) + duration, "x");
+						if (startDate.format("x") === endDate.format("x")) {
+							endDate = endDate.endOf("day");
+						}
+
+						const recurrenceTitle = CalendarFetcherUtils.getTitleFromEvent(curEvent);
+
+						// If this recurrence ends before the start of the date range, or starts after the end of the date range, don"t add
+						// it to the event list.
+						if (endDate.isBefore(past) || startDate.isAfter(future)) {
+							showRecurrence = false;
+						}
+
+						if (CalendarFetcherUtils.timeFilterApplies(now, endDate, dateFilter)) {
+							showRecurrence = false;
+						}
+
+						if (showRecurrence === true) {
+							Log.debug(`saving event: ${description}`);
+							addedEvents++;
+							newEvents.push({
+								title: recurrenceTitle,
+								startDate: (adjustDays ? (adjustDays > 0 ? startDate.add(adjustDays, "hours") : startDate.subtract(Math.abs(adjustDays), "hours")) : startDate).format("x"),
+								endDate: (adjustDays ? (adjustDays > 0 ? endDate.add(adjustDays, "hours") : endDate.subtract(Math.abs(adjustDays), "hours")) : endDate).format("x"),
+								fullDayEvent: CalendarFetcherUtils.isFullDayEvent(event),
+								recurringEvent: true,
+								class: event.class,
+								firstYear: event.start.getFullYear(),
+								location: location,
+								geo: geo,
+								description: description
+							});
+						}
+					}
+					// End recurring event parsing.
+				} else {
+					// Single event.
+					const fullDayEvent = isFacebookBirthday ? true : CalendarFetcherUtils.isFullDayEvent(event);
+					// Log.debug("full day event")
+
+					// if the start and end are the same, then make end the 'end of day' value (start is at 00:00:00)
+					if (fullDayEvent && startDate.format("x") === endDate.format("x")) {
+						endDate = endDate.endOf("day");
+					}
+
+					if (config.includePastEvents) {
+						// Past event is too far in the past, so skip.
+						if (endDate < past) {
+							return;
+						}
+					} else {
+						// It's not a fullday event, and it is in the past, so skip.
+						if (!fullDayEvent && endDate < new Date()) {
+							return;
+						}
+
+						// It's a fullday event, and it is before today, So skip.
+						if (fullDayEvent && endDate <= today) {
+							return;
+						}
+					}
+
+					// It exceeds the maximumNumberOfDays limit, so skip.
+					if (startDate > future) {
+						return;
+					}
+
+					if (CalendarFetcherUtils.timeFilterApplies(now, endDate, dateFilter)) {
+						return;
+					}
+
+					// get correction for date saving and dst change between now and then
+					let adjustDays = CalendarFetcherUtils.calculateTimezoneAdjustment(event, startDate.toDate());
+					// Every thing is good. Add it to the list.
+					newEvents.push({
+						title: title,
+						startDate: (adjustDays ? (adjustDays > 0 ? startDate.add(adjustDays, "hours") : startDate.subtract(Math.abs(adjustDays), "hours")) : startDate).format("x"),
+						endDate: (adjustDays ? (adjustDays > 0 ? endDate.add(adjustDays, "hours") : endDate.subtract(Math.abs(adjustDays), "hours")) : endDate).format("x"),
+						fullDayEvent: fullDayEvent,
+						class: event.class,
+						location: location,
+						geo: geo,
+						description: description
+					});
+				}
+			}
+		});
+
+		newEvents.sort(function (a, b) {
+			return a.startDate - b.startDate;
+		});
+
+		return newEvents;
+	},
+
+	/**
+	 * Lookup iana tz from windows
+	 * @param {string} msTZName the timezone name to lookup
+	 * @returns {string|null} the iana name or null of none is found
+	 */
+	getIanaTZFromMS: function (msTZName) {
+		// Get hash entry
+		const he = zoneTable[msTZName];
+		// If found return iana name, else null
+		return he ? he.iana[0] : null;
+	},
+
+	/**
+	 * Gets the title from the event.
+	 * @param {object} event The event object to check.
+	 * @returns {string} The title of the event, or "Event" if no title is found.
+	 */
+	getTitleFromEvent: function (event) {
+		let title = "Event";
+		if (event.summary) {
+			title = typeof event.summary.val !== "undefined" ? event.summary.val : event.summary;
+		} else if (event.description) {
+			title = event.description;
+		}
+
+		return title;
+	},
+
+	/**
+	 * Checks if an event is a fullday event.
+	 * @param {object} event The event object to check.
+	 * @returns {boolean} True if the event is a fullday event, false otherwise
+	 */
+	isFullDayEvent: function (event) {
+		if (event.start.length === 8 || event.start.dateOnly || event.datetype === "date") {
+			return true;
+		}
+
+		const start = event.start || 0;
+		const startDate = new Date(start);
+		const end = event.end || 0;
+		if ((end - start) % (24 * 60 * 60 * 1000) === 0 && startDate.getHours() === 0 && startDate.getMinutes() === 0) {
+			// Is 24 hours, and starts on the middle of the night.
+			return true;
+		}
+
+		return false;
+	},
+
+	/**
+	 * Determines if the user defined time filter should apply
+	 * @param {Date} now Date object using previously created object for consistency
+	 * @param {Moment} endDate Moment object representing the event end date
+	 * @param {string} filter The time to subtract from the end date to determine if an event should be shown
+	 * @returns {boolean} True if the event should be filtered out, false otherwise
+	 */
+	timeFilterApplies: function (now, endDate, filter) {
+		if (filter) {
+			const until = filter.split(" "),
+				value = parseInt(until[0]),
+				increment = until[1].slice(-1) === "s" ? until[1] : `${until[1]}s`, // Massage the data for moment js
+				filterUntil = moment(endDate.format()).subtract(value, increment);
+
+			return now < filterUntil.format("x");
+		}
+
+		return false;
+	},
+
+	/**
+	 * Determines if the user defined title filter should apply
+	 * @param {string} title the title of the event
+	 * @param {string} filter the string to look for, can be a regex also
+	 * @param {boolean} useRegex true if a regex should be used, otherwise it just looks for the filter as a string
+	 * @param {string} regexFlags flags that should be applied to the regex
+	 * @returns {boolean} True if the title should be filtered out, false otherwise
+	 */
+	titleFilterApplies: function (title, filter, useRegex, regexFlags) {
+		if (useRegex) {
+			let regexFilter = filter;
+			// Assume if leading slash, there is also trailing slash
+			if (filter[0] === "/") {
+				// Strip leading and trailing slashes
+				regexFilter = filter.substr(1).slice(0, -1);
+			}
+			return new RegExp(regexFilter, regexFlags).test(title);
+		} else {
+			return title.includes(filter);
+		}
+	}
+};
+
+if (typeof module !== "undefined") {
+	module.exports = CalendarFetcherUtils;
+}

modules/default/calendar/calendarutils.js

@@ -0,0 +1,117 @@
+/* MagicMirror²
+ * Calendar Util Methods
+ *
+ * By Rejas
+ * MIT Licensed.
+ */
+const CalendarUtils = {
+	/**
+	 * Capitalize the first letter of a string
+	 * @param {string} string The string to capitalize
+	 * @returns {string} The capitalized string
+	 */
+	capFirst: function (string) {
+		return string.charAt(0).toUpperCase() + string.slice(1);
+	},
+
+	/**
+	 * This function accepts a number (either 12 or 24) and returns a moment.js LocaleSpecification with the
+	 * corresponding time-format to be used in the calendar display. If no number is given (or otherwise invalid input)
+	 * it will a localeSpecification object with the system locale time format.
+	 * @param {number} timeFormat Specifies either 12 or 24-hour time format
+	 * @returns {moment.LocaleSpecification} formatted time
+	 */
+	getLocaleSpecification: function (timeFormat) {
+		switch (timeFormat) {
+			case 12: {
+				return { longDateFormat: { LT: "h:mm A" } };
+			}
+			case 24: {
+				return { longDateFormat: { LT: "HH:mm" } };
+			}
+			default: {
+				return { longDateFormat: { LT: moment.localeData().longDateFormat("LT") } };
+			}
+		}
+	},
+
+	/**
+	 * Shortens a string if it's longer than maxLength and add an ellipsis to the end
+	 * @param {string} string Text string to shorten
+	 * @param {number} maxLength The max length of the string
+	 * @param {boolean} wrapEvents Wrap the text after the line has reached maxLength
+	 * @param {number} maxTitleLines The max number of vertical lines before cutting event title
+	 * @returns {string} The shortened string
+	 */
+	shorten: function (string, maxLength, wrapEvents, maxTitleLines) {
+		if (typeof string !== "string") {
+			return "";
+		}
+
+		if (wrapEvents === true) {
+			const words = string.split(" ");
+			let temp = "";
+			let currentLine = "";
+			let line = 0;
+
+			for (let i = 0; i < words.length; i++) {
+				const word = words[i];
+				if (currentLine.length + word.length < (typeof maxLength === "number" ? maxLength : 25) - 1) {
+					// max - 1 to account for a space
+					currentLine += `${word} `;
+				} else {
+					line++;
+					if (line > maxTitleLines - 1) {
+						if (i < words.length) {
+							currentLine += "…";
+						}
+						break;
+					}
+
+					if (currentLine.length > 0) {
+						temp += `${currentLine}<br>${word} `;
+					} else {
+						temp += `${word}<br>`;
+					}
+					currentLine = "";
+				}
+			}
+
+			return (temp + currentLine).trim();
+		} else {
+			if (maxLength && typeof maxLength === "number" && string.length > maxLength) {
+				return `${string.trim().slice(0, maxLength)}…`;
+			} else {
+				return string.trim();
+			}
+		}
+	},
+
+	/**
+	 * Transforms the title of an event for usage.
+	 * Replaces parts of the text as defined in config.titleReplace.
+	 * Shortens title based on config.maxTitleLength and config.wrapEvents
+	 * @param {string} title The title to transform.
+	 * @param {object} titleReplace Pairs of strings to be replaced in the title
+	 * @returns {string} The transformed title.
+	 */
+	titleTransform: function (title, titleReplace) {
+		let transformedTitle = title;
+		for (let needle in titleReplace) {
+			const replacement = titleReplace[needle];
+
+			const regParts = needle.match(/^\/(.+)\/([gim]*)$/);
+			if (regParts) {
+				// the parsed pattern is a regexp.
+				needle = new RegExp(regParts[1], regParts[2]);
+			}
+
+			transformedTitle = transformedTitle.replace(needle, replacement);
+		}
+		return transformedTitle;
+	}
+};
+
+if (typeof module !== "undefined") {
+	module.exports = CalendarUtils;
+}

modules/default/calendar/debug.js

@@ -0,0 +1,43 @@
+/* CalendarFetcher Tester
+ * use this script with `node debug.js` to test the fetcher without the need
+ * of starting the MagicMirror² core. Adjust the values below to your desire.
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ */
+// Alias modules mentioned in package.js under _moduleAliases.
+require("module-alias/register");
+
+const CalendarFetcher = require("./calendarfetcher");
+
+const url = "https://calendar.google.com/calendar/ical/pkm1t2uedjbp0uvq1o7oj1jouo%40group.calendar.google.com/private-08ba559f89eec70dd74bbd887d0a3598/basic.ics"; // Standard test URL
+//const url = "https://www.googleapis.com/calendar/v3/calendars/primary/events/"; // URL for Bearer auth (must be configured  in Google OAuth2 first)
+const fetchInterval = 60 * 60 * 1000;
+const maximumEntries = 10;
+const maximumNumberOfDays = 365;
+const user = "magicmirror";
+const pass = "MyStrongPass";
+const auth = {
+	user: user,
+	pass: pass
+};
+
+console.log("Create fetcher ...");
+
+const fetcher = new CalendarFetcher(url, fetchInterval, [], maximumEntries, maximumNumberOfDays, auth);
+
+fetcher.onReceive(function (fetcher) {
+	console.log(fetcher.events());
+	console.log("------------------------------------------------------------");
+	process.exit(0);
+});
+
+fetcher.onError(function (fetcher, error) {
+	console.log("Fetcher error:");
+	console.log(error);
+	process.exit(1);
+});
+
+fetcher.startFetch();
+
+console.log("Create fetcher done! ");

modules/default/calendar/node_helper.js

@@ -0,0 +1,95 @@
+/* MagicMirror²
+ * Node Helper: Calendar
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ */
+const NodeHelper = require("node_helper");
+const Log = require("logger");
+const CalendarFetcher = require("./calendarfetcher");
+
+module.exports = NodeHelper.create({
+	// Override start method.
+	start: function () {
+		Log.log(`Starting node helper for: ${this.name}`);
+		this.fetchers = [];
+	},
+
+	// Override socketNotificationReceived method.
+	socketNotificationReceived: function (notification, payload) {
+		if (notification === "ADD_CALENDAR") {
+			this.createFetcher(payload.url, payload.fetchInterval, payload.excludedEvents, payload.maximumEntries, payload.maximumNumberOfDays, payload.auth, payload.broadcastPastEvents, payload.selfSignedCert, payload.id);
+		} else if (notification === "FETCH_CALENDAR") {
+			const key = payload.id + payload.url;
+			if (typeof this.fetchers[key] === "undefined") {
+				Log.error("Calendar Error. No fetcher exists with key: ", key);
+				this.sendSocketNotification("CALENDAR_ERROR", { error_type: "MODULE_ERROR_UNSPECIFIED" });
+				return;
+			}
+			this.fetchers[key].startFetch();
+		}
+	},
+
+	/**
+	 * Creates a fetcher for a new url if it doesn't exist yet.
+	 * Otherwise it reuses the existing one.
+	 * @param {string} url The url of the calendar
+	 * @param {number} fetchInterval How often does the calendar needs to be fetched in ms
+	 * @param {string[]} excludedEvents An array of words / phrases from event titles that will be excluded from being shown.
+	 * @param {number} maximumEntries The maximum number of events fetched.
+	 * @param {number} maximumNumberOfDays The maximum number of days an event should be in the future.
+	 * @param {object} auth The object containing options for authentication against the calendar.
+	 * @param {boolean} broadcastPastEvents If true events from the past maximumNumberOfDays will be included in event broadcasts
+	 * @param {boolean} selfSignedCert If true, the server certificate is not verified against the list of supplied CAs.
+	 * @param {string} identifier ID of the module
+	 */
+	createFetcher: function (url, fetchInterval, excludedEvents, maximumEntries, maximumNumberOfDays, auth, broadcastPastEvents, selfSignedCert, identifier) {
+		try {
+			new URL(url);
+		} catch (error) {
+			Log.error("Calendar Error. Malformed calendar url: ", url, error);
+			this.sendSocketNotification("CALENDAR_ERROR", { error_type: "MODULE_ERROR_MALFORMED_URL" });
+			return;
+		}
+
+		let fetcher;
+		if (typeof this.fetchers[identifier + url] === "undefined") {
+			Log.log(`Create new calendarfetcher for url: ${url} - Interval: ${fetchInterval}`);
+			fetcher = new CalendarFetcher(url, fetchInterval, excludedEvents, maximumEntries, maximumNumberOfDays, auth, broadcastPastEvents, selfSignedCert);
+
+			fetcher.onReceive((fetcher) => {
+				this.broadcastEvents(fetcher, identifier);
+			});
+
+			fetcher.onError((fetcher, error) => {
+				Log.error("Calendar Error. Could not fetch calendar: ", fetcher.url(), error);
+				let error_type = NodeHelper.checkFetchError(error);
+				this.sendSocketNotification("CALENDAR_ERROR", {
+					id: identifier,
+					error_type
+				});
+			});
+
+			this.fetchers[identifier + url] = fetcher;
+		} else {
+			Log.log(`Use existing calendarfetcher for url: ${url}`);
+			fetcher = this.fetchers[identifier + url];
+			fetcher.broadcastEvents();
+		}
+
+		fetcher.startFetch();
+	},
+
+	/**
+	 *
+	 * @param {object} fetcher the fetcher associated with the calendar
+	 * @param {string} identifier the identifier of the calendar
+	 */
+	broadcastEvents: function (fetcher, identifier) {
+		this.sendSocketNotification("CALENDAR_EVENTS", {
+			id: identifier,
+			url: fetcher.url(),
+			events: fetcher.events()
+		});
+	}
+});

modules/default/calendar/windowsZones.json

@@ -0,0 +1,237 @@
+{
+	"Dateline Standard Time": { "iana": ["Etc/GMT+12"] },
+	"UTC-11": { "iana": ["Etc/GMT+11"] },
+	"Aleutian Standard Time": { "iana": ["America/Adak"] },
+	"Hawaiian Standard Time": { "iana": ["Pacific/Honolulu"] },
+	"Marquesas Standard Time": { "iana": ["Pacific/Marquesas"] },
+	"Alaskan Standard Time": { "iana": ["America/Anchorage"] },
+	"UTC-09": { "iana": ["Etc/GMT+9"] },
+	"Pacific Standard Time (Mexico)": { "iana": ["America/Tijuana"] },
+	"UTC-08": { "iana": ["Etc/GMT+8"] },
+	"Pacific Standard Time": { "iana": ["America/Los_Angeles"] },
+	"US Mountain Standard Time": { "iana": ["America/Phoenix"] },
+	"Mountain Standard Time (Mexico)": { "iana": ["America/Chihuahua"] },
+	"Mountain Standard Time": { "iana": ["America/Denver"] },
+	"Central America Standard Time": { "iana": ["America/Guatemala"] },
+	"Central Standard Time": { "iana": ["America/Chicago"] },
+	"Easter Island Standard Time": { "iana": ["Pacific/Easter"] },
+	"Central Standard Time (Mexico)": { "iana": ["America/Mexico_City"] },
+	"Canada Central Standard Time": { "iana": ["America/Regina"] },
+	"SA Pacific Standard Time": { "iana": ["America/Bogota"] },
+	"Eastern Standard Time (Mexico)": { "iana": ["America/Cancun"] },
+	"Eastern Standard Time": { "iana": ["America/New_York"] },
+	"Haiti Standard Time": { "iana": ["America/Port-au-Prince"] },
+	"Cuba Standard Time": { "iana": ["America/Havana"] },
+	"US Eastern Standard Time": { "iana": ["America/Indianapolis"] },
+	"Turks And Caicos Standard Time": { "iana": ["America/Grand_Turk"] },
+	"Paraguay Standard Time": { "iana": ["America/Asuncion"] },
+	"Atlantic Standard Time": { "iana": ["America/Halifax"] },
+	"Venezuela Standard Time": { "iana": ["America/Caracas"] },
+	"Central Brazilian Standard Time": { "iana": ["America/Cuiaba"] },
+	"SA Western Standard Time": { "iana": ["America/La_Paz"] },
+	"Pacific SA Standard Time": { "iana": ["America/Santiago"] },
+	"Newfoundland Standard Time": { "iana": ["America/St_Johns"] },
+	"Tocantins Standard Time": { "iana": ["America/Araguaina"] },
+	"E. South America Standard Time": { "iana": ["America/Sao_Paulo"] },
+	"SA Eastern Standard Time": { "iana": ["America/Cayenne"] },
+	"Argentina Standard Time": { "iana": ["America/Buenos_Aires"] },
+	"Greenland Standard Time": { "iana": ["America/Godthab"] },
+	"Montevideo Standard Time": { "iana": ["America/Montevideo"] },
+	"Magallanes Standard Time": { "iana": ["America/Punta_Arenas"] },
+	"Saint Pierre Standard Time": { "iana": ["America/Miquelon"] },
+	"Bahia Standard Time": { "iana": ["America/Bahia"] },
+	"UTC-02": { "iana": ["Etc/GMT+2"] },
+	"Azores Standard Time": { "iana": ["Atlantic/Azores"] },
+	"Cape Verde Standard Time": { "iana": ["Atlantic/Cape_Verde"] },
+	"UTC": { "iana": ["Etc/GMT"] },
+	"GMT Standard Time": { "iana": ["Europe/London"] },
+	"Greenwich Standard Time": { "iana": ["Atlantic/Reykjavik"] },
+	"Sao Tome Standard Time": { "iana": ["Africa/Sao_Tome"] },
+	"Morocco Standard Time": { "iana": ["Africa/Casablanca"] },
+	"W. Europe Standard Time": { "iana": ["Europe/Berlin"] },
+	"Central Europe Standard Time": { "iana": ["Europe/Budapest"] },
+	"Romance Standard Time": { "iana": ["Europe/Paris"] },
+	"Central European Standard Time": { "iana": ["Europe/Warsaw"] },
+	"W. Central Africa Standard Time": { "iana": ["Africa/Lagos"] },
+	"Jordan Standard Time": { "iana": ["Asia/Amman"] },
+	"GTB Standard Time": { "iana": ["Europe/Bucharest"] },
+	"Middle East Standard Time": { "iana": ["Asia/Beirut"] },
+	"Egypt Standard Time": { "iana": ["Africa/Cairo"] },
+	"E. Europe Standard Time": { "iana": ["Europe/Chisinau"] },
+	"Syria Standard Time": { "iana": ["Asia/Damascus"] },
+	"West Bank Standard Time": { "iana": ["Asia/Hebron"] },
+	"South Africa Standard Time": { "iana": ["Africa/Johannesburg"] },
+	"FLE Standard Time": { "iana": ["Europe/Kiev"] },
+	"Israel Standard Time": { "iana": ["Asia/Jerusalem"] },
+	"Kaliningrad Standard Time": { "iana": ["Europe/Kaliningrad"] },
+	"Sudan Standard Time": { "iana": ["Africa/Khartoum"] },
+	"Libya Standard Time": { "iana": ["Africa/Tripoli"] },
+	"Namibia Standard Time": { "iana": ["Africa/Windhoek"] },
+	"Arabic Standard Time": { "iana": ["Asia/Baghdad"] },
+	"Turkey Standard Time": { "iana": ["Europe/Istanbul"] },
+	"Arab Standard Time": { "iana": ["Asia/Riyadh"] },
+	"Belarus Standard Time": { "iana": ["Europe/Minsk"] },
+	"Russian Standard Time": { "iana": ["Europe/Moscow"] },
+	"E. Africa Standard Time": { "iana": ["Africa/Nairobi"] },
+	"Iran Standard Time": { "iana": ["Asia/Tehran"] },
+	"Arabian Standard Time": { "iana": ["Asia/Dubai"] },
+	"Astrakhan Standard Time": { "iana": ["Europe/Astrakhan"] },
+	"Azerbaijan Standard Time": { "iana": ["Asia/Baku"] },
+	"Russia Time Zone 3": { "iana": ["Europe/Samara"] },
+	"Mauritius Standard Time": { "iana": ["Indian/Mauritius"] },
+	"Saratov Standard Time": { "iana": ["Europe/Saratov"] },
+	"Georgian Standard Time": { "iana": ["Asia/Tbilisi"] },
+	"Volgograd Standard Time": { "iana": ["Europe/Volgograd"] },
+	"Caucasus Standard Time": { "iana": ["Asia/Yerevan"] },
+	"Afghanistan Standard Time": { "iana": ["Asia/Kabul"] },
+	"West Asia Standard Time": { "iana": ["Asia/Tashkent"] },
+	"Ekaterinburg Standard Time": { "iana": ["Asia/Yekaterinburg"] },
+	"Pakistan Standard Time": { "iana": ["Asia/Karachi"] },
+	"Qyzylorda Standard Time": { "iana": ["Asia/Qyzylorda"] },
+	"India Standard Time": { "iana": ["Asia/Calcutta"] },
+	"Sri Lanka Standard Time": { "iana": ["Asia/Colombo"] },
+	"Nepal Standard Time": { "iana": ["Asia/Katmandu"] },
+	"Central Asia Standard Time": { "iana": ["Asia/Almaty"] },
+	"Bangladesh Standard Time": { "iana": ["Asia/Dhaka"] },
+	"Omsk Standard Time": { "iana": ["Asia/Omsk"] },
+	"Myanmar Standard Time": { "iana": ["Asia/Rangoon"] },
+	"SE Asia Standard Time": { "iana": ["Asia/Bangkok"] },
+	"Altai Standard Time": { "iana": ["Asia/Barnaul"] },
+	"W. Mongolia Standard Time": { "iana": ["Asia/Hovd"] },
+	"North Asia Standard Time": { "iana": ["Asia/Krasnoyarsk"] },
+	"N. Central Asia Standard Time": { "iana": ["Asia/Novosibirsk"] },
+	"Tomsk Standard Time": { "iana": ["Asia/Tomsk"] },
+	"China Standard Time": { "iana": ["Asia/Shanghai"] },
+	"North Asia East Standard Time": { "iana": ["Asia/Irkutsk"] },
+	"Singapore Standard Time": { "iana": ["Asia/Singapore"] },
+	"W. Australia Standard Time": { "iana": ["Australia/Perth"] },
+	"Taipei Standard Time": { "iana": ["Asia/Taipei"] },
+	"Ulaanbaatar Standard Time": { "iana": ["Asia/Ulaanbaatar"] },
+	"Aus Central W. Standard Time": { "iana": ["Australia/Eucla"] },
+	"Transbaikal Standard Time": { "iana": ["Asia/Chita"] },
+	"Tokyo Standard Time": { "iana": ["Asia/Tokyo"] },
+	"North Korea Standard Time": { "iana": ["Asia/Pyongyang"] },
+	"Korea Standard Time": { "iana": ["Asia/Seoul"] },
+	"Yakutsk Standard Time": { "iana": ["Asia/Yakutsk"] },
+	"Cen. Australia Standard Time": { "iana": ["Australia/Adelaide"] },
+	"AUS Central Standard Time": { "iana": ["Australia/Darwin"] },
+	"E. Australia Standard Time": { "iana": ["Australia/Brisbane"] },
+	"AUS Eastern Standard Time": { "iana": ["Australia/Sydney"] },
+	"West Pacific Standard Time": { "iana": ["Pacific/Port_Moresby"] },
+	"Tasmania Standard Time": { "iana": ["Australia/Hobart"] },
+	"Vladivostok Standard Time": { "iana": ["Asia/Vladivostok"] },
+	"Lord Howe Standard Time": { "iana": ["Australia/Lord_Howe"] },
+	"Bougainville Standard Time": { "iana": ["Pacific/Bougainville"] },
+	"Russia Time Zone 10": { "iana": ["Asia/Srednekolymsk"] },
+	"Magadan Standard Time": { "iana": ["Asia/Magadan"] },
+	"Norfolk Standard Time": { "iana": ["Pacific/Norfolk"] },
+	"Sakhalin Standard Time": { "iana": ["Asia/Sakhalin"] },
+	"Central Pacific Standard Time": { "iana": ["Pacific/Guadalcanal"] },
+	"Russia Time Zone 11": { "iana": ["Asia/Kamchatka"] },
+	"New Zealand Standard Time": { "iana": ["Pacific/Auckland"] },
+	"UTC+12": { "iana": ["Etc/GMT-12"] },
+	"Fiji Standard Time": { "iana": ["Pacific/Fiji"] },
+	"Chatham Islands Standard Time": { "iana": ["Pacific/Chatham"] },
+	"UTC+13": { "iana": ["Etc/GMT-13"] },
+	"Tonga Standard Time": { "iana": ["Pacific/Tongatapu"] },
+	"Samoa Standard Time": { "iana": ["Pacific/Apia"] },
+	"Line Islands Standard Time": { "iana": ["Pacific/Kiritimati"] },
+	"(UTC-12:00) International Date Line West": { "iana": ["Etc/GMT+12"] },
+	"(UTC-11:00) Midway Island, Samoa": { "iana": ["Pacific/Apia"] },
+	"(UTC-10:00) Hawaii": { "iana": ["Pacific/Honolulu"] },
+	"(UTC-09:00) Alaska": { "iana": ["America/Anchorage"] },
+	"(UTC-08:00) Pacific Time (US & Canada); Tijuana": { "iana": ["America/Los_Angeles"] },
+	"(UTC-08:00) Pacific Time (US and Canada); Tijuana": { "iana": ["America/Los_Angeles"] },
+	"(UTC-07:00) Mountain Time (US & Canada)": { "iana": ["America/Denver"] },
+	"(UTC-07:00) Mountain Time (US and Canada)": { "iana": ["America/Denver"] },
+	"(UTC-07:00) Chihuahua, La Paz, Mazatlan": { "iana": [null] },
+	"(UTC-07:00) Arizona": { "iana": ["America/Phoenix"] },
+	"(UTC-06:00) Central Time (US & Canada)": { "iana": ["America/Chicago"] },
+	"(UTC-06:00) Central Time (US and Canada)": { "iana": ["America/Chicago"] },
+	"(UTC-06:00) Saskatchewan": { "iana": ["America/Regina"] },
+	"(UTC-06:00) Guadalajara, Mexico City, Monterrey": { "iana": [null] },
+	"(UTC-06:00) Central America": { "iana": ["America/Guatemala"] },
+	"(UTC-05:00) Eastern Time (US & Canada)": { "iana": ["America/New_York"] },
+	"(UTC-05:00) Eastern Time (US and Canada)": { "iana": ["America/New_York"] },
+	"(UTC-05:00) Indiana (East)": { "iana": ["America/Indianapolis"] },
+	"(UTC-05:00) Bogota, Lima, Quito": { "iana": ["America/Bogota"] },
+	"(UTC-04:00) Atlantic Time (Canada)": { "iana": ["America/Halifax"] },
+	"(UTC-04:00) Georgetown, La Paz, San Juan": { "iana": ["America/La_Paz"] },
+	"(UTC-04:00) Santiago": { "iana": ["America/Santiago"] },
+	"(UTC-03:30) Newfoundland": { "iana": [null] },
+	"(UTC-03:00) Brasilia": { "iana": ["America/Sao_Paulo"] },
+	"(UTC-03:00) Georgetown": { "iana": ["America/Cayenne"] },
+	"(UTC-03:00) Greenland": { "iana": ["America/Godthab"] },
+	"(UTC-02:00) Mid-Atlantic": { "iana": [null] },
+	"(UTC-01:00) Azores": { "iana": ["Atlantic/Azores"] },
+	"(UTC-01:00) Cape Verde Islands": { "iana": ["Atlantic/Cape_Verde"] },
+	"(UTC) Greenwich Mean Time: Dublin, Edinburgh, Lisbon, London": { "iana": [null] },
+	"(UTC) Monrovia, Reykjavik": { "iana": ["Atlantic/Reykjavik"] },
+	"(UTC+01:00) Belgrade, Bratislava, Budapest, Ljubljana, Prague": { "iana": ["Europe/Budapest"] },
+	"(UTC+01:00) Sarajevo, Skopje, Warsaw, Zagreb": { "iana": ["Europe/Warsaw"] },
+	"(UTC+01:00) Brussels, Copenhagen, Madrid, Paris": { "iana": ["Europe/Paris"] },
+	"(UTC+01:00) Amsterdam, Berlin, Bern, Rome, Stockholm, Vienna": { "iana": ["Europe/Berlin"] },
+	"(UTC+01:00) West Central Africa": { "iana": ["Africa/Lagos"] },
+	"(UTC+02:00) Minsk": { "iana": ["Europe/Chisinau"] },
+	"(UTC+02:00) Cairo": { "iana": ["Africa/Cairo"] },
+	"(UTC+02:00) Helsinki, Kiev, Riga, Sofia, Tallinn, Vilnius": { "iana": ["Europe/Kiev"] },
+	"(UTC+02:00) Athens, Bucharest, Istanbul": { "iana": ["Europe/Bucharest"] },
+	"(UTC+02:00) Jerusalem": { "iana": ["Asia/Jerusalem"] },
+	"(UTC+02:00) Harare, Pretoria": { "iana": ["Africa/Johannesburg"] },
+	"(UTC+03:00) Moscow, St. Petersburg, Volgograd": { "iana": ["Europe/Moscow"] },
+	"(UTC+03:00) Kuwait, Riyadh": { "iana": ["Asia/Riyadh"] },
+	"(UTC+03:00) Nairobi": { "iana": ["Africa/Nairobi"] },
+	"(UTC+03:00) Baghdad": { "iana": ["Asia/Baghdad"] },
+	"(UTC+03:30) Tehran": { "iana": ["Asia/Tehran"] },
+	"(UTC+04:00) Abu Dhabi, Muscat": { "iana": ["Asia/Dubai"] },
+	"(UTC+04:00) Baku, Tbilisi, Yerevan": { "iana": ["Asia/Yerevan"] },
+	"(UTC+04:30) Kabul": { "iana": [null] },
+	"(UTC+05:00) Ekaterinburg": { "iana": ["Asia/Yekaterinburg"] },
+	"(UTC+05:00) Tashkent": { "iana": ["Asia/Tashkent"] },
+	"(UTC+05:30) Chennai, Kolkata, Mumbai, New Delhi": { "iana": ["Asia/Calcutta"] },
+	"(UTC+05:45) Kathmandu": { "iana": ["Asia/Katmandu"] },
+	"(UTC+06:00) Astana, Dhaka": { "iana": ["Asia/Almaty"] },
+	"(UTC+06:00) Sri Jayawardenepura": { "iana": ["Asia/Colombo"] },
+	"(UTC+06:00) Almaty, Novosibirsk": { "iana": ["Asia/Novosibirsk"] },
+	"(UTC+06:30) Yangon (Rangoon)": { "iana": ["Asia/Rangoon"] },
+	"(UTC+07:00) Bangkok, Hanoi, Jakarta": { "iana": ["Asia/Bangkok"] },
+	"(UTC+07:00) Krasnoyarsk": { "iana": ["Asia/Krasnoyarsk"] },
+	"(UTC+08:00) Beijing, Chongqing, Hong Kong, Urumqi": { "iana": ["Asia/Shanghai"] },
+	"(UTC+08:00) Kuala Lumpur, Singapore": { "iana": ["Asia/Singapore"] },
+	"(UTC+08:00) Taipei": { "iana": ["Asia/Taipei"] },
+	"(UTC+08:00) Perth": { "iana": ["Australia/Perth"] },
+	"(UTC+08:00) Irkutsk, Ulaanbaatar": { "iana": ["Asia/Irkutsk"] },
+	"(UTC+09:00) Seoul": { "iana": ["Asia/Seoul"] },
+	"(UTC+09:00) Osaka, Sapporo, Tokyo": { "iana": ["Asia/Tokyo"] },
+	"(UTC+09:00) Yakutsk": { "iana": ["Asia/Yakutsk"] },
+	"(UTC+09:30) Darwin": { "iana": ["Australia/Darwin"] },
+	"(UTC+09:30) Adelaide": { "iana": ["Australia/Adelaide"] },
+	"(UTC+10:00) Canberra, Melbourne, Sydney": { "iana": ["Australia/Sydney"] },
+	"(GMT+10:00) Canberra, Melbourne, Sydney": { "iana": ["Australia/Sydney"] },
+	"(UTC+10:00) Brisbane": { "iana": ["Australia/Brisbane"] },
+	"(UTC+10:00) Hobart": { "iana": ["Australia/Hobart"] },
+	"(UTC+10:00) Vladivostok": { "iana": ["Asia/Vladivostok"] },
+	"(UTC+10:00) Guam, Port Moresby": { "iana": ["Pacific/Port_Moresby"] },
+	"(UTC+11:00) Magadan, Solomon Islands, New Caledonia": { "iana": ["Pacific/Guadalcanal"] },
+	"(UTC+12:00) Fiji, Kamchatka, Marshall Is.": { "iana": [null] },
+	"(UTC+12:00) Auckland, Wellington": { "iana": ["Pacific/Auckland"] },
+	"(UTC+13:00) Nuku'alofa": { "iana": ["Pacific/Tongatapu"] },
+	"(UTC-03:00) Buenos Aires": { "iana": ["America/Buenos_Aires"] },
+	"(UTC+02:00) Beirut": { "iana": ["Asia/Beirut"] },
+	"(UTC+02:00) Amman": { "iana": ["Asia/Amman"] },
+	"(UTC-06:00) Guadalajara, Mexico City, Monterrey - New": { "iana": ["America/Mexico_City"] },
+	"(UTC-07:00) Chihuahua, La Paz, Mazatlan - New": { "iana": ["America/Chihuahua"] },
+	"(UTC-08:00) Tijuana, Baja California": { "iana": ["America/Tijuana"] },
+	"(UTC+02:00) Windhoek": { "iana": ["Africa/Windhoek"] },
+	"(UTC+03:00) Tbilisi": { "iana": ["Asia/Tbilisi"] },
+	"(UTC-04:00) Manaus": { "iana": ["America/Cuiaba"] },
+	"(UTC-03:00) Montevideo": { "iana": ["America/Montevideo"] },
+	"(UTC+04:00) Yerevan": { "iana": [null] },
+	"(UTC-04:30) Caracas": { "iana": ["America/Caracas"] },
+	"(UTC) Casablanca": { "iana": ["Africa/Casablanca"] },
+	"(UTC+05:00) Islamabad, Karachi": { "iana": ["Asia/Karachi"] },
+	"(UTC+04:00) Port Louis": { "iana": ["Indian/Mauritius"] },
+	"(UTC) Coordinated Universal Time": { "iana": ["Etc/GMT"] },
+	"(UTC-04:00) Asuncion": { "iana": ["America/Asuncion"] },
+	"(UTC+12:00) Petropavlovsk-Kamchatsky": { "iana": [null] }
+}

modules/default/clock/README.md

@@ -0,0 +1,6 @@
+# Module: Clock
+
+The `clock` module is one of the default modules of the MagicMirror².
+This module displays the current date and time. The information will be updated realtime.
+
+For configuration options, please check the [MagicMirror² documentation](https://docs.magicmirror.builders/modules/clock.html).

modules/default/clock/clock.js

@@ -0,0 +1,306 @@
+/* global SunCalc, formatTime */
+
+/* MagicMirror²
+ * Module: Clock
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ */
+Module.register("clock", {
+	// Module config defaults.
+	defaults: {
+		displayType: "digital", // options: digital, analog, both
+
+		timeFormat: config.timeFormat,
+		timezone: null,
+
+		displaySeconds: true,
+		showPeriod: true,
+		showPeriodUpper: false,
+		clockBold: false,
+		showDate: true,
+		showTime: true,
+		showWeek: false,
+		dateFormat: "dddd, LL",
+		sendNotifications: false,
+
+		/* specific to the analog clock */
+		analogSize: "200px",
+		analogFace: "simple", // options: 'none', 'simple', 'face-###' (where ### is 001 to 012 inclusive)
+		analogPlacement: "bottom", // options: 'top', 'bottom', 'left', 'right'
+		analogShowDate: "top", // OBSOLETE, can be replaced with analogPlacement and showTime, options: false, 'top', or 'bottom'
+		secondsColor: "#888888",
+
+		showSunTimes: false,
+		showMoonTimes: false,
+		lat: 47.630539,
+		lon: -122.344147
+	},
+	// Define required scripts.
+	getScripts: function () {
+		return ["moment.js", "moment-timezone.js", "suncalc.js"];
+	},
+	// Define styles.
+	getStyles: function () {
+		return ["clock_styles.css"];
+	},
+	// Define start sequence.
+	start: function () {
+		Log.info(`Starting module: ${this.name}`);
+
+		// Schedule update interval.
+		this.second = moment().second();
+		this.minute = moment().minute();
+
+		// Calculate how many ms should pass until next update depending on if seconds is displayed or not
+		const delayCalculator = (reducedSeconds) => {
+			const EXTRA_DELAY = 50; // Deliberate imperceptible delay to prevent off-by-one timekeeping errors
+
+			if (this.config.displaySeconds) {
+				return 1000 - moment().milliseconds() + EXTRA_DELAY;
+			} else {
+				return (60 - reducedSeconds) * 1000 - moment().milliseconds() + EXTRA_DELAY;
+			}
+		};
+
+		// A recursive timeout function instead of interval to avoid drifting
+		const notificationTimer = () => {
+			this.updateDom();
+
+			if (this.config.sendNotifications) {
+				// If seconds is displayed CLOCK_SECOND-notification should be sent (but not when CLOCK_MINUTE-notification is sent)
+				if (this.config.displaySeconds) {
+					this.second = moment().second();
+					if (this.second !== 0) {
+						this.sendNotification("CLOCK_SECOND", this.second);
+						setTimeout(notificationTimer, delayCalculator(0));
+						return;
+					}
+				}
+
+				// If minute changed or seconds isn't displayed send CLOCK_MINUTE-notification
+				this.minute = moment().minute();
+				this.sendNotification("CLOCK_MINUTE", this.minute);
+			}
+
+			setTimeout(notificationTimer, delayCalculator(0));
+		};
+
+		// Set the initial timeout with the amount of seconds elapsed as
+		// reducedSeconds, so it will trigger when the minute changes
+		setTimeout(notificationTimer, delayCalculator(this.second));
+
+		// Set locale.
+		moment.locale(config.language);
+	},
+	// Override dom generator.
+	getDom: function () {
+		const wrapper = document.createElement("div");
+		wrapper.classList.add("clock-grid");
+
+		/************************************
+		 * Create wrappers for analog and digital clock
+		 */
+		const analogWrapper = document.createElement("div");
+		analogWrapper.className = "clock-circle";
+		const digitalWrapper = document.createElement("div");
+		digitalWrapper.className = "digital";
+		digitalWrapper.style.gridArea = "center";
+
+		/************************************
+		 * Create wrappers for DIGITAL clock
+		 */
+		const dateWrapper = document.createElement("div");
+		const timeWrapper = document.createElement("div");
+		const secondsWrapper = document.createElement("sup");
+		const periodWrapper = document.createElement("span");
+		const sunWrapper = document.createElement("div");
+		const moonWrapper = document.createElement("div");
+		const weekWrapper = document.createElement("div");
+
+		// Style Wrappers
+		dateWrapper.className = "date normal medium";
+		timeWrapper.className = "time bright large light";
+		secondsWrapper.className = "seconds dimmed";
+		sunWrapper.className = "sun dimmed small";
+		moonWrapper.className = "moon dimmed small";
+		weekWrapper.className = "week dimmed medium";
+
+		// Set content of wrappers.
+		// The moment().format("h") method has a bug on the Raspberry Pi.
+		// So we need to generate the timestring manually.
+		// See issue: https://github.com/MichMich/MagicMirror/issues/181
+		let timeString;
+		const now = moment();
+		if (this.config.timezone) {
+			now.tz(this.config.timezone);
+		}
+
+		let hourSymbol = "HH";
+		if (this.config.timeFormat !== 24) {
+			hourSymbol = "h";
+		}
+
+		if (this.config.clockBold) {
+			timeString = now.format(`${hourSymbol}[<span class="bold">]mm[</span>]`);
+		} else {
+			timeString = now.format(`${hourSymbol}:mm`);
+		}
+
+		if (this.config.showDate) {
+			dateWrapper.innerHTML = now.format(this.config.dateFormat);
+			digitalWrapper.appendChild(dateWrapper);
+		}
+
+		if (this.config.displayType !== "analog" && this.config.showTime) {
+			timeWrapper.innerHTML = timeString;
+			secondsWrapper.innerHTML = now.format("ss");
+			if (this.config.showPeriodUpper) {
+				periodWrapper.innerHTML = now.format("A");
+			} else {
+				periodWrapper.innerHTML = now.format("a");
+			}
+			if (this.config.displaySeconds) {
+				timeWrapper.appendChild(secondsWrapper);
+			}
+			if (this.config.showPeriod && this.config.timeFormat !== 24) {
+				timeWrapper.appendChild(periodWrapper);
+			}
+			digitalWrapper.appendChild(timeWrapper);
+		}
+
+		/****************************************************************
+		 * Create wrappers for Sun Times, only if specified in config
+		 */
+		if (this.config.showSunTimes) {
+			const sunTimes = SunCalc.getTimes(now, this.config.lat, this.config.lon);
+			const isVisible = now.isBetween(sunTimes.sunrise, sunTimes.sunset);
+			let nextEvent;
+			if (now.isBefore(sunTimes.sunrise)) {
+				nextEvent = sunTimes.sunrise;
+			} else if (now.isBefore(sunTimes.sunset)) {
+				nextEvent = sunTimes.sunset;
+			} else {
+				const tomorrowSunTimes = SunCalc.getTimes(now.clone().add(1, "day"), this.config.lat, this.config.lon);
+				nextEvent = tomorrowSunTimes.sunrise;
+			}
+			const untilNextEvent = moment.duration(moment(nextEvent).diff(now));
+			const untilNextEventString = `${untilNextEvent.hours()}h ${untilNextEvent.minutes()}m`;
+			sunWrapper.innerHTML =
+				`<span class="${isVisible ? "bright" : ""}"><i class="fas fa-sun" aria-hidden="true"></i> ${untilNextEventString}</span>` +
+				`<span><i class="fas fa-arrow-up" aria-hidden="true"></i> ${formatTime(this.config, sunTimes.sunrise)}</span>` +
+				`<span><i class="fas fa-arrow-down" aria-hidden="true"></i> ${formatTime(this.config, sunTimes.sunset)}</span>`;
+			digitalWrapper.appendChild(sunWrapper);
+		}
+
+		/****************************************************************
+		 * Create wrappers for Moon Times, only if specified in config
+		 */
+		if (this.config.showMoonTimes) {
+			const moonIllumination = SunCalc.getMoonIllumination(now.toDate());
+			const moonTimes = SunCalc.getMoonTimes(now, this.config.lat, this.config.lon);
+			const moonRise = moonTimes.rise;
+			let moonSet;
+			if (moment(moonTimes.set).isAfter(moonTimes.rise)) {
+				moonSet = moonTimes.set;
+			} else {
+				const nextMoonTimes = SunCalc.getMoonTimes(now.clone().add(1, "day"), this.config.lat, this.config.lon);
+				moonSet = nextMoonTimes.set;
+			}
+			const isVisible = now.isBetween(moonRise, moonSet) || moonTimes.alwaysUp === true;
+			const illuminatedFractionString = `${Math.round(moonIllumination.fraction * 100)}%`;
+			moonWrapper.innerHTML =
+				`<span class="${isVisible ? "bright" : ""}"><i class="fas fa-moon" aria-hidden="true"></i> ${illuminatedFractionString}</span>` +
+				`<span><i class="fas fa-arrow-up" aria-hidden="true"></i> ${moonRise ? formatTime(this.config, moonRise) : "..."}</span>` +
+				`<span><i class="fas fa-arrow-down" aria-hidden="true"></i> ${moonSet ? formatTime(this.config, moonSet) : "..."}</span>`;
+			digitalWrapper.appendChild(moonWrapper);
+		}
+
+		if (this.config.showWeek) {
+			weekWrapper.innerHTML = this.translate("WEEK", { weekNumber: now.week() });
+			digitalWrapper.appendChild(weekWrapper);
+		}
+
+		/****************************************************************
+		 * Create wrappers for ANALOG clock, only if specified in config
+		 */
+		if (this.config.displayType !== "digital") {
+			// If it isn't 'digital', then an 'analog' clock was also requested
+
+			// Calculate the degree offset for each hand of the clock
+			if (this.config.timezone) {
+				now.tz(this.config.timezone);
+			}
+			const second = now.seconds() * 6,
+				minute = now.minute() * 6 + second / 60,
+				hour = ((now.hours() % 12) / 12) * 360 + 90 + minute / 12;
+
+			// Create wrappers
+			analogWrapper.style.width = this.config.analogSize;
+			analogWrapper.style.height = this.config.analogSize;
+
+			if (this.config.analogFace !== "" && this.config.analogFace !== "simple" && this.config.analogFace !== "none") {
+				analogWrapper.style.background = `url(${this.data.path}faces/${this.config.analogFace}.svg)`;
+				analogWrapper.style.backgroundSize = "100%";
+
+				// The following line solves issue: https://github.com/MichMich/MagicMirror/issues/611
+				// analogWrapper.style.border = "1px solid black";
+				analogWrapper.style.border = "rgba(0, 0, 0, 0.1)"; //Updated fix for Issue 611 where non-black backgrounds are used
+			} else if (this.config.analogFace !== "none") {
+				analogWrapper.style.border = "2px solid white";
+			}
+			const clockFace = document.createElement("div");
+			clockFace.className = "clock-face";
+
+			const clockHour = document.createElement("div");
+			clockHour.id = "clock-hour";
+			clockHour.style.transform = `rotate(${hour}deg)`;
+			clockHour.className = "clock-hour";
+			const clockMinute = document.createElement("div");
+			clockMinute.id = "clock-minute";
+			clockMinute.style.transform = `rotate(${minute}deg)`;
+			clockMinute.className = "clock-minute";
+
+			// Combine analog wrappers
+			clockFace.appendChild(clockHour);
+			clockFace.appendChild(clockMinute);
+
+			if (this.config.displaySeconds) {
+				const clockSecond = document.createElement("div");
+				clockSecond.id = "clock-second";
+				clockSecond.style.transform = `rotate(${second}deg)`;
+				clockSecond.className = "clock-second";
+				clockSecond.style.backgroundColor = this.config.secondsColor;
+				clockFace.appendChild(clockSecond);
+			}
+			analogWrapper.appendChild(clockFace);
+		}
+
+		/*******************************************
+		 * Update placement, respect old analogShowDate even if it's not needed anymore
+		 */
+		if (this.config.displayType === "analog") {
+			// Display only an analog clock
+			if (this.config.showDate) {
+				// Add date to the analog clock
+				dateWrapper.innerHTML = now.format(this.config.dateFormat);
+				wrapper.appendChild(dateWrapper);
+			}
+			if (this.config.analogShowDate === "bottom") {
+				wrapper.classList.add("clock-grid-bottom");
+			} else if (this.config.analogShowDate === "top") {
+				wrapper.classList.add("clock-grid-top");
+			}
+			wrapper.appendChild(analogWrapper);
+		} else if (this.config.displayType === "digital") {
+			wrapper.appendChild(digitalWrapper);
+		} else if (this.config.displayType === "both") {
+			wrapper.classList.add(`clock-grid-${this.config.analogPlacement}`);
+			wrapper.appendChild(analogWrapper);
+			wrapper.appendChild(digitalWrapper);
+		}
+
+		// Return the wrapper to the dom.
+		return wrapper;
+	}
+});

modules/default/clock/clock_styles.css

@@ -0,0 +1,93 @@
+.clock-grid {
+  display: inline-flex;
+  gap: 15px;
+}
+
+.clock-grid-left {
+  flex-direction: row;
+}
+
+.clock-grid-right {
+  flex-direction: row-reverse;
+}
+
+.clock-grid-top {
+  flex-direction: column;
+}
+
+.clock-grid-bottom {
+  flex-direction: column-reverse;
+}
+
+.clock-circle {
+  place-self: center;
+  position: relative;
+  border-radius: 50%;
+  background-size: 100%;
+}
+
+.clock-face {
+  width: 100%;
+  height: 100%;
+}
+
+.clock-face::after {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 6px;
+  height: 6px;
+  margin: -3px 0 0 -3px;
+  background: var(--color-text-bright);
+  border-radius: 3px;
+  content: "";
+  display: block;
+}
+
+.clock-hour {
+  width: 0;
+  height: 0;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  margin: -2px 0 -2px -25%; /* numbers must match negative length & thickness */
+  padding: 2px 0 2px 25%; /* indicator length & thickness */
+  background: var(--color-text-bright);
+  transform-origin: 100% 50%;
+  border-radius: 3px 0 0 3px;
+}
+
+.clock-minute {
+  width: 0;
+  height: 0;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  margin: -35% -2px 0; /* numbers must match negative length & thickness */
+  padding: 35% 2px 0; /* indicator length & thickness */
+  background: var(--color-text-bright);
+  transform-origin: 50% 100%;
+  border-radius: 3px 0 0 3px;
+}
+
+.clock-second {
+  width: 0;
+  height: 0;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  margin: -38% -1px 0 0; /* numbers must match negative length & thickness */
+  padding: 38% 1px 0 0; /* indicator length & thickness */
+  background: var(--color-text);
+  transform-origin: 50% 100%;
+}
+
+.module.clock .sun,
+.module.clock .moon {
+  display: flex;
+}
+
+.module.clock .sun > *,
+.module.clock .moon > * {
+  flex: 1;
+}

modules/default/clock/faces/face-001.svg

@@ -0,0 +1 @@
+<svg id="Hour_Markers_-_Singlets" data-name="Hour Markers - Singlets" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 250 250"><defs><style>.cls-1,.cls-2{fill:none;stroke:#fff;stroke-linecap:round;stroke-miterlimit:10;}.cls-2{stroke-width:0.5px;}</style></defs><title>face-001</title><line class="cls-1" x1="125" y1="1.25" x2="125" y2="16.23"/><line class="cls-1" x1="186.87" y1="17.83" x2="179.39" y2="30.8"/><line class="cls-1" x1="232.17" y1="63.12" x2="219.2" y2="70.61"/><line class="cls-1" x1="248.75" y1="125" x2="233.77" y2="125"/><line class="cls-1" x1="232.17" y1="186.87" x2="219.2" y2="179.39"/><line class="cls-1" x1="186.88" y1="232.17" x2="179.39" y2="219.2"/><line class="cls-1" x1="125" y1="248.75" x2="125" y2="233.77"/><line class="cls-1" x1="63.13" y1="232.17" x2="70.61" y2="219.2"/><line class="cls-1" x1="17.83" y1="186.88" x2="30.8" y2="179.39"/><line class="cls-1" x1="1.25" y1="125" x2="16.23" y2="125"/><line class="cls-1" x1="17.83" y1="63.13" x2="30.8" y2="70.61"/><line class="cls-1" x1="63.12" y1="17.83" x2="70.61" y2="30.8"/><line class="cls-2" x1="138.01" y1="1.25" x2="136.96" y2="11.23"/><line class="cls-2" x1="150.87" y1="3.29" x2="148.78" y2="13.11"/><line class="cls-2" x1="163.45" y1="6.66" x2="160.35" y2="16.21"/><line class="cls-2" x1="175.61" y1="11.33" x2="171.53" y2="20.5"/><line class="cls-2" x1="198.14" y1="24.33" x2="192.24" y2="32.45"/><line class="cls-2" x1="208.26" y1="32.53" x2="201.54" y2="39.99"/><line class="cls-2" x1="217.47" y1="41.74" x2="210.01" y2="48.46"/><line class="cls-2" x1="225.67" y1="51.86" x2="217.55" y2="57.76"/><line class="cls-2" x1="238.67" y1="74.39" x2="229.5" y2="78.47"/><line class="cls-2" x1="243.34" y1="86.55" x2="233.79" y2="89.65"/><line class="cls-2" x1="246.71" y1="99.13" x2="236.89" y2="101.22"/><line class="cls-2" x1="248.75" y1="111.99" x2="238.77" y2="113.04"/><line class="cls-2" x1="248.75" y1="138.01" x2="238.77" y2="136.96"/><line class="cls-2" x1="246.71" y1="150.87" x2="236.89" y2="148.78"/><line class="cls-2" x1="243.34" y1="163.45" x2="233.79" y2="160.35"/><line class="cls-2" x1="238.67" y1="175.61" x2="229.5" y2="171.53"/><line class="cls-2" x1="225.67" y1="198.14" x2="217.55" y2="192.24"/><line class="cls-2" x1="217.47" y1="208.26" x2="210.01" y2="201.54"/><line class="cls-2" x1="208.26" y1="217.47" x2="201.54" y2="210.01"/><line class="cls-2" x1="198.14" y1="225.67" x2="192.24" y2="217.55"/><line class="cls-2" x1="175.61" y1="238.67" x2="171.53" y2="229.5"/><line class="cls-2" x1="163.45" y1="243.34" x2="160.35" y2="233.79"/><line class="cls-2" x1="150.87" y1="246.71" x2="148.78" y2="236.89"/><line class="cls-2" x1="138.01" y1="248.75" x2="136.96" y2="238.77"/><line class="cls-2" x1="111.99" y1="248.75" x2="113.04" y2="238.77"/><line class="cls-2" x1="99.13" y1="246.71" x2="101.22" y2="236.89"/><line class="cls-2" x1="86.55" y1="243.34" x2="89.65" y2="233.79"/><line class="cls-2" x1="74.39" y1="238.67" x2="78.47" y2="229.5"/><line class="cls-2" x1="51.86" y1="225.67" x2="57.76" y2="217.55"/><line class="cls-2" x1="41.74" y1="217.47" x2="48.46" y2="210.01"/><line class="cls-2" x1="32.53" y1="208.26" x2="39.99" y2="201.54"/><line class="cls-2" x1="24.33" y1="198.14" x2="32.45" y2="192.24"/><line class="cls-2" x1="11.33" y1="175.61" x2="20.5" y2="171.53"/><line class="cls-2" x1="6.66" y1="163.45" x2="16.21" y2="160.35"/><line class="cls-2" x1="3.29" y1="150.87" x2="13.11" y2="148.78"/><line class="cls-2" x1="1.25" y1="138.01" x2="11.23" y2="136.96"/><line class="cls-2" x1="1.25" y1="111.99" x2="11.23" y2="113.04"/><line class="cls-2" x1="3.29" y1="99.13" x2="13.11" y2="101.22"/><line class="cls-2" x1="6.66" y1="86.55" x2="16.21" y2="89.65"/><line class="cls-2" x1="11.33" y1="74.39" x2="20.5" y2="78.47"/><line class="cls-2" x1="24.33" y1="51.86" x2="32.45" y2="57.76"/><line class="cls-2" x1="32.53" y1="41.74" x2="39.99" y2="48.46"/><line class="cls-2" x1="41.74" y1="32.53" x2="48.46" y2="39.99"/><line class="cls-2" x1="51.86" y1="24.33" x2="57.76" y2="32.45"/><line class="cls-2" x1="74.39" y1="11.33" x2="78.47" y2="20.5"/><line class="cls-2" x1="86.55" y1="6.66" x2="89.65" y2="16.21"/><line class="cls-2" x1="99.13" y1="3.29" x2="101.22" y2="13.11"/><line class="cls-2" x1="111.99" y1="1.25" x2="113.04" y2="11.23"/></svg>

modules/default/clock/faces/face-002.svg

@@ -0,0 +1 @@
+<svg id="Hour_Markers_-_Doubles" data-name="Hour Markers - Doubles" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 250 250"><defs><style>.cls-1{fill:none;stroke:#fff;stroke-linecap:round;stroke-miterlimit:10;stroke-width:2.98px;}</style></defs><title>face-002</title><line class="cls-1" x1="122.01" y1="1.75" x2="122.01" y2="16.67"/><line class="cls-1" x1="186.62" y1="18.26" x2="179.17" y2="31.18"/><line class="cls-1" x1="231.74" y1="63.37" x2="218.82" y2="70.83"/><line class="cls-1" x1="248.25" y1="127.99" x2="233.33" y2="127.99"/><line class="cls-1" x1="231.74" y1="186.62" x2="218.82" y2="179.17"/><line class="cls-1" x1="186.63" y1="231.74" x2="179.17" y2="218.82"/><line class="cls-1" x1="127.99" y1="248.25" x2="127.99" y2="233.33"/><line class="cls-1" x1="63.38" y1="231.74" x2="70.83" y2="218.82"/><line class="cls-1" x1="18.26" y1="186.63" x2="31.18" y2="179.17"/><line class="cls-1" x1="1.75" y1="122.01" x2="16.67" y2="122.01"/><line class="cls-1" x1="18.26" y1="63.38" x2="31.18" y2="70.83"/><line class="cls-1" x1="63.37" y1="18.26" x2="70.83" y2="31.18"/><line class="cls-1" x1="127.99" y1="1.75" x2="127.99" y2="16.67"/><line class="cls-1" x1="248.25" y1="122.01" x2="233.33" y2="122.01"/><line class="cls-1" x1="122.01" y1="248.25" x2="122.01" y2="233.33"/><line class="cls-1" x1="1.75" y1="127.99" x2="16.67" y2="127.99"/></svg>

modules/default/compliments/README.md

@@ -0,0 +1,6 @@
+# Module: Compliments
+
+The `compliments` module is one of the default modules of the MagicMirror².
+This module displays a random compliment.
+
+For configuration options, please check the [MagicMirror² documentation](https://docs.magicmirror.builders/modules/compliments.html).

modules/default/compliments/compliments.js

@@ -0,0 +1,181 @@
+/* MagicMirror²
+ * Module: Compliments
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ */
+Module.register("compliments", {
+	// Module config defaults.
+	defaults: {
+		compliments: {
+			anytime: ["Hey there sexy!"],
+			morning: ["Good morning, handsome!", "Enjoy your day!", "How was your sleep?"],
+			afternoon: ["Hello, beauty!", "You look sexy!", "Looking good today!"],
+			evening: ["Wow, you look hot!", "You look nice!", "Hi, sexy!"],
+			"....-01-01": ["Happy new year!"]
+		},
+		updateInterval: 30000,
+		remoteFile: null,
+		fadeSpeed: 4000,
+		morningStartTime: 3,
+		morningEndTime: 12,
+		afternoonStartTime: 12,
+		afternoonEndTime: 17,
+		random: true
+	},
+	lastIndexUsed: -1,
+	// Set currentweather from module
+	currentWeatherType: "",
+
+	// Define required scripts.
+	getScripts: function () {
+		return ["moment.js"];
+	},
+
+	// Define start sequence.
+	start: async function () {
+		Log.info(`Starting module: ${this.name}`);
+
+		this.lastComplimentIndex = -1;
+
+		if (this.config.remoteFile !== null) {
+			const response = await this.loadComplimentFile();
+			this.config.compliments = JSON.parse(response);
+			this.updateDom();
+		}
+
+		// Schedule update timer.
+		setInterval(() => {
+			this.updateDom(this.config.fadeSpeed);
+		}, this.config.updateInterval);
+	},
+
+	/**
+	 * Generate a random index for a list of compliments.
+	 * @param {string[]} compliments Array with compliments.
+	 * @returns {number} a random index of given array
+	 */
+	randomIndex: function (compliments) {
+		if (compliments.length === 1) {
+			return 0;
+		}
+
+		const generate = function () {
+			return Math.floor(Math.random() * compliments.length);
+		};
+
+		let complimentIndex = generate();
+
+		while (complimentIndex === this.lastComplimentIndex) {
+			complimentIndex = generate();
+		}
+
+		this.lastComplimentIndex = complimentIndex;
+
+		return complimentIndex;
+	},
+
+	/**
+	 * Retrieve an array of compliments for the time of the day.
+	 * @returns {string[]} array with compliments for the time of the day.
+	 */
+	complimentArray: function () {
+		const hour = moment().hour();
+		const date = moment().format("YYYY-MM-DD");
+		let compliments = [];
+
+		// Add time of day compliments
+		if (hour >= this.config.morningStartTime && hour < this.config.morningEndTime && this.config.compliments.hasOwnProperty("morning")) {
+			compliments = [...this.config.compliments.morning];
+		} else if (hour >= this.config.afternoonStartTime && hour < this.config.afternoonEndTime && this.config.compliments.hasOwnProperty("afternoon")) {
+			compliments = [...this.config.compliments.afternoon];
+		} else if (this.config.compliments.hasOwnProperty("evening")) {
+			compliments = [...this.config.compliments.evening];
+		}
+
+		// Add compliments based on weather
+		if (this.currentWeatherType in this.config.compliments) {
+			Array.prototype.push.apply(compliments, this.config.compliments[this.currentWeatherType]);
+		}
+
+		// Add compliments for anytime
+		Array.prototype.push.apply(compliments, this.config.compliments.anytime);
+
+		// Add compliments for special days
+		for (let entry in this.config.compliments) {
+			if (new RegExp(entry).test(date)) {
+				Array.prototype.push.apply(compliments, this.config.compliments[entry]);
+			}
+		}
+
+		return compliments;
+	},
+
+	/**
+	 * Retrieve a file from the local filesystem
+	 * @returns {Promise} Resolved when the file is loaded
+	 */
+	loadComplimentFile: async function () {
+		const isRemote = this.config.remoteFile.indexOf("http://") === 0 || this.config.remoteFile.indexOf("https://") === 0,
+			url = isRemote ? this.config.remoteFile : this.file(this.config.remoteFile);
+		const response = await fetch(url);
+		return await response.text();
+	},
+
+	/**
+	 * Retrieve a random compliment.
+	 * @returns {string} a compliment
+	 */
+	getRandomCompliment: function () {
+		// get the current time of day compliments list
+		const compliments = this.complimentArray();
+		// variable for index to next message to display
+		let index;
+		// are we randomizing
+		if (this.config.random) {
+			// yes
+			index = this.randomIndex(compliments);
+		} else {
+			// no, sequential
+			// if doing sequential, don't fall off the end
+			index = this.lastIndexUsed >= compliments.length - 1 ? 0 : ++this.lastIndexUsed;
+		}
+
+		return compliments[index] || "";
+	},
+
+	// Override dom generator.
+	getDom: function () {
+		const wrapper = document.createElement("div");
+		wrapper.className = this.config.classes ? this.config.classes : "thin xlarge bright pre-line";
+		// get the compliment text
+		const complimentText = this.getRandomCompliment();
+		// split it into parts on newline text
+		const parts = complimentText.split("\n");
+		// create a span to hold the compliment
+		const compliment = document.createElement("span");
+		// process all the parts of the compliment text
+		for (const part of parts) {
+			if (part !== "") {
+				// create a text element for each part
+				compliment.appendChild(document.createTextNode(part));
+				// add a break
+				compliment.appendChild(document.createElement("BR"));
+			}
+		}
+		// only add compliment to wrapper if there is actual text in there
+		if (compliment.children.length > 0) {
+			// remove the last break
+			compliment.lastElementChild.remove();
+			wrapper.appendChild(compliment);
+		}
+		return wrapper;
+	},
+
+	// Override notification handler.
+	notificationReceived: function (notification, payload, sender) {
+		if (notification === "CURRENTWEATHER_TYPE") {
+			this.currentWeatherType = payload.type;
+		}
+	}
+});

modules/default/defaultmodules.js

@@ -0,0 +1,12 @@
+/* MagicMirror² Default Modules List
+ * Modules listed below can be loaded without the 'default/' prefix. Omitting the default folder name.
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ */
+const defaultModules = ["alert", "calendar", "clock", "compliments", "helloworld", "newsfeed", "updatenotification", "weather"];
+
+/*************** DO NOT EDIT THE LINE BELOW ***************/
+if (typeof module !== "undefined") {
+	module.exports = defaultModules;
+}

modules/default/helloworld/README.md

@@ -0,0 +1,5 @@
+# Module: Hello World
+
+The `helloworld` module is one of the default modules of the MagicMirror². It is a simple way to display a static text on the mirror.
+
+For configuration options, please check the [MagicMirror² documentation](https://docs.magicmirror.builders/modules/helloworld.html).

modules/default/helloworld/helloworld.js

@@ -0,0 +1,20 @@
+/* MagicMirror²
+ * Module: HelloWorld
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ */
+Module.register("helloworld", {
+	// Default module config.
+	defaults: {
+		text: "Bonjour Pascal!"
+	},
+
+	getTemplate: function () {
+		return "helloworld.njk";
+	},
+
+	getTemplateData: function () {
+		return this.config;
+	}
+});

modules/default/helloworld/helloworld.njk

@@ -0,0 +1,5 @@
+<!--
+	Use ` | safe` to allow html tages within the text string.
+	https://mozilla.github.io/nunjucks/templating.html#autoescaping
+-->
+<div>{{text | safe}}</div>

modules/default/newsfeed/README.md

@@ -0,0 +1,6 @@
+# Module: News Feed
+
+The `newsfeed` module is one of the default modules of the MagicMirror².
+This module displays news headlines based on an RSS feed. Scrolling through news headlines happens time-based (`updateInterval`), but can also be controlled by sending news feed specific notifications to the module.
+
+For configuration options, please check the [MagicMirror² documentation](https://docs.magicmirror.builders/modules/newsfeed.html).

modules/default/newsfeed/fullarticle.njk

@@ -0,0 +1,3 @@
+<div>
+    <iframe class="newsfeed-fullarticle" src="{{ url }}"></iframe>
+</div>

modules/default/newsfeed/newsfeed.css

@@ -0,0 +1,24 @@
+iframe.newsfeed-fullarticle {
+  width: 100vw;
+
+  /* very large height value to allow scrolling */
+  height: 3000px;
+  top: 0;
+  left: 0;
+  border: none;
+  z-index: 1;
+}
+
+.region.bottom.bar.newsfeed-fullarticle {
+  bottom: inherit;
+  top: -90px;
+}
+
+.newsfeed-list {
+  list-style: none;
+}
+
+.newsfeed-list li {
+  text-align: justify;
+  margin-bottom: 0.5em;
+}

modules/default/newsfeed/newsfeed.js

@@ -0,0 +1,409 @@
+/* MagicMirror²
+ * Module: NewsFeed
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ */
+Module.register("newsfeed", {
+	// Default module config.
+	defaults: {
+		feeds: [
+			{
+				title: "New York Times",
+				url: "https://rss.nytimes.com/services/xml/rss/nyt/HomePage.xml",
+				encoding: "UTF-8" //ISO-8859-1
+			}
+		],
+		showAsList: false,
+		showSourceTitle: true,
+		showPublishDate: true,
+		broadcastNewsFeeds: true,
+		broadcastNewsUpdates: true,
+		showDescription: false,
+		showTitleAsUrl: false,
+		wrapTitle: true,
+		wrapDescription: true,
+		truncDescription: true,
+		lengthDescription: 400,
+		hideLoading: false,
+		reloadInterval: 5 * 60 * 1000, // every 5 minutes
+		updateInterval: 10 * 1000,
+		animationSpeed: 2.5 * 1000,
+		maxNewsItems: 0, // 0 for unlimited
+		ignoreOldItems: false,
+		ignoreOlderThan: 24 * 60 * 60 * 1000, // 1 day
+		removeStartTags: "",
+		removeEndTags: "",
+		startTags: [],
+		endTags: [],
+		prohibitedWords: [],
+		scrollLength: 500,
+		logFeedWarnings: false,
+		dangerouslyDisableAutoEscaping: false
+	},
+
+	getUrlPrefix: function (item) {
+		if (item.useCorsProxy) {
+			return `${location.protocol}//${location.host}/cors?url=`;
+		} else {
+			return "";
+		}
+	},
+
+	// Define required scripts.
+	getScripts: function () {
+		return ["moment.js"];
+	},
+
+	//Define required styles.
+	getStyles: function () {
+		return ["newsfeed.css"];
+	},
+
+	// Define required translations.
+	getTranslations: function () {
+		// The translations for the default modules are defined in the core translation files.
+		// Therefor we can just return false. Otherwise we should have returned a dictionary.
+		// If you're trying to build your own module including translations, check out the documentation.
+		return false;
+	},
+
+	// Define start sequence.
+	start: function () {
+		Log.info(`Starting module: ${this.name}`);
+
+		// Set locale.
+		moment.locale(config.language);
+
+		this.newsItems = [];
+		this.loaded = false;
+		this.error = null;
+		this.activeItem = 0;
+		this.scrollPosition = 0;
+
+		this.registerFeeds();
+
+		this.isShowingDescription = this.config.showDescription;
+	},
+
+	// Override socket notification handler.
+	socketNotificationReceived: function (notification, payload) {
+		if (notification === "NEWS_ITEMS") {
+			this.generateFeed(payload);
+
+			if (!this.loaded) {
+				if (this.config.hideLoading) {
+					this.show();
+				}
+				this.scheduleUpdateInterval();
+			}
+
+			this.loaded = true;
+			this.error = null;
+		} else if (notification === "NEWSFEED_ERROR") {
+			this.error = this.translate(payload.error_type);
+			this.scheduleUpdateInterval();
+		}
+	},
+
+	//Override fetching of template name
+	getTemplate: function () {
+		if (this.config.feedUrl) {
+			return "oldconfig.njk";
+		} else if (this.config.showFullArticle) {
+			return "fullarticle.njk";
+		}
+		return "newsfeed.njk";
+	},
+
+	//Override template data and return whats used for the current template
+	getTemplateData: function () {
+		// this.config.showFullArticle is a run-time configuration, triggered by optional notifications
+		if (this.config.showFullArticle) {
+			return {
+				url: this.getActiveItemURL()
+			};
+		}
+		if (this.error) {
+			return {
+				error: this.error
+			};
+		}
+		if (this.newsItems.length === 0) {
+			return {
+				empty: true
+			};
+		}
+		if (this.activeItem >= this.newsItems.length) {
+			this.activeItem = 0;
+		}
+
+		const item = this.newsItems[this.activeItem];
+		const items = this.newsItems.map(function (item) {
+			item.publishDate = moment(new Date(item.pubdate)).fromNow();
+			return item;
+		});
+
+		return {
+			loaded: true,
+			config: this.config,
+			sourceTitle: item.sourceTitle,
+			publishDate: moment(new Date(item.pubdate)).fromNow(),
+			title: item.title,
+			url: this.getUrlPrefix(item) + item.url,
+			description: item.description,
+			items: items
+		};
+	},
+
+	getActiveItemURL: function () {
+		const item = this.newsItems[this.activeItem];
+		if (item) {
+			return typeof item.url === "string" ? this.getUrlPrefix(item) + item.url : this.getUrlPrefix(item) + item.url.href;
+		} else {
+			return "";
+		}
+	},
+
+	/**
+	 * Registers the feeds to be used by the backend.
+	 */
+	registerFeeds: function () {
+		for (let feed of this.config.feeds) {
+			this.sendSocketNotification("ADD_FEED", {
+				feed: feed,
+				config: this.config
+			});
+		}
+	},
+
+	/**
+	 * Generate an ordered list of items for this configured module.
+	 * @param {object} feeds An object with feeds returned by the node helper.
+	 */
+	generateFeed: function (feeds) {
+		let newsItems = [];
+		for (let feed in feeds) {
+			const feedItems = feeds[feed];
+			if (this.subscribedToFeed(feed)) {
+				for (let item of feedItems) {
+					item.sourceTitle = this.titleForFeed(feed);
+					if (!(this.config.ignoreOldItems && Date.now() - new Date(item.pubdate) > this.config.ignoreOlderThan)) {
+						newsItems.push(item);
+					}
+				}
+			}
+		}
+		newsItems.sort(function (a, b) {
+			const dateA = new Date(a.pubdate);
+			const dateB = new Date(b.pubdate);
+			return dateB - dateA;
+		});
+
+		if (this.config.maxNewsItems > 0) {
+			newsItems = newsItems.slice(0, this.config.maxNewsItems);
+		}
+
+		if (this.config.prohibitedWords.length > 0) {
+			newsItems = newsItems.filter(function (item) {
+				for (let word of this.config.prohibitedWords) {
+					if (item.title.toLowerCase().indexOf(word.toLowerCase()) > -1) {
+						return false;
+					}
+				}
+				return true;
+			}, this);
+		}
+		newsItems.forEach((item) => {
+			//Remove selected tags from the beginning of rss feed items (title or description)
+			if (this.config.removeStartTags === "title" || this.config.removeStartTags === "both") {
+				for (let startTag of this.config.startTags) {
+					if (item.title.slice(0, startTag.length) === startTag) {
+						item.title = item.title.slice(startTag.length, item.title.length);
+					}
+				}
+			}
+
+			if (this.config.removeStartTags === "description" || this.config.removeStartTags === "both") {
+				if (this.isShowingDescription) {
+					for (let startTag of this.config.startTags) {
+						if (item.description.slice(0, startTag.length) === startTag) {
+							item.description = item.description.slice(startTag.length, item.description.length);
+						}
+					}
+				}
+			}
+
+			//Remove selected tags from the end of rss feed items (title or description)
+			if (this.config.removeEndTags) {
+				for (let endTag of this.config.endTags) {
+					if (item.title.slice(-endTag.length) === endTag) {
+						item.title = item.title.slice(0, -endTag.length);
+					}
+				}
+
+				if (this.isShowingDescription) {
+					for (let endTag of this.config.endTags) {
+						if (item.description.slice(-endTag.length) === endTag) {
+							item.description = item.description.slice(0, -endTag.length);
+						}
+					}
+				}
+			}
+		});
+
+		// get updated news items and broadcast them
+		const updatedItems = [];
+		newsItems.forEach((value) => {
+			if (this.newsItems.findIndex((value1) => value1 === value) === -1) {
+				// Add item to updated items list
+				updatedItems.push(value);
+			}
+		});
+
+		// check if updated items exist, if so and if we should broadcast these updates, then lets do so
+		if (this.config.broadcastNewsUpdates && updatedItems.length > 0) {
+			this.sendNotification("NEWS_FEED_UPDATE", { items: updatedItems });
+		}
+
+		this.newsItems = newsItems;
+	},
+
+	/**
+	 * Check if this module is configured to show this feed.
+	 * @param {string} feedUrl Url of the feed to check.
+	 * @returns {boolean} True if it is subscribed, false otherwise
+	 */
+	subscribedToFeed: function (feedUrl) {
+		for (let feed of this.config.feeds) {
+			if (feed.url === feedUrl) {
+				return true;
+			}
+		}
+		return false;
+	},
+
+	/**
+	 * Returns title for the specific feed url.
+	 * @param {string} feedUrl Url of the feed
+	 * @returns {string} The title of the feed
+	 */
+	titleForFeed: function (feedUrl) {
+		for (let feed of this.config.feeds) {
+			if (feed.url === feedUrl) {
+				return feed.title || "";
+			}
+		}
+		return "";
+	},
+
+	/**
+	 * Schedule visual update.
+	 */
+	scheduleUpdateInterval: function () {
+		this.updateDom(this.config.animationSpeed);
+
+		// Broadcast NewsFeed if needed
+		if (this.config.broadcastNewsFeeds) {
+			this.sendNotification("NEWS_FEED", { items: this.newsItems });
+		}
+
+		// #2638 Clear timer if it already exists
+		if (this.timer) clearInterval(this.timer);
+
+		this.timer = setInterval(() => {
+			this.activeItem++;
+			this.updateDom(this.config.animationSpeed);
+
+			// Broadcast NewsFeed if needed
+			if (this.config.broadcastNewsFeeds) {
+				this.sendNotification("NEWS_FEED", { items: this.newsItems });
+			}
+		}, this.config.updateInterval);
+	},
+
+	resetDescrOrFullArticleAndTimer: function () {
+		this.isShowingDescription = this.config.showDescription;
+		this.config.showFullArticle = false;
+		this.scrollPosition = 0;
+		// reset bottom bar alignment
+		document.getElementsByClassName("region bottom bar")[0].classList.remove("newsfeed-fullarticle");
+		if (!this.timer) {
+			this.scheduleUpdateInterval();
+		}
+	},
+
+	notificationReceived: function (notification, payload, sender) {
+		const before = this.activeItem;
+		if (notification === "MODULE_DOM_CREATED" && this.config.hideLoading) {
+			this.hide();
+		} else if (notification === "ARTICLE_NEXT") {
+			this.activeItem++;
+			if (this.activeItem >= this.newsItems.length) {
+				this.activeItem = 0;
+			}
+			this.resetDescrOrFullArticleAndTimer();
+			Log.debug(`${this.name} - going from article #${before} to #${this.activeItem} (of ${this.newsItems.length})`);
+			this.updateDom(100);
+		} else if (notification === "ARTICLE_PREVIOUS") {
+			this.activeItem--;
+			if (this.activeItem < 0) {
+				this.activeItem = this.newsItems.length - 1;
+			}
+			this.resetDescrOrFullArticleAndTimer();
+			Log.debug(`${this.name} - going from article #${before} to #${this.activeItem} (of ${this.newsItems.length})`);
+			this.updateDom(100);
+		}
+		// if "more details" is received the first time: show article summary, on second time show full article
+		else if (notification === "ARTICLE_MORE_DETAILS") {
+			// full article is already showing, so scrolling down
+			if (this.config.showFullArticle === true) {
+				this.scrollPosition += this.config.scrollLength;
+				window.scrollTo(0, this.scrollPosition);
+				Log.debug(`${this.name} - scrolling down`);
+				Log.debug(`${this.name} - ARTICLE_MORE_DETAILS, scroll position: ${this.config.scrollLength}`);
+			} else {
+				this.showFullArticle();
+			}
+		} else if (notification === "ARTICLE_SCROLL_UP") {
+			if (this.config.showFullArticle === true) {
+				this.scrollPosition -= this.config.scrollLength;
+				window.scrollTo(0, this.scrollPosition);
+				Log.debug(`${this.name} - scrolling up`);
+				Log.debug(`${this.name} - ARTICLE_SCROLL_UP, scroll position: ${this.config.scrollLength}`);
+			}
+		} else if (notification === "ARTICLE_LESS_DETAILS") {
+			this.resetDescrOrFullArticleAndTimer();
+			Log.debug(`${this.name} - showing only article titles again`);
+			this.updateDom(100);
+		} else if (notification === "ARTICLE_TOGGLE_FULL") {
+			if (this.config.showFullArticle) {
+				this.activeItem++;
+				this.resetDescrOrFullArticleAndTimer();
+			} else {
+				this.showFullArticle();
+			}
+		} else if (notification === "ARTICLE_INFO_REQUEST") {
+			this.sendNotification("ARTICLE_INFO_RESPONSE", {
+				title: this.newsItems[this.activeItem].title,
+				source: this.newsItems[this.activeItem].sourceTitle,
+				date: this.newsItems[this.activeItem].pubdate,
+				desc: this.newsItems[this.activeItem].description,
+				url: this.getActiveItemURL()
+			});
+		}
+	},
+
+	showFullArticle: function () {
+		this.isShowingDescription = !this.isShowingDescription;
+		this.config.showFullArticle = !this.isShowingDescription;
+		// make bottom bar align to top to allow scrolling
+		if (this.config.showFullArticle === true) {
+			document.getElementsByClassName("region bottom bar")[0].classList.add("newsfeed-fullarticle");
+		}
+		clearInterval(this.timer);
+		this.timer = null;
+		Log.debug(`${this.name} - showing ${this.isShowingDescription ? "article description" : "full article"}`);
+		this.updateDom(100);
+	}
+});

modules/default/newsfeed/newsfeed.njk

@@ -0,0 +1,93 @@
+{% macro escapeText(text, dangerouslyDisableAutoEscaping=false) %}
+  {% if dangerouslyDisableAutoEscaping %}
+    {{ text | safe}}
+  {% else %}
+    {{ text }}
+  {% endif %}
+{% endmacro %}
+
+{% macro escapeTitle(title, url, dangerouslyDisableAutoEscaping=false, showTitleAsUrl=false) %}
+  {% if dangerouslyDisableAutoEscaping %}
+    {% if showTitleAsUrl %}
+      <a href="{{ url }}" style="text-decoration:none;color:#ffffff" target="_blank">{{ title | safe }}</a>
+    {% else %}
+      {{ title | safe}}
+    {% endif %}
+  {% else %}
+    {% if showTitleAsUrl %}
+      <a href="{{ url }}" style="text-decoration:none;color:#ffffff" target="_blank">{{ title }}</a>
+    {% else %}
+      {{ title }}
+    {% endif %}
+  {% endif %}
+{% endmacro %}
+
+{% if loaded %}
+    {% if config.showAsList %}
+        <ul class="newsfeed-list">
+            {% for item in items %}
+                <li>
+                    {% if (config.showSourceTitle and item.sourceTitle) or config.showPublishDate %}
+                        <div class="newsfeed-source light small dimmed">
+                            {% if item.sourceTitle and config.showSourceTitle %}
+                                {{ item.sourceTitle }}{% if config.showPublishDate %}, {% else %}: {% endif %}
+                            {% endif %}
+                            {% if config.showPublishDate %}
+                                {{ item.publishDate }}:
+                            {% endif %}
+                        </div>
+                    {% endif %}
+                    <div class="newsfeed-title bright medium light{{ ' no-wrap' if not config.wrapTitle }}">
+                        {{ escapeTitle(item.title, item.url, config.dangerouslyDisableAutoEscaping, config.showTitleAsUrl) }}
+                    </div>
+                    {% if config.showDescription %}
+                        <div class="newsfeed-desc small light{{ ' no-wrap' if not config.wrapDescription }}">
+                            {% if config.truncDescription %}
+                                {{ escapeText(item.description | truncate(config.lengthDescription), config.dangerouslyDisableAutoEscaping) }}
+                            {% else %}
+                                {{ escapeText(item.description, config.dangerouslyDisableAutoEscaping) }}
+                            {% endif %}
+                        </div>
+                    {% endif %}
+                </li>
+            {% endfor %}
+        </ul>
+    {% else %}
+        <div>
+            {% if (config.showSourceTitle and sourceTitle) or config.showPublishDate %}
+                <div class="newsfeed-source light small dimmed">
+                    {% if sourceTitle and config.showSourceTitle %}
+                        {{ escapeText(sourceTitle, config.dangerouslyDisableAutoEscaping) }}{% if config.showPublishDate %}, {% else %}: {% endif %}
+                    {% endif %}
+                    {% if config.showPublishDate %}
+                        {{ publishDate }}:
+                    {% endif %}
+                </div>
+            {% endif %}
+            <div class="newsfeed-title bright medium light{{ ' no-wrap' if not config.wrapTitle }}">
+                {{ escapeTitle(title, url, config.dangerouslyDisableAutoEscaping, config.showTitleAsUrl) }}
+            </div>
+            {% if config.showDescription %}
+                <div class="newsfeed-desc small light{{ ' no-wrap' if not config.wrapDescription }}">
+                    {% if config.truncDescription %}
+                        {{ escapeText(description | truncate(config.lengthDescription), config.dangerouslyDisableAutoEscaping) }}
+                    {% else %}
+                        {{ escapeText(description, config.dangerouslyDisableAutoEscaping) }}
+                    {% endif %}
+                </div>
+            {% endif %}
+        </div>
+    {% endif %}
+{% elseif empty %}
+    <div class="small dimmed">
+        {{ "NEWSFEED_NO_ITEMS" | translate | safe }}
+    </div>
+{% elseif error %}
+    <div class="small dimmed">
+        {{ "MODULE_CONFIG_ERROR" | translate({MODULE_NAME: "Newsfeed", ERROR: error}) | safe }}
+    </div>
+{% else %}
+    <div class="small dimmed">
+        {{ "LOADING" | translate | safe }}
+    </div>
+{% endif %}

modules/default/newsfeed/newsfeedfetcher.js

@@ -0,0 +1,183 @@
+/* MagicMirror²
+ * Node Helper: Newsfeed - NewsfeedFetcher
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ */
+
+const stream = require("stream");
+const FeedMe = require("feedme");
+const iconv = require("iconv-lite");
+const fetch = require("fetch");
+const Log = require("logger");
+const NodeHelper = require("node_helper");
+
+/**
+ * Responsible for requesting an update on the set interval and broadcasting the data.
+ * @param {string} url URL of the news feed.
+ * @param {number} reloadInterval Reload interval in milliseconds.
+ * @param {string} encoding Encoding of the feed.
+ * @param {boolean} logFeedWarnings If true log warnings when there is an error parsing a news article.
+ * @param {boolean} useCorsProxy If true cors proxy is used for article url's.
+ * @class
+ */
+const NewsfeedFetcher = function (url, reloadInterval, encoding, logFeedWarnings, useCorsProxy) {
+	let reloadTimer = null;
+	let items = [];
+	let reloadIntervalMS = reloadInterval;
+
+	let fetchFailedCallback = function () {};
+	let itemsReceivedCallback = function () {};
+
+	if (reloadIntervalMS < 1000) {
+		reloadIntervalMS = 1000;
+	}
+
+	/* private methods */
+
+	/**
+	 * Request the new items.
+	 */
+	const fetchNews = () => {
+		clearTimeout(reloadTimer);
+		reloadTimer = null;
+		items = [];
+
+		const parser = new FeedMe();
+
+		parser.on("item", (item) => {
+			const title = item.title;
+			let description = item.description || item.summary || item.content || "";
+			const pubdate = item.pubdate || item.published || item.updated || item["dc:date"];
+			const url = item.url || item.link || "";
+
+			if (title && pubdate) {
+				const regex = /(<([^>]+)>)/gi;
+				description = description.toString().replace(regex, "");
+
+				items.push({
+					title: title,
+					description: description,
+					pubdate: pubdate,
+					url: url,
+					useCorsProxy: useCorsProxy
+				});
+			} else if (logFeedWarnings) {
+				Log.warn("Can't parse feed item:");
+				Log.warn(item);
+				Log.warn(`Title: ${title}`);
+				Log.warn(`Description: ${description}`);
+				Log.warn(`Pubdate: ${pubdate}`);
+			}
+		});
+
+		parser.on("end", () => {
+			this.broadcastItems();
+		});
+
+		parser.on("error", (error) => {
+			fetchFailedCallback(this, error);
+			scheduleTimer();
+		});
+
+		//"end" event is not broadcast if the feed is empty but "finish" is used for both
+		parser.on("finish", () => {
+			scheduleTimer();
+		});
+
+		parser.on("ttl", (minutes) => {
+			try {
+				// 86400000 = 24 hours is mentioned in the docs as maximum value:
+				const ttlms = Math.min(minutes * 60 * 1000, 86400000);
+				if (ttlms > reloadIntervalMS) {
+					reloadIntervalMS = ttlms;
+					Log.info(`Newsfeed-Fetcher: reloadInterval set to ttl=${reloadIntervalMS} for url ${url}`);
+				}
+			} catch (error) {
+				Log.warn(`Newsfeed-Fetcher: feed ttl is no valid integer=${minutes} for url ${url}`);
+			}
+		});
+
+		const nodeVersion = Number(process.version.match(/^v(\d+\.\d+)/)[1]);
+		const headers = {
+			"User-Agent": `Mozilla/5.0 (Node.js ${nodeVersion}) MagicMirror/${global.version}`,
+			"Cache-Control": "max-age=0, no-cache, no-store, must-revalidate",
+			Pragma: "no-cache"
+		};
+
+		fetch(url, { headers: headers })
+			.then(NodeHelper.checkFetchStatus)
+			.then((response) => {
+				let nodeStream;
+				if (response.body instanceof stream.Readable) {
+					nodeStream = response.body;
+				} else {
+					nodeStream = stream.Readable.fromWeb(response.body);
+				}
+				nodeStream.pipe(iconv.decodeStream(encoding)).pipe(parser);
+			})
+			.catch((error) => {
+				fetchFailedCallback(this, error);
+				scheduleTimer();
+			});
+	};
+
+	/**
+	 * Schedule the timer for the next update.
+	 */
+	const scheduleTimer = function () {
+		clearTimeout(reloadTimer);
+		reloadTimer = setTimeout(function () {
+			fetchNews();
+		}, reloadIntervalMS);
+	};
+
+	/* public methods */
+
+	/**
+	 * Update the reload interval, but only if we need to increase the speed.
+	 * @param {number} interval Interval for the update in milliseconds.
+	 */
+	this.setReloadInterval = function (interval) {
+		if (interval > 1000 && interval < reloadIntervalMS) {
+			reloadIntervalMS = interval;
+		}
+	};
+
+	/**
+	 * Initiate fetchNews();
+	 */
+	this.startFetch = function () {
+		fetchNews();
+	};
+
+	/**
+	 * Broadcast the existing items.
+	 */
+	this.broadcastItems = function () {
+		if (items.length <= 0) {
+			Log.info("Newsfeed-Fetcher: No items to broadcast yet.");
+			return;
+		}
+		Log.info(`Newsfeed-Fetcher: Broadcasting ${items.length} items.`);
+		itemsReceivedCallback(this);
+	};
+
+	this.onReceive = function (callback) {
+		itemsReceivedCallback = callback;
+	};
+
+	this.onError = function (callback) {
+		fetchFailedCallback = callback;
+	};
+
+	this.url = function () {
+		return url;
+	};
+
+	this.items = function () {
+		return items;
+	};
+};
+
+module.exports = NewsfeedFetcher;

modules/default/newsfeed/node_helper.js

@@ -0,0 +1,86 @@
+/* MagicMirror²
+ * Node Helper: Newsfeed
+ *
+ * By Michael Teeuw https://michaelteeuw.nl
+ * MIT Licensed.
+ */
+
+const NodeHelper = require("node_helper");
+const Log = require("logger");
+const NewsfeedFetcher = require("./newsfeedfetcher");
+
+module.exports = NodeHelper.create({
+	// Override start method.
+	start: function () {
+		Log.log(`Starting node helper for: ${this.name}`);
+		this.fetchers = [];
+	},
+
+	// Override socketNotificationReceived received.
+	socketNotificationReceived: function (notification, payload) {
+		if (notification === "ADD_FEED") {
+			this.createFetcher(payload.feed, payload.config);
+		}
+	},
+
+	/**
+	 * Creates a fetcher for a new feed if it doesn't exist yet.
+	 * Otherwise it reuses the existing one.
+	 * @param {object} feed The feed object
+	 * @param {object} config The configuration object
+	 */
+	createFetcher: function (feed, config) {
+		const url = feed.url || "";
+		const encoding = feed.encoding || "UTF-8";
+		const reloadInterval = feed.reloadInterval || config.reloadInterval || 5 * 60 * 1000;
+		let useCorsProxy = feed.useCorsProxy;
+		if (useCorsProxy === undefined) useCorsProxy = true;
+
+		try {
+			new URL(url);
+		} catch (error) {
+			Log.error("Newsfeed Error. Malformed newsfeed url: ", url, error);
+			this.sendSocketNotification("NEWSFEED_ERROR", { error_type: "MODULE_ERROR_MALFORMED_URL" });
+			return;
+		}
+
+		let fetcher;
+		if (typeof this.fetchers[url] === "undefined") {
+			Log.log(`Create new newsfetcher for url: ${url} - Interval: ${reloadInterval}`);
+			fetcher = new NewsfeedFetcher(url, reloadInterval, encoding, config.logFeedWarnings, useCorsProxy);
+
+			fetcher.onReceive(() => {
+				this.broadcastFeeds();
+			});
+
+			fetcher.onError((fetcher, error) => {
+				Log.error("Newsfeed Error. Could not fetch newsfeed: ", url, error);
+				let error_type = NodeHelper.checkFetchError(error);
+				this.sendSocketNotification("NEWSFEED_ERROR", {
+					error_type
+				});
+			});
+
+			this.fetchers[url] = fetcher;
+		} else {
+			Log.log(`Use existing newsfetcher for url: ${url}`);
+			fetcher = this.fetchers[url];
+			fetcher.setReloadInterval(reloadInterval);
+			fetcher.broadcastItems();
+		}
+
+		fetcher.startFetch();
+	},
+
+	/**
+	 * Creates an object with all feed items of the different registered feeds,
+	 * and broadcasts these using sendSocketNotification.
+	 */
+	broadcastFeeds: function () {
+		const feeds = {};
+		for (let f in this.fetchers) {
+			feeds[f] = this.fetchers[f].items();
+		}
+		this.sendSocketNotification("NEWS_ITEMS", feeds);
+	}
+});

modules/default/newsfeed/oldconfig.njk

@@ -0,0 +1,3 @@
+<div class="small bright">
+    {{ "MODULE_CONFIG_CHANGED" | translate({MODULE_NAME: "Newsfeed"}) | safe }}
+</div>

modules/default/updatenotification/README.md

@@ -0,0 +1,6 @@
+# Module: Update Notification
+
+The `updatenotification` module is one of the default modules of the MagicMirror².
+This will display a message whenever a new version of the MagicMirror² application is available.
+
+For configuration options, please check the [MagicMirror² documentation](https://docs.magicmirror.builders/modules/updatenotification.html).

modules/default/updatenotification/git_helper.js

@@ -0,0 +1,213 @@
+const util = require("util");
+const exec = util.promisify(require("child_process").exec);
+const fs = require("fs");
+const path = require("path");
+const Log = require("logger");
+
+const BASE_DIR = path.normalize(`${__dirname}/../../../`);
+
+class GitHelper {
+	constructor() {
+		this.gitRepos = [];
+		this.gitResultList = [];
+	}
+
+	getRefRegex(branch) {
+		return new RegExp(`s*([a-z,0-9]+[.][.][a-z,0-9]+)  ${branch}`, "g");
+	}
+
+	async execShell(command) {
+		const { stdout = "", stderr = "" } = await exec(command);
+
+		return { stdout, stderr };
+	}
+
+	async isGitRepo(moduleFolder) {
+		const { stderr } = await this.execShell(`cd ${moduleFolder} && git remote -v`);
+
+		if (stderr) {
+			Log.error(`Failed to fetch git data for ${moduleFolder}: ${stderr}`);
+
+			return false;
+		}
+
+		return true;
+	}
+
+	async add(moduleName) {
+		let moduleFolder = BASE_DIR;
+
+		if (moduleName !== "MagicMirror") {
+			moduleFolder = `${moduleFolder}modules/${moduleName}`;
+		}
+
+		try {
+			Log.info(`Checking git for module: ${moduleName}`);
+			// Throws error if file doesn't exist
+			fs.statSync(path.join(moduleFolder, ".git"));
+
+			// Fetch the git or throw error if no remotes
+			const isGitRepo = await this.isGitRepo(moduleFolder);
+
+			if (isGitRepo) {
+				// Folder has .git and has at least one git remote, watch this folder
+				this.gitRepos.push({ module: moduleName, folder: moduleFolder });
+			}
+		} catch (err) {
+			// Error when directory .git doesn't exist or doesn't have any remotes
+			// This module is not managed with git, skip
+		}
+	}
+
+	async getStatusInfo(repo) {
+		let gitInfo = {
+			module: repo.module,
+			behind: 0, // commits behind
+			current: "", // branch name
+			hash: "", // current hash
+			tracking: "", // remote branch
+			isBehindInStatus: false
+		};
+
+		if (repo.module === "MagicMirror") {
+			// the hash is only needed for the mm repo
+			const { stderr, stdout } = await this.execShell(`cd ${repo.folder} && git rev-parse HEAD`);
+
+			if (stderr) {
+				Log.error(`Failed to get current commit hash for ${repo.module}: ${stderr}`);
+			}
+
+			gitInfo.hash = stdout;
+		}
+
+		const { stderr, stdout } = await this.execShell(`cd ${repo.folder} && git status -sb`);
+
+		if (stderr) {
+			Log.error(`Failed to get git status for ${repo.module}: ${stderr}`);
+			// exit without git status info
+			return;
+		}
+
+		// only the first line of stdout is evaluated
+		let status = stdout.split("\n")[0];
+		// examples for status:
+		// ## develop...origin/develop
+		// ## master...origin/master [behind 8]
+		// ## master...origin/master [ahead 8, behind 1]
+		// ## HEAD (no branch)
+		status = status.match(/## (.*)\.\.\.([^ ]*)(?: .*behind (\d+))?/);
+		// examples for status:
+		// [ '## develop...origin/develop', 'develop', 'origin/develop' ]
+		// [ '## master...origin/master [behind 8]', 'master', 'origin/master', '8' ]
+		// [ '## master...origin/master [ahead 8, behind 1]', 'master', 'origin/master', '1' ]
+		if (status) {
+			gitInfo.current = status[1];
+			gitInfo.tracking = status[2];
+
+			if (status[3]) {
+				// git fetch was already called before so `git status -sb` delivers already the behind number
+				gitInfo.behind = parseInt(status[3]);
+				gitInfo.isBehindInStatus = true;
+			}
+		}
+
+		return gitInfo;
+	}
+
+	async getRepoInfo(repo) {
+		const gitInfo = await this.getStatusInfo(repo);
+
+		if (!gitInfo || !gitInfo.current) {
+			return;
+		}
+
+		if (gitInfo.isBehindInStatus && (gitInfo.module !== "MagicMirror" || gitInfo.current !== "master")) {
+			return gitInfo;
+		}
+
+		const { stderr } = await this.execShell(`cd ${repo.folder} && git fetch -n --dry-run`);
+
+		// example output:
+		// From https://github.com/MichMich/MagicMirror
+		//    e40ddd4..06389e3  develop    -> origin/develop
+		// here the result is in stderr (this is a git default, don't ask why ...)
+		const matches = stderr.match(this.getRefRegex(gitInfo.current));
+
+		// this is the default if there was no match from "git fetch -n --dry-run".
+		// Its a fallback because if there was a real "git fetch", the above "git fetch -n --dry-run" would deliver nothing.
+		let refDiff = `${gitInfo.current}..origin/${gitInfo.current}`;
+		if (matches && matches[0]) {
+			refDiff = matches[0];
+		}
+
+		// get behind with refs
+		try {
+			const { stdout } = await this.execShell(`cd ${repo.folder} && git rev-list --ancestry-path --count ${refDiff}`);
+			gitInfo.behind = parseInt(stdout);
+
+			// for MagicMirror-Repo and "master" branch avoid getting notified when no tag is in refDiff
+			// so only releases are reported and we can change e.g. the README.md without sending notifications
+			if (gitInfo.behind > 0 && gitInfo.module === "MagicMirror" && gitInfo.current === "master") {
+				let tagList = "";
+				try {
+					const { stdout } = await this.execShell(`cd ${repo.folder} && git ls-remote -q --tags --refs`);
+					tagList = stdout.trim();
+				} catch (err) {
+					Log.error(`Failed to get tag list for ${repo.module}: ${err}`);
+				}
+				// check if tag is between commits and only report behind > 0 if so
+				try {
+					const { stdout } = await this.execShell(`cd ${repo.folder} && git rev-list --ancestry-path ${refDiff}`);
+					let cnt = 0;
+					for (const ref of stdout.trim().split("\n")) {
+						if (tagList.includes(ref)) cnt++; // tag found
+					}
+					if (cnt === 0) gitInfo.behind = 0;
+				} catch (err) {
+					Log.error(`Failed to get git revisions for ${repo.module}: ${err}`);
+				}
+			}
+
+			return gitInfo;
+		} catch (err) {
+			Log.error(`Failed to get git revisions for ${repo.module}: ${err}`);
+		}
+	}
+
+	async getRepos() {
+		this.gitResultList = [];
+
+		for (const repo of this.gitRepos) {
+			try {
+				const gitInfo = await this.getRepoInfo(repo);
+
+				if (gitInfo) {
+					this.gitResultList.push(gitInfo);
+				}
+			} catch (e) {
+				Log.error(`Failed to retrieve repo info for ${repo.module}: ${e}`);
+			}
+		}
+
+		return this.gitResultList;
+	}
+
+	async checkUpdates() {
+		var updates = [];
+
+		const allRepos = await this.gitResultList.map((module) => {
+			return new Promise((resolve) => {
+				if (module.behind > 0 && module.module !== "MagicMirror") {
+					Log.info(`Update found for module: ${module.module}`);
+					updates.push(module);
+				}
+				resolve(module);
+			});
+		});
+		await Promise.all(allRepos);
+
+		return updates;
+	}
+}
+
+module.exports = GitHelper;