From 7fc4c51f36ecdf3908e1002666fa3f6a0ce3f8b8 Mon Sep 17 00:00:00 2001
From: SimolZimol <70102430+SimolZimol@users.noreply.github.com>
Date: Sat, 7 Jun 2025 02:02:14 +0200
Subject: [PATCH] 	modified:   templates/quiz_multiplayer.html

---
 templates/quiz_multiplayer.html | 68 ++++++++++++++++++++-------------
 1 file changed, 42 insertions(+), 26 deletions(-)

diff --git a/templates/quiz_multiplayer.html b/templates/quiz_multiplayer.html
index 648e9db..e60995a 100644
--- a/templates/quiz_multiplayer.html
+++ b/templates/quiz_multiplayer.html
@@ -57,26 +57,28 @@
 {% endblock %}
 {% block extra_body %}
 <script>
-// Multiplayer-Daten IMMER beim Laden löschen, damit Popup immer erscheint
-localStorage.removeItem('quizify_multiplayer_names');
-localStorage.removeItem('quizify_multiplayer_scores');
-localStorage.removeItem('quizify_multiplayer_current');
-</script>
-{% if local_multiplayer %}
-<div id="multiplayerPopup" style="position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,0.7);display:flex;align-items:center;justify-content:center;z-index:2000;">
-  <div style="background:#191414;padding:30px 40px;border-radius:18px;box-shadow:0 8px 32px 0 rgba(0,0,0,0.37);min-width:320px;text-align:center;">
-    <h3>Lokaler Multiplayer</h3>
-    <p>Gib bis zu 4 Spielernamen ein:</p>
-    <form id="multiplayerForm" onsubmit="startMultiplayer(event)">
-      <input type="text" id="player1" placeholder="Spieler 1" required style="margin:5px;width:80%"><br>
-      <input type="text" id="player2" placeholder="Spieler 2" style="margin:5px;width:80%"><br>
-      <input type="text" id="player3" placeholder="Spieler 3" style="margin:5px;width:80%"><br>
-      <input type="text" id="player4" placeholder="Spieler 4" style="margin:5px;width:80%"><br>
-      <button class="btn" type="submit" style="margin-top:10px;">Starten</button>
-    </form>
-  </div>
-</div>
-<script>
+// Popup und Multiplayer-Daten nur anzeigen/löschen, wenn noch keine Namen gesetzt sind
+function showMultiplayerPopupIfNeeded() {
+  const names = JSON.parse(localStorage.getItem('quizify_multiplayer_names') || "[]");
+  if (!names || names.length < 2) {
+    // Daten löschen, falls unvollständig
+    localStorage.removeItem('quizify_multiplayer_names');
+    localStorage.removeItem('quizify_multiplayer_scores');
+    localStorage.removeItem('quizify_multiplayer_current');
+    // Popup anzeigen
+    if (document.getElementById('multiplayerPopup')) {
+      document.getElementById('multiplayerPopup').style.display = 'flex';
+    }
+  } else {
+    // Popup ausblenden, falls schon Spieler gesetzt
+    if (document.getElementById('multiplayerPopup')) {
+      document.getElementById('multiplayerPopup').style.display = 'none';
+    }
+    updateMultiplayerUI();
+    quizifyReady();
+  }
+}
+
 function startMultiplayer(e) {
   e.preventDefault();
   const names = [];
@@ -91,11 +93,27 @@ function startMultiplayer(e) {
   localStorage.setItem('quizify_multiplayer_names', JSON.stringify(names));
   localStorage.setItem('quizify_multiplayer_scores', JSON.stringify(Array(names.length).fill(0)));
   localStorage.setItem('quizify_multiplayer_current', 0);
-  document.getElementById('multiplayerPopup').style.display = 'none';
+  if (document.getElementById('multiplayerPopup')) {
+    document.getElementById('multiplayerPopup').style.display = 'none';
+  }
   updateMultiplayerUI();
-  quizifyReady(); // Musik und Quiz jetzt starten!
+  quizifyReady();
 }
 </script>
+{% if local_multiplayer %}
+<div id="multiplayerPopup" style="position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,0.7);display:none;align-items:center;justify-content:center;z-index:2000;">
+  <div style="background:#191414;padding:30px 40px;border-radius:18px;box-shadow:0 8px 32px 0 rgba(0,0,0,0.37);min-width:320px;text-align:center;">
+    <h3>Lokaler Multiplayer</h3>
+    <p>Gib bis zu 4 Spielernamen ein:</p>
+    <form id="multiplayerForm" onsubmit="startMultiplayer(event)">
+      <input type="text" id="player1" placeholder="Spieler 1" required style="margin:5px;width:80%"><br>
+      <input type="text" id="player2" placeholder="Spieler 2" style="margin:5px;width:80%"><br>
+      <input type="text" id="player3" placeholder="Spieler 3" style="margin:5px;width:80%"><br>
+      <input type="text" id="player4" placeholder="Spieler 4" style="margin:5px;width:80%"><br>
+      <button class="btn" type="submit" style="margin-top:10px;">Starten</button>
+    </form>
+  </div>
+</div>
 {% endif %}
 <script>
 let allTracks = {{ all_tracks|tojson }};
@@ -269,10 +287,8 @@ window.onload = function() {
   document.getElementById('startPosition').value = getOption('startPosition', 'start');
   updateMultiplayerUI();
 
-  // Popup immer anzeigen, weil LocalStorage oben geleert wurde
-  if (document.getElementById('multiplayerPopup')) {
-    document.getElementById('multiplayerPopup').style.display = 'flex';
-  }
+  // Popup anzeigen, wenn nötig
+  showMultiplayerPopupIfNeeded();
 };
 
 // Musikstart und Quiz erst nach Namensbestätigung!