diff --git a/.planning/REQUIREMENTS.md b/.planning/REQUIREMENTS.md index 5335e30..acdeeb7 100644 --- a/.planning/REQUIREMENTS.md +++ b/.planning/REQUIREMENTS.md @@ -13,14 +13,14 @@ Requirements for initial release (MVP). Each maps to roadmap phases. - [x] **FNDN-02**: Projektstruktur gemäss Spec Abschnitt 13 (alle Verzeichnisse + Dateien) - [x] **FNDN-03**: Alle TypeScript-Interfaces definiert (Progress, ForestElement, CompanionAssets, Level, etc.) - [x] **FNDN-04**: IndexedDB-Wrapper mit allen Stores (progress, companionAssets, styleReference, forestElements, settings) -- [ ] **FNDN-05**: Screen-Management: 5 Screens (welcome, forest, lesson, reward, parent), CSS fade Transitions +- [x] **FNDN-05**: Screen-Management: 5 Screens (welcome, forest, lesson, reward, parent), CSS fade Transitions ### Onboarding -- [ ] **ONBD-01**: Willkommens-Screen mit Begleitfigur-Auswahl (4 Karten mit Avataren) -- [ ] **ONBD-02**: Tastatur-Layout-Auswahl (DE/CH) im Willkommens-Screen -- [ ] **ONBD-03**: Auswahl persistiert in IndexedDB, wird nach Reload wiederhergestellt -- [ ] **ONBD-04**: "Los geht's" führt direkt zur Wald-Übersicht (kein Ladescreen) +- [x] **ONBD-01**: Willkommens-Screen mit Begleitfigur-Auswahl (4 Karten mit Avataren) +- [x] **ONBD-02**: Tastatur-Layout-Auswahl (DE/CH) im Willkommens-Screen +- [x] **ONBD-03**: Auswahl persistiert in IndexedDB, wird nach Reload wiederhergestellt +- [x] **ONBD-04**: "Los geht's" führt direkt zur Wald-Übersicht (kein Ladescreen) ### Keyboard @@ -153,11 +153,11 @@ Which phases cover which requirements. Updated during roadmap creation. | FNDN-02 | Phase 1 | Complete | | FNDN-03 | Phase 1 | Complete | | FNDN-04 | Phase 1 | Complete | -| FNDN-05 | Phase 1 | Pending | -| ONBD-01 | Phase 1 | Pending | -| ONBD-02 | Phase 1 | Pending | -| ONBD-03 | Phase 1 | Pending | -| ONBD-04 | Phase 1 | Pending | +| FNDN-05 | Phase 1 | Complete | +| ONBD-01 | Phase 1 | Complete | +| ONBD-02 | Phase 1 | Complete | +| ONBD-03 | Phase 1 | Complete | +| ONBD-04 | Phase 1 | Complete | | KYBD-01 | Phase 1 | Pending | | KYBD-02 | Phase 1 | Pending | | KYBD-03 | Phase 1 | Pending | diff --git a/.planning/ROADMAP.md b/.planning/ROADMAP.md index 9d55646..f6b2623 100644 --- a/.planning/ROADMAP.md +++ b/.planning/ROADMAP.md @@ -33,7 +33,7 @@ Decimal phases appear between their surrounding integers in numeric order. Plans: - [x] 01-01-PLAN.md — Vite scaffold, project structure, CSS palette, TypeScript interfaces, IndexedDB wrapper -- [ ] 01-02-PLAN.md — Screen management, welcome screen, companion/layout selection, onboarding persistence +- [x] 01-02-PLAN.md — Screen management, welcome screen, companion/layout selection, onboarding persistence - [ ] 01-03-PLAN.md — QWERTZ keyboard component with finger colors, level definitions 1-6 - [ ] 01-04-PLAN.md — Typing exercise engine (TDD), adaptive tempo, lesson screen UI - [ ] 01-05-PLAN.md — Forest overview with level map, full app flow integration, human verification diff --git a/.planning/STATE.md b/.planning/STATE.md index 1704696..3756078 100644 --- a/.planning/STATE.md +++ b/.planning/STATE.md @@ -3,14 +3,14 @@ gsd_state_version: 1.0 milestone: v1.0 milestone_name: milestone status: executing -stopped_at: Completed 01-01-PLAN.md -last_updated: "2026-03-29T09:04:30.178Z" +stopped_at: Completed 01-02-PLAN.md +last_updated: "2026-03-29T09:07:53.267Z" last_activity: 2026-03-29 progress: total_phases: 4 completed_phases: 0 total_plans: 5 - completed_plans: 1 + completed_plans: 2 percent: 0 --- @@ -26,7 +26,7 @@ See: .planning/PROJECT.md (updated 2026-03-29) ## Current Position Phase: 01 (grundger-st-tippmechanik) — EXECUTING -Plan: 2 of 5 +Plan: 3 of 5 Status: Ready to execute Last activity: 2026-03-29 @@ -53,6 +53,7 @@ Progress: [░░░░░░░░░░] 0% *Updated after each plan completion* | Phase 01 P01 | 4min | 2 tasks | 22 files | +| Phase 01 P02 | 2min | 2 tasks | 6 files | ## Accumulated Context @@ -65,6 +66,8 @@ Recent decisions affecting current work: - All phases: Gemini REST via fetch(), key in public/config.json (private use acceptable) - Phase 2+: Vorab-generierte Character Assets per Build-Script (kein Onboarding-Warten) - [Phase 01]: openDB accepts optional name param for test isolation with fake-indexeddb +- [Phase 01]: Screen transitions use CSS opacity+display toggle, no router library +- [Phase 01]: Companion cards rendered dynamically from data array, not hardcoded HTML ### Pending Todos @@ -76,6 +79,6 @@ None yet. ## Session Continuity -Last session: 2026-03-29T09:04:30.171Z -Stopped at: Completed 01-01-PLAN.md +Last session: 2026-03-29T09:07:53.261Z +Stopped at: Completed 01-02-PLAN.md Resume file: None diff --git a/.planning/phases/01-grundger-st-tippmechanik/01-02-SUMMARY.md b/.planning/phases/01-grundger-st-tippmechanik/01-02-SUMMARY.md new file mode 100644 index 0000000..75d5605 --- /dev/null +++ b/.planning/phases/01-grundger-st-tippmechanik/01-02-SUMMARY.md @@ -0,0 +1,103 @@ +--- +phase: 01-grundger-st-tippmechanik +plan: 02 +subsystem: ui +tags: [screen-management, onboarding, indexeddb, companion-selection, css-transitions] + +requires: + - phase: 01-01 + provides: "IndexedDB storage layer (openDB, getProgress, saveProgress), types, CSS design system" +provides: + - "Screen management (showScreen, initApp)" + - "Welcome screen with companion selection and layout toggle" + - "Companion definitions (fee/einhorn/fuchs/eule)" + - "Onboarding flow with IndexedDB persistence" +affects: [01-03, 01-04, 01-05] + +tech-stack: + added: [] + patterns: + - "Screen routing via CSS class toggle (.screen--active)" + - "DOM-based UI generation from data arrays (companion cards)" + - "Event delegation for toggle groups (layout buttons)" + +key-files: + created: + - src/app.ts + - src/companion/characters.ts + - src/ui/screens.ts + modified: + - src/main.ts + - index.html + - src/styles/main.css + +key-decisions: + - "Screen transitions use CSS opacity + display toggle, no router library" + - "Companion cards rendered dynamically from characters.ts array, not hardcoded in HTML" + +patterns-established: + - "showScreen(name) pattern: remove .screen--active from all, add to target by id" + - "initApp checks IndexedDB progress to route returning users directly to forest" + +requirements-completed: [FNDN-05, ONBD-01, ONBD-02, ONBD-03, ONBD-04] + +duration: 2min +completed: 2026-03-29 +--- + +# Phase 01 Plan 02: Screen Management + Onboarding Summary + +**CSS screen management with companion selection (4 characters), DE/CH layout toggle, and IndexedDB-persisted onboarding flow** + +## Performance + +- **Duration:** 2 min +- **Started:** 2026-03-29T09:05:08Z +- **Completed:** 2026-03-29T09:07:06Z +- **Tasks:** 2 +- **Files modified:** 6 + +## Accomplishments +- Screen management system with CSS fade transitions between 5 app screens +- Welcome screen with 4 companion cards (Lila/Stella/Finn/Elsa) showing emoji and name +- DE/CH keyboard layout toggle with active state styling +- Full onboarding persistence: companion + layout saved to IndexedDB, returning users skip to forest + +## Task Commits + +Each task was committed atomically: + +1. **Task 1: Screen management + companion definitions** - `4b5502f` (feat) +2. **Task 2: Welcome screen UI + onboarding flow** - `20a7670` (feat) + +## Files Created/Modified +- `src/app.ts` - Screen management (showScreen, getDB, initApp), routes to welcome or forest +- `src/companion/characters.ts` - 4 companion definitions with type, name, emoji, personality +- `src/ui/screens.ts` - Welcome screen logic: card rendering, layout toggle, start button, save + navigate +- `src/main.ts` - Updated to import and call initApp on DOMContentLoaded +- `index.html` - Welcome screen HTML structure with companion-grid, layout-toggle, start-btn +- `src/styles/main.css` - Welcome screen styles: companion cards, layout buttons, start button with states + +## Decisions Made +- Screen transitions use CSS opacity + display toggle (no router library needed for 5 screens) +- Companion cards rendered dynamically from characters.ts data array rather than hardcoded in HTML +- Layout defaults to 'de' (German), toggleable to 'ch' (Swiss) + +## Deviations from Plan + +None - plan executed exactly as written. + +## Issues Encountered +None. + +## User Setup Required +None - no external service configuration required. + +## Next Phase Readiness +- Screen management ready for lesson, reward, and parent screens +- Forest screen is empty placeholder, ready for 01-03 to populate +- Companion data available for dialogue generation in later plans + +--- +*Phase: 01-grundger-st-tippmechanik* +*Completed: 2026-03-29*