Simon/quizify
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

modified: templates/quiz_multiplayer.html

Browse Source
This commit is contained in:
SimolZimol
2025-06-07 02:47:15 +02:00
parent 7fc4c51f36
commit 08400c03b9
1 changed files with 23 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
templates/quiz_multiplayer.html
View File

@@ -57,28 +57,26 @@
{% endblock %}
{% block extra_body %}
<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();
}
}
// Multiplayer-Daten 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>
function startMultiplayer(e) {
e.preventDefault();
const names = [];
@@ -93,27 +91,11 @@ 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);
if (document.getElementById('multiplayerPopup')) {
document.getElementById('multiplayerPopup').style.display = 'none';
}
document.getElementById('multiplayerPopup').style.display = 'none';
updateMultiplayerUI();
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 }};
@@ -267,8 +249,6 @@ function switchGameMode(mode) {
function setOption(key, value) { localStorage.setItem(key, value); }
function getOption(key, defaultValue) { return localStorage.getItem(key) || defaultValue; }
// KEIN quizifyReady oder Musikstart im window.onload!
// Nur UI initialisieren:
window.onload = function() {
const playDuration = getOption('playDuration', '0');
const sel = document.getElementById('playDuration');
@@ -286,13 +266,11 @@ window.onload = function() {
}
document.getElementById('startPosition').value = getOption('startPosition', 'start');
updateMultiplayerUI();
// Popup anzeigen, wenn nötig
showMultiplayerPopupIfNeeded();
// Kein Popup-Handling nötig, da es immer sichtbar ist (außer nach Start)
};
// Musikstart und Quiz erst nach Namensbestätigung!
function quizifyReady() {
// Hier alles, was nach dem Schließen des Popups passieren soll
if (window.spotifyPlayer && window.spotifyPlayer._options && window.spotifyPlayer._options.getOAuthToken) {
const device_id = document.getElementById('device_id').value;
const playDuration = getPlayDuration();