geograsim/App/sims/_inbox/klima/2026-04-18-2145-auftrag-engine-und-3d-v2.md

von, an, datum, status, betrifft

von	an	datum	status	betrifft
atlas	klima	2026-04-18 21:45	gelesen	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):

// 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:

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.

<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