From f23d309b2bc402f4bf7683eb9167c9f74f58e8c5 Mon Sep 17 00:00:00 2001
From: sascha <sascha@schliep.it>
Date: Wed, 28 Jan 2026 15:38:34 +0000
Subject: [PATCH] app/static/script.js aktualisiert

---
 app/static/script.js | 177 +++++++++++++++++--------------------------
 1 file changed, 69 insertions(+), 108 deletions(-)

diff --git a/app/static/script.js b/app/static/script.js
index 3208c19..918a491 100644
--- a/app/static/script.js
+++ b/app/static/script.js
@@ -1,20 +1,24 @@
 let currentMode = 'random';
 let selectedPages = [];
-let quizQueue = [];
 let currentCard = null;
 let attempts = 0;
 let stats = { correct: 0, total: 0 };
 
 document.addEventListener('DOMContentLoaded', () => {
     fetchPages();
-    document.getElementById('answer-input').addEventListener('keypress', function (e) {
-        if (e.key === 'Enter') {
-            if (document.getElementById('next-btn').style.display !== 'none') {
-                nextQuestion();
-            } else {
-                checkAnswer();
+    
+    // Enter-Taste für alle Inputs
+    const inputs = ['answer-input', 'input-simple', 'input-participle'];
+    inputs.forEach(id => {
+        document.getElementById(id).addEventListener('keypress', function (e) {
+            if (e.key === 'Enter') {
+                if (document.getElementById('next-btn').style.display !== 'none') {
+                    nextQuestion();
+                } else {
+                    checkAnswer();
+                }
             }
-        }
+        });
     });
 });
 
@@ -22,6 +26,11 @@ function setMode(mode) {
     currentMode = mode;
     document.querySelectorAll('.mode-select button').forEach(b => b.classList.remove('active'));
     document.getElementById(`btn-${mode}`).classList.add('active');
+    
+    // Wenn Verben-Modus, wähle automatisch Seite 206/207 aus (optional, aber hilfreich)
+    if (mode === 'irregular') {
+        // Logik könnte hier erweitert werden, um Checkboxen zu setzen
+    }
 }
 
 function fetchPages() {
@@ -45,114 +54,66 @@ function fetchPages() {
 function updatePageSelection() {
     const checkboxes = document.querySelectorAll('#page-list input:checked');
     selectedPages = Array.from(checkboxes).map(cb => parseInt(cb.value));
-    const disp = document.getElementById('selected-pages-display');
-    if (selectedPages.length === 0) disp.innerText = "Alle Seiten";
-    else disp.innerText = `${selectedPages.length} Seite(n) ausgewählt`;
+    
+    const display = document.getElementById('selected-pages-display');
+    if (selectedPages.length === 0) display.innerText = "Alle Seiten";
+    else display.innerText = `Seiten: ${selectedPages.join(', ')}`;
 }
 
 function openPageOverlay() { document.getElementById('overlay').style.display = 'flex'; }
 function closeOverlay() { document.getElementById('overlay').style.display = 'none'; }
 
 function startQuiz() {
-    fetch('/api/start', {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ pages: selectedPages, mode: currentMode })
-    })
-    .then(res => res.json())
-    .then(data => {
-        quizQueue = data;
-        stats = { correct: 0, total: 0 };
-        updateProgress();
-        document.getElementById('setup-screen').style.display = 'none';
-        document.getElementById('quiz-screen').style.display = 'block';
-        nextQuestion();
-    });
-}
-
-function nextQuestion() {
-    if (quizQueue.length === 0) {
-        alert("Runde beendet! Alle Vokabeln gelernt.");
-        stopQuiz();
-        return;
-    }
-    
-    currentCard = quizQueue.pop();
-    attempts = 0;
-    
-    document.getElementById('question-label').innerText = currentCard.direction === 'de-en' ? "Deutsch -> Englisch" : "Englisch -> Deutsch";
-    document.getElementById('question-text').innerText = currentCard.question;
-    document.getElementById('answer-input').value = '';
-    document.getElementById('answer-input').focus();
-    document.getElementById('feedback-msg').innerText = '';
-    
-    document.getElementById('check-btn').style.display = 'inline-block';
-    document.getElementById('next-btn').style.display = 'none';
-}
-
-function checkAnswer() {
-    const input = document.getElementById('answer-input').value;
-    
-    fetch('/api/check', {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ input: input, correct: currentCard.answer })
-    })
-    .then(res => res.json())
-    .then(res => {
-        const feedback = document.getElementById('feedback-msg');
-        feedback.className = '';
-        
-        if (res.status === 'correct') {
-            feedback.innerText = res.msg;
-            feedback.classList.add('msg-correct');
-            stats.correct++;
-            stats.total++;
-            updateProgress();
-            setTimeout(nextQuestion, 1000);
-        } else if (res.status === 'typo') {
-            feedback.innerText = res.msg;
-            feedback.classList.add('msg-typo');
-            attempts++;
-            checkAttempts();
-        } else {
-            feedback.innerText = res.msg;
-            feedback.classList.add('msg-wrong');
-            attempts++;
-            checkAttempts();
-        }
-    });
-}
-
-function checkAttempts() {
-    if (attempts >= 3) {
-        const feedback = document.getElementById('feedback-msg');
-        feedback.innerText = `Leider nicht geschafft. Lösung: ${currentCard.answer}`;
-        document.getElementById('check-btn').style.display = 'none';
-        document.getElementById('next-btn').style.display = 'inline-block';
-        stats.total++;
-        updateProgress();
-    }
-}
-
-function updateProgress() {
-    let percent = 0;
-    if (stats.total > 0) {
-        percent = Math.round((stats.correct / stats.total) * 100);
-    }
-    const text = document.getElementById('progress-text');
-    const bar = document.getElementById('progress-bar');
-    
-    text.innerText = `${percent}% Richtig (${stats.correct}/${stats.total})`;
-    bar.style.width = `${percent}%`;
-    
-    if (percent < 50) bar.style.backgroundColor = '#dc3545';
-    else if (percent < 65) bar.style.backgroundColor = '#f08080';
-    else if (percent < 85) bar.style.backgroundColor = '#ffc107';
-    else bar.style.backgroundColor = '#28a745';
+    stats = { correct: 0, total: 0 };
+    updateProgress();
+    document.getElementById('setup-screen').style.display = 'none';
+    document.getElementById('quiz-screen').style.display = 'flex';
+    nextQuestion();
 }
 
 function stopQuiz() {
     document.getElementById('quiz-screen').style.display = 'none';
-    document.getElementById('setup-screen').style.display = 'block';
+    document.getElementById('setup-screen').style.display = 'flex';
+    fetchPages(); // Seiten neu laden falls was dazu kam
 }
+
+function nextQuestion() {
+    document.getElementById('check-btn').style.display = 'inline-block';
+    document.getElementById('next-btn').style.display = 'none';
+    document.getElementById('feedback-msg').innerText = '';
+    document.getElementById('feedback-msg').className = '';
+    
+    // Inputs leeren
+    document.getElementById('answer-input').value = '';
+    document.getElementById('input-simple').value = '';
+    document.getElementById('input-participle').value = '';
+    
+    attempts = 0;
+
+    // Abfrage an Backend
+    fetch('/api/question', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ mode: currentMode, pages: selectedPages })
+    })
+    .then(res => res.json())
+    .then(data => {
+        if (data.error) {
+            alert(data.error);
+            stopQuiz();
+            return;
+        }
+        currentCard = data;
+        renderCard(data);
+    });
+}
+
+function renderCard(card) {
+    const label = document.getElementById('question-label');
+    const text = document.getElementById('question-text');
+    const hint = document.getElementById('hint-text');
+    
+    const standardInput = document.getElementById('answer-input');
+    const verbInputs = document.getElementById('verb-inputs');
+
+    hint.innerText
\ No newline at end of file