app/static/script.js aktualisiert

This commit is contained in:
sascha 2026-01-28 18:45:59 +00:00
parent 8a692c3d04
commit cca29425ea

View File

@ -2,6 +2,7 @@ let mainMode = null;
let subMode = null;
let selectedPages = [];
let currentCard = null;
let attempts = 0;
let stats = { correct: 0, total: 0 };
function selectMainMode(mode) {
@ -24,10 +25,7 @@ function selectSubMode(mode) {
subMode = mode;
document.querySelectorAll('.sub-btn').forEach(b => b.classList.remove('active'));
document.getElementById(`btn-sub-${mode}`).classList.add('active');
document.getElementById('page-section').style.display = 'block';
// Button Check: Nur aktivieren wenn Seiten gewählt sind
updatePageDisplay();
}
@ -38,14 +36,12 @@ function fetchPages(type) {
const list = document.getElementById('page-list');
list.innerHTML = '';
// WICHTIG: selectedPages resetten und KEINE Haken standardmäßig setzen
selectedPages = [];
updatePageDisplay(); // Zeigt "Keine Seiten gewählt!"
selectedPages = []; // Standard: Nichts ausgewählt
updatePageDisplay();
pages.forEach(p => {
const div = document.createElement('div');
div.className = 'page-item';
// Hier KEIN 'checked' Attribut mehr
div.innerHTML = `
<input type="checkbox" id="p-${p}" value="${p}" onchange="updatePageSelection()">
<label for="p-${p}">${p}</label>
@ -56,10 +52,7 @@ function fetchPages(type) {
}
function toggleAllPages(state) {
const checkboxes = document.querySelectorAll('#page-list input');
checkboxes.forEach(cb => {
cb.checked = state;
});
document.querySelectorAll('#page-list input').forEach(cb => cb.checked = state);
updatePageSelection();
}
@ -84,12 +77,13 @@ function updatePageDisplay() {
}
}
// --- QUIZ LOGIC (Unverändert) ---
// --- QUIZ LOGIC ---
function startQuiz() {
stats = { correct: 0, total: 0 };
updateStats();
document.getElementById('setup-screen').style.display = 'none';
document.getElementById('quiz-screen').style.display = 'flex'; // Flex, wegen CSS column
document.getElementById('quiz-screen').style.display = 'flex';
nextQuestion();
}
@ -99,12 +93,19 @@ function stopQuiz() {
}
function nextQuestion() {
document.getElementById('btn-check').style.display = 'block';
document.getElementById('btn-next').style.display = 'none';
document.getElementById('feedback').innerText = '';
document.getElementById('feedback').className = 'feedback';
const btn = document.getElementById('btn-action');
const fb = document.getElementById('feedback');
// Button zurücksetzen auf "Prüfen"
btn.innerText = "Prüfen";
btn.onclick = checkAnswer;
btn.className = "action-btn primary"; // Farbe Grün
fb.innerText = '';
fb.className = 'feedback';
document.querySelectorAll('input').forEach(i => i.value = '');
attempts = 0; // Versuche resetten
fetch('/api/question', {
method: 'POST',
@ -141,7 +142,6 @@ function renderCard(card) {
lbl.innerText = 'Unregelmäßiges Verb:';
txt.innerText = `to ${card.question}`;
hint.innerText = `(Deutsch: ${card.german_hint})`;
inpStd.style.display = 'none';
boxVerbs.style.display = 'flex';
inpInf.style.display = 'none';
@ -150,7 +150,6 @@ function renderCard(card) {
else if (card.type === 'irregular_full') {
lbl.innerText = 'Unregelmäßiges Verb (Alle Formen):';
txt.innerText = card.question;
inpStd.style.display = 'none';
boxVerbs.style.display = 'flex';
inpInf.style.display = 'block';
@ -169,7 +168,6 @@ function checkAnswer() {
payload.participle = document.getElementById('inp-part').value;
payload.correct_simple = currentCard.answer_simple;
payload.correct_participle = currentCard.answer_participle;
if (currentCard.type === 'irregular_full') {
payload.infinitive = document.getElementById('inp-inf').value;
payload.correct_infinitive = currentCard.answer_infinitive;
@ -187,24 +185,47 @@ function checkAnswer() {
fb.innerText = res.msg;
if (res.status === 'correct') {
fb.classList.add('correct');
// RICHTIG -> Button auf "Weiter" schalten
fb.className = 'feedback correct';
stats.correct++;
finishTurn();
switchToNextMode();
} else if (res.status === 'typo') {
fb.classList.add('typo');
fb.className = 'feedback typo';
attempts++;
checkAttempts(res.msg); // Typo zählt auch als Versuch
} else {
fb.classList.add('wrong');
finishTurn();
// FALSCH
fb.className = 'feedback wrong';
attempts++;
checkAttempts(res.msg);
}
});
}
function checkAttempts(msg) {
if (attempts >= 3) {
// Zu viele Versuche -> Button auf "Weiter"
document.getElementById('feedback').innerText = "Leider falsch (3 Versuche). " + msg;
stats.total++; // Zählt als fertig (aber falsch)
updateStats();
switchToNextMode();
}
}
function switchToNextMode() {
const btn = document.getElementById('btn-action');
btn.innerText = "Weiter";
btn.onclick = finishTurn; // Beim Klick auf Weiter -> finishTurn
btn.focus();
}
function finishTurn() {
stats.total++;
updateStats();
document.getElementById('btn-check').style.display = 'none';
document.getElementById('btn-next').style.display = 'block';
document.getElementById('btn-next').focus();
// Wenn "Weiter" geklickt wird
if (document.getElementById('btn-action').innerText === "Weiter") {
if(attempts < 3) stats.total++; // Wenn richtig, hier Zähler hoch
updateStats();
nextQuestion();
}
}
function updateStats() {
@ -214,11 +235,10 @@ function updateStats() {
document.getElementById('stats-text').innerText = `${p}% Richtig (${stats.correct}/${stats.total})`;
}
// Enter Key: Klickt einfach den aktiven Button
document.addEventListener('keypress', (e) => {
if (e.key === 'Enter') {
const nextBtn = document.getElementById('btn-next');
if (nextBtn.style.display !== 'none') nextQuestion();
else checkAnswer();
document.getElementById('btn-action').click();
}
});