JavaScript must be enabled to play.
Browser lacks capabilities required to play.
Upgrade or switch to another browser.
Loading…
<<run Save.browser.slot.save(0, setup.aktuellerWortschatzName)>> <<nobr>> /* In der Frage-Passage und Ergebnis-Passage ersetzen: */ <<run Save.browser.slot.save(0, setup.aktuellerWortschatzName)>> /* ========================================== LOKALES CSS NUR FÜR DIESE PASSAGE ========================================== */ <style> /* Container für die Zentrierung aller Elemente */ .zentrierter-inhalt { text-align: center; max-width: 600px; /* Begrenzt die Breite für bessere Lesbarkeit */ margin: 0 auto; /* Zentriert den Container selbst auf dem Bildschirm */ } /* Das sanfte Pulsieren der Opazität (70% bis 100%) */ @keyframes bonusPulsieren { 0%, 100% { opacity: 0.7; } 50% { opacity: 1; } } /* Die Klasse für den gelben Bonustext */ .bonus-text-animiert { color: #ffd700 !important; display: block; margin: 0 0 15px 0; animation: bonusPulsieren 1.5s ease-in-out infinite; transition: opacity 0.3s ease; text-align: center; } /* Die normale Klasse für die Frage nach dem Tausch */ .frage-normal { color: #fff !important; display: block; margin: 0 0 15px 0; opacity: 1 !important; animation: none !important; text-align: center; } /* Button-Verhalten für die Zentrierung anpassen */ .antwort-buttons button { font-size: 1.5em !important; /* Schrift dezent größer */ padding: 10px 20px !important; /* Mehr Klickfläche im Button */ min-width: 200px; /* Verhindert winzige Buttons bei kurzen Wörtern */ cursor: pointer; margin: 0 auto 20px auto !important; /* Zentriert die Buttons und hält Abstand nach unten */ display: block; /* Macht die Buttons zu Block-Elementen für die Zentrierung */ } </style> <div class="zentrierter-inhalt"> <<if $fragenIndex < $aktuelleRunde.length>> <<set $aktuellesPaar to $aktuelleRunde[$fragenIndex]>> /* 1. Score-Faktor bestimmen */ <<set $faktor to $aktuellesPaar.scoreFaktor or 1>> /* 2. Alle Optionen in eine Liste packen (und Duplikate des richtigen Wortes aus den falschen löschen) */ <<set _bereinigteFalschen to $aktuellesPaar.falsch.filter(function(wort) { return wort !== $aktuellesPaar.richtig; })>> <<set $optionen to [$aktuellesPaar.richtig].concat(_bereinigteFalschen)>> /* 3. Die Optionen komplett durchmischen */ <<run $optionen.shuffle()>> /* TEXT- UND ATTRIBUT-TAUSCH DIREKT AUF DERSELBEN ID */ <<if $zeigeFeuerwerk>> <h3 id="dynamische-frage" class="bonus-text-animiert">⭐ Belohnung! $streakY Minuten extra! ⭐</h3> /* Nach 4 Sekunden tauschen wir Text und Klasse aus */ <<run setTimeout(function() { var el = document.getElementById('dynamische-frage'); if (el) { el.innerHTML = 'Welches ist richtig?'; el.className = 'frage-normal'; } }, 4000)>> <<else>> <h3 id="dynamische-frage" class="frage-normal">Welches ist richtig?</h3> <</if>> <<if $faktor > 1>> <span style="color: #ffd700; display: block; text-align: center;">⭐ Schweres Wort (<<print $basisMinuten * $faktor>> Minuten extra!)</span><br> <</if>> <div class="antwort-buttons"> <<for _i = 0; _i < $optionen.length; _i++>> <<capture _i>> <<button $optionen[_i]>> <<if $optionen[_i] === $aktuellesPaar.richtig>> /* RICHTIG: Basis-Minuten dazurechnen */ <<set _gewinn to $basisMinuten * $faktor>> /* Streak überprüfen */ <<set $richtigInFolge += 1>> <<if $streakX > 0 and $richtigInFolge >= $streakX>> <<set _gewinn += $streakY>> <<set $richtigInFolge to 0>> <<set $zeigeFeuerwerk to true>> <</if>> /* Minuten sauber runden */ <<set $minuten to Math.round(($minuten + _gewinn) * 100) / 100>> <<set $fragenIndex += 1>> <<goto "Frage-Passage">> <<else>> /* FALSCH: Die Strähne ist gerissen -> Zähler zurück auf 0! */ <<set $richtigInFolge to 0>> /* Daten merken und in den Fehler-Buffer */ <<set $letztesPaar to $aktuellesPaar>> <<set $gewaehltesWort to $optionen[_i]>> <<run $fehlerBuffer.push($aktuellesPaar)>> <<set $fragenIndex += 1>> <<goto "Falsch-Passage">> <</if>> <</button>> <</capture>> <</for>> </div> <<else>> <<goto "Zwischenseite-Passage">> <</if>> </div> <</nobr>>
/* In der Frage-Passage und Ergebnis-Passage ersetzen: */ <<run Save.browser.slot.save(0, setup.aktuellerWortschatzName)>> <h2>Fertig!</h2> Du hast $minuten Minuten Filmzeit gewonnen! [[Nochmal spielen|Start]]
<<run DebugView.disable()>>
<<nobr>> <<if tags().includes("mit-footer")>> /* AUTOMATISCHER AUSLÖSER: Wenn der Bonus geknackt wurde, schießen wir das Profi-Konfetti ab */ <<if $zeigeFeuerwerk>> <img src="x" onerror="feuerwerk(); this.remove();" style="display:none;"> <<set $zeigeFeuerwerk to false>> /* Direkt wieder ausschalten für die nächste Frage */ <</if>> <hr> <div style="text-align: center; font-size: 0.9em; color: #aaa; line-height: 1.6;"> /* Erste Zeile: Runde, Frage und der Countdown zur Belohnung */ Runde: <strong>$runde</strong> | Frage: <strong><<print $fragenIndex + 1>></strong>/<strong><<print $aktuelleRunde.length>></strong> /* Zeigt den Countdown nur an, wenn ein Streak im JSON eingestellt ist */ <<if $streakX > 0>> | 🌟 <strong><<print $streakX - $richtigInFolge>></strong> bis Bonus <</if>> /* Zeilenumbruch */ <br> /* Zweite Zeile: Die Filmzeit als Highlight */ <span style="color: #66ff66; font-size: 1.1em; display: inline-block; margin-top: 5px;"> 🎬 Filmzeit: <strong>$minuten</strong> Minuten </span> /* Dritte Zeile: Tipp als Hilfe einblenden (falls aktiv) */ <<if $tippsImmerAnzeigen and $aktuellesPaar and $aktuellesPaar.tipp>> <br> <span style="color: #00ffcc; font-style: italic; display: inline-block; margin-top: 5px; font-size: 0.95em;"> 💡 Hinweis: $aktuellesPaar.tipp </span> <</if>> /* Vierte Zeile: Geladene JSON-Datei */ <br> <span style="color: #777; font-size: 0.8em; display: inline-block; margin-top: 8px;"> <<print setup.aktuellerWortschatzName>>.json </span> </div> <</if>> <</nobr>>
<<if $fehlerBuffer.length > 0>> <h2>Runde $runde beendet!</h2> <p>Du hast diese Runde <<print $fehlerBuffer.length>> Fehler gemacht.</p> <p>Diese Wörter wiederholen wir jetzt in der nächsten Runde!</p> <<set $aktuelleRunde to clone($fehlerBuffer)>> <<set $fehlerBuffer to []>> <<set $fragenIndex to 0>> <<set $runde += 1>> <<button "Fehler-Runde starten">> <<goto "Frage-Passage">> <</button>> <<else>> <<goto "Ergebnis-Passage">> <</if>>
<<nobr>> <h2>Leider nicht ganz richtig!</h2> /* ÜBERPRÜFUNG AUF REINE GROSS-/KLEINSCHREIBUNG */ <<if $gewaehltesWort.toLowerCase() === $letztesPaar.richtig.toLowerCase()>> <p><strong>Fast richtig!</strong> Du hast das Wort eigentlich richtig im Kopf, aber die <strong>Groß- und Kleinschreibung</strong> nicht beachtet.</p> <p>Es heißt nicht <span style="color: #ff9900">$gewaehltesWort</span>. Denk daran: Nomen (Substantive) schreiben wir groß!</p> <<else>> /* Ein echter Rechtschreibfehler -> Hier zeigen wir deine originale Meldung UND den Tipp */ <p>Du hast <strong><<print $letztesPaar.richtig>></strong> falsch geschrieben. Es heißt nicht <span style="color: #ff6666">$gewaehltesWort</span>.</p> <<if $letztesPaar.tipp>> <p><em>Tipp: <<print $letztesPaar.tipp>></em></p> <</if>> <</if>> <hr style="margin: 20px 0;"> <p>Merke dir die richtige Schreibweise:</p> <h1 style="color: #66ff66; letter-spacing: 1px; margin-bottom: 30px;">$letztesPaar.richtig</h1> <<button "Weiter zur nächsten Frage">> <<goto "Frage-Passage">> <</button>> <</nobr>>
<<nobr>> <style> /* Container für die Zentrierung */ .karteikarte-inhalt { text-align: center; max-width: 600px; margin: 0 auto; } /* Styling für die großen Wort-Anzeigen - ABSTAND VERKLEINERT */ .wort-anzeige { font-size: 2.0em; font-weight: bold; margin: 8px 0; letter-spacing: 1px; line-height: 1.2; /* Hinzugefügt: Verringert den Abstand zwischen den Zeilen */ } /* Einheitliche Formatierung für ALLE Buttons im Spiel (Blau, Grün, Rot) */ .karteikarte-inhalt button { font-size: 1.1em !important; padding: 10px 20px !important; min-width: 140px; cursor: pointer; margin: 3px !important; display: inline-block; box-sizing: border-box; /* Sorgt für identische Höhenberechnung */ } /* Spezifische Farben für die Buttons */ .btn-loesung button { background-color: #4361ee !important; border-color: #3f37c9 !important; color: #ffffff !important; } .btn-ja button { background-color: #2eb82e !important; border-color: #208020 !important; } .btn-nein button { background-color: #cc3333 !important; border-color: #992626 !important; } /* Flex-Container für die Buttons nebeneinander */ .button-reihe { display: flex; justify-content: center; align-items: center; /* Zentriert die Elemente vertikal zueinander */ gap: 6px; /* Abstand zwischen den Elementen */ margin-top: 15px; margin-bottom: 15px; } /* Spezielles Styling für den Audio-Button - Dynamisch exakt quadratisch und bündig mit Text-Buttons */ .btn-audio-icon button { min-width: 0 !important; /* Berechnet die exakte Breite basierend auf Schriftgröße und Padding der Text-Buttons */ width: calc(1.1em * 1.2 + 20px) !important; height: calc(1.1em * 1.2 + 20px) !important; padding: 0 !important; font-size: 1.2em !important; /* Passt die Icon-Größe harmonisch an */ display: inline-flex !important; align-items: center; justify-content: center; margin: 0 !important; } /* Verhindert zusätzliche Margins bei den Buttons in der Reihe */ .button-reihe span button { margin: 0 !important; } </style> <div class="karteikarte-inhalt"> /* Index-Korrektur falls das Einstellungs-Objekt noch im Array existiert */ <<set _wirklicherIndex to $fragenIndex>> <<if $aktuelleRunde[0] and $aktuelleRunde[0].istEinstellung>> <<set _wirklicherIndex to $fragenIndex + 1>> <</if>> <<if _wirklicherIndex < $aktuelleRunde.length>> <<set $aktuellesPaar to $aktuelleRunde[_wirklicherIndex]>> <<done>> <<run Save.browser.slot.save(0, setup.aktuellerWortschatzName)>> <</done>> /* 1. Score-Faktor für die Filmminuten bestimmen */ <<set $faktor to $aktuellesPaar.scoreFaktor or 1>> /* Dynamische Zuweisung von Texten und Audio-Variablen basierend auf $switchQA */ <<if $switchQA>> <<set _frageText to "Wie heißt das auf Deutsch?">> <<set _anzeigeVorne to $aktuellesPaar.englisch>> <<set _anzeigeHinten to $aktuellesPaar.deutsch>> <<set _audioVorneKey to "audio_en">> <<set _audioHintenKey to "audio_de">> <<else>> <<set _frageText to "Wie heißt das auf Englisch?">> <<set _anzeigeVorne to $aktuellesPaar.deutsch>> <<set _anzeigeHinten to $aktuellesPaar.englisch>> <<set _audioVorneKey to "audio_de">> <<set _audioHintenKey to "audio_en">> <</if>> <div id="schritt-vorderseite"> <p style="color: #aaa; font-size: 1.1em; margin-bottom: 2px;">_frageText</p> <div class="wort-anzeige" style="color: #00ffcc;"> _anzeigeVorne </div> /* Unsichtbares Audio-Element für die Frage, das sofort abspielt */ <audio autoplay id="audio-first"> <source s_c_="true" id="src-first"> </audio> <<run setTimeout(function() { var aud = document.getElementById('audio-first'); var audioDaten = setup.audioSpeicher[State.variables.aktuellesPaar.id]; var key = State.temporary.audioVorneKey; if(aud && audioDaten && audioDaten[key]) { aud.src = audioDaten[key]; aud.play().catch(function(e){ console.log("Autoplay blockiert"); }); } }, 50)>> <div class="button-reihe"> /* Lautsprecher-Button für die Vorderseite */ <span class="btn-loesung btn-audio-icon"> <<button "🔊">> <<run var aud = document.getElementById('audio-first'); var audioDaten = setup.audioSpeicher[State.variables.aktuellesPaar.id]; var key = State.temporary.audioVorneKey; if(aud && audioDaten && audioDaten[key]) { aud.currentTime = 0; /* Ton zurückspulen */ aud.play().catch(function(e){ console.log("Audio blockiert"); }); } >> <</button>> </span> /* Lösung-Button */ <span class="btn-loesung"> <<button "Lösung">> <<replace "#loesungs-bereich">><</replace>> <<run jQuery("#schritt-rueckseite").show();>> <<run var audBack = document.getElementById('audio-second'); var audioDaten = setup.audioSpeicher[State.variables.aktuellesPaar.id]; var key = State.temporary.audioHintenKey; if(audBack && audioDaten && audioDaten[key]) { audBack.src = audioDaten[key]; audBack.play().catch(function(e){ console.log("Autoplay blockiert"); }); } >> <</button>> </span> </div> </div> <div id="loesungs-bereich"></div> <div id="schritt-rueckseite" style="display: none; margin-top: 10px;"> <hr style="margin: 15px 0; border-color: #444;"> <div class="wort-anzeige" style="color: #ffff00;"> _anzeigeHinten </div> /* Unsichtbares Audio-Element für die Antwort */ <audio id="audio-second"> <source s_c_="true" id="src-second"> </audio> <p style="font-size: 1.2em; margin-top: 15px; margin-bottom: 5px;"><strong>Hattest du es gewusst?</strong></p> /* Die Klasse button-reihe wurde hinzugefügt, damit der neue Audio-Button auf gleicher Höhe zentriert wird */ <div class="bewertung-buttons button-reihe"> /* Lautsprecher-Button für die Rückseite - HIER NACH UNTEN VERSCHOBEN */ <span class="btn-loesung btn-audio-icon"> <<button "🔊">> <<run var aud = document.getElementById('audio-second'); var audioDaten = setup.audioSpeicher[State.variables.aktuellesPaar.id]; var key = State.temporary.audioHintenKey; if(aud && audioDaten && audioDaten[key]) { aud.currentTime = 0; /* Ton zurückspulen */ aud.play().catch(function(e){ console.log("Audio blockiert"); }); } >> <</button>> </span> <span class="btn-ja"> <<button "Ja">> <<set _gewinn to $basisMinuten * $faktor>> <<set $richtigInFolge += 1>> /* Streak überprüfen */ <<if $streakX > 0 and $richtigInFolge >= $streakX>> <<set _gewinn += $streakY>> <<set $richtigInFolge to 0>> <<set $zeigeFeuerwerk to true>> <</if>> <<set $minuten to Math.round(($minuten + _gewinn) * 100) / 100>> <<set $fragenIndex += 1>> <<goto $zielPassage>> <</button>> </span> <span class="btn-nein"> <<button "Nein">> <<set $richtigInFolge to 0>> /* Daten für die Fehler-Passage zwischenspeichern */ <<set $letztesPaar to $aktuellesPaar>> <<run $fehlerBuffer.push($aktuellesPaar)>> <<set $fragenIndex += 1>> <<goto "Falsch-DEAudio_Speak_ListenTo_Confirm">> <</button>> </span> </div> </div> <<else>> <<goto "Zwischenseite-DEAudio_Speak_ListenTo_Confirm">> <</if>> </div> <</nobr>>
<<nobr>> <style> .fehler-audio-inhalt { text-align: center; max-width: 600px; margin: 0 auto; } .fehler-wort { font-size: 2.5em; font-weight: bold; margin: 10px 0; letter-spacing: 1px; } /* Formatierung für alle normalen Buttons in dieser Passage */ .fehler-audio-inhalt button { font-size: 1.3em !important; padding: 15px 30px !important; min-width: 220px; cursor: pointer; display: inline-block; box-sizing: border-box; /* Sorgt für identische Höhenberechnung */ } /* Blauer Button für das wiederholte Abspielen und Weiter */ .btn-loesung button { background-color: #4361ee !important; border-color: #3f37c9 !important; color: #ffffff !important; } /* Flex-Container, um Lautsprecher und Weiter-Button exakt gleich hoch nebeneinander anzuordnen */ .button-reihe { display: flex; justify-content: center; align-items: stretch; /* Zwingt den Audio-Button auf die exakte Höhe des Text-Buttons */ gap: 8px; margin-top: 20px; } /* Verhindert zusätzliche Margins bei den Buttons in der Reihe */ .button-reihe span { display: flex; /* Unterstützt die vertikale Streckung */ } .button-reihe span button { margin: 0 !important; } /* Spezielles Styling für den Audio-Button - Garantiert absolut bündig und quadratisch */ .btn-audio-icon button { min-width: 0 !important; width: auto !important; height: auto !important; /* Nutzt die Streckung des Containers */ aspect-ratio: 1 / 1 !important; /* Erzwingt ein perfektes Quadrat basierend auf der Höhe */ padding: 0 15px !important; /* Horizontale Zentrierungshilfe */ font-size: 1.4em !important; display: inline-flex !important; align-items: center; justify-content: center; } </style> <div class="fehler-audio-inhalt"> <h2>Merke dir das Wort:</h2> <div class="fehler-wort" style="color: #00ffcc;"> $letztesPaar.deutsch </div> <hr style="margin: 15px 0; border-color: #444;"> <div class="fehler-wort" style="color: #ffff00;"> $letztesPaar.englisch </div> /* Unsichtbarer Audio-Player für das englische Wort */ <audio autoplay id="fehler-audio-en"> <source s_c_="true" id="src-fehler-en"> </audio> <<run setTimeout(function() { var aud = document.getElementById('fehler-audio-en'); var audioDaten = setup.audioSpeicher[State.variables.letztesPaar.id]; if(aud && audioDaten && audioDaten.audio_en) { aud.src = audioDaten.audio_en; aud.play().catch(function(e){ console.log("Autoplay blockiert"); }); } }, 50)>> <p style="font-size: 1.1em; margin-top: 15px; margin-bottom: 15px; color: #ff9900;"> 💡 Schau dir das Wort genau an und sprich es laut nach! </p> <div class="button-reihe"> /* Quadratischer Lautsprecher-Button */ <span class="btn-loesung btn-audio-icon"> <<button "🔊">> <<run var aud = document.getElementById('fehler-audio-en'); var audioDaten = setup.audioSpeicher[State.variables.letztesPaar.id]; if(aud && audioDaten && audioDaten.audio_en) { aud.currentTime = 0; /* Ton zurückspulen */ aud.play().catch(function(e){ console.log("Audio blockiert"); }); } >> <</button>> </span> /* Weiter-Button */ <span class="btn-loesung"> <<button "Weiter zur nächsten Karte">> /* Dynamischer Rücksprung zur im JSON definierten Karteikarten-Passage */ <<goto $zielPassage>> <</button>> </span> </div> </div> <</nobr>>
<<nobr>> <style> /* Wiederverwendung des kompakten Karteikarten-Designs */ .zwischenseite-inhalt { text-align: center; max-width: 600px; margin: 0 auto; } /* Formatierung für den normalen Text-Button */ .zwischenseite-inhalt button { font-size: 1.3em !important; padding: 15px 30px !important; min-width: 220px; cursor: pointer; background-color: #4361ee !important; border-color: #3f37c9 !important; color: #ffffff !important; margin-top: 20px !important; display: inline-block; box-sizing: border-box; } </style> <div class="zwischenseite-inhalt"> <<if $fehlerBuffer.length > 0>> <h2>Runde $runde beendet!</h2> <p>Du hast in dieser Runde <strong><<print $fehlerBuffer.length>></strong> Fehler gemacht.</p> <p>Diese Wörter wiederholen wir jetzt direkt in der nächsten Runde!</p> /* Fehler-Buffer klonen und Variablen für die neue Runde vorbereiten */ <<set $aktuelleRunde to clone($fehlerBuffer)>> <<set $fehlerBuffer to []>> <<set $fragenIndex to 0>> <<set $runde += 1>> /* Mischen nur, wenn es laut JSON erlaubt ist */ <<if $sollShuffeln>> <<run $aktuelleRunde.shuffle()>> <</if>> <<button "Fehler-Runde starten">> /* Springt dynamisch zurück in deine Karteikarten-Schleife */ <<goto $zielPassage>> <</button>> <<else>> /* Alles richtig? Dann ab zur großen Auswertung */ <<goto "Ergebnis-DEAudio_Speak_ListenTo_Confirm">> <</if>> </div> <</nobr>>
/* In der Frage-Passage und Ergebnis-Passage ersetzen: */ <<run Save.browser.slot.save(0, setup.aktuellerWortschatzName)>> <h2>Fertig!</h2> Du hast $minuten Minuten Filmzeit gewonnen! [[Nochmal spielen|Start]]
<style> /* Container für die Zentrierung aller Elemente */ .zentrierter-inhalt { text-align: center; max-width: 600px; margin: 40px auto; } /* Allgemeine Button-Anpassung für die Zentrierung */ .zentrierter-inhalt button { font-size: 1.5em !important; padding: 10px 20px !important; min-width: 250px; cursor: pointer; margin: 0 auto 20px auto !important; display: block; } /* Spezielles CSS, das den "Neues Spiel"-Button grau färbt */ .grauer-button button { background-color: #7a7a7a !important; border-color: #5a5a5a !important; color: #ffffff !important; } .grauer-button button:hover { background-color: #5a5a5a !important; } </style> <<nobr>> <<if Save.browser.slot.has(0)>> /* ========================================== SPIELSTAND VORHANDEN: AUSWAHL ANZEIGEN ========================================== */ <div class="zentrierter-inhalt"> <h3>Hallo und willkommen zurück!</h3> <p>Hier kannst du Film-Minuten verdienen.</p> <p>Es gibt für diese Liste noch einen gespeicherten Fortschritt.</p> /* Button 1: Briefkasten-Trick für fehlerfreies Laden */ <<button "Letzten Spielstand laden">> <<run Save.browser.slot.load(0); sessionStorage.setItem("soll_laden", "ja"); window.location.reload(); >> <</button>> /* Button 2: Neues Spiel starten (mit Sicherheitsabfrage) */ <span class="grauer-button"> <<button "Neues Spiel starten">> <<script>> if (confirm("Möchtest du wirklich ein neues Spiel starten? Dein aktueller Fortschritt geht dabei verloren.")) { Save.browser.slot.delete(0); Engine.restart(); } <</script>> <</button>> </span> </div> <<else>> /* ========================================== KEIN SPIELSTAND: INITIALISIEREN & STARTEN ========================================== */ <<set $aktuelleRunde to clone(setup.wortschatz)>> /* Globale Einstellungen aus dem JSON laden */ <<if $aktuelleRunde[0].istEinstellung>> <<set $basisMinuten to $aktuelleRunde[0].standardMinuten>> <<set $streakX to $aktuelleRunde[0].streakAnzahl or 0>> <<set $streakY to $aktuelleRunde[0].streakBonus or 0>> <<set $tippsImmerAnzeigen to $aktuelleRunde[0].tippsImmerAnzeigen or false>> /* SWAP QUALITY/ANSWER STEUERUNG */ <<set $switchQA to $aktuelleRunde[0]["switch-qa"] or false>> /* SHUFFLE STEUERUNG */ <<set $sollShuffeln to ($aktuelleRunde[0].shuffle !== false)>> /* DYNAMISCHE PASSAGE AUSLESEN */ <<set $zielPassage to $aktuelleRunde[0]["query-passage"] or $aktuelleRunde[0].queryPassage or "Frage-Passage">> <<run $aktuelleRunde.shift()>> <<else>> /* Fallbacks, falls keine Einstellungen im JSON definiert sind */ <<set $basisMinuten to 0.25>> <<set $streakX to 0>> <<set $streakY to 0>> <<set $tippsImmerAnzeigen to false>> <<set $switchQA to false>> <<set $sollShuffeln to true>> <<set $zielPassage to "Frage-Passage">> <</if>> /* Variablen zurücksetzen & bedingtes Shuffeln */ <<if $sollShuffeln>> <<run $aktuelleRunde.shuffle()>> <</if>> <<set $fehlerBuffer to []>> <<set $fragenIndex to 0>> <<set $minuten to 0>> <<set $runde to 1>> <<set $richtigInFolge to 0>> <<set $zeigeFeuerwerk to false>> /* Unsichtbarer und direkter Sprung zur ermittelten Passage */ <<goto $zielPassage>> /* [[Frage-Passage-Finde-Das-Falsche-Wort]]*/ <</if>> <</nobr>>
<<nobr>> <style> /* Container für die Zentrierung */ .satz-inhalt { text-align: center; max-width: 700px; margin: 0 auto; } /* Gestaltet das Satzfeld groß und gut lesbar */ .satz-anzeige { font-size: 1.6em; line-height: 1.5em; /* WURDE GEÄNDERT: Zeilenabstand verringert */ margin: 30px 0; text-align: center; word-wrap: break-word; } /* Verwandelt Buttons in unsichtbare Text-Elemente */ .wort-button-wrap { display: inline; /* WURDE GEÄNDERT: Reines Inline-Verhalten für perfekten Textfluss */ margin: 0; } .wort-button-wrap button { background: none !important; border: none !important; color: #ffffff !important; font-size: 1em !important; padding: 0 !important; /* WURDE GEÄNDERT: Absolut kein innerer Puffer mehr */ margin: 0 !important; display: inline !important; cursor: pointer; font-weight: bold; border-radius: 4px; transition: background-color 0.2s, color 0.2s; } /* Sanfter Hover-Effekt für Kilian */ .wort-button-wrap button:hover { color: #00ffcc !important; background-color: rgba(0, 255, 204, 0.15) !important; text-decoration: underline; } /* Styling für den Debug-Bereich unten */ .debug-box { margin-top: 40px; padding: 10px; background-color: #1a1a1a; border: 1px dashed #555; border-radius: 6px; text-align: left; font-family: monospace; font-size: 0.85em; color: #aaa; } </style> <div class="satz-inhalt"> <<if $fragenIndex < $aktuelleRunde.length>> <<set $aktuellesPaar to $aktuelleRunde[$fragenIndex]>> <<set $faktor to $aktuellesPaar.scoreFaktor or 1>> <<done>> <<run Save.browser.slot.save(0, setup.aktuellerWortschatzName)>> <</done>> /* DIE RETTUNG: Wir suchen in der unveränderten Liste nach der passenden ID */ <<set _originalSatz to "">> <<for _j = 0; _j < setup.wortschatz.length; _j++>> <<if setup.wortschatz[_j].id === $aktuellesPaar.id>> /* ID gefunden! Jetzt holen wir uns den echten Satz aus den Rohdaten */ <<set _originalSatz to setup.wortschatz[_j].satz or "">> <<break>> <</if>> <</for>> <p style="color: #ffd700; margin-top: 0; margin-bottom: 20px;">Klicke auf das falsch geschriebene Wort!</p> <div class="satz-anzeige"> /* Den absolut synchronen Satz in einzelne Wörter zerlegen */ <<set _woerter to _originalSatz.split(" ")>> /* Loop durch alle Wörter des Satzes */ <<for _i = 0; _i < _woerter.length; _i++>> <<capture _i>> <span class="wort-button-wrap"> <<button _woerter[_i]>> /* WICHTIG: Erst HIER im Klick-Moment wird das angeklickte Wort bereinigt! */ <<set _reinesWort to _woerter[_i].replace(/[.,!?;:]/g, "").trim()>> <<set _zielFehler to $aktuellesPaar.falsch.trim()>> /* STRIKTER VERGLEICH: Passt das angeklickte Wort zur geladenen Karte? */ <<if _reinesWort === _zielFehler>> /* RICHTIG GEKLICKT: Punkte und Streak berechnen */ <<set _gewinn to $basisMinuten * $faktor>> <<set $richtigInFolge += 1>> <<if $streakX > 0 and $richtigInFolge >= $streakX>> <<set _gewinn += $streakY>> <<set $richtigInFolge to 0>> <<set $zeigeFeuerwerk to true>> <</if>> <<set $minuten to Math.round(($minuten + _gewinn) * 100) / 100>> <<set $fragenIndex += 1>> /* Bleibt in diesem Modus für den nächsten Satz */ <<goto "Frage-Passage-Finde-Das-Falsche-Wort">> <<else>> /* FALSCH GEKLICKT: Strähne reißt */ <<set $richtigInFolge to 0>> /* Daten für die Fehler-Passage vorbereiten */ <<set $letztesPaar to $aktuellesPaar>> <<set $gewaehltesWort to _reinesWort>> /* Satz für die Falsch-Passage zwischenspeichern */ <<set $letztesPaar.satz to _originalSatz>> <<run $fehlerBuffer.push($aktuellesPaar)>> <<set $fragenIndex += 1>> /* Weiterleitung zur Falsch-Passage */ <<goto "Falsch-Passage-Finde-Das-Falsche-Wort">> /* [[Falsch-Passage-Finde-Das-Falsche-Wort]] */ <</if>> <</button>> </span> <</capture>> <</for>> </div> /* ======================================================= */ /* DEBUG-BEREICH FÜR DIE FEHLERSUCHE */ /* ======================================================= */ /*<div class="debug-box"> <strong>⚙️ Debug-Informationen:</strong><br> • ID der Karte: <span style="color: #ff00ff;"><<print $aktuellesPaar.id>></span><br> • Gesuchtes Fehler-Wort (JSON): <span style="color: #ff6666;">"$aktuellesPaar.falsch"</span><br> • Richtiges Austausch-Wort (JSON): <span style="color: #66ff66;">"$aktuellesPaar.richtig"</span> </div> */ <<else>> <<goto "Zwischenseite-Passage-Finde-Das-Falsche-Wort">> /* [[Zwischenseite-Passage-Finde-Das-Falsche-Wort]] */ <</if>> </div> <</nobr>>
<<nobr>> <div style="text-align: center; max-width: 600px; margin: 0 auto;"> <p style="font-size: 1.1em; margin-bottom: 15px;">Du hast auf das Wort <span style="color: #00ffcc; font-size: 1.1em;">$gewaehltesWort</span> geklickt. Das ist aber richtig geschrieben.</p> <table style="width: 100%; margin: 15px auto; border-collapse: collapse; background-color: #222; border: 1px solid #444;"> <tr> <th style="width: 50%; padding: 8px; border: 1px solid #444; color: #aaa; font-weight: normal; font-size: 1em;">Falsch</th> <th style="width: 50%; padding: 8px; border: 1px solid #444; color: #aaa; font-weight: normal; font-size: 1em;">Richtig</th> </tr> <tr> <td style="padding: 12px; border: 1px solid #444; color: red; font-size: 1.2em; font-weight: bold;">$letztesPaar.falsch</td> <td style="padding: 12px; border: 1px solid #444; color: #00ffcc; font-size: 1.2em; font-weight: bold;">$letztesPaar.richtig</td> </tr> </table> /*<div style="background-color: #222; padding: 8px; border-radius: 4px; margin: 18px 0; border: 1px solid #444;"> <p style="color: #aaa; margin: 0 0 3px 0; font-size: 0.9em;">Der Satz war:</p> <p style="font-size: 1.1em; margin: 0; color: #ffffff;">"$letztesPaar.satz"</p> </div> */ /* Tipp aus dem JSON einblenden, falls vorhanden */ <<if $letztesPaar.tipp>> <div style="font-size: 1.1em; margin-bottom: 8px; line-height: 1.4em;"> <p style="color: #ffd700;">💡 Tipp für das nächste Mal:</p> <span style="color: #00ffcc;">$letztesPaar.tipp</span> </div> <</if>> <hr style="border-color: #444; margin-bottom: 15px; margin-top: 8px;"> <<button "Weiter zum nächsten Satz">> <<goto "Frage-Passage-Finde-Das-Falsche-Wort">> /* [[Frage-Passage-Finde-Das-Falsche-Wort]] */ <</button>> </div> <</nobr>>
<<if $fehlerBuffer.length > 0>> <h2>Runde $runde beendet!</h2> <p>Du hast diese Runde <<print $fehlerBuffer.length>> Fehler gemacht.</p> <p>Diese Sätze wiederholen wir jetzt in der nächsten Runde!</p> <<set $aktuelleRunde to clone($fehlerBuffer)>> <<set $fehlerBuffer to []>> <<set $fragenIndex to 0>> <<set $runde += 1>> <<button "Fehler-Runde starten">> <<goto "Frage-Passage-Finde-Das-Falsche-Wort">> <</button>> /* [[Frage-Passage-Finde-Das-Falsche-Wort]] */ <<else>> <<goto "Ergebnis-Passage-Finde-Das-Falsche-Wort">> /* [[Ergebnis-Passage-Finde-Das-Falsche-Wort]] */ <</if>>
/* In der Frage-Passage und Ergebnis-Passage ersetzen: */ <<run Save.browser.slot.save(0, setup.aktuellerWortschatzName)>> <h2>Fertig!</h2> Du hast $minuten Minuten Filmzeit gewonnen! [[Nochmal spielen|Start]]