From 3ce165a3e61f48c7f6ad735f8fa8b7fbb25082ae Mon Sep 17 00:00:00 2001
From: SanjarBLZK <sanjar.husagic@student.vonknh.nl>
Date: Tue, 9 Sep 2025 11:41:55 +0200
Subject: [PATCH] loadingscreen improvements

---
 index.html | 36 ++++++++++++++++++++++++++++++------
 1 file changed, 30 insertions(+), 6 deletions(-)

diff --git a/index.html b/index.html
index 31dd3b7..219ef64 100644
--- a/index.html
+++ b/index.html
@@ -179,14 +179,38 @@
         // Start game
         function startGame() {
             gameState = STATES.LOADING;
+            loadingProgress = 0;
             document.getElementById('welcome').classList.add('hidden');
             document.getElementById('loading').classList.remove('hidden');
-            // Start met een korte vertraging om de engine tijd te geven
-            setTimeout(() => {
-                document.getElementById('loading').classList.add('hidden');
-                document.getElementById('gameCanvas').classList.remove('hidden');
-                gameState = STATES.PLAYING;
-            }, 1000); // 1 seconde loading screen
+            startLoadingProgress();
+        }
+
+        function startLoadingProgress() {
+            const progressElement = document.getElementById('progress');
+            const updateProgress = () => {
+                if (loadingProgress < 100 && gameState === STATES.LOADING) {
+                    // Verhoog met een random getal tussen 1 en 5
+                    loadingProgress += Math.floor(Math.random() * 5) + 1;
+                    if (loadingProgress > 100) loadingProgress = 100;
+                    
+                    // Update de tekst
+                    progressElement.textContent = `${loadingProgress}%`;
+                    
+                    if (loadingProgress >= 100) {
+                        // Als we klaar zijn, wacht even en ga naar het game scherm
+                        setTimeout(() => {
+                            document.getElementById('loading').classList.add('hidden');
+                            document.getElementById('gameCanvas').classList.remove('hidden');
+                            gameState = STATES.PLAYING;
+                        }, 500);
+                    } else {
+                        // Random vertraging tussen updates (tussen 50 en 200ms)
+                        const delay = Math.floor(Math.random() * 150) + 50;
+                        setTimeout(updateProgress, delay);
+                    }
+                }
+            };
+            updateProgress();
         }
 
         function pauseGame() {