v0.1.0 — M1: Project Setup + Tilemap + Combat + Backend

Frontend:
- HTML5 Canvas isometric tilemap renderer
- Eichenhafen starting city (procedural)
- Click-to-move A* pathfinding
- Player stats, HP/SP/EXP bars, skill bar, minimap
- 3 NPCs (merchant, class master, innkeeper)
- 6 monster spawns with aggro AI
- Combat: auto-attack, damage numbers, EXP/gold
- Player death + respawn

Backend:
- FastAPI server with SQLite
- Ollama LLM bridge for events + dialogue
- Event validation (no soft-lock)
- NPC dialogue generation

Design:
- Full DESIGN.md with architecture, formulas, milestones
- 6 base classes + 6 advanced classes
- 3 fixed cities, dynamic events
This commit is contained in:
arch_agent
2026-07-17 20:14:16 +02:00
commit 5cf42a5e5d
12 changed files with 2038 additions and 0 deletions
+79
View File
@@ -0,0 +1,79 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Aether Chronicles</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="game-container">
<canvas id="game-canvas" width="960" height="640"></canvas>
<!-- UI Overlay -->
<div id="ui-overlay">
<!-- HP/SP Bars -->
<div id="status-bars">
<div class="bar-row">
<span class="bar-label">HP</span>
<div class="bar-container">
<div id="hp-bar" class="bar-fill hp-fill"></div>
<span id="hp-text" class="bar-text">100/100</span>
</div>
</div>
<div class="bar-row">
<span class="bar-label">SP</span>
<div class="bar-container">
<div id="sp-bar" class="bar-fill sp-fill"></div>
<span id="sp-text" class="bar-text">50/50</span>
</div>
</div>
<div class="bar-row">
<span class="bar-label">EXP</span>
<div class="bar-container">
<div id="exp-bar" class="bar-fill exp-fill"></div>
<span id="exp-text" class="bar-text">0/100</span>
</div>
</div>
</div>
<!-- Skill Bar -->
<div id="skill-bar">
<div class="skill-slot" data-slot="1">1</div>
<div class="skill-slot" data-slot="2">2</div>
<div class="skill-slot" data-slot="3">3</div>
<div class="skill-slot" data-slot="4">4</div>
<div class="skill-slot" data-slot="5">5</div>
<div class="skill-slot" data-slot="6">6</div>
<div class="skill-slot" data-slot="7">7</div>
<div class="skill-slot" data-slot="8">8</div>
<div class="skill-slot" data-slot="9">9</div>
<div class="skill-slot" data-slot="0">0</div>
</div>
<!-- Minimap -->
<div id="minimap-container">
<canvas id="minimap" width="120" height="120"></canvas>
</div>
<!-- Chat / Event Log -->
<div id="event-log">
<div id="event-messages"></div>
</div>
<!-- Character Info -->
<div id="char-info">
<div id="char-name">Wanderer</div>
<div id="char-level">Lv. 1</div>
<div id="char-class">Wanderer</div>
</div>
</div>
</div>
<script src="js/tilemap.js"></script>
<script src="js/camera.js"></script>
<script src="js/player.js"></script>
<script src="js/input.js"></script>
<script src="js/game.js"></script>
</body>
</html>