Files
geograsim/App/pages/buch.php
T
Adminator c4276083a2 Glossar visuell komplett: 162 Bilder, 13 Kapitel-Icons, 12 interaktive Widgets
- 162 neue Glossar-Bilder (Flat-Scandinavian, gpt-image-1) → alle 402 Einträge bebildert;
  image_path-Update: App/Don_t_Deploy/2026-07-16-glossar-bilder.sql
- 13 Kapitel-Icons (icon-<id>.webp) ersetzen die Emojis in Buch-Übersicht + Kapitel-h1
  (buchKapIcon-Helper mit Emoji-Fallback)
- 12 interaktive Glossar-Experimente in 2 Modulen:
  natur (Mondrotation, Kernschatten, Keeling-Kurve, Pegel/HQ100, Wärmeausdehnung,
  Klimaträgheit) + wirtschaft (Preiselastizität, Engpass, Skaleneffekt, Modal Split,
  Netzfrequenz/Hertz, Lageenergie/Pumpspeicher); Registry via Object.assign,
  Script-Einbindung in glossar.php

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-07-16 00:59:30 +02:00

121 lines
6.4 KiB
PHP
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<?php
/**
* Schulbuch — Übersicht aller Kapitel
* URL: /buch
* Ein Kapitel pro Simulation. Jedes Kapitel gibt es in drei Versionen:
* Schüler:innen · Leichte Sprache · Lehrperson.
* Status wird automatisch aus der Existenz von pages/buch-<id>.php abgeleitet.
*/
require_once __DIR__ . '/../php/config/app.php';
$bp = BASE_PATH;
$KAPITEL = [
['id' => 'tourismustal', 'icon' => '🏔️', 'titel' => 'Ein Tal wird Tourismusregion',
'sim' => 'Tourismustal',
'themen' => 'Standortfaktoren · Angebot &amp; Nachfrage · Saisonalität · Klimawandel · Zielkonflikte'],
['id' => 'tourismusregion', 'icon' => '🗺️', 'titel' => 'Besucherströme lenken',
'sim' => 'Tourismusregion',
'themen' => 'Besucherlenkung · Standort am Weg · Mobilität · Zielgruppen'],
['id' => 'kofferdetektiv', 'icon' => '🧳', 'titel' => 'Dem Reisen auf der Spur',
'sim' => 'Kofferdetektiv',
'themen' => 'Reise &amp; Tourismus weltweit · Transport &amp; Flugverkehr · Nachhaltig reisen'],
['id' => 'busfahrt', 'icon' => '🚌', 'titel' => 'Mit dem Bus durch Europa',
'sim' => 'Busfahrt',
'themen' => 'Topografie Europas · Hauptstädte · Entfernungen · Verkehr'],
['id' => 'logistik', 'icon' => '🚚', 'titel' => 'Waren auf Reisen',
'sim' => 'Logistik Europa',
'themen' => 'Güterverkehr · LKW, Zug, Schiff · Häfen · Lieferketten'],
['id' => 'weltkueche', 'icon' => '🍲', 'titel' => 'Was die Welt isst',
'sim' => 'Weltküche',
'themen' => 'Welthandel · Klimazonen · Ernährung · regionale vs. globale Lebensmittel'],
['id' => 'farmer', 'icon' => '🌾', 'titel' => 'Landwirtschaft weltweit',
'sim' => 'Landwirtschaft',
'themen' => 'Klimazonen · Anbaugrenzen · Nutztiere · Klimawandel im Anbau'],
['id' => 'klima', 'icon' => '🌍', 'titel' => 'Klimawandel an der Küste',
'sim' => 'Klimawächter (2D &amp; 3D)',
'themen' => 'Klimawandel · CO₂ &amp; Energie · Küstenschutz · Ökonomie vs. Ökologie'],
['id' => 'fluss', 'icon' => '🌊', 'titel' => 'Der Fluss und das Hochwasser',
'sim' => 'Flussmanagement',
'themen' => 'Hochwasser · Dämme &amp; Retention · Renaturierung · Raumplanung'],
['id' => 'energiemanager', 'icon' => '⚡', 'titel' => 'Strom rund um die Uhr',
'sim' => 'Energiemanager',
'themen' => 'Energiebilanz · Pumpspeicher · Wetter &amp; Erneuerbare · Grundlast'],
['id' => 'heli', 'icon' => '🚁', 'titel' => 'Mit Karte und Koordinaten',
'sim' => 'Heli-Navigation',
'themen' => 'Gradnetz · Kartenkompetenz · Alpen · Bergrettung'],
['id' => 'sonnensystem', 'icon' => '🪐', 'titel' => 'Sonne, Erde, Mond',
'sim' => 'Sonnensystem',
'themen' => 'Jahreszeiten · Tag &amp; Nacht · Finsternisse · Größenordnungen'],
['id' => 'eu-werkstatt', 'icon' => '🇪🇺', 'titel' => 'Wie ein EU-Gesetz entsteht',
'sim' => 'EU-Werkstatt',
'themen' => 'Demokratie · Institutionen · Bürgerinitiative · Lobbyismus'],
];
?>
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>📖 Schulbuch · GeoGraSim</title>
<link rel="stylesheet" href="<?= $bp ?>/assets/css/design-system.css">
<style>
/* design-system.css sperrt body-Scroll (App-Layout) Buch braucht Scroll */
html, body { overflow: auto !important; height: auto !important; }
body { background: #edeae0; margin: 0; font-family: system-ui, -apple-system, "Segoe UI", sans-serif; color: #2f3e46; }
.b-wrap { max-width: 880px; margin: 0 auto; padding: 26px 14px 80px; }
h1 { font-size: 30px; margin: 0 0 4px; }
.sub { color: #6b6659; margin: 0 0 14px; line-height: 1.55; }
.versionen { display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 22px; }
.versionen span { background: #fdfbf4; border: 1.5px solid #c9c2ae; border-radius: 999px; font-size: 12.5px; font-weight: 700; padding: 4px 12px; }
.kap { display: flex; gap: 16px; align-items: flex-start; background: #fdfbf4; border-radius: 14px;
box-shadow: 0 4px 18px rgba(47,62,70,.10); padding: 20px 22px; margin-bottom: 14px;
text-decoration: none; color: inherit; }
.kap:hover { box-shadow: 0 6px 22px rgba(47,62,70,.18); }
.kap .ic { font-size: 34px; }
.kap img.ic { width: 58px; height: 58px; border-radius: 12px; object-fit: cover; flex-shrink: 0; }
.kap b { font-size: 18px; display: block; }
.kap small { color: #6b6659; display: block; margin-top: 3px; line-height: 1.5; }
.kap .pill { margin-left: auto; align-self: center; font-size: 11px; font-weight: 800;
border-radius: 999px; padding: 4px 12px; white-space: nowrap; }
.pill.fertig { background: #dcead1; color: #2f6b46; }
.pill.geplant { background: #e3ddc9; color: #6b6659; }
a.back { color: #4f7f5e; font-weight: 600; text-decoration: none; font-size: 14px; }
</style>
</head>
<body>
<div class="b-wrap">
<p><a class="back" href="<?= $bp ?>/simulationen">← Zu den Simulationen</a></p>
<h1>📖 Das Schulbuch zu den Simulationen</h1>
<p class="sub">Jede Simulation bekommt ein Kapitel: die Sachinhalte lehrplankonform
aufbereitet, mit echten Daten, Glossar-Begriffen und Aufgaben — zum Präsentieren
vor, zwischen oder nach dem Arbeiten mit der Simulation. Jedes Kapitel gibt es
in drei Versionen (Umschalter oben rechts im Kapitel):</p>
<div class="versionen">
<span>👩‍🎓 Schüler:innen</span>
<span>🌱 Leichte Sprache — für den inklusiven Unterricht</span>
<span>👩‍🏫 Lehrperson — mit didaktischen Hinweisen</span>
</div>
<?php foreach ($KAPITEL as $k): ?>
<?php $fertig = is_file(__DIR__ . '/buch-' . $k['id'] . '.php'); ?>
<?php if ($fertig): ?>
<a class="kap" href="<?= $bp ?>/buch-<?= $k['id'] ?>">
<?php else: ?>
<div class="kap" style="opacity:.6">
<?php endif; ?>
<?php if (is_file(__DIR__ . '/../assets/img/buch/icon-' . $k['id'] . '.webp')): ?>
<img class="ic" src="<?= $bp ?>/assets/img/buch/icon-<?= $k['id'] ?>.webp" alt="">
<?php else: ?>
<span class="ic"><?= $k['icon'] ?></span>
<?php endif; ?>
<span>
<b><?= $k['titel'] ?></b>
<small>Zur Simulation „<?= $k['sim'] ?>" · <?= $k['themen'] ?></small>
</span>
<span class="pill <?= $fertig ? 'fertig' : 'geplant' ?>"><?= $fertig ? 'Kapitel lesen' : 'in Arbeit' ?></span>
<?php echo $fertig ? '</a>' : '</div>'; ?>
<?php endforeach; ?>
</div>
</body>
</html>