Added astroid game

2025-12-05 10:53:17 +03:00
parent dd33d45f46
commit 30bc82ad00
34 changed files with 1476 additions and 19 deletions
--- a/quiz_game/static/script.js
+++ b/quiz_game/static/script.js
@@ -0,0 +1,149 @@
+// script.js
+let currentQuestion = null;
+
+// Utility function for making API requests
+function apiRequest(url, options = {}) {
+    return fetch(url, options)
+        .then(response => response.json())
+        .catch(error => {
+            console.error('Error:', error);
+            throw error;
+        });
+}
+
+// Utility function for updating element text content
+function updateElementText(id, text) {
+    const element = document.getElementById(id);
+    if (element) {
+        element.textContent = text;
+    }
+}
+
+// Utility function for showing/hiding elements
+function toggleElementVisibility(id, show = true) {
+    const element = document.getElementById(id);
+    if (element) {
+        element.style.display = show ? 'block' : 'none';
+    }
+}
+
+function loadQuestion() {
+    apiRequest('/get_question')
+        .then(data => {
+            if (data.game_over) {
+                endGame(data.final_score);
+                return;
+            }
+            
+            currentQuestion = data;
+            displayQuestion(data);
+        })
+        .catch(error => console.error('Error:', error));
+}
+
+function displayQuestion(data) {
+    updateElementText('q-number', data.question_number);
+    updateElementText('question-text', data.question);
+    updateElementText('prize', data.current_prize);
+    
+    const optionsContainer = document.getElementById('options');
+    optionsContainer.innerHTML = '';
+    
+    data.options.forEach((option, index) => {
+        const optionElement = document.createElement('div');
+        optionElement.className = 'option';
+        optionElement.textContent = option;
+        optionElement.onclick = () => selectAnswer(option);
+        optionsContainer.appendChild(optionElement);
+    });
+    
+    // Reset result display
+    toggleElementVisibility('result', false);
+    const result = document.getElementById('result');
+    if (result) {
+        result.className = 'result';
+    }
+}
+
+function selectAnswer(answer) {
+    apiRequest('/answer', {
+        method: 'POST',
+        headers: {'Content-Type': 'application/json'},
+        body: JSON.stringify({ answer: answer })
+    })
+    .then(data => {
+        const result = document.getElementById('result');
+        if (result) {
+            result.style.display = 'block';
+            
+            if (data.correct) {
+                result.textContent = 'Correct!';
+                result.className = 'result correct';
+                
+                setTimeout(() => {
+                    if (data.game_over) {
+                        endGame(data.final_score);
+                    } else {
+                        loadQuestion();
+                    }
+                }, 1500);
+            } else {
+                result.textContent = `Wrong! Correct answer: ${data.correct_answer}`;
+                result.className = 'result incorrect';
+                
+                setTimeout(() => {
+                    endGame(data.final_score);
+                }, 2000);
+            }
+        }
+    })
+    .catch(error => console.error('Error:', error));
+}
+
+function useFiftyFifty() {
+    const lifelineBtn = document.querySelector('.lifeline');
+    if (lifelineBtn) {
+        lifelineBtn.disabled = true;
+    }
+    
+    apiRequest('/lifeline/fifty_fifty')
+        .then(data => {
+            if (data.error) {
+                alert(data.error);
+                if (lifelineBtn) {
+                    lifelineBtn.disabled = false;
+                }
+                return;
+            }
+            
+            // Hide two wrong options
+            const options = document.querySelectorAll('.option');
+            data.remove_indices.forEach(index => {
+                if (options[index]) {
+                    options[index].style.display = 'none';
+                }
+            });
+        })
+        .catch(error => {
+            console.error('Error:', error);
+            if (lifelineBtn) {
+                lifelineBtn.disabled = false;
+            }
+        });
+}
+
+function endGame(score) {
+    updateElementText('final-prize', score);
+    toggleElementVisibility('game-over', true);
+    toggleElementVisibility('question-box', false);
+    toggleElementVisibility('lifeline', false);
+}
+
+function restartGame() {
+    window.location.href = '/start';
+}
+
+// Start the game when page loads
+if (window.location.pathname === '/start') {
+    loadQuestion();
+}