From cb3fc8ad45ccdfd2f95817451e90932ed2271303 Mon Sep 17 00:00:00 2001 From: Markus Graf Date: Sun, 29 Mar 2026 22:44:29 +0200 Subject: [PATCH] docs(05): capture phase context (assumptions mode) --- .../05-CONTEXT.md | 95 +++++++++++++++++++ .../05-DISCUSSION-LOG.md | 35 +++++++ 2 files changed, 130 insertions(+) create mode 100644 .planning/phases/05-multi-wald-system-wald-pagination-und-navigation-zwischen-w-ldern/05-CONTEXT.md create mode 100644 .planning/phases/05-multi-wald-system-wald-pagination-und-navigation-zwischen-w-ldern/05-DISCUSSION-LOG.md diff --git a/.planning/phases/05-multi-wald-system-wald-pagination-und-navigation-zwischen-w-ldern/05-CONTEXT.md b/.planning/phases/05-multi-wald-system-wald-pagination-und-navigation-zwischen-w-ldern/05-CONTEXT.md new file mode 100644 index 0000000..c43bb3c --- /dev/null +++ b/.planning/phases/05-multi-wald-system-wald-pagination-und-navigation-zwischen-w-ldern/05-CONTEXT.md @@ -0,0 +1,95 @@ +# Phase 5: Multi-Wald-System: Wald-Pagination und Navigation zwischen Wäldern - Context + +**Gathered:** 2026-03-29 (assumptions mode) +**Status:** Ready for planning + + +## Phase Boundary + +Der Wald hat aktuell ein 4x3 Grid (12 Slots). Mit 16 Stufen und je einem Waldelement pro Einheit füllt sich ein einzelner Wald schnell. Diese Phase fügt Pagination hinzu: Mehrere "Waldseiten" mit Navigation dazwischen. Das Kind kann zwischen gefüllten Wäldern blättern und sieht neue Elemente immer auf der aktuellen Seite. + + + +## Implementation Decisions + +### Pagination Data Model +- **D-01:** Wald-Seite wird aus dem Element-Index berechnet (`Math.floor(index / 12)`), kein neues Feld auf ForestElement, kein DB-Version-Bump. Elemente 1-12 = Wald 1, 13-24 = Wald 2, etc. +- **D-02:** `getForestElements()` gibt weiterhin alle Elemente zurück. Die Slicing-Logik liegt in `renderForestScene`. + +### Navigation UI +- **D-03:** Links/Rechts-Pfeiltasten neben der Waldszene + "Wald X von Y" Textanzeige. Keine Swipe-Gesten, keine Tab-Bar. +- **D-04:** Pfeiltasten sind kindgerecht gross (min 44px Touch-Target), Pastellfarben passend zum bestehenden Stil. Pfeil-Links deaktiviert auf Seite 1, Pfeil-Rechts deaktiviert auf letzter Seite. + +### Aktueller Wald in Progress +- **D-05:** Neues Feld `currentForestPage: number` im Progress-Singleton. Default 0. Wird bei Navigation aktualisiert und persistiert. +- **D-06:** Nach Lesson-Abschluss wird automatisch zur Seite navigiert, die das neue Element enthält (letzte Seite). + +### Rendering-Ansatz +- **D-07:** `renderForestScene` bekommt Page-Index-Parameter, slice-t Elements (`page * 12` bis `(page + 1) * 12`). Bestehendes tear-down-and-rebuild Pattern bleibt erhalten. +- **D-08:** Object-URL-Management bleibt wie bisher — nur die aktuelle Seite hat aktive Object URLs. + +### Claude's Discretion +- Exakte Pfeil-Button-Positionierung (über, neben, unter dem Grid) +- Animation beim Seitenwechsel (Slide, Fade, oder sofort) +- "Wald X von Y" Typography und Platzierung +- Ob bei nur einem Wald die Navigation ausgeblendet wird + + + +## Canonical References + +**Downstream agents MUST read these before planning or implementing.** + +### Forest System +- `src/forest/scene.ts` — Aktuelles Forest-Rendering, 12-Slot-Limit, `renderForestScene`, `initForestScreen`, `renderLevelMap` +- `src/forest/reward.ts` — Reward-Flow der neue Elemente speichert, `slotIndex = existing.length % 12` +- `src/types.ts` — `ForestElement` Interface, `Progress` Interface (Singleton) +- `src/storage/db.ts` — `getForestElements()`, `saveForestElement()`, DB-Schema + +### UI & Styling +- `src/styles/main.css` — Forest-Grid-Styling (`.forest__scene`, `.forest__element`) +- `index.html` — Forest-Screen DOM-Struktur (`screen-forest`) +- `src/ui/screens.ts` — Screen-Management + +### App Flow +- `src/app.ts` — `initForestScreen` Aufruf nach Reward, Navigation zwischen Screens + + + +## Existing Code Insights + +### Reusable Assets +- `renderForestScene(db, newElementId?)` — Kernfunktion, muss um Page-Parameter erweitert werden +- `initForestScreen(db, onStartLesson)` — Init-Punkt für Navigation-UI-Setup +- `getForestElements(db)` — Gibt alle Elemente zurück, bereits für Slicing geeignet +- Object-URL-Management in `activeObjectUrls` — Verhindert Memory Leaks + +### Established Patterns +- Tear-down-and-rebuild: `grid.innerHTML = ""` + Neuaufbau bei jedem Render +- Singleton Progress mit `getProgress`/`saveProgress` für Zustandspersistenz +- CSS-Klassen mit BEM-Notation (`.forest__element`, `.forest__element--new`) +- Button-Patterns: `continueBtn` in Forest, Level-Cards als Buttons + +### Integration Points +- `renderForestScene` wird von `initForestScreen` und nach Reward aufgerufen +- `reward.ts` berechnet `slotIndex` — muss Pagination berücksichtigen +- `app.ts` steuert den Flow zwischen Screens — Forest-Init muss korrekte Seite laden +- Progress wird bei jedem Forest-Init gelesen — neues Feld wird automatisch mitgeladen + + + +## Specific Ideas + +No specific requirements — open to standard approaches + + + +## Deferred Ideas + +None — analysis stayed within phase scope + + +--- + +*Phase: 05-multi-wald-system-wald-pagination-und-navigation-zwischen-w-ldern* +*Context gathered: 2026-03-29 via assumptions mode* diff --git a/.planning/phases/05-multi-wald-system-wald-pagination-und-navigation-zwischen-w-ldern/05-DISCUSSION-LOG.md b/.planning/phases/05-multi-wald-system-wald-pagination-und-navigation-zwischen-w-ldern/05-DISCUSSION-LOG.md new file mode 100644 index 0000000..fd419cb --- /dev/null +++ b/.planning/phases/05-multi-wald-system-wald-pagination-und-navigation-zwischen-w-ldern/05-DISCUSSION-LOG.md @@ -0,0 +1,35 @@ +# Phase 5: Multi-Wald-System — Discussion Log (Assumptions Mode) + +> **Audit trail only.** Do not use as input to planning, research, or execution agents. +> Decisions captured in CONTEXT.md — this log preserves the analysis. + +**Date:** 2026-03-29 +**Phase:** 05-multi-wald-system-wald-pagination-und-navigation-zwischen-w-ldern +**Mode:** assumptions +**Areas analyzed:** Pagination Data Model, Navigation UI, Aktueller Wald in Progress, Rendering-Ansatz + +## Assumptions Presented + +### Pagination Data Model +| Assumption | Confidence | Evidence | +|------------|-----------|----------| +| Wald-Seite aus Element-Index berechnen, kein DB-Schema-Change | Likely | src/forest/reward.ts slotIndex, src/types.ts ForestElement, src/storage/db.ts DB_VERSION=1 | + +### Navigation UI +| Assumption | Confidence | Evidence | +|------------|-----------|----------| +| Links/Rechts-Pfeiltasten + "Wald X von Y" Anzeige | Likely | Zielgruppe 7 Jahre, bestehende Button-Patterns, Forest-Grid absolut positioniert | + +### Aktueller Wald in Progress +| Assumption | Confidence | Evidence | +|------------|-----------|----------| +| currentForestPage im Progress-Singleton persistieren | Confident | Progress ist Singleton, wird bei jedem Forest-Init gelesen | + +### Rendering-Ansatz +| Assumption | Confidence | Evidence | +|------------|-----------|----------| +| renderForestScene mit Page-Parameter, Slice statt Pre-Rendering | Confident | Bestehendes tear-down-rebuild Pattern, activeObjectUrls Management | + +## Corrections Made + +No corrections — all assumptions confirmed.