prevent displaying default wallpaper during load

Author: FreekBes

client/uis/wallpaper.ts

@@ -28,9 +28,8 @@ export class WallpaperUI {
 			this._element.style.backgroundImage = 'url("' + wallpaper.path + '")';
 		}
 		else {
-			// Fall back to black color
-			this._element.style.backgroundColor = 'black';
-			this._element.style.backgroundImage = 'none';
+			// Fall back to default image from CSS vars
+			this._element.style.backgroundImage = window.getComputedStyle(this._element).getPropertyValue('--default-bg-img');
 		}
 
 		return true;

static/css/styles.css

@@ -2,7 +2,7 @@
 	/* Colors can be found in css/dark.css and css/light.css */
 
 	/* Generic settings */
-	--default-bg-img: url('../assets/default-wallpaper.png');
+	--default-bg-img: url('assets/default-wallpaper.png'); /* relative to html file, set in JS */
 	--blur-bg-filter: blur(5px);
 	--blur-bg-filter-lock-screen: blur(25px);
 	--border-radius: 4px;
@@ -53,7 +53,7 @@ body {
 	flex-direction: column;
 	align-items: center;
 	justify-content: center;
-	background: var(--default-bg-img);
+	background-color: #000;
 	background-position: center center;
 	background-size: cover;
 	background-repeat: no-repeat;

static/debug.js

@@ -14,6 +14,9 @@ examModeProjects.innerText = 'Exam Rank 00, Exam Rank 01, Exam Rank 02, non-exis
 const lockedAgo = document.getElementById('active-user-session-locked-ago');
 lockedAgo.innerText = 'Automated logout occurs in 42 minutes';
 
+// Load the default wallpaper
+document.body.style.backgroundImage = window.getComputedStyle(document.body).getPropertyValue('--default-bg-img');
+
 // Add options container
 const optionsContainer = document.createElement('div');
 optionsContainer.id = 'screen-switcher';