Mittel-Training mit Matching-System und Auswertung implementiert

This commit is contained in:
2026-02-12 08:00:05 +01:00
parent 2e3c937b99
commit 374be205b7
4 changed files with 246 additions and 136 deletions

View File

@@ -11,61 +11,66 @@
<h1>Flashcards Generator</h1>
</header>
<div class="main-wrapper">
<div class="section-title" id="title">
<div class="content">
<label for="inputText" class="inputText">Sende deine Wortliste an ChatGPT mit folgender Anweisung:</label>
</div>
<div id="aufgabe_fuer_gpt">
<pre id="formatText">
Bitte formatiere meine Wortliste exakt nach folgendem Schema.
Jeder Eintrag muss durch eine Leerzeile getrennt sein.
Englisches Wort
[IPA-Transkription]
Beispielsatz auf Englisch
Deutsche Übersetzung des Wortes
Beispielsatz auf Deutsch
</pre>
<button id="copyButton" style="position: absolute; top: 5px; right: 5px; cursor: pointer;">📋</button>
</div>
<div id="inputHinweis">
<div id="startScreen">
<div class="section-title" id="title">
<div class="content">
<label for="inputText" class="section-title">Füge deinen Text hier ein:</label>
<textarea id="inputText" placeholder="Hier Text einfügen..."></textarea>
<label for="inputText" class="inputText">Sende deine Wortliste an ChatGPT mit folgender Anweisung:</label>
</div>
<div id="aufgabe_fuer_gpt">
<pre id="formatText">
Bitte formatiere meine Wortliste exakt nach folgendem Schema.
Jeder Eintrag muss durch eine Leerzeile getrennt sein.
Englisches Wort
[IPA-Transkription]
Beispielsatz auf Englisch
Deutsche Übersetzung des Wortes
Beispielsatz auf Deutsch
</pre>
<button id="copyButton" style="position: absolute; top: 5px; right: 5px; cursor: pointer;">📋</button>
</div>
<div id="inputHinweis">
<div class="content">
<label for="inputText" class="section-title">Füge deinen Text hier ein:</label>
<textarea id="inputText" placeholder="Hier Text einfügen..."></textarea>
</div>
</div>
</div>
<div class="button-wrapper">
<button id="kartenErstellen">Karten erstellen</button>
</div>
</div>
<div class="button-wrapper">
<button id="kartenErstellen">Karten erstellen</button>
</div>
<div id="modusAuswahlSeite" style="display:none">
<div id="modusAuswahlSeite" style="display:none;">
<h2>Wählt einen Modus:</h2>
<button class="modus-btn" data-modus="druck">📄 PDF erstellen</button>
<button class="modus-btn" data-modus="training_einfach">🃏 Online-Training</button>
<button class="modus-btn" data-modus="statistik">📊 Statistik</button>
</div>
<div id="pdfPages" class="modus-view">
<div id="pdfPages">
<div id="kartenContainer"></div>
<div class="button-wrapper">
<button id="druckenBtn" style="display:none;">Drucken</button>
</div>
</div>
<div id="onlineTraining" class="modus-view">
<div id="onlineTraining">
<div id="trainingLevels">
<div id="trainingLevels" class="training-view">
<h3>Wählt einen Schwierigkeitsgrad:</h3>
<button class="level-btn" data-level="leicht">🟢 Leicht</button>
<button class="level-btn" data-level="mittel">🟡 Mittel</button>
<button class="level-btn" data-level="schwer">🔴 Schwer</button>
</div>
<div id="trainingLeicht" class="training-view modus-view"></div>
<div id="trainingMittel" class="training-view"></div>
<button onclick="checkMatching()">Überprüfen</button>
<div id="trainingLeicht" class="training-view"></div>
<div id="trainingMittel" class="training-view" style="display:none;"></div>
<div id="trainingSchwer" class="training-view"></div>
<div class="button-wrapper">
<button id="checkBtn" style="display:none;" onclick="pruefeRunde()">Überprüfen</button>
</div>
</div>
<div id="trainingContainer" style="display:none; text-align:center; margin-top:30px;"></div>