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

modified: app.py

Browse Source 
modified:   templates/playerselect.html
	modified:   templates/quiz_buzzer_multiplayer.html
	new file:   templates/team_setup.html
This commit is contained in:
Simon
2025-11-15 01:53:25 +01:00
parent 47aaf76a57
commit a2bbca4ef1
4 changed files with 307 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

107
templates/quiz_buzzer_multiplayer.html
View File

@@ -244,13 +244,16 @@
let gameStarted = false;
let currentBuzzer = null;
// Spieler-Daten
let players = [
{ id: 1, name: 'Spieler 1', score: {{ player_scores[0] if player_scores else 0 }} },
{ id: 2, name: 'Spieler 2', score: {{ player_scores[1] if player_scores else 0 }} },
{ id: 3, name: 'Spieler 3', score: {{ player_scores[2] if player_scores else 0 }} },
{ id: 4, name: 'Spieler 4', score: {{ player_scores[3] if player_scores else 0 }} }
];
// Lade Team-Daten aus localStorage
let teamCount = parseInt(localStorage.getItem('team_count')) || 4;
let players = [];
for (let i = 1; i <= teamCount; i++) {
const teamName = localStorage.getItem(`team_${i}_name`) || `Team ${i}`;
const scoreIndex = i - 1;
const score = {{ player_scores|tojson }}[scoreIndex] || 0;
players.push({ id: i, name: teamName, score: score });
}
window.onSpotifyWebPlaybackSDKReady = () => {
const token = '{{ access_token }}';
@@ -321,10 +324,10 @@
.then(() => {
console.log('Play command sent');
document.getElementById('startButton').style.display = 'none';
// Aktiviere Buzzer
for (let i = 1; i <= 4; i++) {
document.getElementById(`buzzer${i}`).classList.remove('disabled');
}
// Aktiviere alle Buzzer
players.forEach(player => {
document.getElementById(`buzzer${player.id}`).classList.remove('disabled');
});
})
.catch(error => console.error('Error starting playback:', error));
}
@@ -390,9 +393,9 @@
document.getElementById('currentPlayer').textContent = `${players[playerId - 1].name} hat gebuzzert!`;
// Deaktiviere alle Buzzer
for (let i = 1; i <= 4; i++) {
document.getElementById(`buzzer${i}`).classList.add('disabled');
}
players.forEach(player => {
document.getElementById(`buzzer${player.id}`).classList.add('disabled');
});
document.getElementById('answerSection').classList.add('active');
window.earnedPoints = calculatePoints(elapsed);
@@ -533,30 +536,54 @@
gracePeriod = parseInt(localStorage.getItem('buzzer_grace_period')) || 5;
decayRate = parseInt(localStorage.getItem('buzzer_decay_rate')) || 50;
document.getElementById('pointsDisplay').textContent = maxPoints + ' Punkte';
// Dynamisches Scoreboard erstellen
createScoreboard();
// Dynamische Buzzer-Buttons erstellen
createBuzzerButtons();
};
function createScoreboard() {
const scoreboard = document.getElementById('scoreboard');
scoreboard.innerHTML = '';
players.forEach(player => {
const card = document.createElement('div');
card.className = 'player-card';
card.id = `player${player.id}`;
card.innerHTML = `
<div class="player-name">${player.name}</div>
<div class="player-score">${player.score}</div>
`;
scoreboard.appendChild(card);
});
}
function createBuzzerButtons() {
const grid = document.getElementById('buzzerGrid');
grid.innerHTML = `
<button class="player-buzzer start" id="startButton" onclick="startGame()">
▶️<br>START
</button>
`;
players.forEach(player => {
const button = document.createElement('button');
button.className = 'player-buzzer disabled';
button.id = `buzzer${player.id}`;
button.onclick = () => buzz(player.id);
button.innerHTML = `🔴<br>${player.name}`;
grid.appendChild(button);
});
}
</script>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class="quiz-container">
<!-- Scoreboard -->
<div class="scoreboard">
<div class="player-card" id="player1">
<div class="player-name">Spieler 1</div>
<div class="player-score">0</div>
</div>
<div class="player-card" id="player2">
<div class="player-name">Spieler 2</div>
<div class="player-score">0</div>
</div>
<div class="player-card" id="player3">
<div class="player-name">Spieler 3</div>
<div class="player-score">0</div>
</div>
<div class="player-card" id="player4">
<div class="player-name">Spieler 4</div>
<div class="player-score">0</div>
</div>
<div class="scoreboard" id="scoreboard">
<!-- Dynamisch generiert via JavaScript -->
</div>
<input type="hidden" id="device_id" value="">
@@ -570,22 +597,8 @@
<div class="current-player" id="currentPlayer">Drücke START um zu beginnen</div>
<!-- Buzzer Buttons -->
<div class="buzzer-grid">
<button class="player-buzzer start" id="startButton" onclick="startGame()">
▶️<br>START
</button>
<button class="player-buzzer disabled" id="buzzer1" onclick="buzz(1)">
🔴<br>Spieler 1
</button>
<button class="player-buzzer disabled" id="buzzer2" onclick="buzz(2)">
🔴<br>Spieler 2
</button>
<button class="player-buzzer disabled" id="buzzer3" onclick="buzz(3)">
🔴<br>Spieler 3
</button>
<button class="player-buzzer disabled" id="buzzer4" onclick="buzz(4)">
🔴<br>Spieler 4
</button>
<div class="buzzer-grid" id="buzzerGrid">
<!-- Dynamisch generiert via JavaScript -->
</div>
<!-- Answer Section -->