From cbcd530cf338a9e5bf500b6cb39640b70527a4a6 Mon Sep 17 00:00:00 2001
From: Antares <MrAntares@users.noreply.github.com>
Date: Wed, 2 Oct 2024 11:54:43 +0200
Subject: [PATCH] Display spinner when loading al the scripts

---
 src/App/Online.js        | 52 ++++++++++++++++++++++++++++++++++++++++
 src/Engine/GameEngine.js |  3 +++
 2 files changed, 55 insertions(+)

diff --git a/src/App/Online.js b/src/App/Online.js
index ceb04128..0806e19f 100644
--- a/src/App/Online.js
+++ b/src/App/Online.js
@@ -8,6 +8,58 @@
  * @author Vincent Thibault
  */
 
+window.roInitSpinner = {
+	add: function(){
+		// Loading spinner ring
+		var loading = document.createElement('div');
+		loading.id = 'loading-element';
+		loading.className = 'lds-dual-ring';
+		
+		var loadingStyle = document.createElement('style');
+		loadingStyle.id = 'loading-style';
+		loadingStyle.textContent = `
+			.lds-dual-ring { color: #1c4c5b }
+			.lds-dual-ring,
+			.lds-dual-ring:after { box-sizing: border-box; }
+			.lds-dual-ring {
+				position: absolute;
+				display: inline-block;
+				width: 80px;
+				height: 80px;
+				top: 50%;
+				left: 50%;
+				margin-top: -40px;
+				margin-left: -40px;
+			}
+			.lds-dual-ring:after {
+				content: " ";
+				display: block;
+				width: 64px;
+				height: 64px;
+				margin: 8px;
+				border-radius: 50%;
+				border: 6.4px solid currentColor;
+				border-color: currentColor transparent currentColor transparent;
+				animation: lds-dual-ring 1.2s linear infinite;
+			}
+			@keyframes lds-dual-ring {
+				0% { transform: rotate(0deg); }
+				100% { transform: rotate(360deg); }
+			}
+		`;
+		
+		document.head.appendChild(loadingStyle);
+		document.body.appendChild(loading);
+	},
+	remove: function(){
+		document.getElementById('loading-element').remove();
+		document.getElementById('loading-style').remove();
+	}
+};
+
+// Add spinner before starting the require chain to let the user know things are happening in the background
+window.roInitSpinner.add();
+
 // Errors Handler (hack)
 require.onError = function (err) {
 	'use strict';
diff --git a/src/Engine/GameEngine.js b/src/Engine/GameEngine.js
index 787b2958..d60e9b01 100644
--- a/src/Engine/GameEngine.js
+++ b/src/Engine/GameEngine.js
@@ -172,6 +172,9 @@ define(function( require )
 
 		// Execute
 		q.run();
+
+		// Remove init spinner
+		window.roInitSpinner.remove();
 	}