app/static/script.js aktualisiert
This commit is contained in:
parent
565c842070
commit
e91bff3eaa
@ -1,6 +1,7 @@
|
|||||||
let mainMode = null;
|
let mainMode = null;
|
||||||
let subMode = null;
|
let subMode = null;
|
||||||
let selectedPages = [];
|
let selectedPages = [];
|
||||||
|
let allAvailablePages = []; // Speichert alle verfügbaren Seiten
|
||||||
let currentCard = null;
|
let currentCard = null;
|
||||||
let attempts = 0;
|
let attempts = 0;
|
||||||
let stats = { correct: 0, total: 0 };
|
let stats = { correct: 0, total: 0 };
|
||||||
@ -26,6 +27,8 @@ function selectSubMode(mode) {
|
|||||||
document.querySelectorAll('.sub-btn').forEach(b => b.classList.remove('active'));
|
document.querySelectorAll('.sub-btn').forEach(b => b.classList.remove('active'));
|
||||||
document.getElementById(`btn-sub-${mode}`).classList.add('active');
|
document.getElementById(`btn-sub-${mode}`).classList.add('active');
|
||||||
document.getElementById('page-section').style.display = 'block';
|
document.getElementById('page-section').style.display = 'block';
|
||||||
|
|
||||||
|
// UI Update, falls schon Seiten geladen sind
|
||||||
updatePageDisplay();
|
updatePageDisplay();
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -33,26 +36,47 @@ function fetchPages(type) {
|
|||||||
fetch(`/api/pages?type=${type}`)
|
fetch(`/api/pages?type=${type}`)
|
||||||
.then(res => res.json())
|
.then(res => res.json())
|
||||||
.then(pages => {
|
.then(pages => {
|
||||||
|
allAvailablePages = pages;
|
||||||
const list = document.getElementById('page-list');
|
const list = document.getElementById('page-list');
|
||||||
list.innerHTML = '';
|
list.innerHTML = '';
|
||||||
|
|
||||||
selectedPages = [];
|
// LOGIK ÄNDERUNG: Standardmäßig ALLE auswählen
|
||||||
updatePageDisplay();
|
selectedPages = [...pages];
|
||||||
|
|
||||||
pages.forEach(p => {
|
pages.forEach(p => {
|
||||||
const div = document.createElement('div');
|
const div = document.createElement('div');
|
||||||
div.className = 'page-item';
|
div.className = 'page-item';
|
||||||
|
// Checkbox ist standardmäßig checked (fürs Backend),
|
||||||
|
// aber im Overlay wird sie beim Öffnen gelöscht (siehe openPageOverlay)
|
||||||
div.innerHTML = `
|
div.innerHTML = `
|
||||||
<input type="checkbox" id="p-${p}" value="${p}" onchange="updatePageSelection()">
|
<input type="checkbox" id="p-${p}" value="${p}" checked onchange="updatePageSelection()">
|
||||||
<label for="p-${p}">${p}</label>
|
<label for="p-${p}">${p}</label>
|
||||||
`;
|
`;
|
||||||
list.appendChild(div);
|
list.appendChild(div);
|
||||||
});
|
});
|
||||||
|
updatePageDisplay();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function openPageOverlay() {
|
||||||
|
const overlay = document.getElementById('overlay');
|
||||||
|
if (!overlay) return;
|
||||||
|
|
||||||
|
// LOGIK ÄNDERUNG: Beim Öffnen alles abwählen!
|
||||||
|
toggleAllPages(false);
|
||||||
|
|
||||||
|
overlay.style.display = 'flex';
|
||||||
|
}
|
||||||
|
|
||||||
|
function closeOverlay() {
|
||||||
|
document.getElementById('overlay').style.display = 'none';
|
||||||
|
}
|
||||||
|
|
||||||
function toggleAllPages(state) {
|
function toggleAllPages(state) {
|
||||||
document.querySelectorAll('#page-list input').forEach(cb => cb.checked = state);
|
const checkboxes = document.querySelectorAll('#page-list input');
|
||||||
|
checkboxes.forEach(cb => {
|
||||||
|
cb.checked = state;
|
||||||
|
});
|
||||||
updatePageSelection();
|
updatePageSelection();
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -70,10 +94,21 @@ function updatePageDisplay() {
|
|||||||
d.innerText = "Keine Seiten gewählt!";
|
d.innerText = "Keine Seiten gewählt!";
|
||||||
d.style.color = "red";
|
d.style.color = "red";
|
||||||
btn.disabled = true;
|
btn.disabled = true;
|
||||||
|
btn.style.opacity = "0.5";
|
||||||
} else {
|
} else {
|
||||||
d.innerText = `Seiten: ${selectedPages.join(', ')}`;
|
// Prüfen ob ALLE ausgewählt sind
|
||||||
|
if (selectedPages.length === allAvailablePages.length && allAvailablePages.length > 0) {
|
||||||
|
d.innerText = "Alle Seiten (Standard)";
|
||||||
|
} else {
|
||||||
|
d.innerText = `Seiten: ${selectedPages.join(', ')}`;
|
||||||
|
}
|
||||||
d.style.color = "#555";
|
d.style.color = "#555";
|
||||||
if (subMode) btn.disabled = false;
|
|
||||||
|
// Start Button nur aktivieren, wenn Submode gewählt UND Seiten da sind
|
||||||
|
if (subMode) {
|
||||||
|
btn.disabled = false;
|
||||||
|
btn.style.opacity = "1";
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -183,40 +218,34 @@ function checkAnswer() {
|
|||||||
const fb = document.getElementById('feedback');
|
const fb = document.getElementById('feedback');
|
||||||
|
|
||||||
if (res.status === 'correct') {
|
if (res.status === 'correct') {
|
||||||
// Richtig -> Sofort grün und weiter
|
|
||||||
fb.innerText = res.msg;
|
fb.innerText = res.msg;
|
||||||
fb.className = 'feedback correct';
|
fb.className = 'feedback correct';
|
||||||
stats.correct++;
|
stats.correct++;
|
||||||
switchToNextMode();
|
switchToNextMode();
|
||||||
|
|
||||||
} else if (res.status === 'typo') {
|
} else if (res.status === 'typo') {
|
||||||
// Tippfehler -> Warnung, zählt als Versuch
|
|
||||||
fb.innerText = res.msg;
|
fb.innerText = res.msg;
|
||||||
fb.className = 'feedback typo';
|
fb.className = 'feedback typo';
|
||||||
attempts++;
|
attempts++;
|
||||||
checkAttempts();
|
checkAttempts();
|
||||||
|
|
||||||
} else {
|
} else {
|
||||||
// Falsch
|
|
||||||
attempts++;
|
attempts++;
|
||||||
if (attempts < 3) {
|
if (attempts < 3) {
|
||||||
fb.innerText = `Falsch. Versuch ${attempts}/3. Probiere es noch einmal!`;
|
fb.innerText = `Falsch. Versuch ${attempts}/3.`;
|
||||||
fb.className = 'feedback wrong';
|
fb.className = 'feedback wrong';
|
||||||
// Button bleibt auf "Prüfen", man kann es nochmal versuchen
|
|
||||||
} else {
|
} else {
|
||||||
checkAttempts(); // Lösen
|
checkAttempts();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function checkAttempts() {
|
function checkAttempts() {
|
||||||
// Wenn 3 mal falsch (oder aufgegeben wird)
|
|
||||||
if (attempts >= 3) {
|
if (attempts >= 3) {
|
||||||
const fb = document.getElementById('feedback');
|
const fb = document.getElementById('feedback');
|
||||||
let solution = "";
|
let solution = "";
|
||||||
|
|
||||||
// Lösungstext zusammenbauen
|
|
||||||
if (currentCard.type === 'vocab') {
|
if (currentCard.type === 'vocab') {
|
||||||
solution = currentCard.answer;
|
solution = currentCard.answer;
|
||||||
} else if (currentCard.type === 'irregular_standard') {
|
} else if (currentCard.type === 'irregular_standard') {
|
||||||
@ -242,11 +271,7 @@ function switchToNextMode() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function finishTurn() {
|
function finishTurn() {
|
||||||
// Wenn "Weiter" geklickt wird
|
|
||||||
if (document.getElementById('btn-action').innerText === "Weiter") {
|
if (document.getElementById('btn-action').innerText === "Weiter") {
|
||||||
// Nur wenn es beim ersten Mal oder nach Typo geklappt hat, zählt es als "correct" für die Statistik
|
|
||||||
// Die Logik oben (bei status correct) hat stats.correct++ schon gemacht.
|
|
||||||
// Hier zählen wir nur total hoch, wenn es noch nicht passiert ist (bei failure passierte es schon)
|
|
||||||
if (attempts < 3 && document.getElementById('feedback').classList.contains('correct')) {
|
if (attempts < 3 && document.getElementById('feedback').classList.contains('correct')) {
|
||||||
stats.total++;
|
stats.total++;
|
||||||
}
|
}
|
||||||
@ -264,6 +289,7 @@ function updateStats() {
|
|||||||
|
|
||||||
document.addEventListener('keypress', (e) => {
|
document.addEventListener('keypress', (e) => {
|
||||||
if (e.key === 'Enter') {
|
if (e.key === 'Enter') {
|
||||||
document.getElementById('btn-action').click();
|
const btn = document.getElementById('btn-action');
|
||||||
|
if (btn) btn.click();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
Loading…
x
Reference in New Issue
Block a user