dfb9e80664
- engine.js als headless Single Source of Truth (KlimaEngine) - game-2d.html nutzt engine (-515 Zeilen Duplikation) - rising-pressure.mp3 als Drama-Slot, Auto-Switch bei kritischem State - state.animMs: alle Animationen bei Pause eingefroren, Speed skaliert - Pro-Haus-Schornstein-Abbau je nach Erneuerbaren-Anteil - Bugfix: Bürger-Dialog überlebt Refresh via pendingCitizenEventId - Toast-Viewport volle Canvas-Breite, Musik-Default 22 % - _status.md Konvention eingeführt, Inbox-Nachrichten erhalten
174 lines
5.7 KiB
Markdown
174 lines
5.7 KiB
Markdown
---
|
||
von: atlas
|
||
an: klima
|
||
datum: 2026-04-18 21:45
|
||
status: gelesen
|
||
betrifft: Nächster grosser Arbeitsblock — Engine extrahieren + 3D V2 bauen
|
||
---
|
||
|
||
# Nächster Block: Spiellogik zentralisieren, 3D V2 aufbauen
|
||
|
||
Thomas und ich haben beschlossen: Klimawächter 2D und 3D sollen **dieselbe
|
||
Spiellogik** nutzen. Aktuell gibt es eine Divergenz-Gefahr (V2-2D ist frisch,
|
||
V1-3D ist online produktiv). Beide auseinanderdriften zu lassen wäre
|
||
gefährlich — gleiche Maßnahmen, gleiche Balance, gleiche Events sollen
|
||
überall wirken.
|
||
|
||
Du bist die richtige Instanz für diesen Block, weil du 2D V2 selbst gebaut
|
||
hast und V1-3D als Referenz bereits durchgeschaut hast.
|
||
|
||
## Ziel
|
||
|
||
- **Single Source of Truth** für die Klima-Spiellogik
|
||
- **2D und 3D teilen sich Engine, Events, Balance, Admin-Level-Config**
|
||
- **3D V2** bekommt das komplette Plattform-Drumherum (Design-System, Audio,
|
||
Glossar, Easy-Sprache, Autosave, Achievements)
|
||
- **V1 bleibt live** unangetastet — wie bei 2D der Wechsel passiert später
|
||
|
||
## Arbeitsschritte
|
||
|
||
### Schritt 1 — Engine extrahieren (Foundation)
|
||
|
||
Neue Datei: **`App/sims/klima/engine.js`** (reines JS-Modul, kein Build-Tool).
|
||
|
||
Inhalt:
|
||
- Tick-System (Runden-Logik, Jahr-Progression)
|
||
- State-Management (Budget, Bevölkerung, CO₂, Temperatur, Meer, Strom)
|
||
- Maßnahmen-Definitionen (Windpark, Solar, Deich, etc. — Kosten, Wirkung, Upkeep)
|
||
- Event-System (Sturmflut, Bürger-Dialoge, Lob/Warnungen)
|
||
- Ziel-Erkennung (win/loss-Conditions)
|
||
- Serialize/Deserialize (für Autosave)
|
||
|
||
Keine UI-Abhängigkeit. Keine DOM-Queries. Die Engine sollte "headless"
|
||
testbar sein.
|
||
|
||
Export-Pattern (ESM-frei, damit wir keinen Bundler brauchen):
|
||
|
||
```javascript
|
||
// engine.js
|
||
window.KlimaEngine = (function() {
|
||
function createGame(levelConfig) { ... }
|
||
function tick(game) { ... }
|
||
function buyMeasure(game, measureId) { ... }
|
||
function triggerEvent(game, eventKey) { ... }
|
||
function serialize(game) { ... }
|
||
function deserialize(data) { ... }
|
||
return { createGame, tick, buyMeasure, triggerEvent, serialize, deserialize, MEASURES, EVENTS };
|
||
})();
|
||
```
|
||
|
||
### Schritt 2 — 2D auf Engine umstellen
|
||
|
||
`game-2d.html` behält UI, Events-Overlay, Graphen, Achievements etc.
|
||
Anstatt interne Funktionen nutzt sie:
|
||
|
||
```javascript
|
||
var game = KlimaEngine.createGame(levelConfig);
|
||
// bei Tick:
|
||
KlimaEngine.tick(game);
|
||
renderUI(game);
|
||
// bei Kauf:
|
||
KlimaEngine.buyMeasure(game, 'windpark');
|
||
```
|
||
|
||
Funktional kein Unterschied für den Spieler. Nur Code-Struktur sauberer.
|
||
|
||
### Schritt 3 — 3D V2 bauen
|
||
|
||
Neue Datei: **`App/sims/klima/game-3d.html`** (V2).
|
||
|
||
Gleiches Pattern wie V2-2D:
|
||
- Design-System (`<link rel="stylesheet" href="../../assets/css/design-system.css">`)
|
||
- `ggsMusicSetup()` mit den gleichen Tracks wie 2D
|
||
- Gleicher Header inkl. Speed-Control, 📚-Button, 🔄 Reset
|
||
- Gleiche Status-Panels, Action-Cards, Graphen, Event-Stapel
|
||
- Glossar-Tooltips via `data-glossar`
|
||
- Easy-Sprache via Helper
|
||
- Autosave (`localStorage`-Key: `ggs-save-klima-3d-L{n}`)
|
||
|
||
Aus V1-3D übernehmen:
|
||
- Three.js-Setup (Scene, Camera, Lights)
|
||
- Insel-Geometrie
|
||
- 3D-Modelle der Maßnahmen (Windrad, Solar, Deich, etc.)
|
||
- Kamera-Steuerung (Drag-Orbit, Scroll-Zoom, Auto-Drohnen-Flug)
|
||
- Raycaster für Platzierung, Placement-Ghost (grün/rot)
|
||
- Arrow-Keys für Rotation
|
||
|
||
**Wichtig:** Three.js per CDN laden, nicht über Vite. Kein TypeScript,
|
||
kein Build-Schritt. Direkt HTML/JS wie 2D V2.
|
||
|
||
```html
|
||
<script src="https://unpkg.com/three@0.155.0/build/three.min.js"></script>
|
||
```
|
||
|
||
Die Szenen-Objekte aus `App/src/sims/sim-05-treibhaus-3d/*.ts` sind als
|
||
Vorlage zu verstehen — in Vanilla JS portieren, nicht importieren.
|
||
|
||
### Schritt 4 — PHP-Wrapper
|
||
|
||
**Neue Datei: `App/pages/klima-3d.php`**
|
||
|
||
Analog zu `klima-2d.php`, aber lädt `App/sims/klima/game-3d.html`. Die
|
||
Level-Config kommt aus der gleichen Quelle (`game_levels` mit
|
||
`game_id='klima'`) — 2D und 3D teilen sich die Admin-Einstellungen.
|
||
|
||
### Schritt 5 — Modul-Info aktualisieren
|
||
|
||
`module_info`-Tabelle hat einen Eintrag `klima`. Wir ergänzen (bitte
|
||
Nachricht an lehrplan-Inbox, damit sie es in `module_info` erweitert):
|
||
- 2D- und 3D-Variante sollen als **ein Modul** erscheinen, nicht zwei.
|
||
- Auf der Modul-Detailseite (`modul-klima.php`) ein Toggle "2D / 3D" oder
|
||
zwei Buttons "▶ 2D spielen" / "▶ 3D spielen".
|
||
|
||
## V1 unangetastet lassen
|
||
|
||
- `App/game.html` (V1 2D) — nicht anfassen
|
||
- `App/game-3d.html` (V1 3D) — nicht anfassen
|
||
- `App/src/sims/sim-05-treibhaus*/` — nur lesen (als Vorlage)
|
||
- `App/dist/` — nicht anfassen (V1-Build)
|
||
|
||
V1-3D bleibt produktiv online bis V2-3D stabil ist und Thomas den Wechsel
|
||
freigibt.
|
||
|
||
## Aufwands-Einschätzung
|
||
|
||
Vermutung 1–2 Tage Arbeit insgesamt:
|
||
- Schritt 1 (Engine): 2–3 h
|
||
- Schritt 2 (2D umstellen): 1–2 h
|
||
- Schritt 3 (3D V2): 4–6 h ← der grösste Block
|
||
- Schritt 4 (PHP-Wrapper): 30 min
|
||
- Schritt 5 (Modul-Info): 15 min + Koordination mit Lehrplan
|
||
|
||
## Kontext-Management
|
||
|
||
Du hast schon viel im Kontext (2D V2 komplett, Audio-Stack, Easy-Sprache).
|
||
Falls du merkst, dass der Kontext knapp wird:
|
||
|
||
1. **Pausiere beim aktuellen Stand**, egal an welchem Schritt
|
||
2. Schreibe in deine **eigene** Inbox (`_inbox/klima/`) eine
|
||
Übergabe-Notiz mit:
|
||
- Wo du stehst
|
||
- Welche Dateien schon geändert wurden
|
||
- Was als nächstes kommen muss
|
||
- Welche Entscheidungen offen sind
|
||
3. Melde in zentrale-Inbox: "Kontext zu voll — neue Session übernimmt,
|
||
siehe Übergabe-Notiz"
|
||
4. Thomas startet dann eine neue "Klima"-Session mit der Übergabe-Notiz
|
||
als Kontext
|
||
|
||
Keine Panik, wenn das passiert — das System ist dafür gemacht.
|
||
|
||
## Konventions-Check
|
||
|
||
Vor der Fertig-Meldung: Inbox prüfen (`ls App/sims/_inbox/klima/`),
|
||
neue `status: neu` einarbeiten.
|
||
|
||
## Start
|
||
|
||
Wann du magst. Kein Zeitdruck. Melde kurz in zentrale-Inbox, wenn du
|
||
loslegst ("Start Engine-Extraktion"), damit ich weiss dass es läuft.
|
||
|
||
## Bestätigen
|
||
|
||
- status: gelesen
|