Feature: In-game timer, anonymous leaderboard, witty tiered finale results, legal pages, button renames

app/static/js/quiz.js

@@ -6,6 +6,9 @@ let attemptsUsed = 0;
 const maxAttempts = 3;
 let selectedDifficulty = "all";
 let lastQuestionData = null;
+let timerStartTime = null;
+let timerInterval = null;
+let elapsedSeconds = 0;
 
 const UI_TEXT = {
     de: {
@@ -24,8 +27,8 @@ const UI_TEXT = {
         questionLabel: "Frage",
         ofLabel: "von",
         attemptLabel: "Versuch",
-        checkBtn: "✨ Zauber prüfen",
-        hintBtn: "💡 Zaubertipp",
+        checkBtn: "✨ Antwort prüfen",
+        hintBtn: "💡 Hinweis anzeigen",
         hintHeading: "📜 Notiz aus der verbotenen Abteilung:",
         placeholder: "Deine Antwort hier eingeben...",
         noHint: "Kein Tipp vorhanden.",
@@ -53,8 +56,8 @@ const UI_TEXT = {
         questionLabel: "Question",
         ofLabel: "of",
         attemptLabel: "Attempt",
-        checkBtn: "✨ Check Spell",
-        hintBtn: "💡 Magic Hint",
+        checkBtn: "✨ Check Answer",
+        hintBtn: "💡 Show Hint",
         hintHeading: "📜 Note from the Restricted Section:",
         placeholder: "Type your answer here...",
         noHint: "No hint available.",
@@ -203,6 +206,7 @@ async function startGame() {
         setTimeout(() => {
             document.getElementById("introCard").classList.add("hidden");
             document.getElementById("gameCard").classList.remove("hidden");
+            startTimer();
             renderQuestion(data);
         }, 1100);
 
@@ -214,6 +218,25 @@ async function startGame() {
     }
 }
 
+function startTimer() {
+    timerStartTime = Date.now();
+    elapsedSeconds = 0;
+    if (timerInterval) clearInterval(timerInterval);
+    timerInterval = setInterval(updateTimer, 1000);
+    updateTimer();
+}
+
+function updateTimer() {
+    if (!timerStartTime) return;
+    elapsedSeconds = Math.floor((Date.now() - timerStartTime) / 1000);
+    const m = Math.floor(elapsedSeconds / 60);
+    const s = elapsedSeconds % 60;
+    const badge = document.getElementById("timerBadge");
+    if (badge) {
+        badge.innerText = `⏱️ ${String(m).padStart(2, '0')}:${String(s).padStart(2, '0')}`;
+    }
+}
+
 function renderQuestion(qData) {
     lastQuestionData = qData;
     const t = UI_TEXT[currentLang] || UI_TEXT.de;
@@ -424,8 +447,9 @@ async function requestHint() {
 }
 
 function finishGame() {
+    if (timerInterval) clearInterval(timerInterval);
     document.getElementById("progressBar").style.width = "100%";
-    window.location.href = `/finale?score=${currentScore}&total=${totalQuestions}&lang=${currentLang}`;
+    window.location.href = `/finale?score=${currentScore}&total=${totalQuestions}&time=${elapsedSeconds}&lang=${currentLang}`;
 }
 
 // Enter key to submit