From 151b07cb4eeaf2fc5ab1f1124bc057c82daf5b30 Mon Sep 17 00:00:00 2001 From: nico Date: Wed, 19 Aug 2026 16:07:46 +0200 Subject: [PATCH] Add changelog panel to main menu --- web/index.html | 43 +++++++++++++++++++++++++++++++++++++++++++ web/src/Game.ts | 25 ++++++++++++++++++++++++- 2 files changed, 67 insertions(+), 1 deletion(-) diff --git a/web/index.html b/web/index.html index 5c305d7..b8e1a4a 100644 --- a/web/index.html +++ b/web/index.html @@ -166,6 +166,28 @@ color: rgba(255,255,255,0.5); font-size: 11px; font-family: monospace; text-align: center; } + #changelog-panel { + position: absolute; top: 0; left: 0; width: 100%; height: 100%; + display: flex; flex-direction: column; align-items: center; justify-content: center; + gap: 14px; background: rgba(0,0,0,0.85); + opacity: 0; pointer-events: none; visibility: hidden; + transition: opacity 0.2s ease; font-family: monospace; + } + #changelog-panel h2 { + color: #ffcc00; font-size: 34px; text-shadow: 3px 3px 6px #000; + } + #changelog-list { + width: 660px; max-width: 92vw; max-height: 55vh; overflow-y: auto; + background: rgba(20,20,30,0.9); border: 2px solid #888; padding: 14px 18px; + color: rgba(255,255,255,0.85); font-size: 13px; line-height: 1.6; + text-align: left; + } + .changelog-entry { + display: flex; gap: 12px; padding: 4px 0; + border-bottom: 1px solid rgba(255,255,255,0.08); + } + .changelog-entry:last-child { border-bottom: none; } + .changelog-date { color: #ffcc00; white-space: nowrap; } #seed-input { background: rgba(0,0,0,0.7); border: 2px solid #555; color: #ffcc00; font-family: monospace; font-size: 16px; padding: 6px 10px; width: 180px; @@ -372,6 +394,27 @@
+ + + +
+

Changelog

+
+
19.08.Minotaurus-Boss mit Frontpanzerung, Dash-Stun und überspringbarem Axthieb
+
19.08.Boss-Treffer-Feedback mit Aufblitzen und schwebenden Schadenszahlen
+
19.08.Krake-Boss mit Tinte, Zug-Markierungen und Sweep-Tentakeln plus Boss-Modus
+
19.08.Golem-Boss in Welle 10, startet erst wenn die Arena geräumt ist
+
19.08.Bumerang als dünne 120-Grad-Sichel neu designt
+
19.08.Spieler-folgendes Licht, Dungeon-Umgebung abgedunkelt
+
19.08.Aura-, Bumerang-, Fallen- und Gaswolken-Skills mit Hotbar und ESC-Pause
+
19.08.Gegner-Blickrichtung korrigiert und Schadens-Feedback beim Spieler
+
18.08.Rückenschild-Modell am Schild-Skill gekoppelt
+
18.08.Skill-Icons auf den Level-up-Karten
+
17.08.Skill-System, Level-Ups und neue Gegnertypen
+
17.08.Hauptmenü, Geist-Gegner und Schwert-Schwung-Spur
+
17.08.AGENTS.md mit Git-Regeln
+
+
diff --git a/web/src/Game.ts b/web/src/Game.ts index b2a1b7e..b486366 100644 --- a/web/src/Game.ts +++ b/web/src/Game.ts @@ -116,6 +116,7 @@ export class Game { private uiSeedInput!: HTMLInputElement; private uiBossMode!: HTMLElement; private uiBossModeButtons!: HTMLElement; + private uiChangelogPanel!: HTMLElement; private cheatBuffer = ''; private uiLevelLabel!: HTMLElement; private uiSeedLabel!: HTMLElement; @@ -260,6 +261,9 @@ export class Game { } document.getElementById('btn-start')!.addEventListener('click', () => this.startGame()); + document.getElementById('btn-changelog')!.addEventListener('click', () => this.showChangelog()); + document.getElementById('btn-changelog-close')!.addEventListener('click', () => this.hideChangelog()); + this.uiChangelogPanel = document.getElementById('changelog-panel')!; document.getElementById('btn-restart')!.addEventListener('click', () => this.restart()); document.getElementById('btn-menu')!.addEventListener('click', () => this.showMenu()); this.uiPauseOverlay = document.getElementById('pause-overlay')!; @@ -298,6 +302,8 @@ export class Game { this.pause(); } else if (this.state === 'gameover') { this.showMenu(); + } else if (this.state === 'menu' && this.uiChangelogPanel.style.visibility === 'visible') { + this.hideChangelog(); } e.preventDefault(); return; @@ -336,7 +342,9 @@ export class Game { return; } if (e.code === 'Enter' || e.code === 'Space') { - if (this.state === 'menu') this.startGame(); + if (this.state === 'menu' && this.uiChangelogPanel.style.visibility !== 'visible') { + this.startGame(); + } else if ( this.state === 'gameover' && performance.now() - this.gameOverAt > 1500 @@ -548,6 +556,7 @@ export class Game { this.uiMainMenu.style.opacity = '0'; this.uiMainMenu.style.pointerEvents = 'none'; this.uiMainMenu.style.visibility = 'hidden'; + this.hideChangelog(); this.uiGameOver.style.opacity = '0'; this.uiGameOverPanel.style.transition = 'opacity 0.3s ease'; this.uiGameOverPanel.style.opacity = '0'; @@ -576,6 +585,20 @@ export class Game { playSound('spawn', 0.7); } + private showChangelog() { + this.uiChangelogPanel.style.opacity = '1'; + this.uiChangelogPanel.style.pointerEvents = 'auto'; + this.uiChangelogPanel.style.visibility = 'visible'; + this.blurFocus(); + } + + private hideChangelog() { + this.uiChangelogPanel.style.opacity = '0'; + this.uiChangelogPanel.style.pointerEvents = 'none'; + this.uiChangelogPanel.style.visibility = 'hidden'; + this.blurFocus(); + } + startBossFight(wave: number) { if (this.state === 'playing' || this.state === 'levelup') return; this.seed = Math.floor(Math.random() * 1000000);