Release 2.28.0 (#3490)

## [2.28.0] - 2024-07-01

Thanks to: @btoconnor, @bugsounet, @JasonStieber, @khassel,
@kleinmantara and @WallysWellies.

> ⚠️ This release needs nodejs version >= v20

### Added

- [calendar] Added config option "showEndsOnlyWithDuration" for default
calendar
- [compliments] Added `specialDayUnique` config option, defaults to
`false` (#3465)
- [weather] Provider weathergov: Use `precipitationLast3Hours` if
`precipitationLastHour` is `null` (#3124)

### Removed

- [tests] delete node v18 support (#3462)

### Updated

- [core] Update dependencies including electron to v31
- [core] use node >= v20 (#3462)
- [core] Update `config.js.sample` to use openmeteo as weather provider
which needs no api key
- [tests] Use latest@version of node for `automated-tests.yaml` (#3483)
- [updatenotification] Avoid using pm2 when running in docker container

### Fixed

- [core] Fixed crash possibility if `module: <name>` is not defined and
on `postion: <positon>` mistake (#3445)
- [weather] Fixed precipitationProbability in forecast for provider
openmeteo (#3446)
- [weather] Fixed type=daily for provider openmeteo having no data when
running after 23:00 (#3449)
- [weather] Fixed type=daily for provider openmeteo showing nightly
icons in forecast when current time is "nightly" (#3458)
- [weather] Fixed forecast and hourly weather for provider openmeteo to
use real temperatures, not apparent temperatures (#3466)
- [tests] Fixed e2e tests running in docker container which needs
`address: "0.0.0.0"` (#3479)

---------

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Michael Teeuw <michael@xonaymedia.nl>
Co-authored-by: Kristjan ESPERANTO <35647502+KristjanESPERANTO@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Ross Younger <crazyscot@gmail.com>
Co-authored-by: Veeck <github@veeck.de>
Co-authored-by: Bugsounet - Cédric <github@bugsounet.fr>
Co-authored-by: jkriegshauser <joshuakr@nvidia.com>
Co-authored-by: illimarkangur <116028111+illimarkangur@users.noreply.github.com>
Co-authored-by: sam detweiler <sdetweil@gmail.com>
Co-authored-by: vppencilsharpener <tim.pray@gmail.com>
Co-authored-by: veeck <michael.veeck@nebenan.de>
Co-authored-by: Paranoid93 <6515818+Paranoid93@users.noreply.github.com>
Co-authored-by: Brian O'Connor <btoconnor@users.noreply.github.com>
Co-authored-by: WallysWellies <59727507+WallysWellies@users.noreply.github.com>
Co-authored-by: Jason Stieber <jrstieber@gmail.com>

.eslintignore

@@ -1 +1,2 @@
-modules/default/calendar/vendor/*
+modules/*
+!modules/default/

.eslintrc.json

@@ -1,9 +1,9 @@
 {
-	"extends": ["eslint:recommended", "plugin:prettier/recommended", "plugin:jsdoc/recommended"],
-	"plugins": ["prettier", "jsdoc", "jest"],
+	"extends": ["eslint:recommended", "plugin:@stylistic/all-extends", "plugin:import/recommended", "plugin:jest/recommended", "plugin:jsdoc/recommended"],
+	"plugins": ["unicorn"],
 	"env": {
 		"browser": true,
-		"es6": true,
+		"es2024": true,
 		"jest/globals": true,
 		"node": true
 	},
@@ -16,16 +16,78 @@
 	},
 	"parserOptions": {
 		"sourceType": "module",
-		"ecmaVersion": 2017,
+		"ecmaVersion": "latest",
 		"ecmaFeatures": {
 			"globalReturn": true
 		}
 	},
 	"rules": {
-		"prettier/prettier": "error",
 		"eqeqeq": "error",
+		"import/order": "error",
+		"import/extensions": "error",
+		"import/newline-after-import": "error",
+		"jest/consistent-test-it": "warn",
+		"jest/expect-expect": "warn",
+		"jest/no-done-callback": "warn",
+		"jest/prefer-expect-resolves": "warn",
+		"jest/prefer-mock-promise-shorthand": "warn",
+		"jest/prefer-to-be": "warn",
+		"jest/prefer-to-have-length": "warn",
+		"no-param-reassign": "error",
 		"no-prototype-builtins": "off",
+		"no-throw-literal": "error",
 		"no-unused-vars": "off",
-		"no-useless-return": "error"
-	}
+		"no-useless-return": "error",
+		"object-shorthand": ["error", "methods"],
+		"prefer-template": "error",
+		"@stylistic/array-element-newline": ["error", "consistent"],
+		"@stylistic/arrow-parens": ["error", "always"],
+		"@stylistic/brace-style": "off",
+		"@stylistic/comma-dangle": ["error", "never"],
+		"@stylistic/dot-location": ["error", "property"],
+		"@stylistic/function-call-argument-newline": ["error", "consistent"],
+		"@stylistic/function-paren-newline": ["error", "consistent"],
+		"@stylistic/implicit-arrow-linebreak": ["error", "beside"],
+		"@stylistic/max-statements-per-line": ["error", { "max": 2 }],
+		"@stylistic/multiline-ternary": ["error", "always-multiline"],
+		"@stylistic/newline-per-chained-call": ["error", { "ignoreChainWithDepth": 4 }],
+		"@stylistic/no-extra-parens": "off",
+		"@stylistic/no-tabs": "off",
+		"@stylistic/object-curly-spacing": ["error", "always"],
+		"@stylistic/object-property-newline": ["error", { "allowAllPropertiesOnSameLine": true }],
+		"@stylistic/operator-linebreak": ["error", "before"],
+		"@stylistic/padded-blocks": "off",
+		"@stylistic/quote-props": ["error", "as-needed"],
+		"@stylistic/quotes": ["error", "double"],
+		"@stylistic/indent": ["error", "tab"],
+		"@stylistic/semi": ["error", "always"],
+		"@stylistic/space-before-function-paren": ["error", "always"],
+		"@stylistic/spaced-comment": "off",
+		"unicorn/prefer-node-protocol": "error"
+	},
+	"overrides": [
+		{
+			"files": ["config/config.js*"],
+			"rules": {
+				"@stylistic/comma-dangle": "off",
+				"@stylistic/indent": "off",
+				"@stylistic/no-multi-spaces": "off"
+			}
+		},
+		{
+			"files": ["tests/configs/modules/weather/*.js"],
+			"rules": {
+				"@stylistic/quotes": "off"
+			}
+		},
+		{
+			"extends": ["plugin:package-json/recommended"],
+			"files": ["package.json"],
+			"parser": "jsonc-eslint-parser",
+			"plugins": ["package-json"],
+			"rules": {
+				"package-json/sort-collections": ["error", ["devDependencies", "dependencies", "peerDependencies", "config"]]
+			}
+		}
+	]
 }

.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

.github/CONTRIBUTING.md

@@ -4,23 +4,34 @@ Thanks for contributing to MagicMirror²!
 
 We hold our code to standard, and these standards are documented below.
 
-If you wish to run our linters, use `npm run lint` without any arguments.
+## Linters
+
+We use prettier for automatic linting of all our files: `npm run lint:prettier`.
 
 ### JavaScript: Run ESLint
 
 We use [ESLint](https://eslint.org) on our JavaScript files.
 
-Our ESLint configuration is in our .eslintrc.json and .eslintignore files.
+Our ESLint configuration is in our `.eslintrc.json` and `.eslintignore` files.
 
 To run ESLint, use `npm run lint:js`.
 
 ### CSS: Run StyleLint
 
-We use [StyleLint](https://stylelint.io) to lint our CSS. Our configuration is in our .stylelintrc file.
+We use [StyleLint](https://stylelint.io) to lint our CSS. Our configuration is in our `.stylelintrc` file.
 
 To run StyleLint, use `npm run lint:css`.
 
-### Submitting Issues
+## Testing
+
+We use [Jest](https://jestjs.io) for JavaScript testing.
+
+To run all tests, use `npm run test`.
+
+The specific test commands are defined in `package.json`.
+So you can also run the specific tests with other commands, e.g. `npm run test:unit` or `npx jest tests/e2e/env_spec.js`.
+
+## Submitting Issues
 
 Please only submit reproducible issues.
 
@@ -32,9 +43,9 @@ When submitting a new issue, please supply the following information:
 
 **Platform**: Place your platform here... give us your web browser/Electron version _and_ your hardware (Raspberry Pi 2/3/4, Windows, Mac, Linux, System V UNIX).
 
-**Node Version**: Make sure it's version 12 or later (recommended is 14).
+**Node Version**: Make sure it's version 18 or later (recommended is 20).
 
-**MagicMirror Version**: Please let us know which version of MagicMirror you are running. It can be found in the `package.json` file.
+**MagicMirror² Version**: Please let us know which version of MagicMirror² you are running. It can be found in the `package.json` file.
 
 **Description**: Provide a detailed description about the issue and include specific details to help us understand the problem. Adding screenshots will help describing the problem.
 

.github/ISSUE_TEMPLATE.md

@@ -1,6 +1,6 @@
 Hello and thank you for opening an issue.
 
-**Please make sure that you have read the following lines before submitting your Issue:**
+**⚠️ Please make sure that you have read the following lines before submitting your Issue:**
 
 ## I'm not sure if this is a bug
 
@@ -10,19 +10,21 @@ If you're not sure if it's a real bug or if it's just you, please open a topic o
 
 Problems installing or configuring your MagicMirror? Check out: [https://forum.magicmirror.builders/category/10/troubleshooting](https://forum.magicmirror.builders/category/10/troubleshooting)
 
-A common problem is that your config file could be invalid. Please run in your MagicMirror directory: `npm run config:check` and see if it reports an error.
+A common problem is that your config file could be invalid. Please run in your MagicMirror² directory: `npm run config:check` and see if it reports an error.
 
-## I found a bug in the MagicMirror installer
+## I found a bug in the MagicMirror² installer
 
-If you are facing an issue or found a bug while trying to install MagicMirror via the installer please report it in the respective GitHub repository:
+If you are facing an issue or found a bug while trying to install MagicMirror² via the installer please report it in the respective GitHub repository:
 [https://github.com/sdetweil/MagicMirror_scripts](https://github.com/sdetweil/MagicMirror_scripts)
 
-## I found a bug in the MagicMirror Docker image
+## I found a bug in the MagicMirror² Docker image
 
-If you are facing an issue or found a bug while running MagicMirror inside a Docker container please create an issue in the corresponding repository:
+If you are facing an issue or found a bug while running MagicMirror² inside a Docker container please create an issue in the corresponding repository:
+[https://gitlab.com/khassel/magicmirror](https://gitlab.com/khassel/magicmirror)
 
-- karsten13/magicmirror: [https://gitlab.com/khassel/magicmirror](https://gitlab.com/khassel/magicmirror)
-- (deprecated) bastilimbach/docker-magicmirror: [https://github.com/bastilimbach/docker-MagicMirror](https://github.com/bastilimbach/docker-MagicMirror)
+## I'm having troubles installing or configuring foreign modules
+
+Please open an issue in the module repository or ask for help in the [forum](https://forum.magicmirror.builders/)
 
 ---
 
@@ -33,9 +35,9 @@ When submitting a new issue, please supply the following information:
 
 **Platform**: Place your platform here... give us your web browser/Electron version _and_ your hardware (Raspberry Pi 2/3/4, Windows, Mac, Linux, System V UNIX).
 
-**Node Version**: Make sure it's version 12 or later (recommended is 14).
+**Node Version**: Make sure it's version 18 or later (recommended is 20).
 
-**MagicMirror Version**: Please let us know which version of MagicMirror you are running. It can be found in the `package.json` file.
+**MagicMirror² Version**: Please let us know which version of MagicMirror² you are running. It can be found in the `package.json` file.
 
 **Description**: Provide a detailed description about the issue and include specific details to help us understand the problem. Adding screenshots will help describing the problem.
 

.github/PULL_REQUEST_TEMPLATE.md

@@ -1,9 +1,8 @@
-Hello and thank you for wanting to contribute to the MagicMirror project
+Hello and thank you for wanting to contribute to the MagicMirror² project
 
 **Please make sure that you have followed these 4 rules before submitting your Pull Request:**
 
 > 1. Base your pull requests against the `develop` branch.
->
 > 2. Include these infos in the description:
 >
 > - Does the pull request solve a **related** issue?
@@ -13,7 +12,6 @@ Hello and thank you for wanting to contribute to the MagicMirror project
 >
 > 3. Please run `npm run lint:prettier` before submitting so that
 >    style issues are fixed.
->
 > 4. Don't forget to add an entry about your changes to
 >    the CHANGELOG.md file.
 

.github/codecov.yml

@@ -1,6 +0,0 @@
-coverage:
-  status:
-    project:
-      default:
-        # advanced settings
-        informational: true

.github/dependabot.yaml

@@ -0,0 +1,40 @@
+version: 2
+updates:
+  - package-ecosystem: "github-actions"
+    directory: "/"
+    schedule:
+      interval: "weekly"
+    target-branch: "develop"
+    labels:
+      - "Skip Changelog"
+      - "dependencies"
+
+  - package-ecosystem: "npm"
+    directory: "/"
+    schedule:
+      interval: "monthly"
+    target-branch: "develop"
+    labels:
+      - "Skip Changelog"
+      - "dependencies"
+      - "javascript"
+
+  - package-ecosystem: "npm"
+    directory: "/vendor"
+    schedule:
+      interval: "monthly"
+    target-branch: "develop"
+    labels:
+      - "Skip Changelog"
+      - "dependencies"
+      - "javascript"
+
+  - package-ecosystem: "npm"
+    directory: "/fonts"
+    schedule:
+      interval: "monthly"
+    target-branch: "develop"
+    labels:
+      - "Skip Changelog"
+      - "dependencies"
+      - "javascript"

.github/workflows/automated-tests.yaml

@@ -9,29 +9,34 @@ on:
   pull_request:
     branches: [master, develop]
 
+permissions:
+  contents: read
+
 jobs:
   test:
     runs-on: ubuntu-latest
     timeout-minutes: 30
     strategy:
       matrix:
-        node-version: [12.x, 14.x, 16.x]
+        node-version: [20.x, 22.x]
     steps:
-      - name: Checkout code
-        uses: actions/checkout@v2
-      - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v1
+      - name: "Checkout code"
+        uses: actions/checkout@v4
+      - name: "Use Node.js ${{ matrix.node-version }}"
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
-      - name: Install dependencies and run tests
+          check-latest: true
+          cache: "npm"
+      - name: "Install dependencies"
+        run: |
+          npm run install-mm:dev
+      - name: "Run tests"
         run: |
           Xvfb :99 -screen 0 1024x768x16 &
           export DISPLAY=:99
-          npm install
           touch css/custom.css
           npm run test:prettier
           npm run test:js
           npm run test:css
-          npm run test:unit
-          npm run test:e2e
-          npm run test:electron
+          npm run test

.github/workflows/codecov-test-suites.yml

@@ -1,29 +0,0 @@
-# This workflow runs the automated test and uploads the coverage results to codecov.io
-
-name: "Run Codecov Tests"
-
-on:
-  push:
-    branches: [master, develop]
-  pull_request:
-    branches: [master, develop]
-
-jobs:
-  run-and-upload-coverage-report:
-    runs-on: ubuntu-latest
-    timeout-minutes: 30
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v2
-      - name: Install dependencies and run coverage
-        run: |
-          Xvfb :99 -screen 0 1024x768x16 &
-          export DISPLAY=:99
-          npm ci
-          touch css/custom.css
-          npm run test:coverage
-      - name: Upload coverage results to codecov
-        uses: codecov/codecov-action@v1
-        with:
-          file: ./coverage/lcov.info
-          fail_ci_if_error: true

.github/workflows/depsreview.yaml

@@ -0,0 +1,18 @@
+# This workflow scans your pull requests for dependency changes, and will raise an error if any vulnerabilities or invalid licenses are being introduced.
+# For more information see: https://github.com/actions/dependency-review-action
+
+name: "Review Dependencies"
+
+on: [pull_request]
+
+permissions:
+  contents: read
+
+jobs:
+  dependency-review:
+    runs-on: ubuntu-latest
+    steps:
+      - name: "Checkout code"
+        uses: actions/checkout@v4
+      - name: "Dependency Review"
+        uses: actions/dependency-review-action@v4

.github/workflows/electronRebuild.yaml

@@ -0,0 +1,28 @@
+name: "Electron Rebuild Testing"
+
+on: [pull_request]
+
+jobs:
+  rebuild:
+    name: Run electron-rebuild
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node-version: [20.x, 22.x]
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+      - name: "Use Node.js ${{ matrix.node-version }}"
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ matrix.node-version }}
+          check-latest: true
+      - name: Install MagicMirror
+        run: npm run install-mm
+      - name: Install @electron/rebuild
+        run: npm install @electron/rebuild
+      - name: Install some test library to be rebuilded
+        run: npm install onoff node-pty drivelist
+      - name: Run electron-rebuild
+        run: npx electron-rebuild
+        continue-on-error: false

.github/workflows/enforce-changelog.yml

@@ -1,20 +0,0 @@
-# This workflow enforces the update of a changelog file on every pull request
-
-name: "Enforce Changelog"
-
-on:
-  pull_request:
-    types: [opened, synchronize, reopened, ready_for_review, labeled, unlabeled]
-
-jobs:
-  check:
-    runs-on: ubuntu-latest
-    timeout-minutes: 10
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v2
-      - name: Enforce changelog️
-        uses: dangoslen/changelog-enforcer@v1.6.1
-        with:
-          changeLogPath: "CHANGELOG.md"
-          skipLabels: "Skip Changelog"

.github/workflows/enforce-pullrequest-rules.yaml

@@ -0,0 +1,28 @@
+# This workflow enforces on every pull request:
+# - the update of our CHANGELOG.md file, see: https://github.com/dangoslen/changelog-enforcer
+# - that the PR is not based against master, taken from https://github.com/oppia/oppia-android/pull/2832/files
+
+name: "Enforce Pull-Request Rules"
+
+on:
+  pull_request:
+    types: [opened, synchronize, reopened, ready_for_review, labeled, unlabeled]
+
+jobs:
+  check:
+    runs-on: ubuntu-latest
+    timeout-minutes: 10
+    steps:
+      - name: "Enforce changelog"
+        uses: dangoslen/changelog-enforcer@v3
+        with:
+          changeLogPath: "CHANGELOG.md"
+          skipLabels: "Skip Changelog"
+      - name: "Enforce develop branch"
+        if: ${{ github.event.pull_request.base.ref == 'master' && !contains(github.event.pull_request.labels.*.name, 'mastermerge') }}
+        run: |
+          echo "This PR is based against the master branch and not a release or hotfix."
+          echo "Please don't do this. Switch the branch to 'develop'."
+          exit 1
+        env:
+          BASE_BRANCH: ${{ github.base_ref }}

.gitignore

@@ -16,7 +16,6 @@ vendor/node_modules/**/*
 jspm_modules
 .npm
 .node_repl_history
-.nyc_output/
 
 # Visual Studio Code ignoramuses.
 .vscode/
@@ -64,8 +63,10 @@ Temporary Items
 !/modules/default/**
 !/modules/README.md**
 
-# Ignore changes to the custom css files.
-/css/custom.css
+# Ignore changes to the custom css files but keep the sample and main.
+/css/*
+!/css/custom.css.sample
+!/css/main.css
 
 # Ignore users config file but keep the sample.
 /config/*

.husky/pre-commit

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

.npmrc

@@ -0,0 +1,3 @@
+engine-strict=true
+audit=false
+loglevel="error"

.prettierignore

@@ -1,4 +1,8 @@
+*.js
+.eslintignore
+.husky/pre-commit
+.prettierignore
 /config
 /coverage
-.nyc_output
 package-lock.json
+**.ics

.stylelintrc.json

@@ -1,5 +1,5 @@
 {
-	"extends": ["stylelint-prettier/recommended"],
+	"extends": ["stylelint-config-standard"],
 	"plugins": ["stylelint-prettier"],
 	"rules": {
 		"prettier/prettier": true

CHANGELOG.md

@@ -3,7 +3,498 @@
 All notable changes to this project will be documented in this file.
 This project adheres to [Semantic Versioning](https://semver.org/).
 
-❤️ **Donate:** Enjoying MagicMirror²? [Please consider a donation!](https://magicmirror.builders/donate) With your help we can continue to improve the MagicMirror²
+❤️ **Donate:** Enjoying MagicMirror²? [Please consider a donation!](https://magicmirror.builders/#donate) With your help we can continue to improve the MagicMirror².
+
+## [2.28.0] - 2024-07-01
+
+Thanks to: @btoconnor, @bugsounet, @JasonStieber, @khassel, @kleinmantara and @WallysWellies.
+
+> ⚠️ This release needs nodejs version >= v20
+
+### Added
+
+- [calendar] Added config option "showEndsOnlyWithDuration" for default calendar
+- [compliments] Added `specialDayUnique` config option, defaults to `false` (#3465)
+- [weather] Provider weathergov: Use `precipitationLast3Hours` if `precipitationLastHour` is `null` (#3124)
+
+### Removed
+
+- [tests] delete node v18 support (#3462)
+
+### Updated
+
+- [core] Update dependencies including electron to v31
+- [core] use node >= v20 (#3462)
+- [core] Update `config.js.sample` to use openmeteo as weather provider which needs no api key
+- [tests] Use latest@version of node for `automated-tests.yaml` (#3483)
+- [updatenotification] Avoid using pm2 when running in docker container
+
+### Fixed
+
+- [core] Fixed crash possibility if `module: <name>` is not defined and on `postion: <positon>` mistake (#3445)
+- [weather] Fixed precipitationProbability in forecast for provider openmeteo (#3446)
+- [weather] Fixed type=daily for provider openmeteo having no data when running after 23:00 (#3449)
+- [weather] Fixed type=daily for provider openmeteo showing nightly icons in forecast when current time is "nightly" (#3458)
+- [weather] Fixed forecast and hourly weather for provider openmeteo to use real temperatures, not apparent temperatures (#3466)
+- [tests] Fixed e2e tests running in docker container which needs `address: "0.0.0.0"` (#3479)
+
+## [2.27.0] - 2024-04-01
+
+Thanks to: @bugsounet, @crazyscot, @illimarkangur, @jkriegshauser, @khassel, @KristjanESPERANTO, @Paranoid93, @rejas, @sdetweil and @vppencilsharpener.
+
+This release marks the first release without Michael Teeuw (@michmich). A very special thanks to him for creating MagicMirror and leading the project for so many years.
+
+For more info, please read the following post: [A New Chapter for MagicMirror: The Community Takes the Lead](https://forum.magicmirror.builders/topic/18329/a-new-chapter-for-magicmirror-the-community-takes-the-lead).
+
+### Added
+
+- Output of system information to the console for troubleshooting (#3328 and #3337), ignore errors under aarch64 (#3349)
+- [core] Add `eslint-plugin-package-json` to lint the `package.json` files (#3368)
+- [weather] `showHumidity` config is now a string describing where to show this element. Supported values: "wind", "temp", "feelslike", "below", "none". (#3330)
+- electron-rebuild test suite for electron and 3rd party modules compatibility (#3392)
+- Create MM² icon and attach it to electron process (#3407)
+
+### Updated
+
+- Update updatenotification (update_helper.js): Recode with pm2 library (#3332)
+- Removing lodash dependency by replacing merge by spread operator (#3339)
+- Use node prefix for build-in modules (#3340)
+- Rework logging colors (#3350)
+- Update pm2 to v5.3.1 with no allow-ghsas (#3364)
+- [core] Update husky and let lint-staged fix ESLint issues
+- [core] Update dependencies including electron to v29 (#3357) and node-ical
+- Update translations for estonian (#3371)
+- Update electron to v29 and update other dependencies
+- [calendar] fullDay events over several days now show the left days from the first day on and 'today' on the last day
+- Update layout of current weather indoor values
+
+### Fixed
+
+- Correct apibase of weathergov weatherprovider to match documentation (#2926)
+- Worked around several issues in the RRULE library that were causing deleted calender events to still show, some
+  initial and recurring events to not show, and some event times to be off an hour. (#3291)
+- Skip changelog requirement when running tests for dependency updates (#3320)
+- Display precipitation probability when it is 0% instead of blank/empty (#3345)
+- [newsfeed] Suppress unsightly animation cases when there are 0 or 1 active news items (#3336)
+- [newsfeed] Always compute the feed item URL using the same helper function (#3336)
+- Ignore all custom css files (#3359)
+- [newsfeed] Fix newsfeed stall issue introduced by #3336 (#3361)
+- Changed `log.debug` to `log.log` in `app.js` where logLevel is not set because config is not loaded at this time (#3353)
+- [calendar] deny fetch interval < 60000 and set 60000 in this case (prevent fetch loop failed) (#3382)
+- added message in case where config.js is missing the module.export line PR #3383
+- Fixed an issue where recurring events could extend past their recurrence end date (#3393)
+- Don't display any `npm WARN <....>` on install (#3399)
+- [core] Moved suncalc dependency to production from dev, as it is used by clock module
+- [compliments] Fix mirror not responding anymore when no compliments are to be shown (#3385)
+- [core] Fixed mastermerge workflow (#3415)
+
+### Deleted
+
+- Unneeded file headers (#3358)
+- Removed codecov.yaml
+
+## [2.26.0] - 2024-01-01
+
+Thanks to: @bnitkin, @bugsounet, @dependabot, @jkriegshauser, @kaennchenstruggle, @KristjanESPERANTO and @Ybbet.
+
+Special thanks to @khassel, @rejas and @sdetweil for taking over most (if not all) of the work on this release as project collaborators. This version would not be there without their effort. Thank you guys! You are awesome!
+
+This release also marks the latest release by Michael Teeuw. For more info, please read the following post: [A New Chapter for MagicMirror: The Community Takes the Lead](https://forum.magicmirror.builders/topic/18329/a-new-chapter-for-magicmirror-the-community-takes-the-lead).
+
+### Added
+
+- Added update notification updater (for 3rd party modules)
+- Added node 21 to the test matrix
+- Added transform object to calendar:customEvents
+- Added ESLint rules for jest (including jest/expect-expect and jest/no-done-callback)
+
+### Removed
+
+- Removed Codecov workflow (not working anymore, other workflow required) (#3107)
+- Removed titleReplace from calendar, replaced + extended by customEvents (backward compatibility included) (#3249)
+- Removed failing unit test (#3254)
+- Removed some unused variables
+
+### Updated
+
+- Update electron to v27 and update other dependencies as well as github actions
+- Update newsfeed: Use `html-to-text` instead of regex for transform description
+- Review ESLint config (#3269)
+- Update dependencies
+- Clock module: optionally display current moon phase in addition to rise/set times
+- electron is now per default started without gpu, if needed it must be enabled with new env var `ELECTRON_ENABLE_GPU=1` on startup (#3226)
+- Replace prettier by stylistic in ESLint config to lint JavaScript (and disable some rules for `config/config.js*` files)
+- Update node-ical to v0.17.1 and fix tests
+
+### Fixed
+
+- Avoid fade out/in on updateDom when many calendars are used
+- Fix the option eventClass on customEvents.
+- Fix yr API version in locationforecast and sunrise call (#3227)
+- Fix cloneObject() function to respect RegExp (#3237)
+- Fix newsfeed module for feeds using "a10:updated" tag (#3238)
+- Fix issue template (#3167)
+- Fix #3256 filter out bad results from rrule.between
+- Fix calendar events sometimes not respecting deleted events (#3250)
+- Fix electron loadurl locally on Windows when address "0.0.0.0" (#2550)
+- Fix updatanotification (update_helper.js): catch error if response is not an JSON format (check PM2)
+- Fix missing typeof in calendar module
+- Fix style issues after prettier update
+- Fix calendar test (#3291) by moving "Exdate check" from e2e to electron to run on a Thursday
+- Fix calendar config params `fetchInterval` and `excludedEvents` were never used from single calendar config (#3297)
+- Fix MM_PORT variable not used in electron and allow full path for MM_CONFIG_FILE variable (#3302)
+
+## [2.25.0] - 2023-10-01
+
+Thanks to: @bugsounet, @dgoth, @dependabot, @kenzal, @Knapoc, @KristjanESPERANTO, @martingron, @NolanKingdon, @Paranoid93, @TeddyStarinvest and @Ybbet.
+
+Special thanks to @khassel, @rejas and @sdetweil for taking over most (if not all) of the work on this release as project collaborators. This version would not be there without their effort. Thank you guys! You are awesome!
+
+> ⚠️ This release needs nodejs version >= `v18`, older releases have reached end of life and will not work!
+
+### Added
+
+- Added UV Index support to OpenWeatherMap
+- Added 'hideDuplicates' flag to the calendar module
+- Added `allowOverrideNotification` to weather module to enable sending current weather objects with the `CURRENT_WEATHER_OVERRIDE` notification to supplement/replace the current weather displayed
+- Added optional AnimateCSS animate for `hide()`, `show()`, `updateDom()`
+- Added AnimateIn and animateOut in module config definition
+- Apply AnimateIn rules on the first start
+- Added automatic client page reload when server was restarted by setting `reloadAfterServerRestart: true` in `config.js`, per default `false` (#3105)
+- Added eventClass option for customEvents on the default calendar
+- Added AnimateCSS integration in tests suite (#3206)
+- Added npm dependabot [Reserved to developer] (#3210)
+- Added improved logging for calendar (#3110)
+
+### Removed
+
+- **Breaking Change**: Removed `digest` authentication method from calendar module (which was already broken since release `2.15.0`)
+
+### Updated
+
+- Update roboto fonts to version v5
+- Update issue template
+- Update dev/dependencies incl. electron to v26
+- Replace pretty-quick by lint-staged (<https://github.com/azz/pretty-quick/issues/164>)
+- Update engine node >=18. v16 reached its end of life. (#3170)
+- Update typescript definition for modules
+- Cleaned up nunjuck templates
+- Replace `node-fetch` with internal fetch (#2649) and remove `digest-fetch`
+- Update the French translation according to the English file.
+- Update dependabot incl. vendor/fonts (monthly check)
+- Renew `package-lock.json` for release
+
+### Fixed
+
+- Fix engine check on npm install (#3135)
+- Fix undefined formatTime method in clock module (#3143)
+- Fix clientonly startup fails after async added (#3151)
+- Fix electron width/height when using xrandr under bullseye
+- Fix time issue with certain recurring events in calendar module
+- Fix ipWhiteList test (#3179)
+- Fix newsfeed: Convert HTML entities, codes and tag in description (#3191)
+- Respect width/height (no fullscreen) if set in electronOptions (together with `fullscreen: false`) in `config.js` (#3174)
+- Fix: AnimateCSS merge hide() and show() animated css class when we do multiple call
+- Fix `Uncaught SyntaxError: Identifier 'getCorsUrl' has already been declared (at utils.js:1:1)` when using `clock` and `weather` module (#3204)
+- Fix overriding `config.js` when running tests (#3201)
+- Fix issue in weathergov provider with probability of precipitation not showing up on hourly or daily forecast
+- Fix yr weather provider after changes in yr API (#3189)
+
+## [2.24.0] - 2023-07-01
+
+Thanks to: @angeldeejay, @bugsounet, @buxxi, @CarJem, @dariom, @DaveChild, @dWoolridge, @eddiehung, @grenagit, @Hirschberger, @ismarslomic, @JakeBinney, @KristjanESPERANTO, @MagMar94, @naveensrinivasan, @nfogal, @oscarb, @OWL4C, @psieg, @rajniszp, @retroflex, @SkySails and @tomzt
+
+Special thanks to @khassel, @rejas and @sdetweil for taking over most (if not all) of the work on this release as project collaborators. This version would not be there without their effort. Thank you guys! You are awesome!
+
+### Added
+
+- Added UV Index to hourly and current Weather, with support for Openmeteo
+- Added tests for serveronly
+- Set Timezone `Europe/Berlin` in unit tests (needed for new formatTime tests)
+- Added no-param-reassign eslint rule and fix warnings
+- [updatenotification] Added `sendUpdatesNotifications` feature. Broadcast update with `UPDATES` notification to other modules
+- [updatenotification] Allow force scanning with `SCAN_UPDATES` notification from other modules
+- Added per-calendar fetchInterval
+
+### Removed
+
+- Removed unneeded (and unwanted) '.' after the year in calendar repeatingCountTitle (#2896, second attempt ...)
+
+### Updated
+
+- Added support for precipitation probability with openmeteo weather-provider
+- Update electron to v25.2 and other dependencies
+- Use node v20 in github workflow (replacing v14)
+- Refactor formatTime into common util function for default modules
+- Refactor some calendar methods into own class and added tests for them
+- Split install and run commands in github actions
+- Changed `fetchInterval` of calendar in `config.js.sample` to 7 days so we not to request example calendar too frequently
+- Changed default calendar fetchInterval to one hour
+- Changed calendar url in sample config
+
+### Fixed
+
+- Fix envcanada hourly forecast time (#3080)
+- Fix electron not running under windows after async changes (#3083)
+- Fix style issues after eslint-plugin-jsdoc update
+- Fix don't filter out ongoing full day events (#3095)
+- Fix date not shown when clock in analog mode (#3100)
+- Fix envcanada today percentage-of-precipitation (#3106)
+- Fix updatenotification where no branch is checked out but e.g. a version tag (#3130)
+
+## [2.23.0] - 2023-04-04
+
+Thanks to: @angeldeejay, @buxxi, @CarJem, @dariom, @DaveChild, @dWoolridge, @grenagit, @Hirschberger, @KristjanESPERANTO, @MagMar94, @naveensrinivasan, @nfogal, @psieg, @rajniszp, @retroflex, @SkySails and @tomzt.
+
+Special thanks to @khassel, @rejas and @sdetweil for taking over most (if not all) of the work on this release as project collaborators. This version would not be there without their effort. Thank you guys! You are awesome!
+
+### Added
+
+- Added increments for hourly forecasts in weather module (#2996)
+- Added tests for hourly weather forecast
+- Added possibility to ignore MagicMirror repo in updatenotification module
+- Added Pirate Weather as new weather-provider (#3005)
+- Added possibility to use your own templates in Alert module
+- Added error message if `<modulename>.js` file is missing in module folder to get a hint in the logs (#2403)
+- Added possibility to use environment variables in `config.js` (#1756)
+- Added option `pastDaysCount` to default calendar module to control of how many days past events should be displayed
+- Added thai language to alert module
+- Added option `sendNotifications` in clock module (#3056)
+- Added tests for some weather utils
+
+### Removed
+
+- Removed darksky weather-provider
+- Removed unneeded (and unwanted) '.' after the year in calendar repeatingCountTitle (#2896)
+
+### Updated
+
+- Use develop as target branch for dependabot
+- Update issue template, contributing doc and sample config
+- The weather modules clearly separates precipitation amount and probability (risk of rain/snow)
+  - This requires all providers that only supports probability to change the config from `showPrecipitationAmount` to `showPrecipitationProbability`.
+- Update tests for weather and calendar module
+- Changed updatenotification module for MagicMirror repo only: Send only notifications for `master` if there is a tag on a newer commit
+- Update dates in Calendar widgets every minute
+- Cleanup jest coverage for patches
+- Update `stylelint` dependencies, switch to `stylelint-config-standard` and handle `stylelint` issues, update `main.css` matching new rules
+- Update Eslint config, add new rule and handle issue
+- Convert lots of callbacks to async/await
+- Revise require imports (#3071 and #3072)
+- Use `config.js-old` instead of file with timestamp suffix when backing up config with a `config.template` in use (#3104)
+
+### Fixed
+
+- Fix wrong day labels in envcanada forecast (#2987)
+- Fix for missing default class name prefix for customEvents in calendar
+- Fix electron flashing white screen on startup (#1919)
+- Fix weathergov provider hourly forecast (#3008)
+- Fix message display with HTML code into alert module (#2828)
+- Fix typo in french translation
+- Yr wind direction is no longer inverted
+- Fix async node_helper stopping electron start (#2487)
+- The wind direction arrow now points in the direction the wind is flowing, not into the wind (#3019)
+- Fix precipitation css styles and rounding value
+- Fix wrong vertical alignment of calendar title column when wrapEvents is true (#3053)
+- Fix empty news feed stopping the reload forever
+- Fix e2e tests (failed after async changes) by running calendar and newsfeed tests last
+- Lint: Use template literals instead of string concatenation
+- Fix default alert module to render HTML for title and message
+- Fix Open-Meteo wind speed units
+
+## [2.22.0] - 2023-01-01
+
+Thanks to: @angeldeejay, @buxxi, @dariom, @dWoolridge, @KristjanESPERANTO, @MagMar94, @naveensrinivasan, @retroflex, @SkySails and @Tom.
+
+Special thanks to @khassel, @rejas and @sdetweil for taking over most (if not all) of the work on this release as project collaborators. This version would not be there without their effort. Thank you!
+
+### Added
+
+- Added new calendar options for colored entries and improved styling (#3033)
+- Added test for remoteFile option in compliments module
+- Added hourlyWeather functionality to Weather.gov weather-provider
+- Added css class names "today" and "tomorrow" for default calendar
+- Added Collaboration.md
+- Added new github action for dependency review (#2862)
+- Added a WeatherProvider for Open-Meteo
+- Added Yr as a weather-provider
+- Added config options "ignoreXOriginHeader" and "ignoreContentSecurityPolicy"
+- Added thai language
+- Added workflow rule to make sure PRs are based against develop
+
+### Removed
+
+- Removed usage of internal fetch function of node until it is more stable
+- Removed weatherEndpoint definition from weathergov.js (not used)
+
+### Updated
+
+- Cleaned up test directory (#2937) and jest config (#2959)
+- Wait for all modules to start before declaring the system ready (#2487)
+- Updated e2e tests (moved `done()` in helper functions) and use es6 syntax in all tests
+- Updated da translation
+- Rework weather module
+  - Make sure smhi provider api only gets a maximum of 6 digits coordinates (#2955)
+  - Use fetch instead of XMLHttpRequest in weather-provider (#2935)
+  - Reworked how weather-providers handle units (#2849)
+  - Use unix() method for parsing times, fix suntimes on the way (#2950)
+  - Refactor conversion functions into utils class (#2958)
+- The `cors`-method in `server.js` now supports sending and receiving HTTP headers
+- Replace `&hellip;` by `…`
+- Cleanup compliments module
+- Updated dependencies including electron to v22 (#2903)
+
+### Fixed
+
+- Correctly show apparent temperature in SMHI weather-provider
+- Ensure updatenotification module isn't shown when local is _ahead_ of remote
+- Handle node_helper errors during startup (#2944)
+- Possibility to change FontAwesome class in calendar, so icons like `fab fa-facebook-square` works.
+- Fix cors problems with newsfeed articles (as far as possible), allow disabling cors per feed with option `useCorsProxy: false` (#2840)
+- Tests not waiting for the application to start and stop before starting the next test
+- Fix electron tests failing sometimes in github workflow
+- Fixed gap in clock module when displayed on the left side with displayType=digital
+- Fixed playwright issue by upgrading to v1.29.1 (#2969)
+
+## [2.21.0] - 2022-10-01
+
+Special thanks to: @BKeyport, @buxxi, @davide125, @khassel, @kolbyjack, @krukle, @MikeBishop, @rejas, @sdetweil, @SkySails and @veeck
+
+### Added
+
+- Added possibility to fetch calendars through socket notifications.
+- New scripts `install-mm` (and `install-mm:dev`) for simplifying mm installation (now: `npm run install-mm`) and adding params `--no-audit --no-fund --no-update-notifier` for less noise.
+- New `showTimeToday` option in calendar module shows time for current-day events even if `timeFormat` is `"relative"`.
+- Added hourly forecasts, apparent temperature & custom location name to SMHI weather-provider.
+- Added new electron tests for calendar and moved some compliments tests from `e2e` to `electron` because of date mocking, removed mock stuff from compliments module.
+
+### Removed
+
+- Removed old and deprecated weather modules `currentweather` and `weatherforecast`.
+- Removed `DAYAFTERTOMORROW` from English.
+
+### Updated
+
+- Updated dependencies.
+- Updated jsdoc.
+- Updated font tree to use variables consistently.
+- Removed deprecated Docker Repository from issue template.
+
+### Fixed
+
+- Broadcast all calendar events while still honoring global and per-calendar maximumEntries.
+- Respect rss ttl provided by newsfeed (#2883).
+- Fix multi day calendar events always presented as "(1/X)" instead of the amount of days the event has progressed.
+- Fix weatherbit provider to use type config value instead of endpoint.
+- Fix calendar events which DO NOT specify rrule byday adjusted incorrectly (#2885).
+- Fix e2e tests not failing on errors (#2911).
+
+## [2.20.0] - 2022-07-02
+
+Special thanks to the following contributors: @eouia, @khassel, @kolbyjack, @KristjanESPERANTO, @nathannaveen, @naveensrinivasan, @rejas, @rohitdharavath and @sdetweil.
+
+### Added
+
+- Added a new config option `httpHeaders` used by helmet (see https://helmetjs.github.io/). You can now set own httpHeaders which will override the defaults in `js/defauls.js` which is useful e.g. if you want to embed MagicMirror into annother website (solves #2847).
+- Show endDate for calendar events when dateHeader is enabled and showEnd is set to true (#2192).
+- Added the notification emitting from the weather module on information updated.
+- Use recommended file extension for YAML files (#2864).
+
+### Updated
+
+- Use latest node 18 when running tests on github actions.
+- Updated `electron` to v19 and other dependencies.
+- Use internal fetch function of node instead external `node-fetch` library if used node version >= `v18`.
+- Include duplicate events in broadcasts.
+
+### Fixed
+
+- Fix problems with non latin fonds caused by updating to fontsource (fixes #2835).
+
+## [2.19.0] - 2022-04-01
+
+Special thanks to the following contributors: @10bias, @CFenner, @JHWelch, @k1rd3rf, @khassel, @kolbyjack, @krekos, @KristjanESPERANTO, @Nerfzooka, @oraclesean, @oscarb, @philnagel, @rejas, @sdetweil, @shin10, @SiderealArt and @Tom-Hirschberger.
+
+### Added
+
+- Added a config option under the weather module, `absoluteDates`, providing an option to format weather forecast date output with either absolute or relative dates.
+- Added test for new weather forecast `absoluteDates` property.
+- The modules get a class hidden added/removed if they get hidden/shown which will also toggle pointer-events.
+- Added new config option `showTitleAsUrl` to newsfeed module. If set, the displayed title is a link to the article which is useful when running in a browser and you want to read this article.
+- Added internal cors proxy to get weather-providers working without public proxies (fixes #2714). The new url `http(s)://address:port/cors?url=https://whatever-to-proxy` can be used in other modules too.
+- Added a WeatherProvider for Weatherflow.
+- Added new env var `ELECTRON_DISABLE_GPU` which disable gpu under electron if set (fixes #2831).
+- Added missing Czech translations.
+
+### Updated
+
+- Deprecated roboto fonts package `roboto-fontface-bower` replaced with `fontsource`.
+- Updated `electron` to v17, `helmet` to v5 (use defaults of v4) and other dependencies
+- Updated Font Awesome css class to new default style (fixes #2768)
+- Replaced deprecated modules `currentweather` and `weatherforecast` with dummy modules only displaying that they have to be replaced.
+- Include all calendar events from the configured date range when broadcasting.
+- Updated Danish and German translation.
+- Updated `node-ical` to v0.15 and added `luxon` as dependency for not breaking the "no-optional" install (see #2718 and #2824).
+
+### Fixed
+
+- Improved and speedup e2e tests, artificial wait after mm start removed.
+- Improved husky setup not blocking `git commit` if `husky` or `npm` is not installed.
+- Using a consistent spelling of MagicMirror².
+- Fix minor console output issue for loading translations (#2814).
+- Don't adjust startDate for full day events if endDate is in the past.
+- Fix windspeed conversion error in openweathermap provider. (#2812)
+- Fix conflicting parms turning off showEnd for full day events. (#2629)
+- Fix regression, calendar.maximumEntries not used to filter calendar level entries (#2868)
+
+## [2.18.0] - 2022-01-01
+
+Special thanks to the following contributors: @AmpioRosso, @eouia, @fewieden, @jupadin, @khassel, @kolbyjack, @KristjanESPERANTO, @MariusVaice, @rejas, @rico24 and @sdetweil.
+
+### Added
+
+- Added test for calendar recurring event with checks the correct date displayed (related to #2752).
+
+### Updated
+
+- ESLint version supports now ECMAScript 2018.
+- Cleaned up `updatenotification` module and switched to nunjuck template.
+- Moved calendar tests from category `electron` to `e2e`.
+- Updated missed translations for Korean language (ko.json).
+- Updated missed translations for Dutch language (nl.json).
+- Cleaned up `alert` module and switched to nunjuck template.
+- Moved weather tests from category `electron` to `e2e`.
+- Updated github actions.
+- Replace spectron with playwright, update dependencies including electron update to v16.
+- Added lithuanian language to translations.js.
+- Show info message if newsfeed is empty (fixes #2731).
+- Added dangerouslyDisableAutoEscaping config option for newsfeed templates (fixes #2712).
+- Added missing shebang to `installers/mm.sh`.
+- Node versions in templates and github workflows.
+- Updated translations for Traditional Chinese (Taiwan) (zh-tw.json).
+
+### Fixed
+
+- Fixed wrong file `kr.json` to `ko.json`. Use language code 'ko' instead of 'kr' for Korean language.
+- Fixed `feels_like` data from openweathermaps current weather being ignored (#2678).
+- Fixed chaotic newsfeed display after network connection loss thanks to @jalibu (#2638).
+- Fixed incorrect time zone correction of recurring full day events (#2632 and #2634).
+- Fixed e2e tests by increasing testTimeout.
+- Revert node-ical update due to missing luxon package.
+- Fixed User-Agent-Header for newsfeed and calendar module (#2729).
+- Replace broken shields in Readme and use https for links.
+- Fixed electron tests with retry.
+- Fixed Calendar recurring cross timezone error (add/subtract a day, not just offset hours) (#2632).
+- Fixed Calendar showEnd and Full Date overlay (#2629).
+- Fixed regression on #2632, #2752.
+- Broadcast custom symbols in CALENDAR_EVENTS.
+
+## [2.17.1] - 2021-10-01
+
+### Fixed
+
+- Fixed error when accessing letsencrypt certificates
+- Fixed Calendar module enhancement: displaying full events without time (#2424)
 
 ## [2.17.0] - 2021-10-01
 
@@ -21,14 +512,14 @@ Special thanks to the following contributors: @apiontek, @eouia, @jupadin, @khas
 - Refactor test configs, use default test config for all tests.
 - Updated github templates.
 - Actually test all js and css files when lint script is run.
-- Update jsdocs and print warnings during testing too.
-- Update weathergov provider to try fetching not just current, but also foreacst, when API URLs available.
+- Updated jsdocs and print warnings during testing too.
+- Updated weathergov provider to try fetching not just current, but also foreacst, when API URLs available.
 - Refactored clock layout.
-- Refactored methods from weatherproviders into weatherobject (isDaytime, updateSunTime).
+- Refactored methods from weather-providers into weatherobject (isDaytime, updateSunTime).
 - Use of `logger.js` in jest tests.
 - Run prettier over all relevant files.
 - Move tests needing electron in new category `electron`, use `server only` mode in `e2e` tests.
-- Update dependencies in package.json.
+- Updated dependencies in package.json.
 
 ### Fixed
 
@@ -62,13 +553,13 @@ Special thanks to the following contributors: @210954, @B1gG, @codac, @Crazylegs
 - Refactor code into es6 where possible (e.g. var -> let/const).
 - Use node v16 in github workflow (replacing node v10).
 - Moved some files into better suited directories.
-- Update dependencies in package.json, require node >= v12, remove `rrule-alt` and `rrule`.
-- Update dependencies in package.json and migrate husky to v6, fix husky setup in prod environment.
+- Updated dependencies in package.json, require node >= v12, remove `rrule-alt` and `rrule`.
+- Updated dependencies in package.json and migrate husky to v6, fix husky setup in prod environment.
 - Cleaned up error handling in newsfeed and calendar modules for real.
 - Updated default WEATHER module such that a provider can optionally set a custom unit-of-measure for precipitation (`weatherObject.precipitationUnits`).
-- Update documentation.
-- Update jest tests: Reset changes on js/logger.js, mock logger.js in global_vars tests.
-- Update dependencies in package.json.
+- Updated documentation.
+- Updated jest tests: Reset changes on js/logger.js, mock logger.js in global_vars tests.
+- Updated dependencies in package.json.
 
 ### Removed
 
@@ -122,7 +613,7 @@ Special thanks to the following contributors: @EdgardosReis, @MystaraTheGreat, @
 - Code cleanup for FEELS like and added {DEGREE} placeholder for FEELSLIKE for each language.
 - Converted newsfeed module to use templates.
 - Updated documentation and help screen about invalid config files.
-- Moving weather provider specific code and configuration into each provider and making hourly part of the interface.
+- Moving weather-provider specific code and configuration into each provider and making hourly part of the interface.
 - Bump electron to v11 and enable contextIsolation.
 - Don't update the DOM when a module is not displayed.
 - Cleaned up jsdoc and tests.
@@ -180,10 +671,10 @@ Special thanks to the following contributors: @Alvinger, @AndyPoms, @ashishtank,
 
 - Merging .gitignore in the config-folder with the .gitignore in the root-folder.
 - Weather module - forecast now show TODAY and TOMORROW instead of weekday, to make it easier to understand.
-- Update dependencies to latest versions.
-- Update dependencies eslint, feedme, simple-git and socket.io to latest versions.
-- Update lithuanian translation.
-- Update config sample.
+- Updated dependencies to latest versions.
+- Updated dependencies eslint, feedme, simple-git and socket.io to latest versions.
+- Updated lithuanian translation.
+- Updated config sample.
 - Highlight required version mismatch.
 - No select Text for TouchScreen use.
 - Corrected logic for timeFormat "relative" and "absolute".
@@ -204,19 +695,19 @@ Special thanks to the following contributors: @Alvinger, @AndyPoms, @ashishtank,
 - Rename Greek translation to correct ISO 639-1 alpha-2 code (gr > el). (#2155)
 - Add a space after icons of sunrise and sunset. (#2169)
 - Fix calendar when no DTEND record found in event, startDate overlay when endDate set. (#2177)
-- Fix windspeed convertion error in ukmetoffice weather provider. (#2189)
+- Fix windspeed conversion error in ukmetoffice weather-provider. (#2189)
 - Fix console.debug not having timestamps. (#2199)
 - Fix calendar full day event east of UTC start time. (#2200)
 - Fix non-fullday recurring rule processing. (#2216)
 - Catch errors when parsing calendar data with ical. (#2022)
 - Fix Default Alert Module does not hide black overlay when alert is dismissed manually. (#2228)
 - Weather module - Always displays night icons when local is other than English. (#2221)
-- Update node-ical 0.12.4, fix invalid RRULE format in cal entries
+- Updated node-ical 0.12.4, fix invalid RRULE format in cal entries
 - Fix package.json for optional electron dependency (2378)
-- Update node-ical version again, 0.12.5, change RRULE fix (#2371, #2379)
+- Updated node-ical version again, 0.12.5, change RRULE fix (#2371, #2379)
 - Remove undefined objects from modules array (#2382)
-- Update node-ical version again, 0.12.7, change RRULE fix (#2371, #2379), node-ical now throws error (which we catch)
-- Update simple-git version to 2.31 unhandled promise rejection (#2383)
+- Updated node-ical version again, 0.12.7, change RRULE fix (#2371, #2379), node-ical now throws error (which we catch)
+- Updated simple-git version to 2.31 unhandled promise rejection (#2383)
 
 ## [2.13.0] - 2020-10-01
 
@@ -227,8 +718,8 @@ Special thanks to the following contributors: @bryanzzhu, @bugsounet, @chamakura
 ### Added
 
 - `--dry-run` Added option in fetch call within updatenotification node_helper. This is to prevent
-  MagicMirror from consuming any fetch result. Causes conflict with MMPM when attempting to check
-  for updates to MagicMirror and/or MagicMirror modules.
+  MagicMirror² from consuming any fetch result. Causes conflict with MMPM when attempting to check
+  for updates to MagicMirror² and/or MagicMirror² modules.
 - Test coverage with Istanbul, run it with `npm run test:coverage`.
 - Added lithuanian language.
 - Added support in weatherforecast for OpenWeather onecall API.
@@ -249,12 +740,12 @@ Special thanks to the following contributors: @bryanzzhu, @bugsounet, @chamakura
 ### Fixed
 
 - Fix backward compatibility issues for Safari < 11.
-- Fix the use of "maxNumberOfDays" in the module "weatherforecast depending on the endpoint (forecast/daily or forecast)". [#2018](https://github.com/MichMich/MagicMirror/issues/2018)
-- Fix calendar display. Account for current timezone. [#2068](https://github.com/MichMich/MagicMirror/issues/2068)
+- Fix the use of "maxNumberOfDays" in the module "weatherforecast depending on the endpoint (forecast/daily or forecast)". [#2018](https://github.com/MagicMirrorOrg/MagicMirror/issues/2018)
+- Fix calendar display. Account for current timezone. [#2068](https://github.com/MagicMirrorOrg/MagicMirror/issues/2068)
 - Fix logLevel being set before loading config.
-- Fix incorrect namespace links in svg clockfaces. [#2072](https://github.com/MichMich/MagicMirror/issues/2072)
-- Fix weather/providers/weathergov for API guidelines. [#2045](https://github.com/MichMich/MagicMirror/issues/2045)
-- Fix "undefined" in weather modules header. [#1985](https://github.com/MichMich/MagicMirror/issues/1985)
+- Fix incorrect namespace links in svg clockfaces. [#2072](https://github.com/MagicMirrorOrg/MagicMirror/issues/2072)
+- Fix weather/providers/weathergov for API guidelines. [#2045](https://github.com/MagicMirrorOrg/MagicMirror/issues/2045)
+- Fix "undefined" in weather modules header. [#1985](https://github.com/MagicMirrorOrg/MagicMirror/issues/1985)
 - Fix #2110, #2111, #2118: Recurring full day events should not use timezone adjustment. Just compare month/day.
 
 ## [2.12.0] - 2020-07-01
@@ -288,22 +779,22 @@ Special thanks to the following contributors: @AndreKoepke, @andrezibaia, @bryan
 
 ### Fixed
 
-- The broken modules due to Socket.io change from last release. [#1973](https://github.com/MichMich/MagicMirror/issues/1973)
-- Add backward compatibility for old module code in socketclient.js. [#1973](https://github.com/MichMich/MagicMirror/issues/1973)
-- Support multiple instances of calendar module with different config. [#1109](https://github.com/MichMich/MagicMirror/issues/1109)
-- Fix the use of "maxNumberOfDays" in the module "weatherforecast". [#2018](https://github.com/MichMich/MagicMirror/issues/2018)
-- Throw error when check_config fails. [#1928](https://github.com/MichMich/MagicMirror/issues/1928)
-- Bug fix related to 'maxEntries' not displaying Calendar events. [#2050](https://github.com/MichMich/MagicMirror/issues/2050)
-- Updated ical library to the latest version. [#1926](https://github.com/MichMich/MagicMirror/issues/1926)
-- Fix config check after merge of prettier [#2109](https://github.com/MichMich/MagicMirror/issues/2109)
+- The broken modules due to Socket.io change from last release. [#1973](https://github.com/MagicMirrorOrg/MagicMirror/issues/1973)
+- Add backward compatibility for old module code in socketclient.js. [#1973](https://github.com/MagicMirrorOrg/MagicMirror/issues/1973)
+- Support multiple instances of calendar module with different config. [#1109](https://github.com/MagicMirrorOrg/MagicMirror/issues/1109)
+- Fix the use of "maxNumberOfDays" in the module "weatherforecast". [#2018](https://github.com/MagicMirrorOrg/MagicMirror/issues/2018)
+- Throw error when check_config fails. [#1928](https://github.com/MagicMirrorOrg/MagicMirror/issues/1928)
+- Bug fix related to 'maxEntries' not displaying Calendar events. [#2050](https://github.com/MagicMirrorOrg/MagicMirror/issues/2050)
+- Updated ical library to the latest version. [#1926](https://github.com/MagicMirrorOrg/MagicMirror/issues/1926)
+- Fix config check after merge of prettier [#2109](https://github.com/MagicMirrorOrg/MagicMirror/issues/2109)
 
 ## [2.11.0] - 2020-04-01
 
 🚨 READ THIS BEFORE UPDATING 🚨
 
-In the past years the project has grown a lot. This came with a huge downside: poor maintainability. If I let the project continue the way it was, it would eventually crash and burn. More important: I would completely lose the drive and interest to continue the project. Because of this the decision was made to simplify the core by removing all side features like automatic installers and support for exotic platforms. This release (2.11.0) is the first real release that will reflect (parts) of these changes. As a result of this, some things might break. So before you continue make sure to backup your installation. Your config, your modules or better yet: your full MagicMirror folder. In other words: update at your own risk.
+In the past years the project has grown a lot. This came with a huge downside: poor maintainability. If I let the project continue the way it was, it would eventually crash and burn. More important: I would completely lose the drive and interest to continue the project. Because of this the decision was made to simplify the core by removing all side features like automatic installers and support for exotic platforms. This release (2.11.0) is the first real release that will reflect (parts) of these changes. As a result of this, some things might break. So before you continue make sure to backup your installation. Your config, your modules or better yet: your full MagicMirror² folder. In other words: update at your own risk.
 
-For more information regarding this major change, please check issue [#1860](https://github.com/MichMich/MagicMirror/issues/1860).
+For more information regarding this major change, please check issue [#1860](https://github.com/MagicMirrorOrg/MagicMirror/issues/1860).
 
 ### Deleted
 
@@ -333,8 +824,8 @@ For more information regarding this major change, please check issue [#1860](htt
 - Fix calendar time offset for recurring events crossing Daylight Savings Time (ISSUE #1798)
 - Fix regression in currentweather module causing 'undefined' to show up when config.hideTemp is false
 - Fix FEELS translation for Croatian
-- Fixed weather tests [#1840](https://github.com/MichMich/MagicMirror/issues/1840)
-- Fixed Socket.io can't be used with Reverse Proxy in serveronly mode [#1934](https://github.com/MichMich/MagicMirror/issues/1934)
+- Fixed weather tests [#1840](https://github.com/MagicMirrorOrg/MagicMirror/issues/1840)
+- Fixed Socket.io can't be used with Reverse Proxy in serveronly mode [#1934](https://github.com/MagicMirrorOrg/MagicMirror/issues/1934)
 - Fix update checking skipping 3rd party modules the first time
 
 ### Changed
@@ -402,14 +893,14 @@ Special thanks to @sdetweil for all his great contributions!
 
 - Updatenotification module: Display update notification for a limited (configurable) time.
 - Enabled e2e/vendor_spec.js tests.
-- The css/custom.css will be renamed after the next release. We've added into `run-start.sh` an instruction by GIT to ignore with `--skip-worktree` and `rm --cached`. [#1540](https://github.com/MichMich/MagicMirror/issues/1540)
+- The css/custom.css will be renamed after the next release. We've added into `run-start.sh` an instruction by GIT to ignore with `--skip-worktree` and `rm --cached`. [#1540](https://github.com/MagicMirrorOrg/MagicMirror/issues/1540)
 - Disable sending of notification CLOCK_SECOND when displaySeconds is false.
 
 ### Fixed
 
 - Updatenotification module: Properly handle race conditions, prevent crash.
 - Send `NEWS_FEED` notification also for the first news messages which are shown.
-- Fixed issue where weather module would not refresh data after a network or API outage. [#1722](https://github.com/MichMich/MagicMirror/issues/1722)
+- Fixed issue where weather module would not refresh data after a network or API outage. [#1722](https://github.com/MagicMirrorOrg/MagicMirror/issues/1722)
 - Fixed weatherforecast module not displaying rain amount on fallback endpoint.
 - Notifications CLOCK_SECOND & CLOCK_MINUTE being from startup instead of matched against the clock and avoid drifting.
 
@@ -424,7 +915,7 @@ Special thanks to @sdetweil for all his great contributions!
 - Russian translation for “Feels”
 - Calendar module: added `nextDaysRelative` config option
 - Add `broadcastPastEvents` config option for calendars to include events from the past `maximumNumberOfDays` in event broadcasts
-- Added feature to broadcast news feed items `NEWS_FEED` and updated news items `NEWS_FEED_UPDATED` in default [newsfeed](https://github.com/MichMich/MagicMirror/tree/develop/modules/default/newsfeed) module (when news is updated) with documented default and `config.js` options in [README.md](https://github.com/MichMich/MagicMirror/blob/develop/modules/default/newsfeed/README.md)
+- Added feature to broadcast news feed items `NEWS_FEED` and updated news items `NEWS_FEED_UPDATED` in default [newsfeed](https://github.com/MagicMirrorOrg/MagicMirror/tree/develop/modules/default/newsfeed) module (when news is updated) with documented default and `config.js` options in [README.md](https://github.com/MagicMirrorOrg/MagicMirror/blob/develop/modules/default/newsfeed/README.md)
 - Added notifications to default `clock` module broadcasting `CLOCK_SECOND` and `CLOCK_MINUTE` for the respective time elapsed.
 - Added UK Met Office Datapoint feed as a provider in the default weather module.
 - Added new provider class
@@ -433,7 +924,7 @@ Special thanks to @sdetweil for all his great contributions!
 - Use Feels Like temp from feed if present
 - Optionally display probability of precipitation (PoP) in current weather (UK Met Office data)
 - Automatically try to fix eslint errors by passing `--fix` option to it
-- Added sunrise and sunset times to weathergov weather provider [#1705](https://github.com/MichMich/MagicMirror/issues/1705)
+- Added sunrise and sunset times to weathergov weather-provider [#1705](https://github.com/MagicMirrorOrg/MagicMirror/issues/1705)
 - Added "useLocationAsHeader" to display "location" in `config.js` as header when location name is not returned
 - Added to `newsfeed.js`: in order to design the news article better with css, three more class-names were introduced: newsfeed-desc, newsfeed-desc, newsfeed-desc
 
@@ -441,19 +932,19 @@ Special thanks to @sdetweil for all his great contributions!
 
 - English translation for "Feels" to "Feels like"
 - Fixed the example calendar url in `config.js.sample`
-- Update `ical.js` to solve various calendar issues.
-- Update weather city list url [#1676](https://github.com/MichMich/MagicMirror/issues/1676)
+- Updated `ical.js` to solve various calendar issues.
+- Updated weather city list url [#1676](https://github.com/MagicMirrorOrg/MagicMirror/issues/1676)
 - Only update clock once per minute when seconds aren't shown
-- Update weatherprovider documentation.
+- Updated weather-provider documentation.
 
 ### Fixed
 
 - Fixed uncaught exception, race condition on module update
-- Fixed issue [#1696](https://github.com/MichMich/MagicMirror/issues/1696), some ical files start date to not parse to date type
+- Fixed issue [#1696](https://github.com/MagicMirrorOrg/MagicMirror/issues/1696), some ical files start date to not parse to date type
 - Allowance HTML5 autoplay-policy (policy is changed from Chrome 66 updates)
 - Handle SIGTERM messages
 - Fixes sliceMultiDayEvents so it respects maximumNumberOfDays
-- Minor types in default NewsFeed [README.md](https://github.com/MichMich/MagicMirror/blob/develop/modules/default/newsfeed/README.md)
+- Minor types in default NewsFeed [README.md](https://github.com/MagicMirrorOrg/MagicMirror/blob/develop/modules/default/newsfeed/README.md)
 - Fix typos and small syntax errors, cleanup dependencies, remove multiple-empty-lines, add semi-rule
 - Fixed issues with calendar not displaying one-time changes to repeating events
 - Updated the fetchedLocationName variable in currentweather.js so that city shows up in the header
@@ -464,7 +955,7 @@ Special thanks to @sdetweil for all his great contributions!
 - use current username vs hardcoded 'pi' to support non-pi install
 - check for npm installed. node install doesn't do npm anymore
 - check for mac as part of PM2 install, add install option string
-- update pm2 config with current username instead of hard coded 'pi'
+- Updated pm2 config with current username instead of hard coded 'pi'
 - check for screen saver config, "/etc/xdg/lxsession", bypass if not setup
 
 ## [2.7.1] - 2019-04-02
@@ -491,42 +982,42 @@ Fixed `package.json` version number.
 
 ### Updated
 
-- Bumped the Electron dependency to v3.0.13 to support the most recent Raspbian. [#1500](https://github.com/MichMich/MagicMirror/issues/1500)
+- Bumped the Electron dependency to v3.0.13 to support the most recent Raspbian. [#1500](https://github.com/MagicMirrorOrg/MagicMirror/issues/1500)
 - Updated modernizr code in alert module, fixed a small typo there too
 - More verbose error message on console if the config is malformed
 - Updated installer script to install Node.js version 10.x
 
 ### Fixed
 
-- Fixed temperature displays in currentweather and weatherforecast modules [#1503](https://github.com/MichMich/MagicMirror/issues/1503), [#1511](https://github.com/MichMich/MagicMirror/issues/1511).
-- Fixed unhandled error on bad git data in updatenotification module [#1285](https://github.com/MichMich/MagicMirror/issues/1285).
-- Weather forecast now works with openweathermap in new weather module. Daily data are displayed, see issue [#1504](https://github.com/MichMich/MagicMirror/issues/1504).
+- Fixed temperature displays in currentweather and weatherforecast modules [#1503](https://github.com/MagicMirrorOrg/MagicMirror/issues/1503), [#1511](https://github.com/MagicMirrorOrg/MagicMirror/issues/1511).
+- Fixed unhandled error on bad git data in updatenotification module [#1285](https://github.com/MagicMirrorOrg/MagicMirror/issues/1285).
+- Weather forecast now works with openweathermap in new weather module. Daily data are displayed, see issue [#1504](https://github.com/MagicMirrorOrg/MagicMirror/issues/1504).
 - Fixed analogue clock border display issue where non-black backgrounds used (previous fix for issue 611)
-- Fixed compatibility issues caused when modules request different versions of Font Awesome, see issue [#1522](https://github.com/MichMich/MagicMirror/issues/1522). MagicMirror now uses [Font Awesome 5 with v4 shims included for backwards compatibility](https://fontawesome.com/how-to-use/on-the-web/setup/upgrading-from-version-4#shims).
+- Fixed compatibility issues caused when modules request different versions of Font Awesome, see issue [#1522](https://github.com/MagicMirrorOrg/MagicMirror/issues/1522). MagicMirror² now uses [Font Awesome 5 with v4 shims included for backwards compatibility](https://fontawesome.com/how-to-use/on-the-web/setup/upgrading-from-version-4#shims).
 - Installation script problems with raspbian
-- Calendar: only show repeating count if the event is actually repeating [#1534](https://github.com/MichMich/MagicMirror/pull/1534)
+- Calendar: only show repeating count if the event is actually repeating [#1534](https://github.com/MagicMirrorOrg/MagicMirror/pull/1534)
 - Calendar: Fix exdate handling when multiple values are specified (comma separated)
-- Calendar: Fix relative date handling for fulldate events, calculate difference always from start of day [#1572](https://github.com/MichMich/MagicMirror/issues/1572)
+- Calendar: Fix relative date handling for fulldate events, calculate difference always from start of day [#1572](https://github.com/MagicMirrorOrg/MagicMirror/issues/1572)
 - Fix null dereference in moduleNeedsUpdate when the module isn't visible
 - Calendar: Fixed event end times by setting default calendarEndTime to "LT" (Local time format). [#1479]
-- Calendar: Fixed missing calendar fetchers after server process restarts [#1589](https://github.com/MichMich/MagicMirror/issues/1589)
+- Calendar: Fixed missing calendar fetchers after server process restarts [#1589](https://github.com/MagicMirrorOrg/MagicMirror/issues/1589)
 - Notification: fixed background color (was white text on white background)
 - Use getHeader instead of data.header when creating the DOM so overwriting the function also propagates into it
 - Fix documentation of `useKMPHwind` option in currentweather
 
 ### New weather module
 
-- Fixed weather forecast table display [#1499](https://github.com/MichMich/MagicMirror/issues/1499).
+- Fixed weather forecast table display [#1499](https://github.com/MagicMirrorOrg/MagicMirror/issues/1499).
 - Dimmed loading indicator for weather forecast.
-- Implemented config option `decimalSymbol` [#1499](https://github.com/MichMich/MagicMirror/issues/1499).
-- Aligned indoor values in current weather vertical [#1499](https://github.com/MichMich/MagicMirror/issues/1499).
+- Implemented config option `decimalSymbol` [#1499](https://github.com/MagicMirrorOrg/MagicMirror/issues/1499).
+- Aligned indoor values in current weather vertical [#1499](https://github.com/MagicMirrorOrg/MagicMirror/issues/1499).
 - Added humidity support to nunjuck unit filter.
-- Do not display degree symbol for temperature in Kelvin [#1503](https://github.com/MichMich/MagicMirror/issues/1503).
-- Weather forecast now works with openweathermap for both, `/forecast` and `/forecast/daily`, in new weather module. If you use the `/forecast`-weatherEndpoint, the hourly data are converted to daily data, see issues [#1504](https://github.com/MichMich/MagicMirror/issues/1504), [#1513](https://github.com/MichMich/MagicMirror/issues/1513).
-- Added fade, fadePoint and maxNumberOfDays properties to the forecast mode [#1516](https://github.com/MichMich/MagicMirror/issues/1516)
-- Fixed Loading string and decimalSymbol string replace [#1538](https://github.com/MichMich/MagicMirror/issues/1538)
-- Show Snow amounts in new weather module [#1545](https://github.com/MichMich/MagicMirror/issues/1545)
-- Added weather.gov as a new weather provider for US locations
+- Do not display degree symbol for temperature in Kelvin [#1503](https://github.com/MagicMirrorOrg/MagicMirror/issues/1503).
+- Weather forecast now works with openweathermap for both, `/forecast` and `/forecast/daily`, in new weather module. If you use the `/forecast`-weatherEndpoint, the hourly data are converted to daily data, see issues [#1504](https://github.com/MagicMirrorOrg/MagicMirror/issues/1504), [#1513](https://github.com/MagicMirrorOrg/MagicMirror/issues/1513).
+- Added fade, fadePoint and maxNumberOfDays properties to the forecast mode [#1516](https://github.com/MagicMirrorOrg/MagicMirror/issues/1516)
+- Fixed Loading string and decimalSymbol string replace [#1538](https://github.com/MagicMirrorOrg/MagicMirror/issues/1538)
+- Show Snow amounts in new weather module [#1545](https://github.com/MagicMirrorOrg/MagicMirror/issues/1545)
+- Added weather.gov as a new weather-provider for US locations
 
 ## [2.6.0] - 2019-01-01
 
@@ -550,7 +1041,7 @@ A huge, huge, huge thanks to user @fewieden for all his hard work on the new `we
 - Screenshot for the weather forecast module
 - Portuguese translation for "Feels"
 - Croatian translation
-- Fading for dateheaders timeFormat in Calendar [#1464](https://github.com/MichMich/MagicMirror/issues/1464)
+- Fading for dateheaders timeFormat in Calendar [#1464](https://github.com/MagicMirrorOrg/MagicMirror/issues/1464)
 - Documentation for the existing `scale` option in the Weather Forecast module.
 
 ### Fixed
@@ -559,7 +1050,7 @@ A huge, huge, huge thanks to user @fewieden for all his hard work on the new `we
 - Fixed Polish translation for Single Update Info
 - Ignore entries with unparseable details in the calendar module
 - Bug showing FullDayEvents one day too long in calendar fixed
-- Bug in newsfeed when `removeStartTags` is used on the description [#1478](https://github.com/MichMich/MagicMirror/issues/1478)
+- Bug in newsfeed when `removeStartTags` is used on the description [#1478](https://github.com/MagicMirrorOrg/MagicMirror/issues/1478)
 
 ### Updated
 
@@ -592,7 +1083,7 @@ A huge, huge, huge thanks to user @fewieden for all his hard work on the new `we
 - Fixed mixup between german and spanish translation for newsfeed.
 - Fixed close dates to be absolute, if no configured in the config.js - module Calendar
 - Fixed the updatenotification module message about new commits in the repository, so they can be correctly localized in singular and plural form.
-- Fix for weatherforecast rainfall rounding [#1374](https://github.com/MichMich/MagicMirror/issues/1374)
+- Fix for weatherforecast rainfall rounding [#1374](https://github.com/MagicMirrorOrg/MagicMirror/issues/1374)
 - Fix calendar parsing issue for Midori on RasperryPi Zero w, related to issue #694.
 - Fix weather city ID link in sample config
 - Fixed issue with clientonly not updating with IP address and port provided on command line.
@@ -614,7 +1105,7 @@ A huge, huge, huge thanks to user @fewieden for all his hard work on the new `we
 
 ## [2.4.0] - 2018-07-01
 
-⚠️ **Warning:** This release includes an updated version of Electron. This requires a Raspberry Pi configuration change to allow the best performance and prevent the CPU from overheating. Please read the information on the [MagicMirror Wiki](https://github.com/michmich/magicmirror/wiki/configuring-the-raspberry-pi#enable-the-open-gl-driver-to-decrease-electrons-cpu-usage).
+⚠️ **Warning:** This release includes an updated version of Electron. This requires a Raspberry Pi configuration change to allow the best performance and prevent the CPU from overheating. Please read the information on the [MagicMirror² Wiki](https://github.com/MagicMirrorOrg/MagicMirror/wiki/configuring-the-raspberry-pi#enable-the-open-gl-driver-to-decrease-electrons-cpu-usage).
 
 ℹ️ **Note:** This update uses new dependencies. Please update using the following command: `git pull && npm install`
 
@@ -636,20 +1127,20 @@ A huge, huge, huge thanks to user @fewieden for all his hard work on the new `we
 
 - Upgrade to Electron 2.0.0.
 - Remove yarn-or-npm which breaks production builds.
-- Invoke module suspend even if no dom content. [#1308](https://github.com/MichMich/MagicMirror/issues/1308)
+- Invoke module suspend even if no dom content. [#1308](https://github.com/MagicMirrorOrg/MagicMirror/issues/1308)
 
 ### Fixed
 
-- Fixed issue where wind chill could not be displayed in Fahrenheit. [#1247](https://github.com/MichMich/MagicMirror/issues/1247)
-- Fixed issues where a module crashes when it tries to dismiss a non existing alert. [#1240](https://github.com/MichMich/MagicMirror/issues/1240)
+- Fixed issue where wind chill could not be displayed in Fahrenheit. [#1247](https://github.com/MagicMirrorOrg/MagicMirror/issues/1247)
+- Fixed issues where a module crashes when it tries to dismiss a non existing alert. [#1240](https://github.com/MagicMirrorOrg/MagicMirror/issues/1240)
 - In default module currentWeather/currentWeather.js line 296, 300, self.config.animationSpeed can not be found because the notificationReceived function does not have "self" variable.
 - Fixed browser-side code to work on the Midori browser.
-- Fixed issue where heat index was reporting incorrect values in Celsius and Fahrenheit. [#1263](https://github.com/MichMich/MagicMirror/issues/1263)
+- Fixed issue where heat index was reporting incorrect values in Celsius and Fahrenheit. [#1263](https://github.com/MagicMirrorOrg/MagicMirror/issues/1263)
 - Fixed weatherforecast to use dt_txt field instead of dt to handle timezones better
-- Newsfeed now remembers to show the description when `"ARTICLE_LESS_DETAILS"` is called if the user wants to always show the description. [#1282](https://github.com/MichMich/MagicMirror/issues/1282)
+- Newsfeed now remembers to show the description when `"ARTICLE_LESS_DETAILS"` is called if the user wants to always show the description. [#1282](https://github.com/MagicMirrorOrg/MagicMirror/issues/1282)
 - `clientonly/*.js` is now linted, and one linting error is fixed
 - Fix issue #1196 by changing underscore to hyphen in locale id, in align with momentjs.
-- Fixed issue where heat index and wind chill were reporting incorrect values in Kelvin. [#1263](https://github.com/MichMich/MagicMirror/issues/1263)
+- Fixed issue where heat index and wind chill were reporting incorrect values in Kelvin. [#1263](https://github.com/MagicMirrorOrg/MagicMirror/issues/1263)
 
 ### Updated
 
@@ -661,7 +1152,7 @@ A huge, huge, huge thanks to user @fewieden for all his hard work on the new `we
 
 ### Fixed
 
-- Downgrade electron to 1.4.15 to solve the black screen issue.[#1243](https://github.com/MichMich/MagicMirror/issues/1243)
+- Downgrade electron to 1.4.15 to solve the black screen issue.[#1243](https://github.com/MagicMirrorOrg/MagicMirror/issues/1243)
 
 ## [2.3.0] - 2018-04-01
 
@@ -672,7 +1163,7 @@ A huge, huge, huge thanks to user @fewieden for all his hard work on the new `we
 - Add types for module.
 - Implement Danger.js to notify contributors when CHANGELOG.md is missing in PR.
 - Allow scrolling in full page article view of default newsfeed module with gesture events from [MMM-Gestures](https://github.com/thobach/MMM-Gestures)
-- Changed 'compliments.js' - update DOM if remote compliments are loaded instead of waiting one updateInterval to show custom compliments
+- Changed 'compliments.js' - Updated DOM if remote compliments are loaded instead of waiting one updateInterval to show custom compliments
 - Automated unit tests utils, deprecated, translator, cloneObject(lockstrings)
 - Automated integration tests translations
 - Add advanced filtering to the excludedEvents configuration of the default calendar module
@@ -684,7 +1175,7 @@ A huge, huge, huge thanks to user @fewieden for all his hard work on the new `we
 
 - Add link to GitHub repository which contains the respective Dockerfile.
 - Optimized automated unit tests cloneObject, cmpVersions
-- Update notifications use now translation templates instead of normal strings.
+- Updated notifications use now translation templates instead of normal strings.
 - Yarn can be used now as an installation tool
 - Changed Electron dependency to v1.7.13.
 
@@ -787,8 +1278,8 @@ A huge, huge, huge thanks to user @fewieden for all his hard work on the new `we
 
 ### Changed
 
-- Revert Docker related changes in favor of [docker-MagicMirror](https://github.com/bastilimbach/docker-MagicMirror). All Docker images are outsourced. ([#856](https://github.com/MichMich/MagicMirror/pull/856))
-- Change Docker base image (Debian + Node) to an arm based distro (AlpineARM + Node) ([#846](https://github.com/MichMich/MagicMirror/pull/846))
+- Revert Docker related changes in favor of [docker-MagicMirror](https://github.com/bastilimbach/docker-MagicMirror). All Docker images are outsourced. ([#856](https://github.com/MagicMirrorOrg/MagicMirror/pull/856))
+- Change Docker base image (Debian + Node) to an arm based distro (AlpineARM + Node) ([#846](https://github.com/MagicMirrorOrg/MagicMirror/pull/846))
 - Fix the dockerfile to have it running from the first time.
 
 ### Added
@@ -835,7 +1326,7 @@ A huge, huge, huge thanks to user @fewieden for all his hard work on the new `we
 - Add `anytime` group for Compliments module.
 - Compliments module can use remoteFile without default daytime arrays defined.
 - Installer: Use init config.js from config.js.sample.
-- Switched out `rrule` package for `rrule-alt` and fixes in `ical.js` in order to fix calendar issues. ([#565](https://github.com/MichMich/MagicMirror/issues/565))
+- Switched out `rrule` package for `rrule-alt` and fixes in `ical.js` in order to fix calendar issues. ([#565](https://github.com/MagicMirrorOrg/MagicMirror/issues/565))
 - Make mouse events pass through the region fullscreen_above to modules below.
 - Scaled the splash screen down to make it a bit more subtle.
 - Replace HTML tables with markdown tables in README files.
@@ -848,14 +1339,14 @@ A huge, huge, huge thanks to user @fewieden for all his hard work on the new `we
 
 ### Added
 
-- Added Docker support (Pull Request [#673](https://github.com/MichMich/MagicMirror/pull/673)).
+- Added Docker support (Pull Request [#673](https://github.com/MagicMirrorOrg/MagicMirror/pull/673)).
 - Calendar-specific support for `maximumEntries`, and `maximumNumberOfDays`.
 - Add loaded function to modules, providing an async callback.
 - Made default newsfeed module aware of gesture events from [MMM-Gestures](https://github.com/thobach/MMM-Gestures)
 - Add use pm2 for manager process into Installer RaspberryPi script.
 - Russian Translation.
 - Afrikaans Translation.
-- Add postinstall script to notify user that MagicMirror installed successfully despite warnings from NPM.
+- Add postinstall script to notify user that MagicMirror² installed successfully despite warnings from NPM.
 - Init tests using mocha.
 - Option to use RegExp in Calendar's titleReplace.
 - Hungarian Translation.
@@ -891,10 +1382,10 @@ A huge, huge, huge thanks to user @fewieden for all his hard work on the new `we
 
 ### Fixed
 
-- Update .gitignore to not ignore default modules folder.
+- Updated .gitignore to not ignore default modules folder.
 - Remove white flash on boot up.
 - Added `update` in Raspberry Pi installation script.
-- Fix an issue where the analog clock looked scrambled. ([#611](https://github.com/MichMich/MagicMirror/issues/611))
+- Fix an issue where the analog clock looked scrambled. ([#611](https://github.com/MagicMirrorOrg/MagicMirror/issues/611))
 - If units are set to imperial, the showRainAmount option of weatherforecast will show the correct unit.
 - Module currentWeather: check if temperature received from api is defined.
 - Fix an issue with module hidden status changing to `true` although lock string prevented showing it.
@@ -911,18 +1402,18 @@ A huge, huge, huge thanks to user @fewieden for all his hard work on the new `we
 - Finnish translation.
 - Danish translation.
 - Turkish translation.
-- Option to limit access to certain IP addresses based on the value of `ipWhitelist` in the `config.js`, default is access from localhost only (Issue [#456](https://github.com/MichMich/MagicMirror/issues/456)).
+- Option to limit access to certain IP addresses based on the value of `ipWhitelist` in the `config.js`, default is access from localhost only (Issue [#456](https://github.com/MagicMirrorOrg/MagicMirror/issues/456)).
 - Added ability to change the point of time when calendar events get relative.
 - Add Splash screen on boot.
 - Add option to show humidity in currentWeather module.
 - Add VSCode IntelliSense support.
-- Module API: Add Visibility locking to module system. [See documentation](https://github.com/MichMich/MagicMirror/tree/develop/modules#visibility-locking) for more information.
-- Module API: Method to overwrite the module's header. [See documentation](https://github.com/MichMich/MagicMirror/tree/develop/modules#getheader) for more information.
-- Module API: Option to define the minimum MagicMirror version to run a module. [See documentation](https://github.com/MichMich/MagicMirror/tree/develop/modules#requiresversion) for more information.
-- Calendar module now broadcasts the event list to all other modules using the notification system. [See documentation](https://github.com/MichMich/MagicMirror/tree/develop/modules/default/calendar) for more information.
-- Possibility to use the calendar feed as the source for the weather (currentweather & weatherforecast) location data. [See documentation](https://github.com/MichMich/MagicMirror/tree/develop/modules/default/weatherforecast) for more information.
+- Module API: Add Visibility locking to module system. [See documentation](https://github.com/MagicMirrorOrg/MagicMirror/tree/develop/modules#visibility-locking) for more information.
+- Module API: Method to overwrite the module's header. [See documentation](https://github.com/MagicMirrorOrg/MagicMirror/tree/develop/modules#getheader) for more information.
+- Module API: Option to define the minimum MagicMirror² version to run a module. [See documentation](https://github.com/MagicMirrorOrg/MagicMirror/tree/develop/modules#requiresversion) for more information.
+- Calendar module now broadcasts the event list to all other modules using the notification system. [See documentation](https://github.com/MagicMirrorOrg/MagicMirror/tree/develop/modules/default/calendar) for more information.
+- Possibility to use the calendar feed as the source for the weather (currentweather & weatherforecast) location data. [See documentation](https://github.com/MagicMirrorOrg/MagicMirror/tree/develop/modules/default/weatherforecast) for more information.
 - Added option to show rain amount in the weatherforecast default module
-- Add module `updatenotification` to get an update whenever a new version is available. [See documentation](https://github.com/MichMich/MagicMirror/tree/develop/modules/default/updatenotification) for more information.
+- Add module `updatenotification` to get an update whenever a new version is available. [See documentation](https://github.com/MagicMirrorOrg/MagicMirror/tree/develop/modules/default/updatenotification) for more information.
 - Add the ability to set timezone on the date display in the Clock Module
 - Ability to set date format in calendar module
 - Possibility to use currentweather for the compliments
@@ -976,8 +1467,8 @@ A huge, huge, huge thanks to user @fewieden for all his hard work on the new `we
 ### Updated
 
 - Force fullscreen when kioskmode is active.
-- Update the .github templates and information with more modern information.
-- Update the Gruntfile with a more functional StyleLint implementation.
+- Updated the .github templates and information with more modern information.
+- Updated the Gruntfile with a more functional StyleLint implementation.
 
 ## [2.0.4] - 2016-08-07
 
@@ -992,11 +1483,11 @@ A huge, huge, huge thanks to user @fewieden for all his hard work on the new `we
 ### Fixed
 
 - Prevent `getModules()` selectors from returning duplicate entries.
-- Append endpoints of weather modules with `/` to retrieve the correct data. (Issue [#337](https://github.com/MichMich/MagicMirror/issues/337))
+- Append endpoints of weather modules with `/` to retrieve the correct data. (Issue [#337](https://github.com/MagicMirrorOrg/MagicMirror/issues/337))
 - Corrected grammar in `module.js` from 'suspend' to 'suspended'.
 - Fixed openweathermap.org URL in config sample.
 - Prevent currentweather module from crashing when received data object is incorrect.
-- Fix issue where translation loading prevented the UI start-up when the language was set to 'en'. (Issue [#388](https://github.com/MichMich/MagicMirror/issues/388))
+- Fix issue where translation loading prevented the UI start-up when the language was set to 'en'. (Issue [#388](https://github.com/MagicMirrorOrg/MagicMirror/issues/388))
 
 ### Updated
 
@@ -1016,8 +1507,8 @@ A huge, huge, huge thanks to user @fewieden for all his hard work on the new `we
 
 ### Fixed
 
-- Edit Alert Module to display title & message if they are provided in the notification (Issue [#300](https://github.com/MichMich/MagicMirror/issues/300))
-- Removed 'null' reference from updateModuleContent(). This fixes recent Edge and Internet Explorer browser displays (Issue [#319](https://github.com/MichMich/MagicMirror/issues/319))
+- Edit Alert Module to display title & message if they are provided in the notification (Issue [#300](https://github.com/MagicMirrorOrg/MagicMirror/issues/300))
+- Removed 'null' reference from updateModuleContent(). This fixes recent Edge and Internet Explorer browser displays (Issue [#319](https://github.com/MagicMirrorOrg/MagicMirror/issues/319))
 
 ### Changed
 
@@ -1034,7 +1525,7 @@ A huge, huge, huge thanks to user @fewieden for all his hard work on the new `we
 ### Fixed
 
 - Added reference to Italian Translation.
-- Added the missing NE translation to all languages. [#344](https://github.com/MichMich/MagicMirror/issues/344)
+- Added the missing NE translation to all languages. [#344](https://github.com/MagicMirrorOrg/MagicMirror/issues/344)
 - Added proper User-Agent string to calendar call.
 
 ### Changed
@@ -1065,6 +1556,6 @@ It includes (but is not limited to) the following features:
 
 ## [1.0.0] - 2014-02-16
 
-### Initial release of MagicMirror.
+### Initial release of MagicMirror
 
 This was part of the blogpost: [https://michaelteeuw.nl/post/83916869600/magic-mirror-part-vi-production-of-the](https://michaelteeuw.nl/post/83916869600/magic-mirror-part-vi-production-of-the)

Collaboration.md

@@ -0,0 +1,38 @@
+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)
+- merge to `master` only for releases or other urgent issues (update notification is only triggered by tags)
+- 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 @rejas or @khassel.
+
+### Deployment steps
+
+- pull latest `develop` branch
+- update `package.json` to reflect correct version number
+- run `npm install` to generate new `package-lock.json`
+- test `develop` branch
+- update `CHANGELOG.md` (don't forget to add all contributor names)
+- commit and push all changes
+- after successful test run via github actions: create pull request to `master` branch
+- after PR tests run without issues, merge PR
+- create new release with corresponding version tag
+- publish release notes with link to github release on forum in new locked topic
+
+### Draft new development release
+
+- checkout `develop` branch
+- update `package.json` to reflect correct version number `2.xx.0-develop`
+- draft new section in `CHANGELOG.md`
+- commit and publish `develop` branch

LICENSE.md

@@ -1,6 +1,6 @@
 # The MIT License (MIT)
 
-Copyright © 2016-2021 Michael Teeuw
+Copyright © 2016-2024 Michael Teeuw
 
 Permission is hereby granted, free of charge, to any person
 obtaining a copy of this software and associated documentation

README.md

@@ -1,15 +1,17 @@
 ![MagicMirror²: The open source modular smart mirror platform. ](.github/header.png)
 
 <p style="text-align: center">
-	<a href="https://david-dm.org/MichMich/MagicMirror"><img src="https://david-dm.org/MichMich/MagicMirror.svg" alt="Dependency Status"></a>
-	<a href="https://david-dm.org/MichMich/MagicMirror?type=dev"><img src="https://david-dm.org/MichMich/MagicMirror/dev-status.svg" alt="devDependency Status"></a>
-	<a href="https://bestpractices.coreinfrastructure.org/projects/347"><img src="https://bestpractices.coreinfrastructure.org/projects/347/badge" alt="CLI Best Practices"></a>
-	<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://choosealicense.com/licenses/mit"><img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="License"></a>
-	<a href="https://github.com/MichMich/MagicMirror/actions?query=workflow%3A%22Automated+Tests%22"><img src="https://github.com/MichMich/MagicMirror/workflows/Automated%20Tests/badge.svg" alt="Tests"></a>
+  <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/magicmirrororg/magicmirror/automated-tests.yaml" alt="GitHub Actions">
+	<img src="https://img.shields.io/github/checks-status/magicmirrororg/magicmirror/master" alt="Build Status">
+	<a href="https://github.com/MagicMirrorOrg/MagicMirror">
+		<img src="https://img.shields.io/github/stars/magicmirrororg/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²** 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/MagicMirrorOrg/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!
 
@@ -35,7 +37,7 @@ Contributions of all kinds are welcome, not only in the form of code but also wi
 - documentation
 - translations
 
-For the full contribution guidelines, check out: [https://docs.magicmirror.builders/getting-started/contributing.html](https://docs.magicmirror.builders/getting-started/contributing.html)
+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!
 

clientonly/index.js

@@ -7,16 +7,16 @@
 	/**
 	 * Helper function to get server address/hostname from either the commandline or env
 	 */
-	function getServerAddress() {
+	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) {
+		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;
@@ -33,15 +33,14 @@
 
 	/**
 	 * Gets the config from the specified server url
-	 *
 	 * @param {string} url location where the server is running.
 	 * @returns {Promise} the config
 	 */
-	function getServerConfig(url) {
+	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 lib = url.startsWith("https") ? require("node:https") : require("node:http");
 			const request = lib.get(url, (response) => {
 				let configData = "";
 
@@ -63,11 +62,10 @@
 
 	/**
 	 * 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) {
+	function fail (message, code = 1) {
 		if (message !== undefined && typeof message === "string") {
 			console.log(message);
 		} else {
@@ -87,6 +85,7 @@
 			.then(function (configReturn) {
 				// Pass along the server config via an environment variable
 				const env = Object.create(process.env);
+				env.clientonly = true; // set to pass to electron.js
 				const options = { env: env };
 				configReturn.address = config.address;
 				configReturn.port = config.port;
@@ -95,7 +94,7 @@
 
 				// Spawn electron application
 				const electron = require("electron");
-				const child = require("child_process").spawn(electron, ["js/electron.js"], options);
+				const child = require("node:child_process").spawn(electron, ["js/electron.js"], options);
 
 				// Pipe all child process output to current stdout
 				child.stdout.on("data", function (buf) {
@@ -123,4 +122,4 @@
 	} else {
 		fail();
 	}
-})();
+}());

config/config.js.sample

@@ -1,41 +1,37 @@
-/* Magic Mirror Config Sample
- *
- * By Michael Teeuw https://michaelteeuw.nl
- * MIT Licensed.
+/* Config Sample
  *
  * For more information on how you can configure this file
- * see https://docs.magicmirror.builders/getting-started/configuration.html#general
+ * see https://docs.magicmirror.builders/configuration/introduction.html
  * and https://docs.magicmirror.builders/modules/configuration.html
+ *
+ * You can use environment variables using a `config.js.template` file instead of `config.js`
+ * which will be converted to `config.js` while starting. For more information
+ * see https://docs.magicmirror.builders/configuration/introduction.html#enviromnent-variables
  */
 let config = {
-	address: "localhost", 	// Address to listen on, can be:
+	address: "localhost",	// Address to listen on, can be:
 							// - "localhost", "127.0.0.1", "::1" to listen on loopback interface
 							// - another specific IPv4/6 to listen on a specific interface
 							// - "0.0.0.0", "::" to listen on any interface
 							// Default, when address config is left out or empty, is "localhost"
 	port: 8080,
-	basePath: "/", 	// The URL path where MagicMirror is hosted. If you are using a Reverse proxy
-					// you must set the sub path here. basePath must end with a /
-	ipWhitelist: ["127.0.0.1", "::ffff:127.0.0.1", "::1"], 	// Set [] to allow all IP addresses
-															// or add a specific IPv4 of 192.168.1.5 :
-															// ["127.0.0.1", "::ffff:127.0.0.1", "::1", "::ffff:192.168.1.5"],
-															// or IPv4 range of 192.168.3.0 --> 192.168.3.15 use CIDR format :
-															// ["127.0.0.1", "::ffff:127.0.0.1", "::1", "::ffff:192.168.3.0/28"],
+	basePath: "/",	// The URL path where MagicMirror² is hosted. If you are using a Reverse proxy
+									// you must set the sub path here. basePath must end with a /
+	ipWhitelist: ["127.0.0.1", "::ffff:127.0.0.1", "::1"],	// Set [] to allow all IP addresses
+									// or add a specific IPv4 of 192.168.1.5 :
+									// ["127.0.0.1", "::ffff:127.0.0.1", "::1", "::ffff:192.168.1.5"],
+									// or IPv4 range of 192.168.3.0 --> 192.168.3.15 use CIDR format :
+									// ["127.0.0.1", "::ffff:127.0.0.1", "::1", "::ffff:192.168.3.0/28"],
 
-	useHttps: false, 		// Support HTTPS or not, default "false" will use HTTP
-	httpsPrivateKey: "", 	// HTTPS private key path, only require when useHttps is true
-	httpsCertificate: "", 	// HTTPS Certificate path, only require when useHttps is true
+	useHttps: false,			// Support HTTPS or not, default "false" will use HTTP
+	httpsPrivateKey: "",	// HTTPS private key path, only require when useHttps is true
+	httpsCertificate: "",	// HTTPS Certificate path, only require when useHttps is true
 
 	language: "en",
 	locale: "en-US",
 	logLevel: ["INFO", "LOG", "WARN", "ERROR"], // Add "DEBUG" for even more logging
 	timeFormat: 24,
 	units: "metric",
-	// serverOnly:  true/false/"local" ,
-	// local for armv6l processors, default
-	//   starts serveronly and then starts chrome browser
-	// false, default for all NON-armv6l devices
-	// true, force serveronly mode, because you want to.. no UI on this device
 
 	modules: [
 		{
@@ -56,8 +52,9 @@ let config = {
 			config: {
 				calendars: [
 					{
+						fetchInterval: 7 * 24 * 60 * 60 * 1000,
 						symbol: "calendar-check",
-						url: "webcal://www.calendarlabs.com/ical-calendar/ics/76/US_Holidays.ics"
+						url: "https://ics.calendarlabs.com/76/mm3137/US_Holidays.ics"
 					}
 				]
 			}
@@ -70,11 +67,10 @@ let config = {
 			module: "weather",
 			position: "top_right",
 			config: {
-				weatherProvider: "openweathermap",
+				weatherProvider: "openmeteo",
 				type: "current",
-				location: "New York",
-				locationID: "5128581", //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find your city
-				apiKey: "YOUR_OPENWEATHER_API_KEY"
+				lat: 40.776676,
+				lon: -73.971321
 			}
 		},
 		{
@@ -82,11 +78,10 @@ let config = {
 			position: "top_right",
 			header: "Weather Forecast",
 			config: {
-				weatherProvider: "openweathermap",
+				weatherProvider: "openmeteo",
 				type: "forecast",
-				location: "New York",
-				locationID: "5128581", //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find your city
-				apiKey: "YOUR_OPENWEATHER_API_KEY"
+				lat: 40.776676,
+				lon: -73.971321
 			}
 		},
 		{
@@ -109,4 +104,4 @@ let config = {
 };
 
 /*************** DO NOT EDIT THE LINE BELOW ***************/
-if (typeof module !== "undefined") {module.exports = config;}
+if (typeof module !== "undefined") { module.exports = config; }

css/custom.css.sample

@@ -1,10 +1,8 @@
-/* Magic Mirror Custom CSS Sample
+/* 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: */
@@ -18,7 +16,7 @@
 
   --font-primary: "Roboto Condensed";
   --font-secondary: "Roboto";
-  
+
   --font-size: 20px;
   --font-size-small: 0.75rem;
 
@@ -26,6 +24,6 @@
   --gap-body-right: 60px;
   --gap-body-bottom: 60px;
   --gap-body-left: 60px;
-  
+
   --gap-modules: 30px;
 }

css/main.css

@@ -3,18 +3,18 @@
   --color-text-dimmed: #666;
   --color-text-bright: #fff;
   --color-background: #000;
-
   --font-primary: "Roboto Condensed";
   --font-secondary: "Roboto";
-
   --font-size: 20px;
-  --font-size-small: 0.75rem;
-
+  --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;
 }
 
@@ -60,27 +60,27 @@ body {
 }
 
 .xsmall {
-  font-size: var(--font-size-small);
+  font-size: var(--font-size-xsmall);
   line-height: 1.275;
 }
 
 .small {
-  font-size: 1rem;
+  font-size: var(--font-size-small);
   line-height: 1.25;
 }
 
 .medium {
-  font-size: 1.5rem;
+  font-size: var(--font-size-medium);
   line-height: 1.225;
 }
 
 .large {
-  font-size: 3.25rem;
+  font-size: var(--font-size-large);
   line-height: 1;
 }
 
 .xlarge {
-  font-size: 3.75rem;
+  font-size: var(--font-size-xlarge);
   line-height: 1;
   letter-spacing: -3px;
 }
@@ -115,7 +115,7 @@ body {
 
 header {
   text-transform: uppercase;
-  font-size: var(--font-size-small);
+  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);
@@ -138,6 +138,14 @@ sup {
   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;
@@ -163,17 +171,10 @@ sup {
 
 .region.fullscreen {
   position: absolute;
-  top: calc(-1 * var(--gap-body-top));
-  left: calc(-1 * var(--gap-body-left));
-  right: calc(-1 * var(--gap-body-right));
-  bottom: calc(-1 * var(--gap-body-bottom));
+  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.fullscreen * {
-  pointer-events: auto;
-}
-
 .region.right {
   right: 0;
   text-align: right;

fonts/package-lock.json

@@ -1,26 +1,27 @@
 {
 	"name": "magicmirror-fonts",
-	"lockfileVersion": 2,
+	"version": "1.0.0",
+	"lockfileVersion": 3,
 	"requires": true,
 	"packages": {
 		"": {
 			"name": "magicmirror-fonts",
+			"version": "1.0.0",
 			"license": "MIT",
 			"dependencies": {
-				"roboto-fontface": "^0.10.0"
+				"@fontsource/roboto": "^5.0.13",
+				"@fontsource/roboto-condensed": "^5.0.16"
 			}
 		},
-		"node_modules/roboto-fontface": {
-			"version": "0.10.0",
-			"resolved": "https://registry.npmjs.org/roboto-fontface/-/roboto-fontface-0.10.0.tgz",
-			"integrity": "sha512-OlwfYEgA2RdboZohpldlvJ1xngOins5d7ejqnIBWr9KaMxsnBqotpptRXTyfNRLnFpqzX6sTDt+X+a+6udnU8g=="
-		}
-	},
-	"dependencies": {
-		"roboto-fontface": {
-			"version": "0.10.0",
-			"resolved": "https://registry.npmjs.org/roboto-fontface/-/roboto-fontface-0.10.0.tgz",
-			"integrity": "sha512-OlwfYEgA2RdboZohpldlvJ1xngOins5d7ejqnIBWr9KaMxsnBqotpptRXTyfNRLnFpqzX6sTDt+X+a+6udnU8g=="
+		"node_modules/@fontsource/roboto": {
+			"version": "5.0.13",
+			"resolved": "https://registry.npmjs.org/@fontsource/roboto/-/roboto-5.0.13.tgz",
+			"integrity": "sha512-j61DHjsdUCKMXSdNLTOxcG701FWnF0jcqNNQi2iPCDxU8seN/sMxeh62dC++UiagCWq9ghTypX+Pcy7kX+QOeQ=="
+		},
+		"node_modules/@fontsource/roboto-condensed": {
+			"version": "5.0.16",
+			"resolved": "https://registry.npmjs.org/@fontsource/roboto-condensed/-/roboto-condensed-5.0.16.tgz",
+			"integrity": "sha512-pjO80g5x/hkqzWCIafvkS3JrkBDxSiTjEy4LdqQKJYrmoGx8x2AlhSUMgzIzG/ge4kT98bA7+gmm7yquzrrZ/w=="
 		}
 	}
 }

fonts/package.json

@@ -1,15 +1,17 @@
 {
 	"name": "magicmirror-fonts",
-	"description": "Package for fonts use by MagicMirror Core.",
+	"version": "1.0.0",
+	"description": "Package for fonts use by MagicMirror² core.",
+	"bugs": {
+		"url": "https://github.com/MagicMirrorOrg/MagicMirror/issues"
+	},
 	"repository": {
 		"type": "git",
-		"url": "git+https://github.com/MichMich/MagicMirror.git"
+		"url": "https://github.com/MagicMirrorOrg/MagicMirror"
 	},
 	"license": "MIT",
-	"bugs": {
-		"url": "https://github.com/MichMich/MagicMirror/issues"
-	},
 	"dependencies": {
-		"roboto-fontface": "^0.10.0"
+		"@fontsource/roboto": "^5.0.13",
+		"@fontsource/roboto-condensed": "^5.0.16"
 	}
 }

fonts/roboto.css

@@ -1,58 +1,671 @@
+/* roboto-cyrillic-ext-100-normal */
 @font-face {
   font-family: Roboto;
   font-style: normal;
+  font-display: var(--fontsource-display, swap);
   font-weight: 100;
-  src: local("Roboto Thin"), local("Roboto-Thin"), url("node_modules/roboto-fontface/fonts/roboto/Roboto-Thin.woff2") format("woff2"), url("node_modules/roboto-fontface/fonts/roboto/Roboto-Thin.woff") format("woff");
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-cyrillic-ext-100-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-cyrillic-ext-100-normal.woff") format("woff");
+  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
 }
 
+/* roboto-cyrillic-100-normal */
 @font-face {
-  font-family: "Roboto Condensed";
+  font-family: Roboto;
   font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 100;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-cyrillic-100-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-cyrillic-100-normal.woff") format("woff");
+  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+
+/* roboto-greek-ext-100-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 100;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-greek-ext-100-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-greek-ext-100-normal.woff") format("woff");
+  unicode-range: U+1F00-1FFF;
+}
+
+/* roboto-greek-100-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 100;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-greek-100-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-greek-100-normal.woff") format("woff");
+  unicode-range: U+0370-03FF;
+}
+
+/* roboto-vietnamese-100-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 100;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-vietnamese-100-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-vietnamese-100-normal.woff") format("woff");
+  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+/* roboto-latin-ext-100-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 100;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-latin-ext-100-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-latin-ext-100-normal.woff") format("woff");
+  unicode-range: U+0100-02AF, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+
+/* roboto-latin-100-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 100;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-latin-100-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-latin-100-normal.woff") format("woff");
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+/* roboto-cyrillic-ext-300-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
   font-weight: 300;
-  src: local("Roboto Condensed Light"), local("RobotoCondensed-Light"), url("node_modules/roboto-fontface/fonts/roboto-condensed/Roboto-Condensed-Light.woff2") format("woff2"),
-    url("node_modules/roboto-fontface/fonts/roboto-condensed/Roboto-Condensed-Light.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/roboto-fontface/fonts/roboto-condensed/Roboto-Condensed-Regular.woff2") format("woff2"),
-    url("node_modules/roboto-fontface/fonts/roboto-condensed/Roboto-Condensed-Regular.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/roboto-fontface/fonts/roboto-condensed/Roboto-Condensed-Bold.woff2") format("woff2"),
-    url("node_modules/roboto-fontface/fonts/roboto-condensed/Roboto-Condensed-Bold.woff") format("woff");
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-cyrillic-ext-300-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-cyrillic-ext-300-normal.woff") format("woff");
+  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
 }
 
+/* roboto-cyrillic-300-normal */
 @font-face {
   font-family: Roboto;
   font-style: normal;
-  font-weight: 400;
-  src: local("Roboto"), local("Roboto-Regular"), url("node_modules/roboto-fontface/fonts/roboto/Roboto-Regular.woff2") format("woff2"), url("node_modules/roboto-fontface/fonts/roboto/Roboto-Regular.woff") format("woff");
+  font-display: var(--fontsource-display, swap);
+  font-weight: 300;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-cyrillic-300-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-cyrillic-300-normal.woff") format("woff");
+  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
 }
 
+/* roboto-greek-ext-300-normal */
 @font-face {
   font-family: Roboto;
   font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 300;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-greek-ext-300-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-greek-ext-300-normal.woff") format("woff");
+  unicode-range: U+1F00-1FFF;
+}
+
+/* roboto-greek-300-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 300;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-greek-300-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-greek-300-normal.woff") format("woff");
+  unicode-range: U+0370-03FF;
+}
+
+/* roboto-vietnamese-300-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 300;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-vietnamese-300-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-vietnamese-300-normal.woff") format("woff");
+  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+/* roboto-latin-ext-300-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 300;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-latin-ext-300-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-latin-ext-300-normal.woff") format("woff");
+  unicode-range: U+0100-02AF, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+
+/* roboto-latin-300-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 300;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-latin-300-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-latin-300-normal.woff") format("woff");
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+/* roboto-cyrillic-ext-400-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 400;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-cyrillic-ext-400-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-cyrillic-ext-400-normal.woff") format("woff");
+  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+
+/* roboto-cyrillic-400-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 400;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-cyrillic-400-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-cyrillic-400-normal.woff") format("woff");
+  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+
+/* roboto-greek-ext-400-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 400;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-greek-ext-400-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-greek-ext-400-normal.woff") format("woff");
+  unicode-range: U+1F00-1FFF;
+}
+
+/* roboto-greek-400-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 400;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-greek-400-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-greek-400-normal.woff") format("woff");
+  unicode-range: U+0370-03FF;
+}
+
+/* roboto-vietnamese-400-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 400;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-vietnamese-400-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-vietnamese-400-normal.woff") format("woff");
+  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+/* roboto-latin-ext-400-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 400;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-latin-ext-400-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-latin-ext-400-normal.woff") format("woff");
+  unicode-range: U+0100-02AF, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+
+/* roboto-latin-400-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 400;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-latin-400-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-latin-400-normal.woff") format("woff");
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+/* roboto-cyrillic-ext-500-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
   font-weight: 500;
-  src: local("Roboto Medium"), local("Roboto-Medium"), url("node_modules/roboto-fontface/fonts/roboto/Roboto-Medium.woff2") format("woff2"), url("node_modules/roboto-fontface/fonts/roboto/Roboto-Medium.woff") format("woff");
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-cyrillic-ext-500-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-cyrillic-ext-500-normal.woff") format("woff");
+  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
 }
 
+/* roboto-cyrillic-500-normal */
 @font-face {
   font-family: Roboto;
   font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 500;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-cyrillic-500-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-cyrillic-500-normal.woff") format("woff");
+  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+
+/* roboto-greek-ext-500-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 500;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-greek-ext-500-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-greek-ext-500-normal.woff") format("woff");
+  unicode-range: U+1F00-1FFF;
+}
+
+/* roboto-greek-500-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 500;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-greek-500-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-greek-500-normal.woff") format("woff");
+  unicode-range: U+0370-03FF;
+}
+
+/* roboto-vietnamese-500-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 500;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-vietnamese-500-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-vietnamese-500-normal.woff") format("woff");
+  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+/* roboto-latin-ext-500-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 500;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-latin-ext-500-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-latin-ext-500-normal.woff") format("woff");
+  unicode-range: U+0100-02AF, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+
+/* roboto-latin-500-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 500;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-latin-500-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-latin-500-normal.woff") format("woff");
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+/* roboto-cyrillic-ext-700-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
   font-weight: 700;
-  src: local("Roboto Bold"), local("Roboto-Bold"), url("node_modules/roboto-fontface/fonts/roboto/Roboto-Bold.woff2") format("woff2"), url("node_modules/roboto-fontface/fonts/roboto/Roboto-Bold.woff") format("woff");
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-cyrillic-ext-700-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-cyrillic-ext-700-normal.woff") format("woff");
+  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
 }
 
+/* roboto-cyrillic-700-normal */
 @font-face {
   font-family: Roboto;
   font-style: normal;
-  font-weight: 300;
-  src: local("Roboto Light"), local("Roboto-Light"), url("node_modules/roboto-fontface/fonts/roboto/Roboto-Light.woff2") format("woff2"), url("node_modules/roboto-fontface/fonts/roboto/Roboto-Light.woff") format("woff");
+  font-display: var(--fontsource-display, swap);
+  font-weight: 700;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-cyrillic-700-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-cyrillic-700-normal.woff") format("woff");
+  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+
+/* roboto-greek-ext-700-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 700;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-greek-ext-700-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-greek-ext-700-normal.woff") format("woff");
+  unicode-range: U+1F00-1FFF;
+}
+
+/* roboto-greek-700-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 700;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-greek-700-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-greek-700-normal.woff") format("woff");
+  unicode-range: U+0370-03FF;
+}
+
+/* roboto-vietnamese-700-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 700;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-vietnamese-700-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-vietnamese-700-normal.woff") format("woff");
+  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+/* roboto-latin-ext-700-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 700;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-latin-ext-700-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-latin-ext-700-normal.woff") format("woff");
+  unicode-range: U+0100-02AF, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+
+/* roboto-latin-700-normal */
+@font-face {
+  font-family: Roboto;
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 700;
+  src:
+    url("node_modules/@fontsource/roboto/files/roboto-latin-700-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto/files/roboto-latin-700-normal.woff") format("woff");
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+/* roboto-condensed-cyrillic-ext-300-normal */
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 300;
+  src:
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-cyrillic-ext-300-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-cyrillic-ext-300-normal.woff") format("woff");
+  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+
+/* roboto-condensed-cyrillic-300-normal */
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 300;
+  src:
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-cyrillic-300-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-cyrillic-300-normal.woff") format("woff");
+  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+
+/* roboto-condensed-greek-ext-300-normal */
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 300;
+  src:
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-greek-ext-300-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-greek-ext-300-normal.woff") format("woff");
+  unicode-range: U+1F00-1FFF;
+}
+
+/* roboto-condensed-greek-300-normal */
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 300;
+  src:
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-greek-300-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-greek-300-normal.woff") format("woff");
+  unicode-range: U+0370-03FF;
+}
+
+/* roboto-condensed-vietnamese-300-normal */
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 300;
+  src:
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-vietnamese-300-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-vietnamese-300-normal.woff") format("woff");
+  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+/* roboto-condensed-latin-ext-300-normal */
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 300;
+  src:
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-latin-ext-300-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-latin-ext-300-normal.woff") format("woff");
+  unicode-range: U+0100-02AF, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+
+/* roboto-condensed-latin-300-normal */
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 300;
+  src:
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-latin-300-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-latin-300-normal.woff") format("woff");
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+/* roboto-condensed-cyrillic-ext-400-normal */
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 400;
+  src:
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-cyrillic-ext-400-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-cyrillic-ext-400-normal.woff") format("woff");
+  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+
+/* roboto-condensed-cyrillic-400-normal */
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 400;
+  src:
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-cyrillic-400-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-cyrillic-400-normal.woff") format("woff");
+  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+
+/* roboto-condensed-greek-ext-400-normal */
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 400;
+  src:
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-greek-ext-400-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-greek-ext-400-normal.woff") format("woff");
+  unicode-range: U+1F00-1FFF;
+}
+
+/* roboto-condensed-greek-400-normal */
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 400;
+  src:
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-greek-400-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-greek-400-normal.woff") format("woff");
+  unicode-range: U+0370-03FF;
+}
+
+/* roboto-condensed-vietnamese-400-normal */
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 400;
+  src:
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-vietnamese-400-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-vietnamese-400-normal.woff") format("woff");
+  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+/* roboto-condensed-latin-ext-400-normal */
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 400;
+  src:
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-latin-ext-400-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-latin-ext-400-normal.woff") format("woff");
+  unicode-range: U+0100-02AF, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+
+/* roboto-condensed-latin-400-normal */
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 400;
+  src:
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-latin-400-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-latin-400-normal.woff") format("woff");
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+/* roboto-condensed-cyrillic-ext-700-normal */
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 700;
+  src:
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-cyrillic-ext-700-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-cyrillic-ext-700-normal.woff") format("woff");
+  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+
+/* roboto-condensed-cyrillic-700-normal */
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 700;
+  src:
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-cyrillic-700-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-cyrillic-700-normal.woff") format("woff");
+  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+
+/* roboto-condensed-greek-ext-700-normal */
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 700;
+  src:
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-greek-ext-700-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-greek-ext-700-normal.woff") format("woff");
+  unicode-range: U+1F00-1FFF;
+}
+
+/* roboto-condensed-greek-700-normal */
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 700;
+  src:
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-greek-700-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-greek-700-normal.woff") format("woff");
+  unicode-range: U+0370-03FF;
+}
+
+/* roboto-condensed-vietnamese-700-normal */
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 700;
+  src:
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-vietnamese-700-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-vietnamese-700-normal.woff") format("woff");
+  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+/* roboto-condensed-latin-ext-700-normal */
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 700;
+  src:
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-latin-ext-700-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-latin-ext-700-normal.woff") format("woff");
+  unicode-range: U+0100-02AF, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+
+/* roboto-condensed-latin-700-normal */
+@font-face {
+  font-family: "Roboto Condensed";
+  font-style: normal;
+  font-display: var(--fontsource-display, swap);
+  font-weight: 700;
+  src:
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-latin-700-normal.woff2") format("woff2"),
+    url("node_modules/@fontsource/roboto-condensed/files/roboto-condensed-latin-700-normal.woff") format("woff");
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 }

index.html

@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html>
   <head>
     <title>MagicMirror²</title>
@@ -13,6 +13,7 @@
     <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" />
+    <link rel="stylesheet" type="text/css" href="vendor/node_modules/animate.css/animate.min.css" />
     <!-- custom.css is loaded by the loader.js to make sure it's loaded after the module css files. -->
 
     <script type="text/javascript">
@@ -45,6 +46,7 @@
     <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="modules/default/utils.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>
@@ -52,6 +54,7 @@
     <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/animateCSS.js"></script>
     <script type="text/javascript" src="js/main.js"></script>
   </body>
 </html>

installers/mm.sh

@@ -1,3 +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/animateCSS.js

@@ -0,0 +1,157 @@
+/* enumeration of animations in Array **/
+const AnimateCSSIn = [
+	// Attention seekers
+	"bounce",
+	"flash",
+	"pulse",
+	"rubberBand",
+	"shakeX",
+	"shakeY",
+	"headShake",
+	"swing",
+	"tada",
+	"wobble",
+	"jello",
+	"heartBeat",
+	// Back entrances
+	"backInDown",
+	"backInLeft",
+	"backInRight",
+	"backInUp",
+	// Bouncing entrances
+	"bounceIn",
+	"bounceInDown",
+	"bounceInLeft",
+	"bounceInRight",
+	"bounceInUp",
+	// Fading entrances
+	"fadeIn",
+	"fadeInDown",
+	"fadeInDownBig",
+	"fadeInLeft",
+	"fadeInLeftBig",
+	"fadeInRight",
+	"fadeInRightBig",
+	"fadeInUp",
+	"fadeInUpBig",
+	"fadeInTopLeft",
+	"fadeInTopRight",
+	"fadeInBottomLeft",
+	"fadeInBottomRight",
+	// Flippers
+	"flip",
+	"flipInX",
+	"flipInY",
+	// Lightspeed
+	"lightSpeedInRight",
+	"lightSpeedInLeft",
+	// Rotating entrances
+	"rotateIn",
+	"rotateInDownLeft",
+	"rotateInDownRight",
+	"rotateInUpLeft",
+	"rotateInUpRight",
+	// Specials
+	"jackInTheBox",
+	"rollIn",
+	// Zooming entrances
+	"zoomIn",
+	"zoomInDown",
+	"zoomInLeft",
+	"zoomInRight",
+	"zoomInUp",
+	// Sliding entrances
+	"slideInDown",
+	"slideInLeft",
+	"slideInRight",
+	"slideInUp"
+];
+
+const AnimateCSSOut = [
+	// Back exits
+	"backOutDown",
+	"backOutLeft",
+	"backOutRight",
+	"backOutUp",
+	// Bouncing exits
+	"bounceOut",
+	"bounceOutDown",
+	"bounceOutLeft",
+	"bounceOutRight",
+	"bounceOutUp",
+	// Fading exits
+	"fadeOut",
+	"fadeOutDown",
+	"fadeOutDownBig",
+	"fadeOutLeft",
+	"fadeOutLeftBig",
+	"fadeOutRight",
+	"fadeOutRightBig",
+	"fadeOutUp",
+	"fadeOutUpBig",
+	"fadeOutTopLeft",
+	"fadeOutTopRight",
+	"fadeOutBottomRight",
+	"fadeOutBottomLeft",
+	// Flippers
+	"flipOutX",
+	"flipOutY",
+	// Lightspeed
+	"lightSpeedOutRight",
+	"lightSpeedOutLeft",
+	// Rotating exits
+	"rotateOut",
+	"rotateOutDownLeft",
+	"rotateOutDownRight",
+	"rotateOutUpLeft",
+	"rotateOutUpRight",
+	// Specials
+	"hinge",
+	"rollOut",
+	// Zooming exits
+	"zoomOut",
+	"zoomOutDown",
+	"zoomOutLeft",
+	"zoomOutRight",
+	"zoomOutUp",
+	// Sliding exits
+	"slideOutDown",
+	"slideOutLeft",
+	"slideOutRight",
+	"slideOutUp"
+];
+
+/**
+ * Create an animation with Animate CSS
+ * @param {string} [element] div element to animate.
+ * @param {string} [animation] animation name.
+ * @param {number} [animationTime] animation duration.
+ */
+function addAnimateCSS (element, animation, animationTime) {
+	const animationName = `animate__${animation}`;
+	const node = document.getElementById(element);
+	if (!node) {
+		// don't execute animate: we don't find div
+		Log.warn("addAnimateCSS: node not found for", element);
+		return;
+	}
+	node.style.setProperty("--animate-duration", `${animationTime}s`);
+	node.classList.add("animate__animated", animationName);
+}
+
+/**
+ * Remove an animation with Animate CSS
+ * @param {string} [element] div element to animate.
+ * @param {string} [animation] animation name.
+ */
+function removeAnimateCSS (element, animation) {
+	const animationName = `animate__${animation}`;
+	const node = document.getElementById(element);
+	if (!node) {
+		// don't execute animate: we don't find div
+		Log.warn("removeAnimateCSS: node not found for", element);
+		return;
+	}
+	node.classList.remove("animate__animated", animationName);
+	node.style.removeProperty("--animate-duration");
+}

js/app.js

@@ -1,33 +1,31 @@
-/* Magic Mirror
- * 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 fs = require("node:fs");
+const path = require("node: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);
+Log.log(`Starting MagicMirror: v${global.version}`);
+
+// Log system information.
+Utils.logSystemInformation();
 
 // global absolute root path
 global.root_path = path.resolve(`${__dirname}/../`);
 
 if (process.env.MM_CONFIG_FILE) {
-	global.configuration_file = process.env.MM_CONFIG_FILE;
+	global.configuration_file = process.env.MM_CONFIG_FILE.replace(`${global.root_path}/`, "");
 }
 
 // FIXME: Hotfix Pull Request
-// https://github.com/MichMich/MagicMirror/pull/673
+// https://github.com/MagicMirrorOrg/MagicMirror/pull/673
 if (process.env.MM_PORT) {
 	global.mmPort = process.env.MM_PORT;
 }
@@ -35,76 +33,130 @@ if (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");
+	// ignore strange exceptions under aarch64 coming from systeminformation:
+	if (!err.stack.includes("node_modules/systeminformation")) {
+		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/MagicMirrorOrg/MagicMirror/issues");
+	}
 });
 
 /**
  * The core app.
- *
  * @class
  */
-function App() {
+function App () {
 	let nodeHelpers = [];
 	let httpServer;
 
 	/**
-	 * Loads the config file. Combines it with the defaults, and runs the
-	 * callback with the found config as argument.
-	 *
-	 * @param {Function} callback Function to be called after loading the config
+	 * 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
 	 */
-	function loadConfig(callback) {
+	async function loadConfig () {
 		Log.log("Loading config ...");
 		const defaults = require(`${__dirname}/defaults`);
+		if (process.env.JEST_WORKER_ID !== undefined) {
+			// if we are running with jest
+			defaults.address = "0.0.0.0";
+		}
 
 		// 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.log("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.log(`${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);
+			if (Object.keys(c).length === 0) {
+				Log.error("WARNING! Config file appears empty, maybe missing module.exports last line?");
+			}
 			checkDeprecatedOptions(c);
-			const config = Object.assign(defaults, c);
-			callback(config);
+			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."));
+				Log.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}`));
+				Log.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}`));
+				Log.error(`WARNING! Could not load config file. Starting with default configuration. Error found: ${e}`);
 			}
-			callback(defaults);
 		}
+
+		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) {
+	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.`));
+			Log.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).
-	 * @param {Function} callback Function to be called after loading
 	 */
-	function loadModule(module, callback) {
+	function loadModule (module) {
 		const elements = module.split("/");
 		const moduleName = elements[elements.length - 1];
 		let moduleFolder = `${__dirname}/../modules/${module}`;
@@ -113,6 +165,14 @@ function App() {
 			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;
@@ -128,7 +188,7 @@ function App() {
 			let m = new Module();
 
 			if (m.requiresVersion) {
-				Log.log(`Check MagicMirror version for node helper '${moduleName}' - Minimum version: ${m.requiresVersion} - Current version: ${global.version}`);
+				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 {
@@ -141,50 +201,33 @@ function App() {
 			m.setPath(path.resolve(moduleFolder));
 			nodeHelpers.push(m);
 
-			m.loaded(callback);
-		} else {
-			callback();
+			m.loaded();
 		}
 	}
 
 	/**
 	 * Loads all modules.
-	 *
 	 * @param {Module[]} modules All modules to be loaded
-	 * @param {Function} callback Function to be called after loading
+	 * @returns {Promise} A promise that is resolved when all modules been loaded
 	 */
-	function loadModules(modules, callback) {
+	async function loadModules (modules) {
 		Log.log("Loading module helpers ...");
 
-		/**
-		 *
-		 */
-		function loadNextModule() {
-			if (modules.length > 0) {
-				const nextModule = modules[0];
-				loadModule(nextModule, function () {
-					modules = modules.slice(1);
-					loadNextModule();
-				});
-			} else {
-				// All modules are loaded
-				Log.log("All module helpers loaded.");
-				callback();
-			}
+		for (let module of modules) {
+			await loadModule(module);
 		}
 
-		loadNextModule();
+		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) {
+	function cmpVersions (a, b) {
 		let i, diff;
 		const regExStrip0 = /(\.0+)+$/;
 		const segmentsA = a.replace(regExStrip0, "").split(".");
@@ -203,43 +246,60 @@ function App() {
 	/**
 	 * Start the core app.
 	 *
-	 * It loads the config, then it loads all modules. When it's done it
-	 * executes the callback with the config as argument.
-	 *
-	 * @param {Function} callback Function to be called after start
+	 * It loads the config, then it loads all modules.
+	 * @async
+	 * @returns {Promise<object>} the config used
 	 */
-	this.start = function (callback) {
-		loadConfig(function (c) {
-			config = c;
+	this.start = async function () {
+		config = await loadConfig();
 
-			Log.setLogLevel(config.logLevel);
+		Log.setLogLevel(config.logLevel);
 
-			let modules = [];
-
-			for (const module of config.modules) {
-				if (!modules.includes(module.module) && !module.disabled) {
+		let modules = [];
+		for (const module of config.modules) {
+			if (module.disabled) continue;
+			if (module.module) {
+				if (Utils.moduleHasValidPosition(module.position) || typeof (module.position) === "undefined") {
 					modules.push(module.module);
+				} else {
+					Log.warn("Invalid module position found for this configuration:", module);
 				}
+			} else {
+				Log.warn("No module name found for this configuration:", module);
 			}
+		}
 
-			loadModules(modules, function () {
-				httpServer = new Server(config, function (app, io) {
-					Log.log("Server started ...");
+		await loadModules(modules);
 
-					for (let nodeHelper of nodeHelpers) {
-						nodeHelper.setExpressApp(app);
-						nodeHelper.setSocketIO(io);
-						nodeHelper.start();
-					}
+		httpServer = new Server(config);
+		const { app, io } = await httpServer.open();
+		Log.log("Server started ...");
 
-					Log.log("Sockets connected & modules started ...");
+		const nodePromises = [];
+		for (let nodeHelper of nodeHelpers) {
+			nodeHelper.setExpressApp(app);
+			nodeHelper.setSocketIO(io);
 
-					if (typeof callback === "function") {
-						callback(config);
-					}
-				});
-			});
+			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;
 	};
 
 	/**
@@ -247,14 +307,40 @@ function App() {
 	 * 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 = function () {
-		for (const nodeHelper of nodeHelpers) {
-			if (typeof nodeHelper.stop === "function") {
-				nodeHelper.stop();
+	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);
 			}
 		}
-		httpServer.close();
+
+		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();
 	};
 
 	/**
@@ -264,12 +350,12 @@ function App() {
 	 * 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", () => {
+	process.on("SIGINT", async () => {
 		Log.log("[SIGINT] Received. Shutting down server...");
 		setTimeout(() => {
 			process.exit(0);
 		}, 3000); // Force quit after 3 seconds
-		this.stop();
+		await this.stop();
 		process.exit(0);
 	});
 
@@ -277,12 +363,12 @@ function App() {
 	 * Listen to SIGTERM signals so we can stop everything when we
 	 * are asked to stop by the OS.
 	 */
-	process.on("SIGTERM", () => {
+	process.on("SIGTERM", async () => {
 		Log.log("[SIGTERM] Received. Shutting down server...");
 		setTimeout(() => {
 			process.exit(0);
 		}, 3000); // Force quit after 3 seconds
-		this.stop();
+		await this.stop();
 		process.exit(0);
 	});
 }

js/check_config.js

@@ -1,27 +1,23 @@
-/* Magic Mirror
- *
- * Check the configuration file for errors
- *
- * By Rodrigo Ramírez Norambuena https://rodrigoramirez.com
- * MIT Licensed.
- */
-const Linter = require("eslint").Linter;
+const path = require("node:path");
+const fs = require("node:fs");
+const colors = require("ansis");
+const { Linter } = require("eslint");
+
 const linter = new Linter();
 
-const path = require("path");
-const fs = require("fs");
+const Ajv = require("ajv");
+
+const ajv = new Ajv();
 
 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() {
+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`);
 }
@@ -29,12 +25,12 @@ function getConfigFile() {
 /**
  * Checks the config file using eslint.
  */
-function checkConfigFile() {
+function checkConfigFile () {
 	const configFileName = getConfigFile();
 
 	// Check if file is present
 	if (fs.existsSync(configFileName) === false) {
-		Log.error(Utils.colors.error("File not found: "), configFileName);
+		Log.error(`File not found: ${configFileName}`);
 		throw new Error("No config file present!");
 	}
 
@@ -42,12 +38,12 @@ function checkConfigFile() {
 	try {
 		fs.accessSync(configFileName, fs.F_OK);
 	} catch (e) {
-		Log.error(Utils.colors.error(e));
+		Log.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);
+	Log.info("Checking file... ", configFileName);
 
 	// I'm not sure if all ever is utf-8
 	const configFile = fs.readFileSync(configFileName, "utf-8");
@@ -60,13 +56,75 @@ function checkConfigFile() {
 	});
 
 	if (errors.length === 0) {
-		Log.info(Utils.colors.pass("Your configuration file doesn't contain syntax errors :)"));
+		Log.info(colors.green("Your configuration file doesn't contain syntax errors :)"));
 	} else {
-		Log.error(Utils.colors.error("Your configuration file contains syntax errors :("));
+		Log.error(colors.red("Your configuration file contains syntax errors :("));
 
 		for (const error of errors) {
 			Log.error(`Line ${error.line} column ${error.column}: ${error.message}`);
 		}
+		return;
+	}
+
+	Log.info("Checking modules structure configuration... ");
+
+	// Make Ajv schema confguration of modules config
+	// only scan "module" and "position"
+	const schema = {
+		type: "object",
+		properties: {
+			modules: {
+				type: "array",
+				items: {
+					type: "object",
+					properties: {
+						module: {
+							type: "string"
+						},
+						position: {
+							type: "string",
+							enum: [
+								"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"
+							]
+						}
+					},
+					required: ["module"]
+				}
+			}
+		}
+	};
+
+	// scan all modules
+	const validate = ajv.compile(schema);
+	const data = require(configFileName);
+
+	const valid = validate(data);
+	if (!valid) {
+		let module = validate.errors[0].instancePath.split("/")[2];
+		let position = validate.errors[0].instancePath.split("/")[3];
+
+		Log.error(colors.red("This module configuration contains errors:"));
+		Log.error(data.modules[module]);
+		if (position) {
+			Log.error(colors.red(`${position}: ${validate.errors[0].message}`));
+			Log.error(validate.errors[0].params.allowedValues);
+		} else {
+			Log.error(colors.red(validate.errors[0].message));
+		}
+	} else {
+		Log.info(colors.green("Your modules structure configuration doesn't contain errors :)"));
 	}
 }
 

js/class.js

@@ -9,7 +9,7 @@
  */
 (function () {
 	let initializing = false;
-	const fnTest = /xyz/.test(function () {
+	const fnTest = (/xyz/).test(function () {
 		xyz;
 	})
 		? /\b_super\b/
@@ -36,31 +36,31 @@
 		// 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])
+			prototype[name]
+				= typeof prop[name] === "function" && typeof _super[name] === "function" && fnTest.test(prop[name])
 					? (function (name, fn) {
-							return function () {
-								const tmp = this._super;
+						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];
+							// 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;
+							// 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])
+							return ret;
+						};
+					}(name, prop[name]))
 					: prop[name];
 		}
 
 		/**
 		 * The dummy class constructor
 		 */
-		function Class() {
+		function Class () {
 			// All construction is actually done in the init method
 			if (!initializing && this.init) {
 				this.init.apply(this, arguments);
@@ -78,19 +78,22 @@
 
 		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) {
+function cloneObject (obj) {
 	if (obj === null || typeof obj !== "object") {
 		return obj;
 	}
 
+	if (obj.constructor.name === "RegExp") {
+		return new RegExp(obj);
+	}
+
 	const temp = obj.constructor(); // give temp the original obj's constructor
 	for (const key in obj) {
 		temp[key] = cloneObject(obj[key]);

js/defaults.js

@@ -1,11 +1,5 @@
 /* global mmPort */
 
-/* Magic Mirror
- * Config Defaults
- *
- * By Michael Teeuw https://michaelteeuw.nl
- * MIT Licensed.
- */
 const address = "localhost";
 let port = 8080;
 if (typeof mmPort !== "undefined") {
@@ -25,6 +19,14 @@ const defaults = {
 	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/MagicMirrorOrg/MagicMirror/issues/2847
+	httpHeaders: { contentSecurityPolicy: false, crossOriginOpenerPolicy: false, crossOriginEmbedderPolicy: false, crossOriginResourcePolicy: false, originAgentCluster: false },
+
+	// properties for checking if server is alive and has same startup-timestamp, the check is per default enabled
+	// (interval 30 seconds). If startup-timestamp has changed the client reloads the magicmirror webpage.
+	checkServerInterval: 30 * 1000,
+	reloadAfterServerRestart: false,
 
 	modules: [
 		{
@@ -36,7 +38,7 @@ const defaults = {
 			position: "upper_third",
 			classes: "large thin",
 			config: {
-				text: "Magic Mirror<sup>2</sup>"
+				text: "MagicMirror²"
 			}
 		},
 		{
@@ -59,7 +61,7 @@ const defaults = {
 			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>"
+				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>"
 			}
 		},
 		{

js/deprecated.js

@@ -1,11 +1,3 @@
-/* Magic Mirror 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

@@ -1,13 +1,20 @@
 "use strict";
 
 const electron = require("electron");
-const core = require("./app.js");
-const Log = require("logger");
+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;
+// Per default electron is started with --disable-gpu flag, if you want the gpu enabled,
+// you must set the env var ELECTRON_ENABLE_GPU=1 on startup.
+// See https://www.electronjs.org/docs/latest/tutorial/offscreen-rendering for more info.
+if (process.env.ELECTRON_ENABLE_GPU !== "1") {
+	app.disableHardwareAcceleration();
+}
+
 // Module to create native browser window.
 const BrowserWindow = electron.BrowserWindow;
 
@@ -18,12 +25,22 @@ let mainWindow;
 /**
  *
  */
-function createWindow() {
+function createWindow () {
+	// see https://www.electronjs.org/docs/latest/api/screen
+	// Create a window that fills the screen's available work area.
+	let electronSize = (800, 600);
+	try {
+		electronSize = electron.screen.getPrimaryDisplay().workAreaSize;
+	} catch {
+		Log.warn("Could not get display size, using defaults ...");
+	}
+
 	let electronSwitchesDefaults = ["autoplay-policy", "no-user-gesture-required"];
 	app.commandLine.appendSwitch(...new Set(electronSwitchesDefaults, config.electronSwitches));
 	let electronOptionsDefaults = {
-		width: 800,
-		height: 600,
+		width: electronSize.width,
+		height: electronSize.height,
+		icon: "mm2.png",
 		x: 0,
 		y: 0,
 		darkTheme: true,
@@ -40,8 +57,11 @@ function createWindow() {
 	if (config.kioskmode) {
 		electronOptionsDefaults.kiosk = true;
 	} else {
+		electronOptionsDefaults.show = false;
+		electronOptionsDefaults.frame = false;
+		electronOptionsDefaults.transparent = true;
+		electronOptionsDefaults.hasShadow = false;
 		electronOptionsDefaults.fullscreen = true;
-		electronOptionsDefaults.autoHideMenuBar = true;
 	}
 
 	const electronOptions = Object.assign({}, electronOptionsDefaults, config.electronOptions);
@@ -53,14 +73,15 @@ function createWindow() {
 	// 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"]) {
+	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}`);
+	let address = (config.address === void 0) | (config.address === "") | (config.address === "0.0.0.0") ? (config.address = "localhost") : config.address;
+	const port = process.env.MM_PORT || config.port;
+	mainWindow.loadURL(`${prefix}${address}:${port}`);
 
 	// Open the DevTools if run with "npm start dev"
 	if (process.argv.includes("dev")) {
@@ -97,14 +118,25 @@ function createWindow() {
 			}, 1000);
 		});
 	}
-}
 
-// This method will be called when Electron has finished
-// initialization and is ready to create browser windows.
-app.on("ready", function () {
-	Log.log("Launching application.");
-	createWindow();
-});
+	//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.show();
+	});
+}
 
 // Quit when all windows are closed.
 app.on("window-all-closed", function () {
@@ -130,20 +162,39 @@ app.on("activate", function () {
  * Note: this is only used if running Electron. Otherwise
  * core.stop() is called by process.on("SIGINT"... in `app.js`
  */
-app.on("before-quit", (event) => {
+app.on("before-quit", async (event) => {
 	Log.log("Shutting down server...");
 	event.preventDefault();
 	setTimeout(() => {
 		process.exit(0);
 	}, 3000); // Force-quit after 3 seconds.
-	core.stop();
+	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);
+});
+
+if (process.env.clientonly) {
+	app.whenReady().then(() => {
+		Log.log("Launching client viewer application.");
+		createWindow();
+	});
+}
+
 // 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(function (c) {
+	core.start().then((c) => {
 		config = c;
+		app.whenReady().then(() => {
+			Log.log("Launching application.");
+			createWindow();
+		});
 	});
 }

js/loader.js

@@ -1,12 +1,7 @@
 /* global defaultModules, vendor */
 
-/* Magic Mirror
- * Module and File loaders.
- *
- * By Michael Teeuw https://michaelteeuw.nl
- * MIT Licensed.
- */
 const Loader = (function () {
+
 	/* Create helper variables */
 
 	const loadedModuleFiles = [];
@@ -16,48 +11,35 @@ const Loader = (function () {
 	/* Private Methods */
 
 	/**
-	 * Loops thru all modules and requests load for every module.
+	 * Loops through all modules and requests start for every module.
 	 */
-	const loadModules = function () {
-		let moduleData = getModuleData();
-
-		const loadNextModule = function () {
-			if (moduleData.length > 0) {
-				const nextModule = moduleData[0];
-				loadModule(nextModule, function () {
-					moduleData = moduleData.slice(1);
-					loadNextModule();
-				});
-			} else {
-				// All modules loaded. Load custom.css
-				// This is done after all the modules so we can
-				// overwrite all the defined styles.
-
-				loadFile(config.customCss, function () {
-					// custom.css loaded. Start all modules.
-					startModules();
-				});
-			}
-		};
-
-		loadNextModule();
-	};
-
-	/**
-	 * Loops thru all modules and requests start for every module.
-	 */
-	const startModules = function () {
+	const startModules = async function () {
+		const modulePromises = [];
 		for (const module of moduleObjects) {
-			module.start();
+			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);
+				Log.info(`Initially hiding ${thisModule.name}`);
 				thisModule.hide();
 			}
 		}
@@ -65,16 +47,15 @@ const Loader = (function () {
 
 	/**
 	 * Retrieve list of all modules.
-	 *
 	 * @returns {object[]} module data as configured in config
 	 */
 	const getAllModules = function () {
-		return config.modules;
+		const AllModules = config.modules.filter((module) => (module.module !== undefined) && (MM.getAvailableModulePositions.indexOf(module.position) > -1 || typeof (module.position) === "undefined"));
+		return AllModules;
 	};
 
 	/**
 	 * Generate array with module information including module paths.
-	 *
 	 * @returns {object[]} Module information.
 	 */
 	const getModuleData = function () {
@@ -86,10 +67,10 @@ const Loader = (function () {
 
 			const elements = module.split("/");
 			const moduleName = elements[elements.length - 1];
-			let moduleFolder = config.paths.modules + "/" + module;
+			let moduleFolder = `${config.paths.modules}/${module}`;
 
 			if (defaultModules.indexOf(moduleName) !== -1) {
-				moduleFolder = config.paths.modules + "/default/" + module;
+				moduleFolder = `${config.paths.modules}/default/${module}`;
 			}
 
 			if (moduleData.disabled === true) {
@@ -98,16 +79,18 @@ const Loader = (function () {
 
 			moduleFiles.push({
 				index: index,
-				identifier: "module_" + index + "_" + module,
+				identifier: `module_${index}_${module}`,
 				name: moduleName,
-				path: moduleFolder + "/",
-				file: moduleName + ".js",
+				path: `${moduleFolder}/`,
+				file: `${moduleName}.js`,
 				position: moduleData.position,
+				animateIn: moduleData.animateIn,
+				animateOut: moduleData.animateOut,
 				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
+				classes: typeof moduleData.classes !== "undefined" ? `${moduleData.classes} ${module}` : module
 			});
 		});
 
@@ -115,134 +98,138 @@ const Loader = (function () {
 	};
 
 	/**
-	 * Load modules via ajax request and create module objects.s
-	 *
+	 * Load modules via ajax request and create module objects.
 	 * @param {object} module Information about the module we want to load.
-	 * @param {Function} callback Function called when done.
+	 * @returns {Promise<void>} resolved when module is loaded
 	 */
-	const loadModule = function (module, callback) {
+	const loadModule = async function (module) {
 		const url = module.path + module.file;
 
-		const afterLoad = function () {
+		/**
+		 * @returns {Promise<void>}
+		 */
+		const afterLoad = async function () {
 			const moduleObject = Module.create(module.name);
 			if (moduleObject) {
-				bootstrapModule(module, moduleObject, function () {
-					callback();
-				});
-			} else {
-				callback();
+				await bootstrapModule(module, moduleObject);
 			}
 		};
 
 		if (loadedModuleFiles.indexOf(url) !== -1) {
-			afterLoad();
+			await afterLoad();
 		} else {
-			loadFile(url, function () {
-				loadedModuleFiles.push(url);
-				afterLoad();
-			});
+			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.
-	 * @param {Function} callback Function called when done.
 	 */
-	const bootstrapModule = function (module, mObj, callback) {
-		Log.info("Bootstrapping module: " + module.name);
-
+	const bootstrapModule = async function (module, mObj) {
+		Log.info(`Bootstrapping module: ${module.name}`);
 		mObj.setData(module);
 
-		mObj.loadScripts(function () {
-			Log.log("Scripts loaded for: " + module.name);
-			mObj.loadStyles(function () {
-				Log.log("Styles loaded for: " + module.name);
-				mObj.loadTranslations(function () {
-					Log.log("Translations loaded for: " + module.name);
-					moduleObjects.push(mObj);
-					callback();
-				});
-			});
-		});
+		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.
-	 * @param {Function} callback Function called when done.
+	 * @returns {Promise} resolved when the file is loaded
 	 */
-	const loadFile = function (fileName, callback) {
+	const loadFile = async function (fileName) {
 		const extension = fileName.slice((Math.max(0, fileName.lastIndexOf(".")) || Infinity) + 1);
 		let script, stylesheet;
 
 		switch (extension.toLowerCase()) {
 			case "js":
-				Log.log("Load script: " + fileName);
-				script = document.createElement("script");
-				script.type = "text/javascript";
-				script.src = fileName;
-				script.onload = function () {
-					if (typeof callback === "function") {
-						callback();
-					}
-				};
-				script.onerror = function () {
-					Log.error("Error on loading script:", fileName);
-					if (typeof callback === "function") {
-						callback();
-					}
-				};
-
-				document.getElementsByTagName("body")[0].appendChild(script);
-				break;
+				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":
-				Log.log("Load stylesheet: " + fileName);
-				stylesheet = document.createElement("link");
-				stylesheet.rel = "stylesheet";
-				stylesheet.type = "text/css";
-				stylesheet.href = fileName;
-				stylesheet.onload = function () {
-					if (typeof callback === "function") {
-						callback();
-					}
-				};
-				stylesheet.onerror = function () {
-					Log.error("Error on loading stylesheet:", fileName);
-					if (typeof callback === "function") {
-						callback();
-					}
-				};
+				return new Promise((resolve) => {
+					Log.log(`Load stylesheet: ${fileName}`);
 
-				document.getElementsByTagName("head")[0].appendChild(stylesheet);
-				break;
+					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: function () {
-			loadModules();
+		async loadModules () {
+			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.
-		 * @param {Function} callback Function called when done.
+		 * @returns {Promise} resolved when the file is loaded
 		 */
-		loadFile: function (fileName, module, callback) {
+		async loadFileForModule (fileName, module) {
 			if (loadedFiles.indexOf(fileName.toLowerCase()) !== -1) {
-				Log.log("File already loaded: " + fileName);
-				callback();
+				Log.log(`File already loaded: ${fileName}`);
 				return;
 			}
 
@@ -250,22 +237,20 @@ const Loader = (function () {
 				// This is an absolute or relative path.
 				// Load it and then return.
 				loadedFiles.push(fileName.toLowerCase());
-				loadFile(fileName, callback);
-				return;
+				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());
-				loadFile(config.paths.vendor + "/" + vendor[fileName], callback);
-				return;
+				return loadFile(`${config.paths.vendor}/${vendor[fileName]}`);
 			}
 
 			// File not loaded yet.
 			// Load it based on the module path.
 			loadedFiles.push(fileName.toLowerCase());
-			loadFile(module.file(fileName), callback);
+			return loadFile(module.file(fileName));
 		}
 	};
-})();
+}());

js/logger.js

@@ -1,19 +1,40 @@
-/* Magic Mirror
- * 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.
- */
+// This logger is very simple, but needs to be extended.
 (function (root, factory) {
 	if (typeof exports === "object") {
 		if (process.env.JEST_WORKER_ID === undefined) {
+			const colors = require("ansis");
+
 			// 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"]
+				format: ":date(yyyy-mm-dd HH:MM:ss.l) :label(7) :msg",
+				tokens: {
+					label: (arg) => {
+						const { method, defaultTokens } = arg;
+						let label = defaultTokens.label(arg);
+						if (method === "error") {
+							label = colors.red(label);
+						} else if (method === "warn") {
+							label = colors.yellow(label);
+						} else if (method === "debug") {
+							label = colors.bgBlue(label);
+						} else if (method === "info") {
+							label = colors.blue(label);
+						}
+						return label;
+					},
+					msg: (arg) => {
+						const { method, defaultTokens } = arg;
+						let msg = defaultTokens.msg(arg);
+						if (method === "error") {
+							msg = colors.red(msg);
+						} else if (method === "warn") {
+							msg = colors.yellow(msg);
+						} else if (method === "info") {
+							msg = colors.blue(msg);
+						}
+						return msg;
+					}
+				}
 			});
 		}
 		// Node, CommonJS-like
@@ -22,7 +43,7 @@
 		// Browser globals (root is window)
 		root.Log = factory(root.config);
 	}
-})(this, function (config) {
+}(this, function (config) {
 	let logLevel;
 	let enableLog;
 	if (typeof exports === "object") {
@@ -50,7 +71,7 @@
 
 		logLevel.setLogLevel = function (newLevel) {
 			if (newLevel) {
-				Object.keys(logLevel).forEach(function (key, index) {
+				Object.keys(logLevel).forEach(function (key) {
 					if (!newLevel.includes(key.toLocaleUpperCase())) {
 						logLevel[key] = function () {};
 					}
@@ -59,21 +80,21 @@
 		};
 	} else {
 		logLevel = {
-			debug: function () {},
-			log: function () {},
-			info: function () {},
-			warn: function () {},
-			error: function () {},
-			group: function () {},
-			groupCollapsed: function () {},
-			groupEnd: function () {},
-			time: function () {},
-			timeEnd: function () {},
-			timeStamp: function () {}
+			debug () {},
+			log () {},
+			info () {},
+			warn () {},
+			error () {},
+			group () {},
+			groupCollapsed () {},
+			groupEnd () {},
+			time () {},
+			timeEnd () {},
+			timeStamp () {}
 		};
 
 		logLevel.setLogLevel = function () {};
 	}
 
 	return logLevel;
-});
+}));

js/main.js

@@ -1,11 +1,5 @@
-/* global Loader, defaults, Translator */
+/* global Loader, defaults, Translator, addAnimateCSS, removeAnimateCSS, AnimateCSSIn, AnimateCSSOut */
 
-/* Magic Mirror
- * Main System
- *
- * By Michael Teeuw https://michaelteeuw.nl
- * MIT Licensed.
- */
 const MM = (function () {
 	let modules = [];
 
@@ -22,6 +16,10 @@ const MM = (function () {
 				return;
 			}
 
+			let haveAnimateIn = null;
+			// check if have valid animateIn in module definition (module.data.animateIn)
+			if (module.data.animateIn && AnimateCSSIn.indexOf(module.data.animateIn) !== -1) haveAnimateIn = module.data.animateIn;
+
 			const wrapper = selectWrapper(module.data.position);
 
 			const dom = document.createElement("div");
@@ -29,7 +27,7 @@ const MM = (function () {
 			dom.className = module.name;
 
 			if (typeof module.data.classes === "string") {
-				dom.className = "module " + dom.className + " " + module.data.classes;
+				dom.className = `module ${dom.className} ${module.data.classes}`;
 			}
 
 			dom.opacity = 0;
@@ -50,7 +48,12 @@ const MM = (function () {
 			moduleContent.className = "module-content";
 			dom.appendChild(moduleContent);
 
-			const domCreationPromise = updateDom(module, 0);
+			// create the domCreationPromise with AnimateCSS (with animateIn of module definition)
+			// or just display it
+			var domCreationPromise;
+			if (haveAnimateIn) domCreationPromise = updateDom(module, { options: { speed: 1000, animate: { in: haveAnimateIn } } }, true);
+			else domCreationPromise = updateDom(module, 0);
+
 			domCreationPromises.push(domCreationPromise);
 			domCreationPromise
 				.then(function () {
@@ -68,9 +71,8 @@ const MM = (function () {
 
 	/**
 	 * Select the wrapper dom object for a specific position.
-	 *
 	 * @param {string} position The name of the position.
-	 * @returns {HTMLElement} the wrapper element
+	 * @returns {HTMLElement | void} the wrapper element
 	 */
 	const selectWrapper = function (position) {
 		const classes = position.replace("_", " ");
@@ -85,7 +87,6 @@ const MM = (function () {
 
 	/**
 	 * 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.
@@ -102,13 +103,31 @@ const MM = (function () {
 
 	/**
 	 * 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.
+	 * @param {object|number} [updateOptions] The (optional) number of microseconds for the animation or object with updateOptions (speed/animates)
+	 * @param {boolean} [createAnimatedDom] for displaying only animateIn (used on first start of MagicMirror)
 	 * @returns {Promise} Resolved when the dom is fully updated.
 	 */
-	const updateDom = function (module, speed) {
+	const updateDom = function (module, updateOptions, createAnimatedDom = false) {
 		return new Promise(function (resolve) {
+			let speed = updateOptions;
+			let animateOut = null;
+			let animateIn = null;
+			if (typeof updateOptions === "object") {
+				if (typeof updateOptions.options === "object" && updateOptions.options.speed !== undefined) {
+					speed = updateOptions.options.speed;
+					Log.debug(`updateDom: ${module.identifier} Has speed in object: ${speed}`);
+					if (typeof updateOptions.options.animate === "object") {
+						animateOut = updateOptions.options.animate.out;
+						animateIn = updateOptions.options.animate.in;
+						Log.debug(`updateDom: ${module.identifier} Has animate in object: out->${animateOut}, in->${animateIn}`);
+					}
+				} else {
+					Log.debug(`updateDom: ${module.identifier} Has no speed in object`);
+					speed = 0;
+				}
+			}
+
 			const newHeader = module.getHeader();
 			let newContentPromise = module.getDom();
 
@@ -119,7 +138,7 @@ const MM = (function () {
 
 			newContentPromise
 				.then(function (newContent) {
-					const updatePromise = updateDomWithContent(module, speed, newHeader, newContent);
+					const updatePromise = updateDomWithContent(module, speed, newHeader, newContent, animateOut, animateIn, createAnimatedDom);
 
 					updatePromise.then(resolve).catch(Log.error);
 				})
@@ -129,14 +148,16 @@ const MM = (function () {
 
 	/**
 	 * 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.
+	 * @param {string} [animateOut] AnimateCss animation name before hidden
+	 * @param {string} [animateIn] AnimateCss animation name on show
+	 * @param {boolean} [createAnimatedDom] for displaying only animateIn (used on first start)
 	 * @returns {Promise} Resolved when the module dom has been updated.
 	 */
-	const updateDomWithContent = function (module, speed, newHeader, newContent) {
+	const updateDomWithContent = function (module, speed, newHeader, newContent, animateOut, animateIn, createAnimatedDom = false) {
 		return new Promise(function (resolve) {
 			if (module.hidden || !speed) {
 				updateModuleContent(module, newHeader, newContent);
@@ -155,19 +176,33 @@ const MM = (function () {
 				return;
 			}
 
-			hideModule(module, speed / 2, function () {
+			if (createAnimatedDom && animateIn !== null) {
+				Log.debug(`${module.identifier} createAnimatedDom (${animateIn})`);
 				updateModuleContent(module, newHeader, newContent);
 				if (!module.hidden) {
-					showModule(module, speed / 2);
+					showModule(module, speed, null, { animate: animateIn });
 				}
 				resolve();
-			});
+				return;
+			}
+
+			hideModule(
+				module,
+				speed / 2,
+				function () {
+					updateModuleContent(module, newHeader, newContent);
+					if (!module.hidden) {
+						showModule(module, speed / 2, null, { animate: animateIn });
+					}
+					resolve();
+				},
+				{ animate: animateOut }
+			);
 		});
 	};
 
 	/**
 	 * 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.
@@ -198,7 +233,6 @@ const MM = (function () {
 
 	/**
 	 * 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.
@@ -224,15 +258,12 @@ const MM = (function () {
 
 	/**
 	 * 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) {
-		options = options || {};
-
+	const hideModule = function (module, speed, callback, options = {}) {
 		// set lockString if set in options.
 		if (options.lockString) {
 			// Log.log("Has lockstring: " + options.lockString);
@@ -243,23 +274,65 @@ const MM = (function () {
 
 		const moduleWrapper = document.getElementById(module.identifier);
 		if (moduleWrapper !== null) {
-			moduleWrapper.style.transition = "opacity " + speed / 1000 + "s";
-			moduleWrapper.style.opacity = 0;
-
 			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";
+			// reset all animations if needed
+			if (module.hasAnimateOut) {
+				removeAnimateCSS(module.identifier, module.hasAnimateOut);
+				Log.debug(`${module.identifier} Force remove animateOut (in hide): ${module.hasAnimateOut}`);
+				module.hasAnimateOut = false;
+			}
+			if (module.hasAnimateIn) {
+				removeAnimateCSS(module.identifier, module.hasAnimateIn);
+				Log.debug(`${module.identifier} Force remove animateIn (in hide): ${module.hasAnimateIn}`);
+				module.hasAnimateIn = false;
+			}
+			// haveAnimateName for verify if we are using AninateCSS library
+			// we check AnimateCSSOut Array for validate it
+			// and finaly return the animate name or `null` (for default MM² animation)
+			let haveAnimateName = null;
+			// check if have valid animateOut in module definition (module.data.animateOut)
+			if (module.data.animateOut && AnimateCSSOut.indexOf(module.data.animateOut) !== -1) haveAnimateName = module.data.animateOut;
+			// can't be override with options.animate
+			else if (options.animate && AnimateCSSOut.indexOf(options.animate) !== -1) haveAnimateName = options.animate;
 
-				updateWrapperStates();
+			if (haveAnimateName) {
+				// with AnimateCSS
+				Log.debug(`${module.identifier} Has animateOut: ${haveAnimateName}`);
+				module.hasAnimateOut = haveAnimateName;
+				addAnimateCSS(module.identifier, haveAnimateName, speed / 1000);
+				module.showHideTimer = setTimeout(function () {
+					removeAnimateCSS(module.identifier, haveAnimateName);
+					Log.debug(`${module.identifier} Remove animateOut: ${module.hasAnimateOut}`);
+					// AnimateCSS is now done
+					moduleWrapper.style.opacity = 0;
+					moduleWrapper.classList.add("hidden");
+					moduleWrapper.style.position = "fixed";
+					module.hasAnimateOut = false;
 
-				if (typeof callback === "function") {
-					callback();
-				}
-			}, speed);
+					updateWrapperStates();
+					if (typeof callback === "function") {
+						callback();
+					}
+				}, speed);
+			} else {
+				// default MM² Animate
+				moduleWrapper.style.transition = `opacity ${speed / 1000}s`;
+				moduleWrapper.style.opacity = 0;
+				moduleWrapper.classList.add("hidden");
+				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") {
@@ -270,15 +343,12 @@ const MM = (function () {
 
 	/**
 	 * 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) {
-		options = options || {};
-
+	const showModule = function (module, speed, callback, options = {}) {
 		// remove lockString if set in options.
 		if (options.lockString) {
 			const index = module.lockStrings.indexOf(options.lockString);
@@ -290,26 +360,49 @@ const MM = (function () {
 		// 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(","));
+			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;
 		}
+		// reset all animations if needed
+		if (module.hasAnimateOut) {
+			removeAnimateCSS(module.identifier, module.hasAnimateOut);
+			Log.debug(`${module.identifier} Force remove animateOut (in show): ${module.hasAnimateOut}`);
+			module.hasAnimateOut = false;
+		}
+		if (module.hasAnimateIn) {
+			removeAnimateCSS(module.identifier, module.hasAnimateIn);
+			Log.debug(`${module.identifier} Force remove animateIn (in show): ${module.hasAnimateIn}`);
+			module.hasAnimateIn = false;
+		}
 
 		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);
+			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";
+			clearTimeout(module.showHideTimer);
+
+			// haveAnimateName for verify if we are using AninateCSS library
+			// we check AnimateCSSIn Array for validate it
+			// and finaly return the animate name or `null` (for default MM² animation)
+			let haveAnimateName = null;
+			// check if have valid animateOut in module definition (module.data.animateIn)
+			if (module.data.animateIn && AnimateCSSIn.indexOf(module.data.animateIn) !== -1) haveAnimateName = module.data.animateIn;
+			// can't be override with options.animate
+			else if (options.animate && AnimateCSSIn.indexOf(options.animate) !== -1) haveAnimateName = options.animate;
+
+			if (!haveAnimateName) moduleWrapper.style.transition = `opacity ${speed / 1000}s`;
 			// Restore the position. See hideModule() for more info.
 			moduleWrapper.style.position = "static";
+			moduleWrapper.classList.remove("hidden");
 
 			updateWrapperStates();
 
@@ -317,12 +410,27 @@ const MM = (function () {
 			const dummy = moduleWrapper.parentElement.parentElement.offsetHeight;
 			moduleWrapper.style.opacity = 1;
 
-			clearTimeout(module.showHideTimer);
-			module.showHideTimer = setTimeout(function () {
-				if (typeof callback === "function") {
-					callback();
-				}
-			}, speed);
+			if (haveAnimateName) {
+				// with AnimateCSS
+				Log.debug(`${module.identifier} Has animateIn: ${haveAnimateName}`);
+				module.hasAnimateIn = haveAnimateName;
+				addAnimateCSS(module.identifier, haveAnimateName, speed / 1000);
+				module.showHideTimer = setTimeout(function () {
+					removeAnimateCSS(module.identifier, haveAnimateName);
+					Log.debug(`${module.identifier} Remove animateIn: ${haveAnimateName}`);
+					module.hasAnimateIn = false;
+					if (typeof callback === "function") {
+						callback();
+					}
+				}, speed);
+			} else {
+				// default MM² Animate
+				module.showHideTimer = setTimeout(function () {
+					if (typeof callback === "function") {
+						callback();
+					}
+				}, speed);
+			}
 		} else {
 			// invoke callback
 			if (typeof callback === "function") {
@@ -342,10 +450,10 @@ const MM = (function () {
 	 * 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"];
+	const modulePositions = ["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 updateWrapperStates = function () {
+		modulePositions.forEach(function (position) {
 			const wrapper = selectWrapper(position);
 			const moduleWrappers = wrapper.getElementsByClassName("module");
 
@@ -365,7 +473,6 @@ const MM = (function () {
 	 */
 	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.");
@@ -373,18 +480,16 @@ const MM = (function () {
 		}
 
 		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.
 		 */
@@ -394,7 +499,6 @@ const MM = (function () {
 
 		/**
 		 * Filter modules without the specified classes.
-		 *
 		 * @param {string|string[]} className one or multiple classnames (array or space divided).
 		 * @returns {Module[]} Filtered collection of modules.
 		 */
@@ -404,7 +508,6 @@ const MM = (function () {
 
 		/**
 		 * 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.
@@ -433,7 +536,6 @@ const MM = (function () {
 
 		/**
 		 * Removes a module instance from the collection.
-		 *
 		 * @param {object} module The module instance to remove from the collection.
 		 * @returns {Module[]} Filtered collection of modules.
 		 */
@@ -448,7 +550,6 @@ const MM = (function () {
 
 		/**
 		 * 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) {
@@ -472,44 +573,64 @@ const MM = (function () {
 	};
 
 	return {
+
 		/* Public Methods */
 
 		/**
 		 * Main init method.
 		 */
-		init: function () {
-			Log.info("Initializing MagicMirror.");
+		async init () {
+			Log.info("Initializing MagicMirror².");
 			loadConfig();
 
 			Log.setLogLevel(config.logLevel);
 
-			Translator.loadCoreTranslations(config.language);
-			Loader.loadModules();
+			await Translator.loadCoreTranslations(config.language);
+			await Loader.loadModules();
 		},
 
 		/**
 		 * Gets called when all modules are started.
-		 *
 		 * @param {Module[]} moduleObjects All module instances.
 		 */
-		modulesStarted: function (moduleObjects) {
+		modulesStarted (moduleObjects) {
 			modules = [];
+			let startUp = "";
+
 			moduleObjects.forEach((module) => modules.push(module));
 
 			Log.info("All modules started!");
 			sendNotification("ALL_MODULES_STARTED");
 
 			createDomObjects();
+
+			if (config.reloadAfterServerRestart) {
+				setInterval(async () => {
+					// if server startup time has changed (which means server was restarted)
+					// the client reloads the mm page
+					try {
+						const res = await fetch(`${location.protocol}//${location.host}/startup`);
+						const curr = await res.text();
+						if (startUp === "") startUp = curr;
+						if (startUp !== curr) {
+							startUp = "";
+							window.location.reload(true);
+							console.warn("Refreshing Website because server was restarted");
+						}
+					} catch (err) {
+						Log.error(`MagicMirror not reachable: ${err}`);
+					}
+				}, config.checkServerInterval);
+			}
 		},
 
 		/**
 		 * 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) {
+		sendNotification (notification, payload, sender) {
 			if (arguments.length < 3) {
 				Log.error("sendNotification: Missing arguments.");
 				return;
@@ -531,11 +652,10 @@ const MM = (function () {
 
 		/**
 		 * 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.
+		 * @param {object|number} [updateOptions] The (optional) number of microseconds for the animation or object with updateOptions (speed/animates)
 		 */
-		updateDom: function (module, speed) {
+		updateDom (module, updateOptions) {
 			if (!(module instanceof Module)) {
 				Log.error("updateDom: Sender should be a module.");
 				return;
@@ -547,46 +667,46 @@ const MM = (function () {
 			}
 
 			// Further implementation is done in the private method.
-			updateDom(module, speed);
+			updateDom(module, updateOptions);
 		},
 
 		/**
 		 * Returns a collection of all modules currently active.
-		 *
 		 * @returns {Module[]} A collection of all modules currently active.
 		 */
-		getModules: function () {
+		getModules () {
 			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) {
+		hideModule (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) {
+		showModule (module, speed, callback, options) {
 			// do not change module.hidden yet, only if we really show it later
 			showModule(module, speed, callback, options);
-		}
+		},
+
+		// return all available module postions.
+		getAvailableModulePositions: modulePositions
 	};
-})();
+}());
 
 // Add polyfill for Object.assign.
 if (typeof Object.assign !== "function") {
@@ -609,7 +729,7 @@ if (typeof Object.assign !== "function") {
 			}
 			return output;
 		};
-	})();
+	}());
 }
 
 MM.init();

js/module.js

@@ -1,18 +1,15 @@
 /* global Class, cloneObject, Loader, MMSocket, nunjucks, Translator */
 
-/* Magic Mirror
- * Module Blueprint.
+/* 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.
+	// Set the minimum MagicMirror² module version for this module.
 	requiresVersion: "2.0.0",
 
 	// Module config defaults.
@@ -25,7 +22,7 @@ const Module = Class.extend({
 	// visibility when hiding and showing module.
 	lockStrings: [],
 
-	// Storage of the nunjuck Environment,
+	// Storage of the nunjucks Environment,
 	// This should not be referenced directly.
 	// Use the nunjucksEnvironment() to get it.
 	_nunjucksEnvironment: null,
@@ -33,32 +30,30 @@ const Module = Class.extend({
 	/**
 	 * Called when the module is instantiated.
 	 */
-	init: function () {
+	init () {
 		//Log.log(this.defaults);
 	},
 
 	/**
 	 * Called when the module is started.
 	 */
-	start: function () {
-		Log.info("Starting module: " + this.name);
+	async start () {
+		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 () {
+	getScripts () {
 		return [];
 	},
 
 	/**
 	 * Returns a list of stylesheets the module requires to be loaded.
-	 *
 	 * @returns {string[]} An array with filenames.
 	 */
-	getStyles: function () {
+	getStyles () {
 		return [];
 	},
 
@@ -66,28 +61,26 @@ const Module = Class.extend({
 	 * 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 () {
+	getTranslations () {
 		return false;
 	},
 
 	/**
-	 * Generates the dom which needs to be displayed. This method is called by the Magic Mirror core.
+	 * 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 () {
+	getDom () {
 		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)) {
+			if ((/^.*((\.html)|(\.njk))$/).test(template)) {
 				// the template is a filename
 				this.nunjucksEnvironment().render(template, templateData, function (err, res) {
 					if (err) {
@@ -109,12 +102,11 @@ const Module = Class.extend({
 
 	/**
 	 * 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 Magic Mirror core, but only if the user has configured a default header for the 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 () {
+	getHeader () {
 		return this.data.header;
 	},
 
@@ -123,31 +115,28 @@ const Module = Class.extend({
 	 * 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>";
+	getTemplate () {
+		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 () {
+	getTemplateData () {
 		return {};
 	},
 
 	/**
-	 * Called by the Magic Mirror core when a notification arrives.
-	 *
+	 * 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) {
+	notificationReceived (notification, payload, sender) {
 		if (sender) {
 			// Log.log(this.name + " received a module notification: " + notification + " from sender: " + sender.name);
 		} else {
@@ -158,10 +147,9 @@ const Module = Class.extend({
 	/**
 	 * Returns the nunjucks environment for the current module.
 	 * The environment is checked in the _nunjucksEnvironment instance variable.
-	 *
 	 * @returns {object} The Nunjucks Environment
 	 */
-	nunjucksEnvironment: function () {
+	nunjucksEnvironment () {
 		if (this._nunjucksEnvironment !== null) {
 			return this._nunjucksEnvironment;
 		}
@@ -180,63 +168,61 @@ const Module = Class.extend({
 
 	/**
 	 * 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);
+	socketNotificationReceived (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.");
+	suspend () {
+		Log.log(`${this.name} is suspended.`);
 	},
 
 	/**
 	 * Called when the module is shown.
 	 */
-	resume: function () {
-		Log.log(this.name + " is resumed.");
+	resume () {
+		Log.log(`${this.name} is resumed.`);
 	},
 
 	/*********************************************
-	 * The methods below don"t need subclassing. *
+	 * The methods below don't need subclassing. *
 	 *********************************************/
 
 	/**
 	 * Set the module data.
-	 *
 	 * @param {object} data The module data
 	 */
-	setData: function (data) {
+	setData (data) {
 		this.data = data;
 		this.name = data.name;
 		this.identifier = data.identifier;
 		this.hidden = false;
+		this.hasAnimateIn = false;
+		this.hasAnimateOut = 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) {
+	setConfig (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 () {
+	socket () {
 		if (typeof this._socket === "undefined") {
 			this._socket = new MMSocket(this.name);
 		}
@@ -250,62 +236,56 @@ const Module = Class.extend({
 
 	/**
 	 * 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("//", "/");
+	file (file) {
+		return `${this.data.path}/${file}`.replace("//", "/");
 	},
 
 	/**
 	 * Load all required stylesheets by requesting the MM object to load the files.
-	 *
-	 * @param {Function} callback Function called when done.
+	 * @returns {Promise<void>}
 	 */
-	loadStyles: function (callback) {
-		this.loadDependencies("getStyles", callback);
+	loadStyles () {
+		return this.loadDependencies("getStyles");
 	},
 
 	/**
 	 * Load all required scripts by requesting the MM object to load the files.
-	 *
-	 * @param {Function} callback Function called when done.
+	 * @returns {Promise<void>}
 	 */
-	loadScripts: function (callback) {
-		this.loadDependencies("getScripts", callback);
+	loadScripts () {
+		return this.loadDependencies("getScripts");
 	},
 
 	/**
 	 * Helper method to load all dependencies.
-	 *
 	 * @param {string} funcName Function name to call to get scripts or styles.
-	 * @param {Function} callback Function called when done.
+	 * @returns {Promise<void>}
 	 */
-	loadDependencies: function (funcName, callback) {
+	async loadDependencies (funcName) {
 		let dependencies = this[funcName]();
 
-		const loadNextDependency = () => {
+		const loadNextDependency = async () => {
 			if (dependencies.length > 0) {
 				const nextDependency = dependencies[0];
-				Loader.loadFile(nextDependency, this, () => {
-					dependencies = dependencies.slice(1);
-					loadNextDependency();
-				});
+				await Loader.loadFileForModule(nextDependency, this);
+				dependencies = dependencies.slice(1);
+				await loadNextDependency();
 			} else {
-				callback();
+				return Promise.resolve();
 			}
 		};
 
-		loadNextDependency();
+		await loadNextDependency();
 	},
 
 	/**
 	 * Load all translations.
-	 *
-	 * @param {Function} callback Function called when done.
+	 * @returns {Promise<void>}
 	 */
-	loadTranslations(callback) {
+	async loadTranslations () {
 		const translations = this.getTranslations() || {};
 		const language = config.language.toLowerCase();
 
@@ -313,7 +293,6 @@ const Module = Class.extend({
 		const fallbackLanguage = languages[0];
 
 		if (languages.length === 0) {
-			callback();
 			return;
 		}
 
@@ -321,28 +300,24 @@ const Module = Class.extend({
 		const translationsFallbackFile = translations[fallbackLanguage];
 
 		if (!translationFile) {
-			Translator.load(this, translationsFallbackFile, true, callback);
-			return;
+			return Translator.load(this, translationsFallbackFile, true);
 		}
 
-		Translator.load(this, translationFile, false, () => {
-			if (translationFile !== translationsFallbackFile) {
-				Translator.load(this, translationsFallbackFile, true, callback);
-			} else {
-				callback();
-			}
-		});
+		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) {
+	translate (key, defaultValueOrVariables, defaultValue) {
 		if (typeof defaultValueOrVariables === "object") {
 			return Translator.translate(this, key, defaultValueOrVariables) || defaultValue || "";
 		}
@@ -351,90 +326,87 @@ const Module = Class.extend({
 
 	/**
 	 * Request an (animated) update of the module.
-	 *
-	 * @param {number} [speed] The speed of the animation.
+	 * @param {number|object} [updateOptions] The speed of the animation or object with for updateOptions (speed/animates)
 	 */
-	updateDom: function (speed) {
-		MM.updateDom(this, speed);
+	updateDom (updateOptions) {
+		MM.updateDom(this, updateOptions);
 	},
 
 	/**
 	 * 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) {
+	sendNotification (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) {
+	sendSocketNotification (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) {
-		if (typeof callback === "object") {
-			options = callback;
-			callback = function () {};
-		}
+	hide (speed, callback, options = {}) {
+		let usedCallback = callback || function () {};
+		let usedOptions = options;
 
-		callback = callback || function () {};
-		options = 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();
-				callback();
+				usedCallback();
 			},
-			options
+			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) {
-		if (typeof callback === "object") {
-			options = callback;
-			callback = function () {};
-		}
+	show (speed, callback, options) {
+		let usedCallback = callback || function () {};
+		let usedOptions = options;
 
-		callback = callback || function () {};
-		options = 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();
-				callback();
+				usedCallback();
 			},
-			options
+			usedOptions
 		);
 	}
 });
 
 /**
- * Merging MagicMirror (or other) default/config script by @bugsounet
+ * Merging MagicMirror² (or other) default/config script by @bugsounet
  * Merge 2 objects or/with array
  *
  * Usage:
@@ -452,11 +424,10 @@ const Module = Class.extend({
  * -------
  *
  * 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) {
+function configMerge (result) {
 	const stack = Array.prototype.slice.call(arguments, 1);
 	let item, key;
 
@@ -498,15 +469,15 @@ Module.create = function (name) {
 
 Module.register = function (name, moduleDefinition) {
 	if (moduleDefinition.requiresVersion) {
-		Log.log("Check MagicMirror version for module '" + name + "' - Minimum version:  " + moduleDefinition.requiresVersion + " - Current version: " + window.mmVersion);
+		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 + "'");
+			Log.warn(`Version is incorrect. Skip module: '${name}'`);
 			return;
 		}
 	}
-	Log.log("Module registered: " + name);
+	Log.log(`Module registered: ${name}`);
 	Module.definitions[name] = moduleDefinition;
 };
 
@@ -514,13 +485,12 @@ 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) {
+function cmpVersions (a, b) {
 	const regExStrip0 = /(\.0+)+$/;
 	const segmentsA = a.replace(regExStrip0, "").split(".");
 	const segmentsB = b.replace(regExStrip0, "").split(".");

js/node_helper.js

@@ -1,62 +1,51 @@
-/* Magic Mirror
- * Node Helper Superclass
- *
- * By Michael Teeuw https://michaelteeuw.nl
- * MIT Licensed.
- */
-const Class = require("./class.js");
-const Log = require("logger");
 const express = require("express");
+const Log = require("logger");
+const Class = require("./class");
 
 const NodeHelper = Class.extend({
-	init() {
+	init () {
 		Log.log("Initializing new module helper ...");
 	},
 
-	loaded(callback) {
+	loaded () {
 		Log.log(`Module helper loaded: ${this.name}`);
-		callback();
 	},
 
-	start() {
+	start () {
 		Log.log(`Starting module helper: ${this.name}`);
 	},
 
-	/* stop()
-	 * Called when the MagicMirror server receives a `SIGINT`
+	/**
+	 * Called when the MagicMirror² server receives a `SIGINT`
 	 * Close any open connections, stop any sub-processes and
 	 * gracefully exit the module.
-	 *
 	 */
-	stop() {
+	stop () {
 		Log.log(`Stopping module helper: ${this.name}`);
 	},
 
-	/* socketNotificationReceived(notification, payload)
+	/**
 	 * This method is called when a socket notification arrives.
-	 *
-	 * argument notification string - The identifier of the notification.
-	 * argument payload mixed - The payload of the notification.
+	 * @param {string} notification The identifier of the notification.
+	 * @param {*}  payload The payload of the notification.
 	 */
-	socketNotificationReceived(notification, payload) {
+	socketNotificationReceived (notification, payload) {
 		Log.log(`${this.name} received a socket notification: ${notification} - Payload: ${payload}`);
 	},
 
-	/* setName(name)
+	/**
 	 * Set the module name.
-	 *
-	 * argument name string - Module name.
+	 * @param {string} name Module name.
 	 */
-	setName(name) {
+	setName (name) {
 		this.name = name;
 	},
 
-	/* setPath(path)
+	/**
 	 * Set the module path.
-	 *
-	 * argument path string - Module path.
+	 * @param {string} path Module path.
 	 */
-	setPath(path) {
+	setPath (path) {
 		this.path = path;
 	},
 
@@ -66,7 +55,7 @@ const NodeHelper = Class.extend({
 	 * argument notification string - The identifier of the notification.
 	 * argument payload mixed - The payload of the notification.
 	 */
-	sendSocketNotification(notification, payload) {
+	sendSocketNotification (notification, payload) {
 		this.io.of(this.name).emit(notification, payload);
 	},
 
@@ -76,7 +65,7 @@ const NodeHelper = Class.extend({
 	 *
 	 * argument app Express app - The Express app object.
 	 */
-	setExpressApp(app) {
+	setExpressApp (app) {
 		this.expressApp = app;
 
 		app.use(`/${this.name}`, express.static(`${this.path}/public`));
@@ -88,7 +77,7 @@ const NodeHelper = Class.extend({
 	 *
 	 * argument io Socket.io - The Socket io object.
 	 */
-	setSocketIO(io) {
+	setSocketIO (io) {
 		this.io = io;
 
 		Log.log(`Connecting socket for: ${this.name}`);
@@ -125,7 +114,6 @@ NodeHelper.checkFetchStatus = function (response) {
 /**
  * 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
  */

js/server.js

@@ -1,111 +1,114 @@
-/* Magic Mirror
- * Server
- *
- * By Michael Teeuw https://michaelteeuw.nl
- * MIT Licensed.
- */
+const fs = require("node:fs");
+const http = require("node:http");
+const https = require("node:https");
+const path = require("node:path");
 const express = require("express");
-const app = require("express")();
-const path = require("path");
 const ipfilter = require("express-ipfilter").IpFilter;
-const fs = require("fs");
 const helmet = require("helmet");
+const socketio = require("socket.io");
 
 const Log = require("logger");
-const Utils = require("./utils.js");
+const Utils = require("./utils");
+const { cors, getConfig, getHtml, getVersion, getStartup } = require("./server_functions");
 
 /**
  * Server
- *
  * @param {object} config The MM config
- * @param {Function} callback Function called when done.
  * @class
  */
-function Server(config, callback) {
+function Server (config) {
+	const app = express();
 	const port = process.env.MM_PORT || config.port;
 	const serverSockets = new Set();
-
 	let server = null;
-	if (config.useHttps) {
-		const options = {
-			key: fs.readFileSync(config.httpsPrivateKey),
-			cert: fs.readFileSync(config.httpsCertificate)
-		};
-		server = require("https").Server(options, app);
-	} else {
-		server = require("http").Server(app);
-	}
-	const io = require("socket.io")(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) {
-				return next();
+	/**
+	 * 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);
 			}
-			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.");
+			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("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("/startup", (req, res) => getStartup(req, res));
+
+			app.get("/", (req, res) => getHtml(req, res));
+
+			server.on("listening", () => {
+				resolve({
+					app,
+					io
+				});
+			});
 		});
-	});
-	app.use(helmet({ contentSecurityPolicy: false }));
-
-	app.use("/js", express.static(__dirname));
-
-	const directories = ["/config", "/css", "/fonts", "/modules", "/vendor", "/translations", "/tests/configs"];
-	for (const directory of directories) {
-		app.use(directory, express.static(path.resolve(global.root_path + directory)));
-	}
-
-	app.get("/version", function (req, res) {
-		res.send(global.version);
-	});
-
-	app.get("/config", function (req, res) {
-		res.send(config);
-	});
-
-	app.get("/", function (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);
-	});
-
-	if (typeof callback === "function") {
-		callback(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 () {
-		for (const socket of serverSockets.values()) {
-			socket.destroy();
-		}
-		server.close();
+		return new Promise((resolve) => {
+			for (const socket of serverSockets.values()) {
+				socket.destroy();
+			}
+			server.close(resolve);
+		});
 	};
 }
 

js/server_functions.js

@@ -0,0 +1,131 @@
+const fs = require("node:fs");
+const path = require("node:path");
+const Log = require("logger");
+
+const startUp = new Date();
+
+/**
+ * Gets the config.
+ * @param {Request} req - the request
+ * @param {Response} res - the result
+ */
+function getConfig (req, res) {
+	res.send(config);
+}
+
+/**
+ * Gets the startup time.
+ * @param {Request} req - the request
+ * @param {Response} res - the result
+ */
+function getStartup (req, res) {
+	res.send(startUp);
+}
+
+/**
+ * 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, getStartup };

js/socketclient.js

@@ -1,11 +1,5 @@
 /* global io */
 
-/* Magic Mirror
- * 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.");
@@ -18,8 +12,8 @@ const MMSocket = function (moduleName) {
 	if (typeof config !== "undefined" && typeof config.basePath !== "undefined") {
 		base = config.basePath;
 	}
-	this.socket = io("/" + this.moduleName, {
-		path: base + "socket.io"
+	this.socket = io(`/${this.moduleName}`, {
+		path: `${base}socket.io`
 	});
 
 	let notificationCallback = function () {};
@@ -44,10 +38,7 @@ const MMSocket = function (moduleName) {
 		notificationCallback = callback;
 	};
 
-	this.sendNotification = (notification, payload) => {
-		if (typeof payload === "undefined") {
-			payload = {};
-		}
+	this.sendNotification = (notification, payload = {}) => {
 		this.socket.emit(notification, payload);
 	};
 };

js/translator.js

@@ -1,36 +1,32 @@
 /* global translations */
 
-/* Magic Mirror
- * 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.
-	 * @param {Function} callback Function called when done.
+	 * @returns {Promise<object>} the translations in the specified file
 	 */
-	function loadJSON(file, callback) {
+	async function loadJSON (file) {
 		const xhr = new XMLHttpRequest();
-		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");
+		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);
 				}
-				callback(fileinfo);
-			}
-		};
-		xhr.send(null);
+			};
+			xhr.send(null);
+		});
 	}
 
 	return {
@@ -41,34 +37,32 @@ const Translator = (function () {
 
 		/**
 		 * 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) {
-			variables = variables || {}; //Empty object by default
+		translate (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) {
+			function createStringFromTemplate (template, variables) {
 				if (Object.prototype.toString.call(template) !== "[object String]") {
 					return template;
 				}
+				let templateToUse = template;
 				if (variables.fallback && !template.match(new RegExp("{.+}"))) {
-					template = variables.fallback;
+					templateToUse = variables.fallback;
 				}
-				return template.replace(new RegExp("{([^}]+)}", "g"), function (_unused, varName) {
-					return varName in variables ? variables[varName] : "{" + varName + "}";
+				return templateToUse.replace(new RegExp("{([^}]+)}", "g"), function (_unused, varName) {
+					return varName in variables ? variables[varName] : `{${varName}}`;
 				});
 			}
 
@@ -97,59 +91,49 @@ const Translator = (function () {
 
 		/**
 		 * 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.
-		 * @param {Function} callback Function called when done.
 		 */
-		load(module, file, isFallback, callback) {
-			Log.log(`${module.name} - Load translation${isFallback && " fallback"}: ${file}`);
+		async load (module, file, isFallback) {
+			Log.log(`${module.name} - Load translation${isFallback ? " fallback" : ""}: ${file}`);
 
 			if (this.translationsFallback[module.name]) {
-				callback();
 				return;
 			}
 
-			loadJSON(module.file(file), (json) => {
-				const property = isFallback ? "translationsFallback" : "translations";
-				this[property][module.name] = json;
-				callback();
-			});
+			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: function (lang) {
+		async loadCoreTranslations (lang) {
 			if (lang in translations) {
-				Log.log("Loading core translation file: " + translations[lang]);
-				loadJSON(translations[lang], (translations) => {
-					this.coreTranslations = 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.");
 			}
 
-			this.loadCoreTranslationsFallback();
+			await this.loadCoreTranslationsFallback();
 		},
 
 		/**
-		 * Load the core translations fallback.
+		 * Load the core translations' fallback.
 		 * The first language defined in translations.js will be used.
 		 */
-		loadCoreTranslationsFallback: function () {
+		async loadCoreTranslationsFallback () {
 			let first = Object.keys(translations)[0];
 			if (first) {
-				Log.log("Loading core translation fallback file: " + translations[first]);
-				loadJSON(translations[first], (translations) => {
-					this.coreTranslationsFallback = translations;
-				});
+				Log.log(`Loading core translation fallback file: ${translations[first]}`);
+				this.coreTranslationsFallback = await loadJSON(translations[first]);
 			}
 		}
 	};
-})();
+}());
 
 window.Translator = Translator;

js/utils.js

@@ -1,16 +1,40 @@
-/* Magic Mirror
- * Utils
- *
- * By Rodrigo Ramírez Norambuena https://rodrigoramirez.com
- * MIT Licensed.
- */
-const colors = require("colors/safe");
+const execSync = require("node:child_process").execSync;
+const Log = require("logger");
+const si = require("systeminformation");
 
 module.exports = {
-	colors: {
-		warn: colors.yellow,
-		error: colors.red,
-		info: colors.blue,
-		pass: colors.green
+
+	async logSystemInformation  () {
+		try {
+			let installedNodeVersion = execSync("node -v", { encoding: "utf-8" }).replace("v", "").replace(/(?:\r\n|\r|\n)/g, "");
+
+			const staticData = await si.get({
+				system: "manufacturer, model, raspberry, virtual",
+				osInfo: "platform, distro, release, arch",
+				versions: "kernel, node, npm, pm2"
+			});
+			let systemDataString = "System information:";
+			systemDataString += `\n### SYSTEM:   manufacturer: ${staticData["system"]["manufacturer"]}; model: ${staticData["system"]["model"]}; raspberry: ${staticData["system"]["raspberry"]}; virtual: ${staticData["system"]["virtual"]}`;
+			systemDataString += `\n### OS:       platform: ${staticData["osInfo"]["platform"]}; distro: ${staticData["osInfo"]["distro"]}; release: ${staticData["osInfo"]["release"]}; arch: ${staticData["osInfo"]["arch"]}; kernel: ${staticData["versions"]["kernel"]}`;
+			systemDataString += `\n### VERSIONS: electron: ${process.versions.electron}; used node: ${staticData["versions"]["node"]}; installed node: ${installedNodeVersion}; npm: ${staticData["versions"]["npm"]}; pm2: ${staticData["versions"]["pm2"]}`;
+			systemDataString += `\n### OTHER:    timeZone: ${Intl.DateTimeFormat().resolvedOptions().timeZone}; ELECTRON_ENABLE_GPU: ${process.env.ELECTRON_ENABLE_GPU}`;
+			Log.info(systemDataString);
+
+			// Return is currently only for jest
+			return systemDataString;
+		} catch (e) {
+			Log.error(e);
+		}
+	},
+
+	// return all available module positions
+	getAvailableModulePositions () {
+		return ["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"];
+	},
+
+	// return if postion is on modulePositions Array (true/false)
+	moduleHasValidPosition (position) {
+		if (this.getAvailableModulePositions().indexOf(position) === -1) return false;
+		return true;
 	}
 };

module-types.ts

@@ -1,16 +1,19 @@
 type ModuleProperties = {
   defaults?: object;
+  [key: string]: any;
   start?(): void;
+  getScripts?(): string[];
+  getStyles?(): string[];
+  getTranslations?(): object;
+  getDom?(): HTMLElement;
   getHeader?(): string;
   getTemplate?(): string;
   getTemplateData?(): object;
   notificationReceived?(notification: string, payload: any, sender: object): void;
+  nunjucksEnvironment?(): void;
   socketNotificationReceived?(notification: string, payload: any): void;
   suspend?(): void;
   resume?(): void;
-  getDom?(): HTMLElement;
-  getStyles?(): string[];
-  [key: string]: any;
 };
 
 export declare const Module: {

modules/default/alert/README.md

@@ -1,5 +1,5 @@
 # Module: Alert
 
-The alert module is one of the default modules of the MagicMirror. This module displays notifications from other modules.
+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

@@ -1,167 +1,141 @@
 /* global NotificationFx */
 
-/* Magic Mirror
- * Module: alert
- *
- * By Paul-Vincent Roll https://paulvincentroll.com/
- * MIT Licensed.
- */
 Module.register("alert", {
+	alerts: {},
+
 	defaults: {
-		// scale|slide|genie|jelly|flip|bouncyflip|exploader
-		effect: "slide",
-		// scale|slide|genie|jelly|flip|bouncyflip|exploader
-		alert_effect: "jelly",
-		//time a notification is displayed in seconds
-		display_time: 3500,
-		//Position
+		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",
-		//shown at startup
-		welcome_message: false
+		welcome_message: false // shown at startup
 	},
-	getScripts: function () {
+
+	getScripts () {
 		return ["notificationFx.js"];
 	},
-	getStyles: function () {
-		return ["notificationFx.css", "font-awesome.css"];
+
+	getStyles () {
+		return ["font-awesome.css", this.file("./styles/notificationFx.css"), this.file(`./styles/${this.config.position}.css`)];
 	},
-	// Define required translations.
-	getTranslations: function () {
+
+	getTranslations () {
 		return {
-			en: "translations/en.json",
+			bg: "translations/bg.json",
+			da: "translations/da.json",
 			de: "translations/de.json",
-			nl: "translations/nl.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"
 		};
 	},
-	show_notification: function (message) {
+
+	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;
+			this.config.effect = `${this.config.effect}-${this.config.position}`;
 		}
-		let msg = "";
-		if (message.title) {
-			msg += "<span class='thin dimmed medium'>" + message.title + "</span>";
+
+		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 });
 		}
-		if (message.message) {
-			if (msg !== "") {
-				msg += "<br />";
+	},
+
+	notificationReceived (notification, payload, sender) {
+		if (notification === "SHOW_ALERT") {
+			if (payload.type === "notification") {
+				this.showNotification(payload);
+			} else {
+				this.showAlert(payload, sender);
 			}
-			msg += "<span class='light bright small'>" + message.message + "</span>";
+		} else if (notification === "HIDE_ALERT") {
+			this.hideAlert(sender);
 		}
+	},
+
+	async showNotification (notification) {
+		const message = await this.renderMessage(notification.templateName || "notification", notification);
 
 		new NotificationFx({
-			message: msg,
+			message,
 			layout: "growl",
 			effect: this.config.effect,
-			ttl: message.timer !== undefined ? message.timer : this.config.display_time
+			ttl: notification.timer || this.config.display_time
 		}).show();
 	},
-	show_alert: function (params, sender) {
-		let image = "";
-		//Set standard params if not provided by module
-		if (typeof params.timer === "undefined") {
-			params.timer = null;
-		}
-		if (typeof params.imageHeight === "undefined") {
-			params.imageHeight = "80px";
-		}
-		if (typeof params.imageUrl === "undefined" && typeof params.imageFA === "undefined") {
-			params.imageUrl = null;
-		} else if (typeof params.imageFA === "undefined") {
-			image = "<img src='" + params.imageUrl.toString() + "' height='" + params.imageHeight.toString() + "' style='margin-bottom: 10px;'/><br />";
-		} else if (typeof params.imageUrl === "undefined") {
-			image = "<span class='bright " + "fa fa-" + params.imageFA + "' style='margin-bottom: 10px;font-size:" + params.imageHeight.toString() + ";'/></span><br />";
-		}
-		//Create overlay
-		const overlay = document.createElement("div");
-		overlay.id = "overlay";
-		overlay.innerHTML += '<div class="black_overlay"></div>';
-		document.body.insertBefore(overlay, document.body.firstChild);
 
-		//If module already has an open alert close it
+	async showAlert (alert, sender) {
+		// If module already has an open alert close it
 		if (this.alerts[sender.name]) {
-			this.hide_alert(sender, false);
+			this.hideAlert(sender, false);
 		}
 
-		//Display title and message only if they are provided in notification parameters
-		let message = "";
-		if (params.title) {
-			message += "<span class='light dimmed medium'>" + params.title + "</span>";
-		}
-		if (params.message) {
-			if (message !== "") {
-				message += "<br />";
-			}
-
-			message += "<span class='thin bright small'>" + params.message + "</span>";
+		// Add overlay
+		if (!Object.keys(this.alerts).length) {
+			this.toggleBlur(true);
 		}
 
-		//Store alert in this.alerts
+		const message = await this.renderMessage(alert.templateName || "alert", alert);
+
+		// Store alert in this.alerts
 		this.alerts[sender.name] = new NotificationFx({
-			message: image + message,
+			message,
 			effect: this.config.alert_effect,
-			ttl: params.timer,
-			onClose: () => this.hide_alert(sender),
+			ttl: alert.timer,
+			onClose: () => this.hideAlert(sender),
 			al_no: "ns-alert"
 		});
 
-		//Show alert
+		// Show alert
 		this.alerts[sender.name].show();
 
-		//Add timer to dismiss alert and overlay
-		if (params.timer) {
+		// Add timer to dismiss alert and overlay
+		if (alert.timer) {
 			setTimeout(() => {
-				this.hide_alert(sender);
-			}, params.timer);
+				this.hideAlert(sender);
+			}, alert.timer);
 		}
 	},
-	hide_alert: function (sender, close = true) {
-		//Dismiss alert and remove from this.alerts
+
+	hideAlert (sender, close = true) {
+		// Dismiss alert and remove from this.alerts
 		if (this.alerts[sender.name]) {
 			this.alerts[sender.name].dismiss(close);
-			this.alerts[sender.name] = null;
-			//Remove overlay
-			const overlay = document.getElementById("overlay");
-			overlay.parentNode.removeChild(overlay);
-		}
-	},
-	setPosition: function (pos) {
-		//Add css to body depending on the set position for notifications
-		const sheet = document.createElement("style");
-		if (pos === "center") {
-			sheet.innerHTML = ".ns-box {margin-left: auto; margin-right: auto;text-align: center;}";
-		}
-		if (pos === "right") {
-			sheet.innerHTML = ".ns-box {margin-left: auto;text-align: right;}";
-		}
-		if (pos === "left") {
-			sheet.innerHTML = ".ns-box {margin-right: auto;text-align: left;}";
-		}
-		document.body.appendChild(sheet);
-	},
-	notificationReceived: function (notification, payload, sender) {
-		if (notification === "SHOW_ALERT") {
-			if (typeof payload.type === "undefined") {
-				payload.type = "alert";
-			}
-			if (payload.type === "alert") {
-				this.show_alert(payload, sender);
-			} else if (payload.type === "notification") {
-				this.show_notification(payload);
-			}
-		} else if (notification === "HIDE_ALERT") {
-			this.hide_alert(sender);
-		}
-	},
-	start: function () {
-		this.alerts = {};
-		this.setPosition(this.config.position);
-		if (this.config.welcome_message) {
-			if (this.config.welcome_message === true) {
-				this.show_notification({ title: this.translate("sysTitle"), message: this.translate("welcome") });
-			} else {
-				this.show_notification({ title: this.translate("sysTitle"), message: this.config.welcome_message });
+			delete this.alerts[sender.name];
+			// Remove overlay
+			if (!Object.keys(this.alerts).length) {
+				this.toggleBlur(false);
 			}
 		}
-		Log.info("Starting module: " + this.name);
+	},
+
+	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

@@ -9,16 +9,17 @@
  *
  * 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) {
+	function extend (a, b) {
 		for (let key in b) {
 			if (b.hasOwnProperty(key)) {
 				a[key] = b[key];
@@ -29,11 +30,10 @@
 
 	/**
 	 * NotificationFx constructor
-	 *
 	 * @param {object} options The configuration options
 	 * @class
 	 */
-	function NotificationFx(options) {
+	function NotificationFx (options) {
 		this.options = extend({}, this.options);
 		extend(this.options, options);
 		this._init();
@@ -64,10 +64,10 @@
 		ttl: 6000,
 		al_no: "ns-box",
 		// callbacks
-		onClose: function () {
+		onClose () {
 			return false;
 		},
-		onOpen: function () {
+		onOpen () {
 			return false;
 		}
 	};
@@ -78,8 +78,8 @@
 	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">';
+		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;
@@ -122,7 +122,6 @@
 
 	/**
 	 * Dismiss the notification
-	 *
 	 * @param {boolean} [close] call the onClose callback at the end
 	 */
 	NotificationFx.prototype.dismiss = function (close = true) {
@@ -155,4 +154,4 @@
 	 * Add to global namespace
 	 */
 	window.NotificationFx = NotificationFx;
-})(window);
+}(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

@@ -1,7 +1,7 @@
 /* Based on work by https://tympanus.net/codrops/licensing/ */
 
 .ns-box {
-  background-color: rgba(0, 0, 0, 0.93);
+  background-color: rgb(0 0 0 / 93%);
   padding: 17px;
   line-height: 1.4;
   margin-bottom: 10px;
@@ -39,12 +39,8 @@
   border-radius: 20px;
 }
 
-.black_overlay {
-  position: fixed;
-  z-index: 2;
-  background-color: rgba(0, 0, 0, 0.93);
-  width: 100%;
-  height: 100%;
+.alert-blur {
+  filter: blur(2px) brightness(50%);
 }
 
 [class^="ns-effect-"].ns-growl.ns-hide,
@@ -59,15 +55,15 @@
 
 .ns-effect-flip.ns-show,
 .ns-effect-flip.ns-hide {
-  animation-name: animFlipFront;
+  animation-name: anim-flip-front;
   animation-duration: 0.3s;
 }
 
 .ns-effect-flip.ns-hide {
-  animation-name: animFlipBack;
+  animation-name: anim-flip-back;
 }
 
-@keyframes animFlipFront {
+@keyframes anim-flip-front {
   0% {
     transform: perspective(1000px) rotate3d(1, 0, 0, -90deg);
   }
@@ -77,7 +73,7 @@
   }
 }
 
-@keyframes animFlipBack {
+@keyframes anim-flip-back {
   0% {
     transform: perspective(1000px) rotate3d(1, 0, 0, 90deg);
   }
@@ -89,11 +85,11 @@
 
 .ns-effect-bouncyflip.ns-show,
 .ns-effect-bouncyflip.ns-hide {
-  animation-name: flipInX;
+  animation-name: flip-in-x;
   animation-duration: 0.8s;
 }
 
-@keyframes flipInX {
+@keyframes flip-in-x {
   0% {
     transform: perspective(400px) rotate3d(1, 0, 0, -90deg);
     transition-timing-function: ease-in;
@@ -121,11 +117,11 @@
 }
 
 .ns-effect-bouncyflip.ns-hide {
-  animation-name: flipInXSimple;
+  animation-name: flip-in-x-simple;
   animation-duration: 0.3s;
 }
 
-@keyframes flipInXSimple {
+@keyframes flip-in-x-simple {
   0% {
     transform: perspective(400px) rotate3d(1, 0, 0, -90deg);
     transition-timing-function: ease-in;
@@ -145,11 +141,11 @@
 }
 
 .ns-effect-exploader.ns-show {
-  animation-name: animLoad;
+  animation-name: anim-load;
   animation-duration: 1s;
 }
 
-@keyframes animLoad {
+@keyframes anim-load {
   0% {
     opacity: 1;
     transform: scale3d(0, 0.3, 1);
@@ -162,7 +158,7 @@
 }
 
 .ns-effect-exploader.ns-hide {
-  animation-name: animFade;
+  animation-name: anim-fade;
   animation-duration: 0.3s;
 }
 
@@ -174,15 +170,15 @@
 }
 
 .ns-effect-exploader.ns-show .ns-close {
-  animation-name: animFade;
+  animation-name: anim-fade;
 }
 
 .ns-effect-exploader.ns-show .ns-box-inner {
-  animation-name: animFadeMove;
+  animation-name: anim-fade-move;
   animation-timing-function: ease-out;
 }
 
-@keyframes animFadeMove {
+@keyframes anim-fade-move {
   0% {
     opacity: 0;
     transform: translate3d(0, 10px, 0);
@@ -194,7 +190,7 @@
   }
 }
 
-@keyframes animFade {
+@keyframes anim-fade {
   0% {
     opacity: 0;
   }
@@ -206,11 +202,11 @@
 
 .ns-effect-scale.ns-show,
 .ns-effect-scale.ns-hide {
-  animation-name: animScale;
+  animation-name: anim-scale;
   animation-duration: 0.25s;
 }
 
-@keyframes animScale {
+@keyframes anim-scale {
   0% {
     opacity: 0;
     transform: translate3d(0, 40px, 0) scale3d(0.1, 0.6, 1);
@@ -223,168 +219,169 @@
 }
 
 .ns-effect-jelly.ns-show {
-  animation-name: animJelly;
+  animation-name: anim-jelly;
   animation-duration: 1s;
   animation-timing-function: linear;
 }
 
 .ns-effect-jelly.ns-hide {
-  animation-name: animFade;
+  animation-name: anim-fade;
   animation-duration: 0.3s;
 }
 
-@keyframes animFade {
+@keyframes anim-fade {
   0% {
     opacity: 0;
   }
+
   100% {
     opacity: 1;
   }
 }
 
-@keyframes animJelly {
+@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.75266, 0, 0, 0, 0, 0.76342, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.81071, 0, 0, 0, 0, 0.84545, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.86808, 0, 0, 0, 0, 0.9286, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.92038, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    transform: matrix3d(0.9204, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
   }
 
   10.416667% {
-    transform: matrix3d(0.96482, 0, 0, 0, 0, 1.05202, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.08204, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    transform: matrix3d(1, 0, 0, 0, 0, 1.082, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
   }
 
   14.583333% {
-    transform: matrix3d(1.02563, 0, 0, 0, 0, 1.09149, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.04227, 0, 0, 0, 0, 1.08453, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.05102, 0, 0, 0, 0, 1.06666, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.05334, 0, 0, 0, 0, 1.04355, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.05078, 0, 0, 0, 0, 1.02012, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    transform: matrix3d(1.0508, 0, 0, 0, 0, 1.0201, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
   }
 
   25% {
-    transform: matrix3d(1.04487, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    transform: matrix3d(1.0449, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
   }
 
   27.083333% {
-    transform: matrix3d(1.03699, 0, 0, 0, 0, 0.98534, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.02831, 0, 0, 0, 0, 0.97688, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.01973, 0, 0, 0, 0, 0.97422, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.01191, 0, 0, 0, 0, 0.97618, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.00526, 0, 0, 0, 0, 0.98122, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.98773, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    transform: matrix3d(1, 0, 0, 0, 0, 0.9877, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
   }
 
   39.583333% {
-    transform: matrix3d(0.99617, 0, 0, 0, 0, 0.99433, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.99368, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    transform: matrix3d(0.9937, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
   }
 
   43.75% {
-    transform: matrix3d(0.99237, 0, 0, 0, 0, 1.00413, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.99202, 0, 0, 0, 0, 1.00651, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.99241, 0, 0, 0, 0, 1.00726, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    transform: matrix3d(0.9924, 0, 0, 0, 0, 1.0073, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
   }
 
   50% {
-    transform: matrix3d(0.99329, 0, 0, 0, 0, 1.00671, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.99447, 0, 0, 0, 0, 1.00529, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.99577, 0, 0, 0, 0, 1.00346, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.99705, 0, 0, 0, 0, 1.0016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.99822, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    transform: matrix3d(0.9982, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
   }
 
   60.416667% {
-    transform: matrix3d(0.99921, 0, 0, 0, 0, 0.99884, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.99816, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    transform: matrix3d(1, 0, 0, 0, 0, 0.9982, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
   }
 
   64.583333% {
-    transform: matrix3d(1.00057, 0, 0, 0, 0, 0.99795, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.00095, 0, 0, 0, 0, 0.99811, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.00114, 0, 0, 0, 0, 0.99851, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.00119, 0, 0, 0, 0, 0.99903, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.00114, 0, 0, 0, 0, 0.99955, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    transform: matrix3d(1.0011, 0, 0, 0, 0, 0.9996, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
   }
 
   75% {
@@ -392,47 +389,47 @@
   }
 
   77.083333% {
-    transform: matrix3d(1.00083, 0, 0, 0, 0, 1.00033, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.00063, 0, 0, 0, 0, 1.00052, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.00044, 0, 0, 0, 0, 1.00058, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.00027, 0, 0, 0, 0, 1.00053, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.00012, 0, 0, 0, 0, 1.00042, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.00027, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    transform: matrix3d(1, 0, 0, 0, 0, 1.0003, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
   }
 
   89.583333% {
-    transform: matrix3d(0.99991, 0, 0, 0, 0, 1.00013, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.99986, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    transform: matrix3d(0.9999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
   }
 
   93.75% {
-    transform: matrix3d(0.99983, 0, 0, 0, 0, 0.99991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.99982, 0, 0, 0, 0, 0.99985, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    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.99983, 0, 0, 0, 0, 0.99984, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
+    transform: matrix3d(0.9998, 0, 0, 0, 0, 0.9998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
   }
 
   100% {
@@ -441,162 +438,162 @@
 }
 
 .ns-effect-slide-left.ns-show {
-  animation-name: animSlideElasticLeft;
+  animation-name: anim-slide-elastic-left;
   animation-duration: 1s;
   animation-timing-function: linear;
 }
 
-@keyframes animSlideElasticLeft {
+@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.92933, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -739.26805, 0, 0, 1);
+    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.96989, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -521.82545, 0, 0, 1);
+    transform: matrix3d(1.9699, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -521.8255, 0, 0, 1);
   }
 
   5% {
-    transform: matrix3d(1.70901, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -349.26115, 0, 0, 1);
+    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.4235, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -218.3238, 0, 0, 1);
+    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.21065, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -123.29848, 0, 0, 1);
+    transform: matrix3d(1.2107, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -123.2985, 0, 0, 1);
   }
 
   10% {
-    transform: matrix3d(1.08167, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -57.59273, 0, 0, 1);
+    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.0165, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -14.72371, 0, 0, 1);
+    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.99057, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 11.12794, 0, 0, 1);
+    transform: matrix3d(0.9906, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 11.1279, 0, 0, 1);
   }
 
   15% {
-    transform: matrix3d(0.98478, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 24.86339, 0, 0, 1);
+    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.98719, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 30.40503, 0, 0, 1);
+    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.9916, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 30.75275, 0, 0, 1);
+    transform: matrix3d(0.992, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 30.7528, 0, 0, 1);
   }
 
   20% {
-    transform: matrix3d(0.99541, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 28.10141, 0, 0, 1);
+    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.99795, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 23.98271, 0, 0, 1);
+    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.99936, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 19.40752, 0, 0, 1);
+    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.99558, 0, 0, 1);
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 14.9956, 0, 0, 1);
   }
 
   26.666667% {
-    transform: matrix3d(1.00021, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 11.08575, 0, 0, 1);
+    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.00022, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 7.82507, 0, 0, 1);
+    transform: matrix3d(1.0002, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 7.8251, 0, 0, 1);
   }
 
   30% {
-    transform: matrix3d(1.00016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 5.23737, 0, 0, 1);
+    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.0001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 3.27389, 0, 0, 1);
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 3.2739, 0, 0, 1);
   }
 
   33.333333% {
-    transform: matrix3d(1.00005, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 1.84893, 0, 0, 1);
+    transform: matrix3d(1.0001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 1.8489, 0, 0, 1);
   }
 
   35% {
-    transform: matrix3d(1.00002, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.86364, 0, 0, 1);
+    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.22079, 0, 0, 1);
+    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.16687, 0, 0, 1);
+    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.37284, 0, 0, 1);
+    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.45594, 0, 0, 1);
+    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.46116, 0, 0, 1);
+    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.4214, 0, 0, 1);
+    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.35963, 0, 0, 1);
+    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.29103, 0, 0, 1);
+    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.22487, 0, 0, 1);
+    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.16624, 0, 0, 1);
+    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.11734, 0, 0, 1);
+    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.07854, 0, 0, 1);
+    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.04909, 0, 0, 1);
+    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.02773, 0, 0, 1);
+    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.01295, 0, 0, 1);
+    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.00331, 0, 0, 1);
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.0033, 0, 0, 1);
   }
 
   63.333333% {
@@ -604,67 +601,67 @@
   }
 
   65% {
-    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.00559, 0, 0, 1);
+    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.00684, 0, 0, 1);
+    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.00692, 0, 0, 1);
+    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.00632, 0, 0, 1);
+    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.00539, 0, 0, 1);
+    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.00436, 0, 0, 1);
+    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.00337, 0, 0, 1);
+    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.00249, 0, 0, 1);
+    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.00176, 0, 0, 1);
+    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.00118, 0, 0, 1);
+    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.00074, 0, 0, 1);
+    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.00042, 0, 0, 1);
+    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.00019, 0, 0, 1);
+    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.00005, 0, 0, 1);
+    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.00004, 0, 0, 1);
+    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.00008, 0, 0, 1);
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.0001, 0, 0, 1);
   }
 
   91.666667% {
@@ -676,15 +673,15 @@
   }
 
   95% {
-    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.00009, 0, 0, 1);
+    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.00008, 0, 0, 1);
+    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.00007, 0, 0, 1);
+    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -0.0001, 0, 0, 1);
   }
 
   100% {
@@ -693,11 +690,11 @@
 }
 
 .ns-effect-slide-left.ns-hide {
-  animation-name: animSlideLeft;
+  animation-name: anim-slide-left;
   animation-duration: 0.25s;
 }
 
-@keyframes animSlideLeft {
+@keyframes anim-slide-left {
   0% {
     transform: translate3d(-30px, 0, 0) translate3d(-100%, 0, 0);
   }
@@ -708,10 +705,10 @@
 }
 
 .ns-effect-slide-right.ns-show {
-  animation: animSlideElasticRight 2000ms linear both;
+  animation: anim-slide-elastic-right 2000ms linear both;
 }
 
-@keyframes animSlideElasticRight {
+@keyframes anim-slide-elastic-right {
   0% {
     transform: matrix3d(2, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 1000, 0, 0, 1);
   }
@@ -790,11 +787,11 @@
 }
 
 .ns-effect-slide-right.ns-hide {
-  animation-name: animSlideRight;
+  animation-name: anim-slide-right;
   animation-duration: 0.25s;
 }
 
-@keyframes animSlideRight {
+@keyframes anim-slide-right {
   0% {
     transform: translate3d(30px, 0, 0) translate3d(100%, 0, 0);
   }
@@ -805,10 +802,10 @@
 }
 
 .ns-effect-slide-center.ns-show {
-  animation: animSlideElasticCenter 2000ms linear both;
+  animation: anim-slide-elastic-center 2000ms linear both;
 }
 
-@keyframes animSlideElasticCenter {
+@keyframes anim-slide-elastic-center {
   0% {
     transform: matrix3d(1, 0, 0, 0, 0, 3, 0, 0, 0, 0, 1, 0, 0, -300, 0, 1);
   }
@@ -887,11 +884,11 @@
 }
 
 .ns-effect-slide-center.ns-hide {
-  animation-name: animSlideCenter;
+  animation-name: anim-slide-center;
   animation-duration: 0.25s;
 }
 
-@keyframes animSlideCenter {
+@keyframes anim-slide-center {
   0% {
     transform: translate3d(0, -30px, 0) translate3d(0, -100%, 0);
   }
@@ -903,11 +900,11 @@
 
 .ns-effect-genie.ns-show,
 .ns-effect-genie.ns-hide {
-  animation-name: animGenie;
+  animation-name: anim-genie;
   animation-duration: 0.4s;
 }
 
-@keyframes animGenie {
+@keyframes anim-genie {
   0% {
     opacity: 0;
     transform: translate3d(0, calc(200% + 30px), 0) scale3d(0, 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,20 @@
+{% 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,7 @@
+{% 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

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

modules/default/alert/translations/da.json

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

modules/default/alert/translations/de.json

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

modules/default/alert/translations/en.json

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

modules/default/alert/translations/es.json

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

modules/default/alert/translations/fr.json

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

modules/default/alert/translations/hu.json

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

modules/default/alert/translations/nl.json

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

modules/default/alert/translations/ru.json

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

modules/default/alert/translations/th.json

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

modules/default/calendar/README.md

@@ -1,6 +1,6 @@
 # Module: Calendar
 
-The `calendar` module is one of the default modules of the MagicMirror.
+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

@@ -14,6 +14,7 @@
 .calendar .title {
   padding-left: 0;
   padding-right: 0;
+  vertical-align: top;
 }
 
 .calendar .time {

modules/default/calendar/calendarfetcher.js

@@ -1,16 +1,8 @@
-/* Magic Mirror
- * Node Helper: Calendar - CalendarFetcher
- *
- * By Michael Teeuw https://michaelteeuw.nl
- * MIT Licensed.
- */
-const CalendarUtils = require("./calendarutils");
+const https = require("node:https");
+const ical = require("node-ical");
 const Log = require("logger");
 const NodeHelper = require("node_helper");
-const ical = require("node-ical");
-const fetch = require("node-fetch");
-const digest = require("digest-fetch");
-const https = require("https");
+const CalendarFetcherUtils = require("./calendarfetcherutils");
 
 /**
  *
@@ -38,10 +30,9 @@ const CalendarFetcher = function (url, reloadInterval, excludedEvents, maximumEn
 		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 + " (https://github.com/MichMich/MagicMirror/)"
+			"User-Agent": `Mozilla/5.0 (Node.js ${nodeVersion}) MagicMirror/${global.version}`
 		};
 
 		if (selfSignedCert) {
@@ -51,18 +42,13 @@ const CalendarFetcher = function (url, reloadInterval, excludedEvents, maximumEn
 		}
 		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 });
+				headers.Authorization = `Bearer ${auth.pass}`;
 			} else {
-				headers.Authorization = "Basic " + Buffer.from(auth.user + ":" + auth.pass).toString("base64");
+				headers.Authorization = `Basic ${Buffer.from(`${auth.user}:${auth.pass}`).toString("base64")}`;
 			}
 		}
-		if (fetcher === null) {
-			fetcher = fetch(url, { headers: headers, agent: httpsAgent });
-		}
 
-		fetcher
+		fetch(url, { headers: headers, agent: httpsAgent })
 			.then(NodeHelper.checkFetchStatus)
 			.then((response) => response.text())
 			.then((responseData) => {
@@ -70,8 +56,8 @@ const CalendarFetcher = function (url, reloadInterval, excludedEvents, maximumEn
 
 				try {
 					data = ical.parseICS(responseData);
-					Log.debug("parsed data=" + JSON.stringify(data));
-					events = CalendarUtils.filterEvents(data, {
+					Log.debug(`parsed data=${JSON.stringify(data)}`);
+					events = CalendarFetcherUtils.filterEvents(data, {
 						excludedEvents,
 						includePastEvents,
 						maximumEntries,
@@ -114,13 +100,12 @@ const CalendarFetcher = function (url, reloadInterval, excludedEvents, maximumEn
 	 * Broadcast the existing events.
 	 */
 	this.broadcastEvents = function () {
-		Log.info("Calendar-Fetcher: Broadcasting " + events.length + " events.");
+		Log.info(`Calendar-Fetcher: Broadcasting ${events.length} events from ${url}.`);
 		eventsReceivedCallback(this);
 	};
 
 	/**
 	 * Sets the on success callback
-	 *
 	 * @param {Function} callback The on success callback.
 	 */
 	this.onReceive = function (callback) {
@@ -129,7 +114,6 @@ const CalendarFetcher = function (url, reloadInterval, excludedEvents, maximumEn
 
 	/**
 	 * Sets the on error callback
-	 *
 	 * @param {Function} callback The on error callback.
 	 */
 	this.onError = function (callback) {
@@ -138,7 +122,6 @@ const CalendarFetcher = function (url, reloadInterval, excludedEvents, maximumEn
 
 	/**
 	 * Returns the url of this fetcher.
-	 *
 	 * @returns {string} The url of this fetcher.
 	 */
 	this.url = function () {
@@ -147,7 +130,6 @@ const CalendarFetcher = function (url, reloadInterval, excludedEvents, maximumEn
 
 	/**
 	 * Returns current available events for this fetcher.
-	 *
 	 * @returns {object[]} The current available events for this fetcher.
 	 */
 	this.events = function () {

modules/default/calendar/calendarfetcherutils.js

@@ -0,0 +1,585 @@
+/**
+ * @external Moment
+ */
+const path = require("node: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 (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 = 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 (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]).startOf("day") : moment(event[time]);
+		};
+
+		Log.debug(`There are ${Object.entries(data).length} calendar entries.`);
+
+		const now = new Date(Date.now());
+		const todayLocal = moment(now).startOf("day").toDate();
+		const futureLocalDate
+			= moment(now)
+				.startOf("day")
+				.add(config.maximumNumberOfDays, "days")
+				.subtract(1, "seconds") // Subtract 1 second so that events that start on the middle of the night will not repeat.
+				.toDate();
+
+		Object.entries(data).forEach(([key, event]) => {
+			Log.debug("Processing entry...");
+			let pastLocalDate = todayLocal;
+
+			if (config.includePastEvents) {
+				pastLocalDate = moment(now).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 startMoment = eventDate(event, "start");
+				let endMoment;
+
+				if (typeof event.end !== "undefined") {
+					endMoment = eventDate(event, "end");
+				} else if (typeof event.duration !== "undefined") {
+					endMoment = startMoment.clone().add(moment.duration(event.duration));
+				} else {
+					if (!isFacebookBirthday) {
+						// make copy of start date, separate storage area
+						endMoment = moment(startMoment.valueOf());
+					} else {
+						endMoment = moment(startMoment).add(1, "days");
+					}
+				}
+
+				Log.debug(`start: ${startMoment.toDate()}`);
+				Log.debug(`end:: ${endMoment.toDate()}`);
+
+				// Calculate the duration of the event for use with recurring events.
+				const durationMs = endMoment.valueOf() - startMoment.valueOf();
+				Log.debug(`duration: ${durationMs}`);
+
+				// FIXME: Since the parsed json object from node-ical comes with time information
+				// this check could be removed (?)
+				if (event.start.length === 8) {
+					startMoment = startMoment.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 (event.rrule && typeof event.rrule !== "undefined" && !isFacebookBirthday) {
+					const rule = event.rrule;
+
+					const pastMoment = moment(pastLocalDate);
+					const futureMoment = moment(futureLocalDate);
+
+					// 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;
+					let futureLocal;
+					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(now).toDate(); //now
+						}
+						futureLocal = futureMoment.toDate(); // future
+					}
+					Log.debug(`Search for recurring events between: ${pastLocal} and ${futureLocal}`);
+					const hasByWeekdayRule = rule.options.byweekday !== undefined && rule.options.byweekday !== null;
+					const oneDayInMs = 24 * 60 * 60 * 1000;
+					Log.debug(`RRule: ${rule.toString()}`);
+					rule.options.tzid = null; // RRule gets *very* confused with timezones
+					let dates = rule.between(new Date(pastLocal.valueOf() - oneDayInMs), new Date(futureLocal.valueOf() + oneDayInMs), true, () => { return true; });
+					Log.debug(`Title: ${event.summary}, with dates: ${JSON.stringify(dates)}`);
+					dates = dates.filter((d) => {
+						if (JSON.stringify(d) === "null") return false;
+						else return true;
+					});
+
+					// RRule can generate dates with an incorrect recurrence date. Process the array here and apply date correction.
+					if (hasByWeekdayRule) {
+						Log.debug("Rule has byweekday, checking for correction");
+						dates.forEach((date, index, arr) => {
+							// NOTE: getTimezoneOffset() is negative of the expected value. For America/Los_Angeles under DST (GMT-7),
+							// this value is +420. For Australia/Sydney under DST (GMT+11), this value is -660.
+							const tzOffset = date.getTimezoneOffset() / 60;
+							const hour = date.getHours();
+							if ((tzOffset < 0) && (hour < -tzOffset)) { // east of GMT
+								Log.debug(`East of GMT (tzOffset: ${tzOffset}) and hour=${hour} < ${-tzOffset}, Subtracting 1 day from ${date}`);
+								arr[index] = new Date(date.valueOf() - oneDayInMs);
+							} else if ((tzOffset > 0) && (hour >= (24 - tzOffset))) { // west of GMT
+								Log.debug(`West of GMT (tzOffset: ${tzOffset}) and hour=${hour} >= 24-${tzOffset}, Adding 1 day to ${date}`);
+								arr[index] = new Date(date.valueOf() + oneDayInMs);
+							}
+						});
+						// Adjusting the dates could push it beyond the 'until' date, so filter those out here.
+						if (rule.options.until !== null) {
+							dates = dates.filter((date) => {
+								return date.valueOf() <= rule.options.until.valueOf();
+							});
+						}
+					}
+
+					// The dates array from rrule can be confused by DST. If the event was created during DST and we
+					// are querying a date range during non-DST, rrule can have the incorrect time for the date range.
+					// Reprocess the array here computing and applying the time offset.
+					dates.forEach((date, index, arr) => {
+						let adjustHours = CalendarFetcherUtils.calculateTimezoneAdjustment(event, date);
+						if (adjustHours !== 0) {
+							Log.debug(`Applying timezone adjustment hours=${adjustHours} to ${date}`);
+							arr[index] = new Date(date.valueOf() + (adjustHours * 60 * 60 * 1000));
+						}
+					});
+
+					// 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 dateKey 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.
+							let d = new Date(dateKey);
+							if (!moment(d).isBetween(pastMoment, futureMoment)) {
+								dates.push(d);
+							}
+						}
+					}
+
+					// Lastly, sometimes rrule doesn't include the event.start even if it is in the requested range. Ensure
+					// inclusion here. Unfortunately dates.includes() doesn't find it so we have to do forEach().
+					{
+						let found = false;
+						dates.forEach((d) => { if (d.valueOf() === event.start.valueOf()) found = true; });
+						if (!found) {
+							Log.debug(`event.start=${event.start} was not included in results from rrule; adding`);
+							dates.splice(0, 0, event.start);
+						}
+					}
+
+					// 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];
+						let curEvent = event;
+						let curDurationMs = durationMs;
+						let showRecurrence = true;
+
+						startMoment = moment(date);
+
+						// 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/).
+						// This must be done after `date` is adjusted
+						const dateKey = date.toISOString().substring(0, 10);
+
+						// 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];
+							startMoment = moment(curEvent.start);
+							curDurationMs = curEvent.end.valueOf() - startMoment.valueOf();
+						}
+						// 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: ${curDurationMs}`);
+
+						endMoment = moment(startMoment.valueOf() + curDurationMs);
+						if (startMoment.valueOf() === endMoment.valueOf()) {
+							endMoment = endMoment.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 (endMoment.isBefore(pastLocal) || startMoment.isAfter(futureLocal)) {
+							showRecurrence = false;
+						}
+
+						if (CalendarFetcherUtils.timeFilterApplies(now, endMoment, dateFilter)) {
+							showRecurrence = false;
+						}
+
+						if (showRecurrence === true) {
+							Log.debug(`saving event: ${description}`);
+							newEvents.push({
+								title: recurrenceTitle,
+								startDate: startMoment.format("x"),
+								endDate: endMoment.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 && startMoment.valueOf() === endMoment.valueOf()) {
+						endMoment = endMoment.endOf("day");
+					}
+
+					if (config.includePastEvents) {
+						// Past event is too far in the past, so skip.
+						if (endMoment < pastLocalDate) {
+							return;
+						}
+					} else {
+						// It's not a fullday event, and it is in the past, so skip.
+						if (!fullDayEvent && endMoment < now) {
+							return;
+						}
+
+						// It's a fullday event, and it is before today, So skip.
+						if (fullDayEvent && endMoment <= todayLocal) {
+							return;
+						}
+					}
+
+					// It exceeds the maximumNumberOfDays limit, so skip.
+					if (startMoment > futureLocalDate) {
+						return;
+					}
+
+					if (CalendarFetcherUtils.timeFilterApplies(now, endMoment, dateFilter)) {
+						return;
+					}
+
+					// get correction for date saving and dst change between now and then
+					let adjustHours = CalendarFetcherUtils.calculateTimezoneAdjustment(event, startMoment.toDate());
+					// This shouldn't happen
+					if (adjustHours) {
+						Log.warn(`Unexpected timezone adjustment of ${adjustHours} hours on non-recurring event`);
+					}
+					// Every thing is good. Add it to the list.
+					newEvents.push({
+						title: title,
+						startDate: startMoment.add(adjustHours, "hours").format("x"),
+						endDate: endMoment.add(adjustHours, "hours").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 (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 (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 (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 (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.toDate();
+		}
+
+		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 (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

@@ -1,620 +1,125 @@
-/* Magic Mirror
- * Calendar Util Methods
- *
- * By Michael Teeuw https://michaelteeuw.nl
- * MIT Licensed.
- */
-
-/**
- * @external Moment
- */
-const moment = require("moment");
-const path = require("path");
-const zoneTable = require(path.join(__dirname, "windowsZones.json"));
-const Log = require("../../../js/logger.js");
-
 const CalendarUtils = {
+
 	/**
-	 * 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 adjustement
-	 * @param {Date} date the date on which this event happens
-	 * @returns {number} the necessary adjustment in hours
+	 * Capitalize the first letter of a string
+	 * @param {string} string The string to capitalize
+	 * @returns {string} The capitalized string
 	 */
-	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 = CalendarUtils.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;
+	capFirst (string) {
+		return string.charAt(0).toUpperCase() + string.slice(1);
 	},
 
 	/**
-	 * 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
+	 * 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
 	 */
-	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 CalendarUtils.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();
+	getLocaleSpecification (timeFormat) {
+		switch (timeFormat) {
+			case 12: {
+				return { longDateFormat: { LT: "h:mm A" } };
 			}
-
-			// 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;
-				}
+			case 24: {
+				return { longDateFormat: { LT: "HH:mm" } };
 			}
+			default: {
+				return { longDateFormat: { LT: moment.localeData().longDateFormat("LT") } };
+			}
+		}
+	},
 
-			if (event.type === "VEVENT") {
-				Log.debug("\nEvent: " + JSON.stringify(event));
-				let startDate = eventDate(event, "start");
-				let endDate;
+	/**
+	 * 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 (string, maxLength, wrapEvents, maxTitleLines) {
+		if (typeof string !== "string") {
+			return "";
+		}
 
-				if (typeof event.end !== "undefined") {
-					endDate = eventDate(event, "end");
-				} else if (typeof event.duration !== "undefined") {
-					endDate = startDate.clone().add(moment.duration(event.duration));
+		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 {
-					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("startDate (local): " + startDate.toDate());
-				Log.debug("endDate (local): " + 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 = CalendarUtils.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 (CalendarUtils.titleFilterApplies(testTitle, filter, useRegex, regexFlags)) {
-						if (until) {
-							dateFilter = until;
-						} else {
-							excluded = true;
+					line++;
+					if (line > maxTitleLines - 1) {
+						if (i < words.length) {
+							currentLine += "…";
 						}
 						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 (CalendarUtils.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);
+					if (currentLine.length > 0) {
+						temp += `${currentLine}<br>${word} `;
 					} 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
+						temp += `${word}<br>`;
 					}
-					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 (CalendarUtils.isFullDayEvent(event)) {
-							Log.debug("Fullday");
-							// If the offset is negative (east of GMT), where the problem is
-							if (dateoffset < 0) {
-								// Remove the offset, independently of the comparison between the date hour and the offset,
-								// since in the case that *date houre < offset*, the *new Date* command will handle this by
-								// representing the day before.
-
-								// Reduce the time by the offset:
-								// Apply the correction to the date/time to get it UTC relative
-								date = new Date(date.getTime() - Math.abs(nowOffset) * 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)) {
-										// 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);
-									}
-								}
-							}
-						} 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)) {
-									// Reduce the time by the offset:
-									// Apply the correction to the date/time to get it UTC relative
-									date = new Date(date.getTime() - Math.abs(nowOffset) * 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)) {
-										// 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 (local): " + startDate.toDate());
-
-						let adjustDays = CalendarUtils.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 = CalendarUtils.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 (CalendarUtils.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: CalendarUtils.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 : CalendarUtils.isFullDayEvent(event);
-					// Log.debug("full day event")
-
-					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 (CalendarUtils.timeFilterApplies(now, endDate, dateFilter)) {
-						return;
-					}
-
-					// Adjust start date so multiple day events will be displayed as happening today even though they started some days ago already
-					if (fullDayEvent && startDate <= today) {
-						startDate = moment(today);
-					}
-					// 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");
-					}
-					// get correction for date saving and dst change between now and then
-					let adjustDays = CalendarUtils.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
-					});
+					currentLine = "";
 				}
 			}
-		});
 
-		newEvents.sort(function (a, b) {
-			return a.startDate - b.startDate;
-		});
-
-		// include up to maximumEntries current or upcoming events
-		// If past events should be included, include all past events
-		const now = moment();
-		let entries = 0;
-		let events = [];
-		for (let ne of newEvents) {
-			if (moment(ne.endDate, "x").isBefore(now)) {
-				if (config.includePastEvents) events.push(ne);
-				continue;
-			}
-			entries++;
-			// If max events has been saved, skip the rest
-			if (entries > config.maximumEntries) break;
-			events.push(ne);
-		}
-
-		return events;
-	},
-
-	/**
-	 * 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) {
-			// Assume if leading slash, there is also trailing slash
-			if (filter[0] === "/") {
-				// Strip leading and trailing slashes
-				filter = filter.substr(1).slice(0, -1);
-			}
-
-			filter = new RegExp(filter, regexFlags);
-
-			return filter.test(title);
+			return (temp + currentLine).trim();
 		} else {
-			return title.includes(filter);
+			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.
+	 * @param {string} title The title to transform.
+	 * @param {object} titleReplace object definition of parts to be replaced in the title
+	 *                 object definition:
+	 *                    search: {string,required} RegEx in format //x or simple string to be searched. For (birthday) year calcluation, the element matching the year must be in a RegEx group
+	 *                    replace: {string,required} Replacement string, may contain match group references (latter is required for year calculation)
+	 *                    yearmatchgroup: {number,optional} match group for year element
+	 * @returns {string} The transformed title.
+	 */
+	titleTransform (title, titleReplace) {
+		let transformedTitle = title;
+		for (let tr in titleReplace) {
+			let transform = titleReplace[tr];
+			if (typeof transform === "object") {
+				if (typeof transform.search !== "undefined" && transform.search !== "" && typeof transform.replace !== "undefined") {
+					let regParts = transform.search.match(/^\/(.+)\/([gim]*)$/);
+					let needle = new RegExp(transform.search, "g");
+					if (regParts) {
+						// the parsed pattern is a regexp with flags.
+						needle = new RegExp(regParts[1], regParts[2]);
+					}
+
+					let replacement = transform.replace;
+					if (typeof transform.yearmatchgroup !== "undefined" && transform.yearmatchgroup !== "") {
+						const yearmatch = [...title.matchAll(needle)];
+						if (yearmatch[0].length >= transform.yearmatchgroup + 1 && yearmatch[0][transform.yearmatchgroup] * 1 >= 1900) {
+							let calcage = new Date().getFullYear() - yearmatch[0][transform.yearmatchgroup] * 1;
+							let searchstr = `$${transform.yearmatchgroup}`;
+							replacement = replacement.replace(searchstr, calcage);
+						}
+					}
+					transformedTitle = transformedTitle.replace(needle, replacement);
+				}
+			}
+		}
+		return transformedTitle;
 	}
 };
 

modules/default/calendar/debug.js

@@ -1,14 +1,11 @@
 /* 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.
+ * of starting the MagicMirror² core. Adjust the values below to your desire.
  */
 // Alias modules mentioned in package.js under _moduleAliases.
 require("module-alias/register");
 
-const CalendarFetcher = require("./calendarfetcher.js");
+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)

modules/default/calendar/node_helper.js

@@ -1,31 +1,32 @@
-/* Magic Mirror
- * Node Helper: Calendar
- *
- * By Michael Teeuw https://michaelteeuw.nl
- * MIT Licensed.
- */
 const NodeHelper = require("node_helper");
-const CalendarFetcher = require("./calendarfetcher.js");
 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);
+	start () {
+		Log.log(`Starting node helper for: ${this.name}`);
 		this.fetchers = [];
 	},
 
 	// Override socketNotificationReceived method.
-	socketNotificationReceived: function (notification, payload) {
+	socketNotificationReceived (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.
@@ -36,7 +37,7 @@ module.exports = NodeHelper.create({
 	 * @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) {
+	createFetcher (url, fetchInterval, excludedEvents, maximumEntries, maximumNumberOfDays, auth, broadcastPastEvents, selfSignedCert, identifier) {
 		try {
 			new URL(url);
 		} catch (error) {
@@ -46,9 +47,14 @@ module.exports = NodeHelper.create({
 		}
 
 		let fetcher;
+		let fetchIntervalCorrected;
 		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);
+			if (fetchInterval < 60000) {
+				Log.warn(`fetchInterval for url ${url} must be >= 60000`);
+				fetchIntervalCorrected = 60000;
+			}
+			Log.log(`Create new calendarfetcher for url: ${url} - Interval: ${fetchIntervalCorrected || fetchInterval}`);
+			fetcher = new CalendarFetcher(url, fetchIntervalCorrected || fetchInterval, excludedEvents, maximumEntries, maximumNumberOfDays, auth, broadcastPastEvents, selfSignedCert);
 
 			fetcher.onReceive((fetcher) => {
 				this.broadcastEvents(fetcher, identifier);
@@ -65,7 +71,7 @@ module.exports = NodeHelper.create({
 
 			this.fetchers[identifier + url] = fetcher;
 		} else {
-			Log.log("Use existing calendarfetcher for url: " + url);
+			Log.log(`Use existing calendarfetcher for url: ${url}`);
 			fetcher = this.fetchers[identifier + url];
 			fetcher.broadcastEvents();
 		}
@@ -78,7 +84,7 @@ module.exports = NodeHelper.create({
 	 * @param {object} fetcher the fetcher associated with the calendar
 	 * @param {string} identifier the identifier of the calendar
 	 */
-	broadcastEvents: function (fetcher, identifier) {
+	broadcastEvents (fetcher, identifier) {
 		this.sendSocketNotification("CALENDAR_EVENTS", {
 			id: identifier,
 			url: fetcher.url(),

modules/default/clock/README.md

@@ -1,6 +1,6 @@
 # Module: Clock
 
-The `clock` module is one of the default modules of the MagicMirror.
+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

@@ -1,11 +1,5 @@
-/* global SunCalc */
+/* global SunCalc, formatTime */
 
-/* Magic Mirror
- * Module: Clock
- *
- * By Michael Teeuw https://michaelteeuw.nl
- * MIT Licensed.
- */
 Module.register("clock", {
 	// Module config defaults.
 	defaults: {
@@ -22,6 +16,7 @@ Module.register("clock", {
 		showTime: true,
 		showWeek: false,
 		dateFormat: "dddd, LL",
+		sendNotifications: false,
 
 		/* specific to the analog clock */
 		analogSize: "200px",
@@ -31,21 +26,21 @@ Module.register("clock", {
 		secondsColor: "#888888",
 
 		showSunTimes: false,
-		showMoonTimes: false,
+		showMoonTimes: false, // options: false, 'times' (rise/set), 'percent' (lit percent), 'phase' (current phase), or 'both' (percent & phase)
 		lat: 47.630539,
 		lon: -122.344147
 	},
 	// Define required scripts.
-	getScripts: function () {
+	getScripts () {
 		return ["moment.js", "moment-timezone.js", "suncalc.js"];
 	},
 	// Define styles.
-	getStyles: function () {
+	getStyles () {
 		return ["clock_styles.css"];
 	},
 	// Define start sequence.
-	start: function () {
-		Log.info("Starting module: " + this.name);
+	start () {
+		Log.info(`Starting module: ${this.name}`);
 
 		// Schedule update interval.
 		this.second = moment().second();
@@ -66,41 +61,44 @@ Module.register("clock", {
 		const notificationTimer = () => {
 			this.updateDom();
 
-			// 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 (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);
 			}
 
-			// 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
+		// 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 () {
+	getDom () {
 		const wrapper = document.createElement("div");
-		wrapper.classList.add("clockGrid");
+		wrapper.classList.add("clock-grid");
 
 		/************************************
 		 * Create wrappers for analog and digital clock
 		 */
 		const analogWrapper = document.createElement("div");
-		analogWrapper.className = "clockCircle";
+		analogWrapper.className = "clock-circle";
 		const digitalWrapper = document.createElement("div");
 		digitalWrapper.className = "digital";
-		digitalWrapper.style.gridArea = "center";
 
 		/************************************
 		 * Create wrappers for DIGITAL clock
@@ -124,7 +122,7 @@ Module.register("clock", {
 		// 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
+		// See issue: https://github.com/MagicMirrorOrg/MagicMirror/issues/181
 		let timeString;
 		const now = moment();
 		if (this.config.timezone) {
@@ -137,9 +135,9 @@ Module.register("clock", {
 		}
 
 		if (this.config.clockBold) {
-			timeString = now.format(hourSymbol + '[<span class="bold">]mm[</span>]');
+			timeString = now.format(`${hourSymbol}[<span class="bold">]mm[</span>]`);
 		} else {
-			timeString = now.format(hourSymbol + ":mm");
+			timeString = now.format(`${hourSymbol}:mm`);
 		}
 
 		if (this.config.showDate) {
@@ -164,21 +162,6 @@ Module.register("clock", {
 			digitalWrapper.appendChild(timeWrapper);
 		}
 
-		/**
-		 * Format the time according to the config
-		 *
-		 * @param {object} config The config of the module
-		 * @param {object} time time to format
-		 * @returns {string} The formatted time string
-		 */
-		function formatTime(config, time) {
-			let formatString = hourSymbol + ":mm";
-			if (config.showPeriod && config.timeFormat !== 24) {
-				formatString += config.showPeriodUpper ? "A" : "a";
-			}
-			return moment(time).format(formatString);
-		}
-
 		/****************************************************************
 		 * Create wrappers for Sun Times, only if specified in config
 		 */
@@ -195,19 +178,11 @@ Module.register("clock", {
 				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="fa fa-sun-o" aria-hidden="true"></i> ' +
-				untilNextEventString +
-				"</span>" +
-				'<span><i class="fa fa-arrow-up" aria-hidden="true"></i> ' +
-				formatTime(this.config, sunTimes.sunrise) +
-				"</span>" +
-				'<span><i class="fa fa-arrow-down" aria-hidden="true"></i> ' +
-				formatTime(this.config, sunTimes.sunset) +
-				"</span>";
+			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);
 		}
 
@@ -226,19 +201,15 @@ Module.register("clock", {
 				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="fa fa-moon-o" aria-hidden="true"></i> ' +
-				illuminatedFractionString +
-				"</span>" +
-				'<span><i class="fa fa-arrow-up" aria-hidden="true"></i> ' +
-				(moonRise ? formatTime(this.config, moonRise) : "...") +
-				"</span>" +
-				'<span><i class="fa fa-arrow-down" aria-hidden="true"></i> ' +
-				(moonSet ? formatTime(this.config, moonSet) : "...") +
-				"</span>";
+			const showFraction = ["both", "percent"].includes(this.config.showMoonTimes);
+			const showUnicode = ["both", "phase"].includes(this.config.showMoonTimes);
+			const illuminatedFractionString = `${Math.round(moonIllumination.fraction * 100)}%`;
+			const image = showUnicode ? [..."🌑🌒🌓🌔🌕🌖🌗🌘"][Math.floor(moonIllumination.phase * 8)] : "<i class=\"fas fa-moon\" aria-hidden=\"true\"></i>";
+
+			moonWrapper.innerHTML
+				= `<span class="${isVisible ? "bright" : ""}">${image} ${showFraction ? 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);
 		}
 
@@ -266,26 +237,26 @@ Module.register("clock", {
 			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.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
+				// The following line solves issue: https://github.com/MagicMirrorOrg/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 = "clockFace";
+			clockFace.className = "clock-face";
 
 			const clockHour = document.createElement("div");
-			clockHour.id = "clockHour";
-			clockHour.style.transform = "rotate(" + hour + "deg)";
-			clockHour.className = "clockHour";
+			clockHour.id = "clock-hour";
+			clockHour.style.transform = `rotate(${hour}deg)`;
+			clockHour.className = "clock-hour";
 			const clockMinute = document.createElement("div");
-			clockMinute.id = "clockMinute";
-			clockMinute.style.transform = "rotate(" + minute + "deg)";
-			clockMinute.className = "clockMinute";
+			clockMinute.id = "clock-minute";
+			clockMinute.style.transform = `rotate(${minute}deg)`;
+			clockMinute.className = "clock-minute";
 
 			// Combine analog wrappers
 			clockFace.appendChild(clockHour);
@@ -293,9 +264,9 @@ Module.register("clock", {
 
 			if (this.config.displaySeconds) {
 				const clockSecond = document.createElement("div");
-				clockSecond.id = "clockSecond";
-				clockSecond.style.transform = "rotate(" + second + "deg)";
-				clockSecond.className = "clockSecond";
+				clockSecond.id = "clock-second";
+				clockSecond.style.transform = `rotate(${second}deg)`;
+				clockSecond.className = "clock-second";
 				clockSecond.style.backgroundColor = this.config.secondsColor;
 				clockFace.appendChild(clockSecond);
 			}
@@ -303,24 +274,29 @@ Module.register("clock", {
 		}
 
 		/*******************************************
-		 * Update placement, respect old analogShowDate even if its not needed anymore
+		 * 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.analogShowDate === "top") {
-				wrapper.classList.add("clockGrid--bottom");
-			} else if (this.config.analogShowDate === "bottom") {
-				wrapper.classList.add("clockGrid--top");
-			} else {
-				//analogWrapper.style.gridArea = "center";
+			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("clockGrid--" + this.config.analogPlacement);
+			wrapper.classList.add(`clock-grid-${this.config.analogPlacement}`);
+			wrapper.appendChild(analogWrapper);
+			wrapper.appendChild(digitalWrapper);
 		}
 
-		wrapper.appendChild(analogWrapper);
-		wrapper.appendChild(digitalWrapper);
-
 		// Return the wrapper to the dom.
 		return wrapper;
 	}

modules/default/clock/clock_styles.css

@@ -1,37 +1,37 @@
-.clockGrid {
+.clock-grid {
   display: inline-flex;
   gap: 15px;
 }
 
-.clockGrid--left {
+.clock-grid-left {
   flex-direction: row;
 }
 
-.clockGrid--right {
+.clock-grid-right {
   flex-direction: row-reverse;
 }
 
-.clockGrid--top {
+.clock-grid-top {
   flex-direction: column;
 }
 
-.clockGrid--bottom {
+.clock-grid-bottom {
   flex-direction: column-reverse;
 }
 
-.clockCircle {
+.clock-circle {
   place-self: center;
   position: relative;
   border-radius: 50%;
   background-size: 100%;
 }
 
-.clockFace {
+.clock-face {
   width: 100%;
   height: 100%;
 }
 
-.clockFace::after {
+.clock-face::after {
   position: absolute;
   top: 50%;
   left: 50%;
@@ -44,7 +44,7 @@
   display: block;
 }
 
-.clockHour {
+.clock-hour {
   width: 0;
   height: 0;
   position: absolute;
@@ -57,7 +57,7 @@
   border-radius: 3px 0 0 3px;
 }
 
-.clockMinute {
+.clock-minute {
   width: 0;
   height: 0;
   position: absolute;
@@ -70,7 +70,7 @@
   border-radius: 3px 0 0 3px;
 }
 
-.clockSecond {
+.clock-second {
   width: 0;
   height: 0;
   position: absolute;

modules/default/compliments/README.md

@@ -1,6 +1,6 @@
 # Module: Compliments
 
-The `compliments` module is one of the default modules of the MagicMirror.
+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

@@ -1,9 +1,3 @@
-/* Magic Mirror
- * Module: Compliments
- *
- * By Michael Teeuw https://michaelteeuw.nl
- * MIT Licensed.
- */
 Module.register("compliments", {
 	// Module config defaults.
 	defaults: {
@@ -22,28 +16,27 @@ Module.register("compliments", {
 		afternoonStartTime: 12,
 		afternoonEndTime: 17,
 		random: true,
-		mockDate: null
+		specialDayUnique: false
 	},
 	lastIndexUsed: -1,
 	// Set currentweather from module
 	currentWeatherType: "",
 
 	// Define required scripts.
-	getScripts: function () {
+	getScripts () {
 		return ["moment.js"];
 	},
 
 	// Define start sequence.
-	start: function () {
-		Log.info("Starting module: " + this.name);
+	async start () {
+		Log.info(`Starting module: ${this.name}`);
 
 		this.lastComplimentIndex = -1;
 
 		if (this.config.remoteFile !== null) {
-			this.complimentFile((response) => {
-				this.config.compliments = JSON.parse(response);
-				this.updateDom();
-			});
+			const response = await this.loadComplimentFile();
+			this.config.compliments = JSON.parse(response);
+			this.updateDom();
 		}
 
 		// Schedule update timer.
@@ -54,12 +47,11 @@ Module.register("compliments", {
 
 	/**
 	 * 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) {
+	randomIndex (compliments) {
+		if (compliments.length <= 1) {
 			return 0;
 		}
 
@@ -80,35 +72,38 @@ Module.register("compliments", {
 
 	/**
 	 * Retrieve an array of compliments for the time of the day.
-	 *
 	 * @returns {string[]} array with compliments for the time of the day.
 	 */
-	complimentArray: function () {
+	complimentArray () {
 		const hour = moment().hour();
-		const date = this.config.mockDate ? this.config.mockDate : moment().format("YYYY-MM-DD");
-		let compliments;
+		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.slice(0);
+			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.slice(0);
+			compliments = [...this.config.compliments.afternoon];
 		} else if (this.config.compliments.hasOwnProperty("evening")) {
-			compliments = this.config.compliments.evening.slice(0);
-		}
-
-		if (typeof compliments === "undefined") {
-			compliments = [];
+			compliments = [...this.config.compliments.evening];
 		}
 
+		// Add compliments based on weather
 		if (this.currentWeatherType in this.config.compliments) {
-			compliments.push.apply(compliments, this.config.compliments[this.currentWeatherType]);
+			Array.prototype.push.apply(compliments, this.config.compliments[this.currentWeatherType]);
 		}
 
-		compliments.push.apply(compliments, this.config.compliments.anytime);
+		// 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)) {
-				compliments.push.apply(compliments, this.config.compliments[entry]);
+				// Only display compliments configured for the day if specialDayUnique is set to true
+				if (this.config.specialDayUnique) {
+					compliments.length = 0;
+				}
+				Array.prototype.push.apply(compliments, this.config.compliments[entry]);
 			}
 		}
 
@@ -117,29 +112,20 @@ Module.register("compliments", {
 
 	/**
 	 * Retrieve a file from the local filesystem
-	 *
-	 * @param {Function} callback Called when the file is retrieved.
+	 * @returns {Promise} Resolved when the file is loaded
 	 */
-	complimentFile: function (callback) {
-		const xobj = new XMLHttpRequest(),
-			isRemote = this.config.remoteFile.indexOf("http://") === 0 || this.config.remoteFile.indexOf("https://") === 0,
-			path = isRemote ? this.config.remoteFile : this.file(this.config.remoteFile);
-		xobj.overrideMimeType("application/json");
-		xobj.open("GET", path, true);
-		xobj.onreadystatechange = function () {
-			if (xobj.readyState === 4 && xobj.status === 200) {
-				callback(xobj.responseText);
-			}
-		};
-		xobj.send(null);
+	async loadComplimentFile () {
+		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
 	 */
-	randomCompliment: function () {
+	getRandomCompliment () {
 		// get the current time of day compliments list
 		const compliments = this.complimentArray();
 		// variable for index to next message to display
@@ -158,38 +144,37 @@ Module.register("compliments", {
 	},
 
 	// Override dom generator.
-	getDom: function () {
+	getDom () {
 		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.randomCompliment();
+		const complimentText = this.getRandomCompliment();
 		// split it into parts on newline text
 		const parts = complimentText.split("\n");
-		// create a span to hold it all
+		// 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) {
-			// create a text element for each part
-			compliment.appendChild(document.createTextNode(part));
-			// add a break `
-			compliment.appendChild(document.createElement("BR"));
+			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);
 		}
-		// remove the last break
-		compliment.lastElementChild.remove();
-		wrapper.appendChild(compliment);
-
 		return wrapper;
 	},
 
-	// From data currentweather set weather type
-	setCurrentWeatherType: function (type) {
-		this.currentWeatherType = type;
-	},
-
 	// Override notification handler.
-	notificationReceived: function (notification, payload, sender) {
+	notificationReceived (notification, payload, sender) {
 		if (notification === "CURRENTWEATHER_TYPE") {
-			this.setCurrentWeatherType(payload.type);
+			this.currentWeatherType = payload.type;
 		}
 	}
 });

modules/default/currentweather/README.md

@@ -1,8 +0,0 @@
-# Module: Current Weather
-
-> :warning: **This module is deprecated in favor of the [weather](https://docs.magicmirror.builders/modules/weather.html) module.**
-
-The `currentweather` module is one of the default modules of the MagicMirror.
-This module displays the current weather, including the windspeed, the sunset or sunrise time, the temperature and an icon to display the current conditions.
-
-For configuration options, please check the [MagicMirror² documentation](https://docs.magicmirror.builders/modules/currentweather.html).

modules/default/currentweather/currentweather.css

@@ -1,15 +0,0 @@
-.currentweather .weathericon,
-.currentweather .fa-home {
-  font-size: 75%;
-  line-height: 65px;
-  display: inline-block;
-  transform: translate(0, -3px);
-}
-
-.currentweather .humidityIcon {
-  padding-right: 4px;
-}
-
-.currentweather .humidity-padding {
-  padding-bottom: 6px;
-}

modules/default/currentweather/currentweather.js

@@ -1,600 +0,0 @@
-/* eslint-disable */
-
-/* Magic Mirror
- * Module: CurrentWeather
- *
- * By Michael Teeuw https://michaelteeuw.nl
- * MIT Licensed.
- *
- * This module is deprecated. Any additional feature will no longer be merged.
- */
-Module.register("currentweather", {
-	// Default module config.
-	defaults: {
-		location: false,
-		locationID: false,
-		appid: "",
-		units: config.units,
-		updateInterval: 10 * 60 * 1000, // every 10 minutes
-		animationSpeed: 1000,
-		timeFormat: config.timeFormat,
-		showPeriod: true,
-		showPeriodUpper: false,
-		showWindDirection: true,
-		showWindDirectionAsArrow: false,
-		useBeaufort: true,
-		useKMPHwind: false,
-		lang: config.language,
-		decimalSymbol: ".",
-		showHumidity: false,
-		showSun: true,
-		degreeLabel: false,
-		showIndoorTemperature: false,
-		showIndoorHumidity: false,
-		showFeelsLike: true,
-
-		initialLoadDelay: 0, // 0 seconds delay
-		retryDelay: 2500,
-
-		apiVersion: "2.5",
-		apiBase: "https://api.openweathermap.org/data/",
-		weatherEndpoint: "weather",
-
-		appendLocationNameToHeader: true,
-		useLocationAsHeader: false,
-
-		calendarClass: "calendar",
-		tableClass: "large",
-
-		onlyTemp: false,
-		hideTemp: false,
-		roundTemp: false,
-
-		iconTable: {
-			"01d": "day-sunny",
-			"02d": "day-cloudy",
-			"03d": "cloudy",
-			"04d": "cloudy-windy",
-			"09d": "showers",
-			"10d": "rain",
-			"11d": "thunderstorm",
-			"13d": "snow",
-			"50d": "fog",
-			"01n": "night-clear",
-			"02n": "night-cloudy",
-			"03n": "night-cloudy",
-			"04n": "night-cloudy",
-			"09n": "night-showers",
-			"10n": "night-rain",
-			"11n": "night-thunderstorm",
-			"13n": "night-snow",
-			"50n": "night-alt-cloudy-windy"
-		}
-	},
-
-	// create a variable for the first upcoming calendar event. Used if no location is specified.
-	firstEvent: false,
-
-	// create a variable to hold the location name based on the API result.
-	fetchedLocationName: "",
-
-	// Define required scripts.
-	getScripts: function () {
-		return ["moment.js"];
-	},
-
-	// Define required scripts.
-	getStyles: function () {
-		return ["weather-icons.css", "currentweather.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.windSpeed = null;
-		this.windDirection = null;
-		this.windDeg = null;
-		this.sunriseSunsetTime = null;
-		this.sunriseSunsetIcon = null;
-		this.temperature = null;
-		this.indoorTemperature = null;
-		this.indoorHumidity = null;
-		this.weatherType = null;
-		this.feelsLike = null;
-		this.loaded = false;
-		this.scheduleUpdate(this.config.initialLoadDelay);
-	},
-
-	// add extra information of current weather
-	// windDirection, humidity, sunrise and sunset
-	addExtraInfoWeather: function (wrapper) {
-		var small = document.createElement("div");
-		small.className = "normal medium";
-
-		var windIcon = document.createElement("span");
-		windIcon.className = "wi wi-strong-wind dimmed";
-		small.appendChild(windIcon);
-
-		var windSpeed = document.createElement("span");
-		windSpeed.innerHTML = " " + this.windSpeed;
-		small.appendChild(windSpeed);
-
-		if (this.config.showWindDirection) {
-			var windDirection = document.createElement("sup");
-			if (this.config.showWindDirectionAsArrow) {
-				if (this.windDeg !== null) {
-					windDirection.innerHTML = ' &nbsp;<i class="fa fa-long-arrow-down" style="transform:rotate(' + this.windDeg + 'deg);"></i>&nbsp;';
-				}
-			} else {
-				windDirection.innerHTML = " " + this.translate(this.windDirection);
-			}
-			small.appendChild(windDirection);
-		}
-		var spacer = document.createElement("span");
-		spacer.innerHTML = "&nbsp;";
-		small.appendChild(spacer);
-
-		if (this.config.showHumidity) {
-			var humidity = document.createElement("span");
-			humidity.innerHTML = this.humidity;
-
-			var supspacer = document.createElement("sup");
-			supspacer.innerHTML = "&nbsp;";
-
-			var humidityIcon = document.createElement("sup");
-			humidityIcon.className = "wi wi-humidity humidityIcon";
-			humidityIcon.innerHTML = "&nbsp;";
-
-			small.appendChild(humidity);
-			small.appendChild(supspacer);
-			small.appendChild(humidityIcon);
-		}
-
-		if (this.config.showSun) {
-			var sunriseSunsetIcon = document.createElement("span");
-			sunriseSunsetIcon.className = "wi dimmed " + this.sunriseSunsetIcon;
-			small.appendChild(sunriseSunsetIcon);
-
-			var sunriseSunsetTime = document.createElement("span");
-			sunriseSunsetTime.innerHTML = " " + this.sunriseSunsetTime;
-			small.appendChild(sunriseSunsetTime);
-		}
-
-		wrapper.appendChild(small);
-	},
-
-	// Override dom generator.
-	getDom: function () {
-		var wrapper = document.createElement("div");
-		wrapper.className = this.config.tableClass;
-
-		if (this.config.appid === "") {
-			wrapper.innerHTML = "Please set the correct openweather <i>appid</i> in the config for module: " + this.name + ".";
-			wrapper.className = "dimmed light small";
-			return wrapper;
-		}
-
-		if (!this.loaded) {
-			wrapper.innerHTML = this.translate("LOADING");
-			wrapper.className = "dimmed light small";
-			return wrapper;
-		}
-
-		if (this.config.onlyTemp === false) {
-			this.addExtraInfoWeather(wrapper);
-		}
-
-		var large = document.createElement("div");
-		large.className = "light";
-
-		var degreeLabel = "";
-		if (this.config.units === "metric" || this.config.units === "imperial") {
-			degreeLabel += "°";
-		}
-		if (this.config.degreeLabel) {
-			switch (this.config.units) {
-				case "metric":
-					degreeLabel += "C";
-					break;
-				case "imperial":
-					degreeLabel += "F";
-					break;
-				case "default":
-					degreeLabel += "K";
-					break;
-			}
-		}
-
-		if (this.config.decimalSymbol === "") {
-			this.config.decimalSymbol = ".";
-		}
-
-		if (this.config.hideTemp === false) {
-			var weatherIcon = document.createElement("span");
-			weatherIcon.className = "wi weathericon wi-" + this.weatherType;
-			large.appendChild(weatherIcon);
-
-			var temperature = document.createElement("span");
-			temperature.className = "bright";
-			temperature.innerHTML = " " + this.temperature.replace(".", this.config.decimalSymbol) + degreeLabel;
-			large.appendChild(temperature);
-		}
-
-		if (this.config.showIndoorTemperature && this.indoorTemperature) {
-			var indoorIcon = document.createElement("span");
-			indoorIcon.className = "fa fa-home";
-			large.appendChild(indoorIcon);
-
-			var indoorTemperatureElem = document.createElement("span");
-			indoorTemperatureElem.className = "bright";
-			indoorTemperatureElem.innerHTML = " " + this.indoorTemperature.replace(".", this.config.decimalSymbol) + degreeLabel;
-			large.appendChild(indoorTemperatureElem);
-		}
-
-		if (this.config.showIndoorHumidity && this.indoorHumidity) {
-			var indoorHumidityIcon = document.createElement("span");
-			indoorHumidityIcon.className = "fa fa-tint";
-			large.appendChild(indoorHumidityIcon);
-
-			var indoorHumidityElem = document.createElement("span");
-			indoorHumidityElem.className = "bright";
-			indoorHumidityElem.innerHTML = " " + this.indoorHumidity + "%";
-			large.appendChild(indoorHumidityElem);
-		}
-
-		wrapper.appendChild(large);
-
-		if (this.config.showFeelsLike && this.config.onlyTemp === false) {
-			var small = document.createElement("div");
-			small.className = "normal medium";
-
-			var feelsLike = document.createElement("span");
-			feelsLike.className = "dimmed";
-			feelsLike.innerHTML = this.translate("FEELS", {
-				DEGREE: this.feelsLike + degreeLabel
-			});
-			small.appendChild(feelsLike);
-
-			wrapper.appendChild(small);
-		}
-
-		return wrapper;
-	},
-
-	// Override getHeader method.
-	getHeader: function () {
-		if (this.config.useLocationAsHeader && this.config.location !== false) {
-			return this.config.location;
-		}
-
-		if (this.config.appendLocationNameToHeader) {
-			if (this.data.header) return this.data.header + " " + this.fetchedLocationName;
-			else return this.fetchedLocationName;
-		}
-
-		return this.data.header ? this.data.header : "";
-	},
-
-	// Override notification handler.
-	notificationReceived: function (notification, payload, sender) {
-		if (notification === "DOM_OBJECTS_CREATED") {
-			if (this.config.appendLocationNameToHeader) {
-				this.hide(0, { lockString: this.identifier });
-			}
-		}
-		if (notification === "CALENDAR_EVENTS") {
-			var senderClasses = sender.data.classes.toLowerCase().split(" ");
-			if (senderClasses.indexOf(this.config.calendarClass.toLowerCase()) !== -1) {
-				this.firstEvent = false;
-
-				for (var e in payload) {
-					var event = payload[e];
-					if (event.location || event.geo) {
-						this.firstEvent = event;
-						//Log.log("First upcoming event with location: ", event);
-						break;
-					}
-				}
-			}
-		}
-		if (notification === "INDOOR_TEMPERATURE") {
-			this.indoorTemperature = this.roundValue(payload);
-			this.updateDom(this.config.animationSpeed);
-		}
-		if (notification === "INDOOR_HUMIDITY") {
-			this.indoorHumidity = this.roundValue(payload);
-			this.updateDom(this.config.animationSpeed);
-		}
-	},
-
-	/* updateWeather(compliments)
-	 * Requests new data from openweather.org.
-	 * Calls processWeather on succesfull response.
-	 */
-	updateWeather: function () {
-		if (this.config.appid === "") {
-			Log.error("CurrentWeather: APPID not set!");
-			return;
-		}
-
-		var url = this.config.apiBase + this.config.apiVersion + "/" + this.config.weatherEndpoint + this.getParams();
-		var self = this;
-		var retry = true;
-
-		var weatherRequest = new XMLHttpRequest();
-		weatherRequest.open("GET", url, true);
-		weatherRequest.onreadystatechange = function () {
-			if (this.readyState === 4) {
-				if (this.status === 200) {
-					self.processWeather(JSON.parse(this.response));
-				} else if (this.status === 401) {
-					self.updateDom(self.config.animationSpeed);
-
-					Log.error(self.name + ": Incorrect APPID.");
-					retry = true;
-				} else {
-					Log.error(self.name + ": Could not load weather.");
-				}
-
-				if (retry) {
-					self.scheduleUpdate(self.loaded ? -1 : self.config.retryDelay);
-				}
-			}
-		};
-		weatherRequest.send();
-	},
-
-	/* getParams(compliments)
-	 * Generates an url with api parameters based on the config.
-	 *
-	 * return String - URL params.
-	 */
-	getParams: function () {
-		var params = "?";
-		if (this.config.locationID) {
-			params += "id=" + this.config.locationID;
-		} else if (this.config.location) {
-			params += "q=" + this.config.location;
-		} else if (this.firstEvent && this.firstEvent.geo) {
-			params += "lat=" + this.firstEvent.geo.lat + "&lon=" + this.firstEvent.geo.lon;
-		} else if (this.firstEvent && this.firstEvent.location) {
-			params += "q=" + this.firstEvent.location;
-		} else {
-			this.hide(this.config.animationSpeed, { lockString: this.identifier });
-			return;
-		}
-
-		params += "&units=" + this.config.units;
-		params += "&lang=" + this.config.lang;
-		params += "&APPID=" + this.config.appid;
-
-		return params;
-	},
-
-	/* processWeather(data)
-	 * Uses the received data to set the various values.
-	 *
-	 * argument data object - Weather information received form openweather.org.
-	 */
-	processWeather: function (data) {
-		if (!data || !data.main || typeof data.main.temp === "undefined") {
-			// Did not receive usable new data.
-			// Maybe this needs a better check?
-			return;
-		}
-
-		this.humidity = parseFloat(data.main.humidity);
-		this.temperature = this.roundValue(data.main.temp);
-		this.fetchedLocationName = data.name;
-		this.feelsLike = 0;
-
-		if (this.config.useBeaufort) {
-			this.windSpeed = this.ms2Beaufort(this.roundValue(data.wind.speed));
-		} else if (this.config.useKMPHwind) {
-			this.windSpeed = parseFloat((data.wind.speed * 60 * 60) / 1000).toFixed(0);
-		} else {
-			this.windSpeed = parseFloat(data.wind.speed).toFixed(0);
-		}
-
-		// ONLY WORKS IF TEMP IN C //
-		var windInMph = parseFloat(data.wind.speed * 2.23694);
-
-		var tempInF = 0;
-		switch (this.config.units) {
-			case "metric":
-				tempInF = 1.8 * this.temperature + 32;
-				break;
-			case "imperial":
-				tempInF = this.temperature;
-				break;
-			case "default":
-				tempInF = 1.8 * (this.temperature - 273.15) + 32;
-				break;
-		}
-
-		if (windInMph > 3 && tempInF < 50) {
-			// windchill
-			var windChillInF = Math.round(35.74 + 0.6215 * tempInF - 35.75 * Math.pow(windInMph, 0.16) + 0.4275 * tempInF * Math.pow(windInMph, 0.16));
-			var windChillInC = (windChillInF - 32) * (5 / 9);
-			// this.feelsLike = windChillInC.toFixed(0);
-
-			switch (this.config.units) {
-				case "metric":
-					this.feelsLike = windChillInC.toFixed(0);
-					break;
-				case "imperial":
-					this.feelsLike = windChillInF.toFixed(0);
-					break;
-				case "default":
-					this.feelsLike = (windChillInC + 273.15).toFixed(0);
-					break;
-			}
-		} else if (tempInF > 80 && this.humidity > 40) {
-			// heat index
-			var Hindex =
-				-42.379 +
-				2.04901523 * tempInF +
-				10.14333127 * this.humidity -
-				0.22475541 * tempInF * this.humidity -
-				6.83783 * Math.pow(10, -3) * tempInF * tempInF -
-				5.481717 * Math.pow(10, -2) * this.humidity * this.humidity +
-				1.22874 * Math.pow(10, -3) * tempInF * tempInF * this.humidity +
-				8.5282 * Math.pow(10, -4) * tempInF * this.humidity * this.humidity -
-				1.99 * Math.pow(10, -6) * tempInF * tempInF * this.humidity * this.humidity;
-
-			switch (this.config.units) {
-				case "metric":
-					this.feelsLike = parseFloat((Hindex - 32) / 1.8).toFixed(0);
-					break;
-				case "imperial":
-					this.feelsLike = Hindex.toFixed(0);
-					break;
-				case "default":
-					var tc = parseFloat((Hindex - 32) / 1.8) + 273.15;
-					this.feelsLike = tc.toFixed(0);
-					break;
-			}
-		} else {
-			this.feelsLike = parseFloat(this.temperature).toFixed(0);
-		}
-
-		this.windDirection = this.deg2Cardinal(data.wind.deg);
-		this.windDeg = data.wind.deg;
-		this.weatherType = this.config.iconTable[data.weather[0].icon];
-
-		var now = new Date();
-		var sunrise = new Date(data.sys.sunrise * 1000);
-		var sunset = new Date(data.sys.sunset * 1000);
-
-		// 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
-		var sunriseSunsetDateObject = sunrise < now && sunset > now ? sunset : sunrise;
-		var timeString = moment(sunriseSunsetDateObject).format("HH:mm");
-		if (this.config.timeFormat !== 24) {
-			//var hours = sunriseSunsetDateObject.getHours() % 12 || 12;
-			if (this.config.showPeriod) {
-				if (this.config.showPeriodUpper) {
-					//timeString = hours + moment(sunriseSunsetDateObject).format(':mm A');
-					timeString = moment(sunriseSunsetDateObject).format("h:mm A");
-				} else {
-					//timeString = hours + moment(sunriseSunsetDateObject).format(':mm a');
-					timeString = moment(sunriseSunsetDateObject).format("h:mm a");
-				}
-			} else {
-				//timeString = hours + moment(sunriseSunsetDateObject).format(':mm');
-				timeString = moment(sunriseSunsetDateObject).format("h:mm");
-			}
-		}
-
-		this.sunriseSunsetTime = timeString;
-		this.sunriseSunsetIcon = sunrise < now && sunset > now ? "wi-sunset" : "wi-sunrise";
-
-		this.show(this.config.animationSpeed, { lockString: this.identifier });
-		this.loaded = true;
-		this.updateDom(this.config.animationSpeed);
-		this.sendNotification("CURRENTWEATHER_DATA", { data: data });
-		this.sendNotification("CURRENTWEATHER_TYPE", { type: this.config.iconTable[data.weather[0].icon].replace("-", "_") });
-	},
-
-	/* scheduleUpdate()
-	 * Schedule next update.
-	 *
-	 * argument delay number - Milliseconds before next update. If empty, this.config.updateInterval is used.
-	 */
-	scheduleUpdate: function (delay) {
-		var nextLoad = this.config.updateInterval;
-		if (typeof delay !== "undefined" && delay >= 0) {
-			nextLoad = delay;
-		}
-
-		var self = this;
-		setTimeout(function () {
-			self.updateWeather();
-		}, nextLoad);
-	},
-
-	/* ms2Beaufort(ms)
-	 * Converts m2 to beaufort (windspeed).
-	 *
-	 * see:
-	 *  https://www.spc.noaa.gov/faq/tornado/beaufort.html
-	 *  https://en.wikipedia.org/wiki/Beaufort_scale#Modern_scale
-	 *
-	 * argument ms number - Windspeed in m/s.
-	 *
-	 * return number - Windspeed in beaufort.
-	 */
-	ms2Beaufort: function (ms) {
-		var kmh = (ms * 60 * 60) / 1000;
-		var speeds = [1, 5, 11, 19, 28, 38, 49, 61, 74, 88, 102, 117, 1000];
-		for (var beaufort in speeds) {
-			var speed = speeds[beaufort];
-			if (speed > kmh) {
-				return beaufort;
-			}
-		}
-		return 12;
-	},
-
-	deg2Cardinal: function (deg) {
-		if (deg > 11.25 && deg <= 33.75) {
-			return "NNE";
-		} else if (deg > 33.75 && deg <= 56.25) {
-			return "NE";
-		} else if (deg > 56.25 && deg <= 78.75) {
-			return "ENE";
-		} else if (deg > 78.75 && deg <= 101.25) {
-			return "E";
-		} else if (deg > 101.25 && deg <= 123.75) {
-			return "ESE";
-		} else if (deg > 123.75 && deg <= 146.25) {
-			return "SE";
-		} else if (deg > 146.25 && deg <= 168.75) {
-			return "SSE";
-		} else if (deg > 168.75 && deg <= 191.25) {
-			return "S";
-		} else if (deg > 191.25 && deg <= 213.75) {
-			return "SSW";
-		} else if (deg > 213.75 && deg <= 236.25) {
-			return "SW";
-		} else if (deg > 236.25 && deg <= 258.75) {
-			return "WSW";
-		} else if (deg > 258.75 && deg <= 281.25) {
-			return "W";
-		} else if (deg > 281.25 && deg <= 303.75) {
-			return "WNW";
-		} else if (deg > 303.75 && deg <= 326.25) {
-			return "NW";
-		} else if (deg > 326.25 && deg <= 348.75) {
-			return "NNW";
-		} else {
-			return "N";
-		}
-	},
-
-	/* function(temperature)
-	 * Rounds a temperature to 1 decimal or integer (depending on config.roundTemp).
-	 *
-	 * argument temperature number - Temperature.
-	 *
-	 * return string - Rounded Temperature.
-	 */
-	roundValue: function (temperature) {
-		var decimals = this.config.roundTemp ? 0 : 1;
-		var roundValue = parseFloat(temperature).toFixed(decimals);
-		return roundValue === "-0" ? 0 : roundValue;
-	}
-});

modules/default/currentweather/node_helper.js

@@ -1,9 +0,0 @@
-const NodeHelper = require("node_helper");
-const Log = require("logger");
-
-module.exports = NodeHelper.create({
-	// Override start method.
-	start: function () {
-		Log.warn(`The module '${this.name}' is deprecated in favor of the 'weather'-module, please refer to the documentation for a migration path`);
-	}
-});

modules/default/defaultmodules.js

@@ -1,10 +1,7 @@
-/* Magic Mirror Default Modules List
+/* 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", "currentweather", "helloworld", "newsfeed", "weatherforecast", "updatenotification", "weather"];
+const defaultModules = ["alert", "calendar", "clock", "compliments", "helloworld", "newsfeed", "updatenotification", "weather"];
 
 /*************** DO NOT EDIT THE LINE BELOW ***************/
 if (typeof module !== "undefined") {

modules/default/helloworld/README.md

@@ -1,5 +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.
+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

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

modules/default/helloworld/helloworld.njk

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

modules/default/newsfeed/README.md

@@ -1,6 +1,6 @@
 # Module: News Feed
 
-The `newsfeed` module is one of the default modules of the MagicMirror.
+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

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

modules/default/newsfeed/newsfeed.css

@@ -1,5 +1,6 @@
 iframe.newsfeed-fullarticle {
   width: 100vw;
+
   /* very large height value to allow scrolling */
   height: 3000px;
   top: 0;

modules/default/newsfeed/newsfeed.js

@@ -1,9 +1,3 @@
-/* Magic Mirror
- * Module: NewsFeed
- *
- * By Michael Teeuw https://michaelteeuw.nl
- * MIT Licensed.
- */
 Module.register("newsfeed", {
 	// Default module config.
 	defaults: {
@@ -20,6 +14,7 @@ Module.register("newsfeed", {
 		broadcastNewsFeeds: true,
 		broadcastNewsUpdates: true,
 		showDescription: false,
+		showTitleAsUrl: false,
 		wrapTitle: true,
 		wrapDescription: true,
 		truncDescription: true,
@@ -37,21 +32,30 @@ Module.register("newsfeed", {
 		endTags: [],
 		prohibitedWords: [],
 		scrollLength: 500,
-		logFeedWarnings: false
+		logFeedWarnings: false,
+		dangerouslyDisableAutoEscaping: false
+	},
+
+	getUrlPrefix (item) {
+		if (item.useCorsProxy) {
+			return `${location.protocol}//${location.host}/cors?url=`;
+		} else {
+			return "";
+		}
 	},
 
 	// Define required scripts.
-	getScripts: function () {
+	getScripts () {
 		return ["moment.js"];
 	},
 
 	//Define required styles.
-	getStyles: function () {
+	getStyles () {
 		return ["newsfeed.css"];
 	},
 
 	// Define required translations.
-	getTranslations: function () {
+	getTranslations () {
 		// 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.
@@ -59,8 +63,8 @@ Module.register("newsfeed", {
 	},
 
 	// Define start sequence.
-	start: function () {
-		Log.info("Starting module: " + this.name);
+	start () {
+		Log.info(`Starting module: ${this.name}`);
 
 		// Set locale.
 		moment.locale(config.language);
@@ -77,7 +81,7 @@ Module.register("newsfeed", {
 	},
 
 	// Override socket notification handler.
-	socketNotificationReceived: function (notification, payload) {
+	socketNotificationReceived (notification, payload) {
 		if (notification === "NEWS_ITEMS") {
 			this.generateFeed(payload);
 
@@ -97,7 +101,7 @@ Module.register("newsfeed", {
 	},
 
 	//Override fetching of template name
-	getTemplate: function () {
+	getTemplate () {
 		if (this.config.feedUrl) {
 			return "oldconfig.njk";
 		} else if (this.config.showFullArticle) {
@@ -107,28 +111,34 @@ Module.register("newsfeed", {
 	},
 
 	//Override template data and return whats used for the current template
-	getTemplateData: function () {
+	getTemplateData () {
+		if (this.activeItem >= this.newsItems.length) {
+			this.activeItem = 0;
+		}
+		this.activeItemCount = this.newsItems.length;
 		// this.config.showFullArticle is a run-time configuration, triggered by optional notifications
 		if (this.config.showFullArticle) {
+			this.activeItemHash = this.newsItems[this.activeItem]?.hash;
 			return {
 				url: this.getActiveItemURL()
 			};
 		}
 		if (this.error) {
+			this.activeItemHash = undefined;
 			return {
 				error: this.error
 			};
 		}
 		if (this.newsItems.length === 0) {
+			this.activeItemHash = undefined;
 			return {
-				loaded: false
+				empty: true
 			};
 		}
-		if (this.activeItem >= this.newsItems.length) {
-			this.activeItem = 0;
-		}
 
 		const item = this.newsItems[this.activeItem];
+		this.activeItemHash = item.hash;
+
 		const items = this.newsItems.map(function (item) {
 			item.publishDate = moment(new Date(item.pubdate)).fromNow();
 			return item;
@@ -140,19 +150,25 @@ Module.register("newsfeed", {
 			sourceTitle: item.sourceTitle,
 			publishDate: moment(new Date(item.pubdate)).fromNow(),
 			title: item.title,
+			url: this.getActiveItemURL(),
 			description: item.description,
 			items: items
 		};
 	},
 
-	getActiveItemURL: function () {
-		return typeof this.newsItems[this.activeItem].url === "string" ? this.newsItems[this.activeItem].url : this.newsItems[this.activeItem].url.href;
+	getActiveItemURL () {
+		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 () {
+	registerFeeds () {
 		for (let feed of this.config.feeds) {
 			this.sendSocketNotification("ADD_FEED", {
 				feed: feed,
@@ -163,10 +179,9 @@ Module.register("newsfeed", {
 
 	/**
 	 * 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) {
+	generateFeed (feeds) {
 		let newsItems = [];
 		for (let feed in feeds) {
 			const feedItems = feeds[feed];
@@ -184,6 +199,7 @@ Module.register("newsfeed", {
 			const dateB = new Date(b.pubdate);
 			return dateB - dateA;
 		});
+
 		if (this.config.maxNewsItems > 0) {
 			newsItems = newsItems.slice(0, this.config.maxNewsItems);
 		}
@@ -219,7 +235,6 @@ Module.register("newsfeed", {
 			}
 
 			//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) {
@@ -256,11 +271,10 @@ Module.register("newsfeed", {
 
 	/**
 	 * 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) {
+	subscribedToFeed (feedUrl) {
 		for (let feed of this.config.feeds) {
 			if (feed.url === feedUrl) {
 				return true;
@@ -271,11 +285,10 @@ Module.register("newsfeed", {
 
 	/**
 	 * Returns title for the specific feed url.
-	 *
 	 * @param {string} feedUrl Url of the feed
 	 * @returns {string} The title of the feed
 	 */
-	titleForFeed: function (feedUrl) {
+	titleForFeed (feedUrl) {
 		for (let feed of this.config.feeds) {
 			if (feed.url === feedUrl) {
 				return feed.title || "";
@@ -287,7 +300,7 @@ Module.register("newsfeed", {
 	/**
 	 * Schedule visual update.
 	 */
-	scheduleUpdateInterval: function () {
+	scheduleUpdateInterval () {
 		this.updateDom(this.config.animationSpeed);
 
 		// Broadcast NewsFeed if needed
@@ -295,9 +308,31 @@ Module.register("newsfeed", {
 			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);
+
+			/*
+			 * When animations are enabled, don't update the DOM unless we are actually changing what we are displaying.
+			 * (Animating from a headline to itself is unsightly.)
+			 * Cases:
+			 *
+			 * Number of items | Number of items | Display
+			 * at last update  |   right now     | Behaviour
+			 * ----------------------------------------------------
+			 *     0           |      0          | do not update
+			 *     0           |     >0          | update
+			 *     1           |   0 or >1       | update
+			 *     1           |      1          | update only if item details (hash value) changed
+			 *    >1           |    any          | update
+			 *
+			 * (N.B. We set activeItemCount and activeItemHash in getTemplateData().)
+			 */
+			if (this.newsItems.length > 1 || this.newsItems.length !== this.activeItemCount || this.activeItemHash !== this.newsItems[0]?.hash) {
+				this.activeItem++; // this is OK if newsItems.Length==1; getTemplateData will wrap it around
+				this.updateDom(this.config.animationSpeed);
+			}
 
 			// Broadcast NewsFeed if needed
 			if (this.config.broadcastNewsFeeds) {
@@ -306,7 +341,7 @@ Module.register("newsfeed", {
 		}, this.config.updateInterval);
 	},
 
-	resetDescrOrFullArticleAndTimer: function () {
+	resetDescrOrFullArticleAndTimer () {
 		this.isShowingDescription = this.config.showDescription;
 		this.config.showFullArticle = false;
 		this.scrollPosition = 0;
@@ -317,7 +352,7 @@ Module.register("newsfeed", {
 		}
 	},
 
-	notificationReceived: function (notification, payload, sender) {
+	notificationReceived (notification, payload, sender) {
 		const before = this.activeItem;
 		if (notification === "MODULE_DOM_CREATED" && this.config.hideLoading) {
 			this.hide();
@@ -327,7 +362,7 @@ Module.register("newsfeed", {
 				this.activeItem = 0;
 			}
 			this.resetDescrOrFullArticleAndTimer();
-			Log.debug(this.name + " - going from article #" + before + " to #" + this.activeItem + " (of " + this.newsItems.length + ")");
+			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--;
@@ -335,7 +370,7 @@ Module.register("newsfeed", {
 				this.activeItem = this.newsItems.length - 1;
 			}
 			this.resetDescrOrFullArticleAndTimer();
-			Log.debug(this.name + " - going from article #" + before + " to #" + this.activeItem + " (of " + this.newsItems.length + ")");
+			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
@@ -344,8 +379,8 @@ Module.register("newsfeed", {
 			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);
+				Log.debug(`${this.name} - scrolling down`);
+				Log.debug(`${this.name} - ARTICLE_MORE_DETAILS, scroll position: ${this.config.scrollLength}`);
 			} else {
 				this.showFullArticle();
 			}
@@ -353,12 +388,12 @@ Module.register("newsfeed", {
 			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);
+				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");
+			Log.debug(`${this.name} - showing only article titles again`);
 			this.updateDom(100);
 		} else if (notification === "ARTICLE_TOGGLE_FULL") {
 			if (this.config.showFullArticle) {
@@ -378,7 +413,7 @@ Module.register("newsfeed", {
 		}
 	},
 
-	showFullArticle: function () {
+	showFullArticle () {
 		this.isShowingDescription = !this.isShowingDescription;
 		this.config.showFullArticle = !this.isShowingDescription;
 		// make bottom bar align to top to allow scrolling
@@ -387,7 +422,7 @@ Module.register("newsfeed", {
 		}
 		clearInterval(this.timer);
 		this.timer = null;
-		Log.debug(this.name + " - showing " + this.isShowingDescription ? "article description" : "full article");
+		Log.debug(`${this.name} - showing ${this.isShowingDescription ? "article description" : "full article"}`);
 		this.updateDom(100);
 	}
 });

modules/default/newsfeed/newsfeed.njk

@@ -1,3 +1,31 @@
+{% 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">
@@ -6,22 +34,20 @@
                     {% 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 }}:
+                                {{ 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 }}">
-                        {{ item.title }}
+                        {{ 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 %}
-                                {{ item.description | truncate(config.lengthDescription) }}
+                                {{ escapeText(item.description | truncate(config.lengthDescription) , config.dangerouslyDisableAutoEscaping) }}
                             {% else %}
-                                {{ item.description }}
+                                {{ escapeText(item.description, config.dangerouslyDisableAutoEscaping) }}
                             {% endif %}
                         </div>
                     {% endif %}
@@ -33,33 +59,31 @@
             {% if (config.showSourceTitle and sourceTitle) or config.showPublishDate %}
                 <div class="newsfeed-source light small dimmed">
                     {% if sourceTitle and config.showSourceTitle %}
-                        {{ sourceTitle }}{% if config.showPublishDate %}, {% else %}: {% endif %}
-                    {% endif %}
-                    {% if config.showPublishDate %}
-                        {{ publishDate }}:
+                        {{ 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 }}">
-                {{ title }}
+                {{ 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 %}
-                        {{ description | truncate(config.lengthDescription) }}
+                        {{ escapeText(description | truncate(config.lengthDescription) , config.dangerouslyDisableAutoEscaping) }}
                     {% else %}
-                        {{ description }}
+                        {{ 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>
+    <div class="small dimmed">{{ "LOADING" | translate | safe }}</div>
 {% endif %}

modules/default/newsfeed/newsfeedfetcher.js

@@ -1,33 +1,30 @@
-/* Magic Mirror
- * Node Helper: Newsfeed - NewsfeedFetcher
- *
- * By Michael Teeuw https://michaelteeuw.nl
- * MIT Licensed.
- */
-const Log = require("logger");
+const crypto = require("node:crypto");
+const stream = require("node:stream");
 const FeedMe = require("feedme");
-const NodeHelper = require("node_helper");
-const fetch = require("node-fetch");
 const iconv = require("iconv-lite");
+const { htmlToText } = require("html-to-text");
+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) {
+const NewsfeedFetcher = function (url, reloadInterval, encoding, logFeedWarnings, useCorsProxy) {
 	let reloadTimer = null;
 	let items = [];
+	let reloadIntervalMS = reloadInterval;
 
 	let fetchFailedCallback = function () {};
 	let itemsReceivedCallback = function () {};
 
-	if (reloadInterval < 1000) {
-		reloadInterval = 1000;
+	if (reloadIntervalMS < 1000) {
+		reloadIntervalMS = 1000;
 	}
 
 	/* private methods */
@@ -45,31 +42,39 @@ const NewsfeedFetcher = function (url, reloadInterval, encoding, logFeedWarnings
 		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 pubdate = item.pubdate || item.published || item.updated || item["dc:date"] || item["a10:updated"];
 			const url = item.url || item.link || "";
 
 			if (title && pubdate) {
-				const regex = /(<([^>]+)>)/gi;
-				description = description.toString().replace(regex, "");
+				// Convert HTML entities, codes and tag
+				description = htmlToText(description, {
+					wordwrap: false,
+					selectors: [
+						{ selector: "a", options: { ignoreHref: true, noAnchorUrl: true } },
+						{ selector: "br", format: "inlineSurround", options: { prefix: " " } },
+						{ selector: "img", format: "skip" }
+					]
+				});
 
 				items.push({
 					title: title,
 					description: description,
 					pubdate: pubdate,
-					url: url
+					url: url,
+					useCorsProxy: useCorsProxy,
+					hash: crypto.createHash("sha256").update(`${pubdate} :: ${title} :: ${url}`).digest("hex")
 				});
 			} 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);
+				Log.warn(`Title: ${title}`);
+				Log.warn(`Description: ${description}`);
+				Log.warn(`Pubdate: ${pubdate}`);
 			}
 		});
 
 		parser.on("end", () => {
 			this.broadcastItems();
-			scheduleTimer();
 		});
 
 		parser.on("error", (error) => {
@@ -77,9 +82,27 @@ const NewsfeedFetcher = function (url, reloadInterval, encoding, logFeedWarnings
 			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 + " (https://github.com/MichMich/MagicMirror/)",
+			"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"
 		};
@@ -87,7 +110,13 @@ const NewsfeedFetcher = function (url, reloadInterval, encoding, logFeedWarnings
 		fetch(url, { headers: headers })
 			.then(NodeHelper.checkFetchStatus)
 			.then((response) => {
-				response.body.pipe(iconv.decodeStream(encoding)).pipe(parser);
+				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);
@@ -102,19 +131,18 @@ const NewsfeedFetcher = function (url, reloadInterval, encoding, logFeedWarnings
 		clearTimeout(reloadTimer);
 		reloadTimer = setTimeout(function () {
 			fetchNews();
-		}, reloadInterval);
+		}, 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 < reloadInterval) {
-			reloadInterval = interval;
+		if (interval > 1000 && interval < reloadIntervalMS) {
+			reloadIntervalMS = interval;
 		}
 	};
 
@@ -133,7 +161,7 @@ const NewsfeedFetcher = function (url, reloadInterval, encoding, logFeedWarnings
 			Log.info("Newsfeed-Fetcher: No items to broadcast yet.");
 			return;
 		}
-		Log.info("Newsfeed-Fetcher: Broadcasting " + items.length + " items.");
+		Log.info(`Newsfeed-Fetcher: Broadcasting ${items.length} items.`);
 		itemsReceivedCallback(this);
 	};