---
phase: quick
plan: 260329-uos
type: execute
wave: 1
depends_on: []
files_modified:
- src/game/levels.ts
- src/game/words.ts
- src/game/words.test.ts
- src/game/levels.test.ts
- src/game/keyboard.ts
- src/companion/fallbacks.ts
autonomous: true
requirements: []
must_haves:
truths:
- "Levels 1-16 decken den gesamten QWERTZ-Bereich ab: A-Z, ö, ä, ü, Komma, Punkt"
- "Jedes Level fügt genau 2 neue Tasten hinzu (Ausnahme: Level 1 hat 3, Level 16 hat 1)"
- "Jedes Level hat mindestens 8 passende deutsche Wörter (max 5 Zeichen)"
- "Alle Wörter eines Levels verwenden nur bis dahin bekannte Buchstaben"
- "Alle Tests bestehen (levels.test.ts, words.test.ts)"
artifacts:
- path: "src/game/levels.ts"
provides: "16 Level-Definitionen mit korrekten allKeys und fingerMap"
contains: "level: 16"
- path: "src/game/words.ts"
provides: "Wortlisten für alle 16 Level"
contains: "wordsByLevel"
- path: "src/game/levels.test.ts"
provides: "Aktualisierte Tests für 16 Level"
- path: "src/game/words.test.ts"
provides: "Aktualisierte Tests für 16 Level"
key_links:
- from: "src/game/words.ts"
to: "src/game/levels.ts"
via: "getKeysUpToLevel validiert erlaubte Buchstaben"
pattern: "getKeysUpToLevel"
---
Erweitere die Level-Definitionen von 6 auf 16 Level, sodass der gesamte QWERTZ-Tastaturbereich abgedeckt ist: A-Z plus ö, ü, ä sowie Komma und Punkt.
Purpose: Das Kind kann schrittweise alle Tasten der Tastatur erlernen, nicht nur die ersten 12 Buchstaben.
Output: Vollständige Level-Definitionen (levels.ts), Wortlisten (words.ts), aktualisierte Tests, Keyboard-Layout mit Komma/Punkt, Fallback-Texte für neue Buchstaben.
@.planning/quick/260329-uos-level-erweiterung-f-r-gesamten-tastaturb/260329-uos-CONTEXT.md
@src/game/levels.ts
@src/game/words.ts
@src/game/words.test.ts
@src/game/levels.test.ts
@src/game/keyboard.ts
@src/companion/fallbacks.ts
From src/types.ts:
```typescript
export interface Level {
level: number;
newKeys: string[];
allKeys: string[]; // cumulative keys up to this level
fingerMap: Record; // key -> CSS variable name for finger color
}
```
From src/companion/fallbacks.ts:
```typescript
interface LetterIntro {
letter: string;
finger: string;
text: string;
}
export const fallbackLetterIntros: LetterIntro[];
export function getFallbackLetterIntro(letter: string): LetterIntro | undefined;
```
Task 1: Level-Definitionen und fingerMap erweitern (levels.ts + keyboard.ts)
src/game/levels.ts, src/game/keyboard.ts
Erweitere levels.ts mit den Levels 7-16. Die didaktische Reihenfolge (pro Level 2 neue Tasten, links/rechts-Paar wo möglich):
**Bestehend (unverändert):**
- Level 1: f, j, Leertaste
- Level 2: d, k
- Level 3: s, l
- Level 4: a, ö
- Level 5: g, h
- Level 6: e, i
**Neue Level — Obere Reihe (Zeigefinger zuerst, dann Ring, dann Kleinfinger):**
- Level 7: r, u (Zeigefinger hoch, links/rechts)
- Level 8: t, z (Zeigefinger hoch innen, links/rechts)
- Level 9: w, o (Ringfinger hoch, links/rechts)
- Level 10: q, p (Kleinfinger hoch, links/rechts)
**Neue Level — Untere Reihe:**
- Level 11: n, b (Zeigefinger runter, rechts/links — n häufig, b häufig)
- Level 12: v, m (Zeigefinger runter, links/rechts)
- Level 13: c, x (Mittelfinger/Ringfinger runter, links)
**Umlaute und Satzzeichen:**
- Level 14: ä, ü (Kleinfinger rechts — restliche Umlaute)
- Level 15: y, "," (Kleinfinger links unten + Mittelfinger rechts)
- Level 16: "." (Ringfinger rechts — letzter Satzzeichen-Key, solo)
Jedes Level-Objekt braucht:
- `level`: fortlaufende Nummer
- `newKeys`: Array der neuen Tasten
- `allKeys`: kumulativ alle Tasten bis einschließlich dieses Levels
- `fingerMap`: das bestehende shared fingerMap-Objekt
**fingerMap erweitern** — Füge diese zwei Einträge hinzu:
```typescript
",": "--finger-r-mid",
".": "--finger-r-ring",
```
**keyboard.ts anpassen:**
1. Füge "," und "." zur unteren Reihe hinzu in KEYBOARD_ROWS_DE und KEYBOARD_ROWS_CH:
`["y", "x", "c", "v", "b", "n", "m", ",", "."]`
2. Füge zum fingerColorMap hinzu:
```
",": "--finger-r-mid",
".": "--finger-r-ring",
```
cd /home/dev/workspace/zauberwald && npx vitest run src/game/levels.test.ts 2>&1 | tail -20
16 Level-Definitionen in levels.ts, fingerMap enthält Komma und Punkt, Keyboard-Layout zeigt Komma und Punkt in unterer Reihe
Task 2: Wortlisten und Fallback-Texte für neue Level
src/game/words.ts, src/companion/fallbacks.ts
**words.ts:** Erweitere wordsByLevel mit Einträgen für Level 7-16. Jedes Level braucht mindestens 10 echte deutsche Wörter (max 5 Zeichen), die NUR bis dahin bekannte Buchstaben verwenden. WICHTIG: Wörter sorgfältig prüfen — jeder Buchstabe muss in allKeys des Levels enthalten sein.
Wortlisten (Vorschlag, Executor soll gegen allKeys validieren):
```typescript
// Level 7: +r, u — bekannt: f,j,d,k,s,l,a,ö,g,h,e,i,r,u
7: ["ruhe", "reis", "reif", "rief", "drei", "fuhr", "krug", "ufer", "raus", "sure"],
// Level 8: +t, z — bekannt: ...+t,z
8: ["zeit", "ziel", "tier", "tief", "fest", "rest", "sitz", "kreuz", "hitze", "reist"],
// Level 9: +w, o — bekannt: ...+w,o
9: ["wort", "rose", "dorf", "wohl", "dort", "forst", "rost", "ohr", "woher", "trotz"],
// Level 10: +q, p — bekannt: ...+q,p
10: ["topf", "kopf", "quer", "post", "pferd" /* wait p,f,e,r,d all known? yes */, "opfer", "sport", "stolp", "preis", "pflug" /* p,f,l,u,g yes */],
// ACHTUNG: "pferd" = 5 chars, OK. "pflug" = 5 chars, OK. "stolp" kein echtes Wort -> ersetzen
// Level 11: +n, b — bekannt: ...+n,b
11: ["bein", "nein", "blind", "blond", "braun", "brot", "neben", "innen", "bone" /* not German */, "nebst"],
// Besser: "bein", "nein", "blind", "blond", "braun", "brot", "nebst", "brand", "gib", "bin"
// Level 12: +v, m — bekannt: ...+v,m
12: ["vorn", "helm", "form", "mund", "viel", "mein", "warm", "maus", "dampf" /* d,a,m,p,f OK */, "stumm"],
// Level 13: +c, x — bekannt: ...+c,x
13: ["dach", "nach", "buch", "milch", "fach", "such", "text", "hexe", "fix", "mach"],
// ACHTUNG: "milch" = 5 chars OK. Prüfe alle Buchstaben!
// Level 14: +ä, ü — bekannt: ...+ä,ü
14: ["über", "übel", "fährt", "wählt" /* 5 chars */, "hüpft" /* 5 */, "grün", "kühl", "spät", "gemüt" /* 5 */, "würde" /* 5 */],
// ACHTUNG: sorgfältig prüfen dass alle Buchstaben bekannt!
// Level 15: +y, "," — bekannt: ...+y (Komma kommt in Wörtern nicht vor)
15: ["baby", "typ", "idyll", "yoga" /* y,o,g,a OK */, "party", "handy", "happy" /* kein dt Wort, aber eingebürgert */, "hobby", "yacht" /* y,a,c,h,t */, "style" /* s,t,y,l,e */],
// Besser echte/eingebürgerte deutsche Wörter: "typ", "yacht", "handy", "party", "hobby", "baby", "yoga", "lyrik" /* 5 */, "idyll", "hymne"
// Level 16: +"." — Punkt kommt in Wörtern nicht vor, verwende kurze Sätze oder Wörter mit Punkt-Übung
16: ["da.", "so.", "gut.", "ja.", "hier.", "dort.", "fein.", "wohl.", "mein.", "doch."],
```
Der Executor soll die endgültigen Wortlisten IMMER gegen die validateWordList()-Funktion prüfen. Bei Level 15-16 (Komma/Punkt) können die Wörter das Satzzeichen enthalten oder nicht — das Satzzeichen wird im Letter-Modus separat geübt.
Kommentar-Stil beibehalten: `// Level N: +key1, key2 — "wort1", "wort2", ... sind echte Wörter`
**fallbacks.ts:** Erweitere fallbackLetterIntros mit kindgerechten Einführungstexten für alle neuen Buchstaben. Pattern beibehalten: { letter, finger, text }. Finger-Zuordnung aus fingerMap. Kommentar `// --- Fallback Letter Introductions (XX entries, levels 1-16) ---` aktualisieren.
Neue Einträge (Reihenfolge nach Level):
- r: "linker Zeigefinger" — "Das R wohnt über dem F. Dein Zeigefinger klettert hoch wie ein Reh den Berg hinauf."
- u: "rechter Zeigefinger" — "Das U sitzt über dem J. Dein rechter Zeigefinger springt hoch wie ein Uhu!"
- t: "linker Zeigefinger" — "Das T liegt neben dem R zur Mitte hin. Ein kleiner Schritt für deinen Zeigefinger."
- z: "rechter Zeigefinger" — "Das Z ist neben dem U zur Mitte hin. Wie ein Zauberer erscheint es dort!"
- w: "linker Ringfinger" — "Das W wohnt über dem S. Dein Ringfinger klettert hoch wie der Wind in die Wolken."
- o: "rechter Ringfinger" — "Das O ist rund wie der Mond. Dein rechter Ringfinger findet es über dem L."
- q: "linker kleiner Finger" — "Das Q wohnt ganz oben links. Dein kleiner Finger streckt sich hoch wie eine Quelle sprudelt."
- p: "rechter kleiner Finger" — "Das P sitzt ganz oben rechts. Dein kleiner Finger tippt es leicht wie Popcorn platzt."
- n: "rechter Zeigefinger" — "Das N liegt unter dem J. Dein Zeigefinger taucht hinab wie ein Nilpferd ins Wasser."
- b: "linker Zeigefinger" — "Das B versteckt sich unter dem G. Dein Zeigefinger springt hinunter wie ein Ball."
- v: "linker Zeigefinger" — "Das V liegt unter dem F. Dein Zeigefinger rutscht hinab wie ein Vogel, der landet."
- m: "rechter Zeigefinger" — "Das M ist unter dem J, ganz unten. Dein Zeigefinger taucht tief wie eine Maus in ihren Bau."
- c: "linker Mittelfinger" — "Das C liegt unter dem D. Dein Mittelfinger gleitet hinunter wie ein Chamäleon."
- x: "linker Ringfinger" — "Das X versteckt sich unter dem S. Dein Ringfinger findet es wie einen geheimen Schatz."
- ä: "rechter kleiner Finger" — "Das Ä hat zwei Pünktchen wie das Ö. Dein kleiner Finger rechts kennt den Weg schon."
- ü: "rechter kleiner Finger" — "Das Ü ist das dritte mit Pünktchen. Dein kleiner Finger tippt es neben dem P."
- y: "linker kleiner Finger" — "Das Y versteckt sich ganz unten links. Dein kleiner Finger findet es wie einen Yeti im Schnee."
- ",": "rechter Mittelfinger" — "Das Komma ist ein kleiner Strich unten. Dein Mittelfinger rechts tippt es neben dem M."
- ".": "rechter Ringfinger" — "Der Punkt ist wie ein kleiner Stein. Dein Ringfinger rechts tippt ihn neben dem Komma."
cd /home/dev/workspace/zauberwald && npx vitest run src/game/words.test.ts 2>&1 | tail -20
Alle 16 Level haben Wortlisten mit mindestens 8 echten deutschen Wörtern, validateWordList() bestätigt Korrektheit, fallbackLetterIntros hat Einträge für alle neuen Tasten
Task 3: Tests aktualisieren für 16 Level
src/game/levels.test.ts, src/game/words.test.ts
**levels.test.ts:**
1. Ändere `has exactly 6 entries` → `has exactly 16 entries` mit `expect(levels).toHaveLength(16)`
2. Füge Tests für die neuen Level 7-16 hinzu im gleichen Pattern:
```typescript
it("Level 7 newKeys = ['r', 'u']", () => { expect(levels[6]!.newKeys).toEqual(["r", "u"]); });
// ... bis Level 16
```
3. Aktualisiere den Test "Level 6 allKeys contains 13 keys" — lasse ihn bestehen, füge aber einen neuen Test hinzu:
```typescript
it("Level 16 allKeys contains all QWERTZ keys", () => {
const expected = "fjdkslagöheiruztwopqnbvmcxäüy,.".split("").concat([" "]);
expect(levels[15]!.allKeys).toHaveLength(expected.length);
for (const key of expected) {
expect(levels[15]!.allKeys).toContain(key);
}
});
```
4. Der bestehende Test "each key in allKeys has a fingerMap entry" bleibt unverändert — er prüft automatisch alle Level.
**words.test.ts:**
1. Ändere alle `<= 6` Schleifen zu `<= 16`
2. Ändere `"has entries for levels 1-6"` → `"has entries for levels 1-16"`
3. Der validateWordList-Test und die anderen bestehenden Tests funktionieren automatisch für alle Level durch die Schleifen.
4. Füge einen expliziten Test hinzu:
```typescript
it("validateWordList confirms all words use only allowed keys", () => {
expect(validateWordList()).toBe(true);
});
```
cd /home/dev/workspace/zauberwald && npx vitest run src/game/levels.test.ts src/game/words.test.ts 2>&1 | tail -30
Alle Tests bestehen, 16 Level vollständig getestet, validateWordList bestätigt Korrektheit aller Wortlisten
```bash
cd /home/dev/workspace/zauberwald && npx vitest run 2>&1 | tail -30
```
Alle Tests müssen bestehen. Speziell:
- levels.test.ts: 16 Level korrekt definiert
- words.test.ts: Alle Wortlisten valide (nur erlaubte Buchstaben, max 5 Zeichen, min 8 Wörter pro Level)
- src/game/levels.ts enthält 16 Level-Definitionen
- Letztes Level (16) hat alle QWERTZ-Buchstaben + ö, ä, ü, Komma, Punkt in allKeys
- fingerMap enthält Einträge für "," und "."
- keyboard.ts zeigt Komma und Punkt in der unteren Reihe
- Jedes Level hat mindestens 8-10 deutsche Wörter in words.ts
- fallbackLetterIntros hat kindgerechte Texte für alle neuen Tasten
- Alle bestehenden und neuen Tests bestehen