ggs-header: Tourismustal + Tourismusregion (Batch 2)

- Komponente: btnHome/⌂-Erkennung (ganzer Header durchsucht), sim-eigener
  Musik-Toggle (btnMusic) -> Musik-Icon, Panel-Optik (blur/shadow/radius)
  gestrippt fuer Sims mit .panel-Leiste.
- Beide Tourismus-Sims: topbar -> ggs-header (Klassen additiv, alle IDs +
  ui.js-Bindings erhalten), Tempo-Popover ueber .ggs-speed, Musik bleibt
  eigenes Panel (btnMusic oeffnet es). ggs-header.css vor style.css fuer
  position:fixed.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
2026-08-25 17:46:46 +02:00
parent 41731254b1
commit 6009eabca1
4 changed files with 42 additions and 24 deletions
+12 -9
View File
@@ -6,24 +6,27 @@
<meta name="apple-mobile-web-app-capable" content="yes">
<title>Tourismusregion entwickeln GeoGraSim</title>
<script>/*__TOURISMUSREGION_INJECTION__*/</script>
<link rel="stylesheet" href="../../assets/fonts/inter.css">
<link rel="stylesheet" href="../../assets/css/ggs-header.css">
<script src="../../assets/js/ggs-header.js"></script>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<canvas id="map"></canvas>
<header id="topbar" class="panel">
<header id="topbar" class="panel ggs-header" data-ggs-sim="tourismusregion" data-ggs-home="../../schueler.html">
<button id="btnHome" class="icon-btn" title="Zurück zur Übersicht"></button>
<h1>Tourismusregion <span class="subtitle">entwickeln</span></h1>
<h1 class="ggs-header-module">Tourismusregion <span class="subtitle">entwickeln</span></h1>
<div id="waveStatus" class="wave-status">Welle 1 vorbereiten…</div>
<div class="top-right">
<div class="top-right ggs-header-actions">
<div id="clock" class="clock">Welle 1/8</div>
<div class="speed" role="group" aria-label="Zeit">
<button data-speed="0" class="icon-btn speed-btn" title="Pause"></button>
<button data-speed="1" class="icon-btn speed-btn active" title="Normal">1×</button>
<button data-speed="2" class="icon-btn speed-btn" title="Doppelt">2×</button>
<button data-speed="3" class="icon-btn speed-btn" title="Dreifach">3×</button>
<button data-speed="4" class="icon-btn speed-btn" title="Vierfach">4×</button>
<div class="speed ggs-speed" role="group" aria-label="Zeit">
<button data-speed="0" class="icon-btn speed-btn ggs-speed-btn" title="Pause"></button>
<button data-speed="1" class="icon-btn speed-btn ggs-speed-btn active" title="Normal">1×</button>
<button data-speed="2" class="icon-btn speed-btn ggs-speed-btn" title="Doppelt">2×</button>
<button data-speed="3" class="icon-btn speed-btn ggs-speed-btn" title="Dreifach">3×</button>
<button data-speed="4" class="icon-btn speed-btn ggs-speed-btn" title="Vierfach">4×</button>
</div>
<button id="btnLog" class="icon-btn" title="Meldungen">🔔<span id="logBadge" class="badge hidden">0</span></button>
<button id="btnSound" class="icon-btn" title="Sound an/aus">🔊</button>
+11 -8
View File
@@ -6,22 +6,25 @@
<meta name="apple-mobile-web-app-capable" content="yes">
<title>Tourismustal GeoGraSim</title>
<script>/*__TOURISMUSTAL_INJECTION__*/</script>
<link rel="stylesheet" href="../../assets/fonts/inter.css">
<link rel="stylesheet" href="../../assets/css/ggs-header.css">
<script src="../../assets/js/ggs-header.js"></script>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<canvas id="map"></canvas>
<header id="topbar" class="panel">
<header id="topbar" class="panel ggs-header" data-ggs-sim="tourismustal" data-ggs-home="../../schueler.html">
<button id="btnHome" class="icon-btn" title="Zurück zur Übersicht"></button>
<h1><span id="valleyTitle">Tourismustal</span> <span id="sceneName"></span></h1>
<div class="top-right">
<h1 class="ggs-header-module"><span id="valleyTitle">Tourismustal</span> <span id="sceneName"></span></h1>
<div class="top-right ggs-header-actions">
<div id="clock" class="clock"></div>
<div class="speed" role="group" aria-label="Zeitskala">
<button data-speed="0" class="icon-btn speed-btn" title="Pause"></button>
<button data-speed="1" class="icon-btn speed-btn active" title="Normal">1×</button>
<button data-speed="2" class="icon-btn speed-btn" title="Schnell">2×</button>
<button data-speed="4" class="icon-btn speed-btn" title="Sehr schnell">4×</button>
<div class="speed ggs-speed" role="group" aria-label="Zeitskala">
<button data-speed="0" class="icon-btn speed-btn ggs-speed-btn" title="Pause"></button>
<button data-speed="1" class="icon-btn speed-btn ggs-speed-btn active" title="Normal">1×</button>
<button data-speed="2" class="icon-btn speed-btn ggs-speed-btn" title="Schnell">2×</button>
<button data-speed="4" class="icon-btn speed-btn ggs-speed-btn" title="Sehr schnell">4×</button>
</div>
<button id="btnInfoMode" class="icon-btn" title="Meldungs-Modus umschalten">📖</button>
<button id="btnLog" class="icon-btn" title="Meldungen">🔔<span id="logBadge" class="badge hidden">0</span></button>