HuggingWizards / static /index.html
Quazim0t0's picture
Upload 127 files
7e5faa7 verified
Raw
History Blame Contribute Delete
4.58 kB
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>🧙 HuggingWizards</title>
<link rel="stylesheet" href="/static/style.css" />
</head>
<body>
<div id="game-wrap">
<canvas id="game" width="1280" height="720"></canvas>
<!-- Top bar: hearts (lives) + leaderboard button -->
<div id="topbar">
<div id="hearts" class="hidden"></div>
<button id="lb-btn">🏆 Leaderboard</button>
</div>
<!-- HUD -->
<div id="hud" class="hidden">
<div id="round-info"></div>
<div id="self-info"></div>
<div id="xp-bar"><div id="xp-fill"></div><span id="xp-text"></span></div>
<div id="aura-bar"></div>
</div>
<!-- Queue position banner -->
<div id="queue-banner" class="hidden"></div>
<!-- Level-up card pick (docked at the bottom; game stays playable) -->
<div id="levelup" class="hidden">
<div class="lu-label"><b>Level Up!</b><br><span>press 1/2/3</span><br><span id="lu-timer"></span></div>
<div id="card-list"></div>
</div>
<!-- Top-right lobby roster -->
<div id="roster" class="hidden"></div>
<!-- Join screen -->
<div id="join-screen" class="overlay">
<div class="panel">
<h1>🧙 HuggingWizards</h1>
<p class="tag">Co-op pixel arena · <b>Nemotron-4B</b> is the Game Master</p>
<input id="name-input" maxlength="16" placeholder="Wizard name" />
<p class="pick-label">Choose your champion:</p>
<div id="char-picker"></div>
<div class="btn-row">
<button id="join-btn">Join as Wizard</button>
<button id="spectate-btn" class="ghost">Spectate</button>
</div>
<p class="hint">Move: <b>W A S D</b> · Attack: <b>Space</b> (auto-aim)</p>
<p class="hint"><a href="/dashboard" target="_blank">Open Game Master dashboard ↗</a></p>
</div>
</div>
<!-- Intermission / upgrade shop -->
<div id="shop" class="overlay hidden">
<div class="panel wide">
<h2 id="shop-title">Intermission</h2>
<p id="gm-line" class="gm"></p>
<div id="skill-box" class="hidden">
<p class="skill-prompt">🏆 Top wizard of the wave! Ask the Game Master for a power-up:</p>
<div class="skill-row">
<input id="skill-input" maxlength="80" placeholder="e.g. a frost nova that freezes enemies" />
<button id="skill-btn">Request</button>
</div>
<p id="skill-msg" class="hint"></p>
</div>
<p id="shop-gold"></p>
<div id="upgrade-list"></div>
<p id="shop-timer" class="hint"></p>
</div>
</div>
<!-- Lobby start -->
<div id="lobby-start" class="overlay hidden">
<div class="panel">
<h2>Lobby</h2>
<p id="lobby-msg"></p>
<button id="start-btn">Start Round</button>
</div>
</div>
<!-- Leaderboard overlay -->
<div id="leaderboard" class="overlay hidden">
<div class="panel wide">
<h2>🏆 Leaderboard</h2>
<div id="lb-list"></div>
<div id="lb-submit" class="hidden">
<p id="lb-score" class="hint"></p>
<button id="lb-submit-btn">Submit my score</button>
</div>
<div class="btn-row"><button id="lb-close" class="ghost">Close</button></div>
</div>
</div>
<!-- Eliminated overlay -->
<div id="gameover" class="overlay hidden">
<div class="panel">
<h2>💀 Eliminated</h2>
<p id="go-score"></p>
<div class="btn-row">
<button id="go-submit">Submit score</button>
<button id="go-rejoin" class="ghost">Re-join queue</button>
</div>
</div>
</div>
<!-- Live agent-trace panel -->
<div id="traces" class="overlay hidden">
<div class="panel wide">
<h2>📜 Game Master — Live Agent Traces</h2>
<p class="hint">Every wave, Nemotron-4B decides rewards, the next wave, the enemy mix and the card pool. Newest first.</p>
<div id="trace-list"></div>
<div class="btn-row"><button id="traces-close" class="ghost">Close</button></div>
</div>
</div>
<div id="conn-status">connecting…</div>
<div id="toast" class="hidden"></div>
<div id="bottom-bar">
<button id="traces-btn">📜 Agent Traces</button>
<button id="mute-btn" title="Toggle music">🔊</button>
</div>
</div>
<audio id="bgm" preload="auto"></audio>
<script src="/static/game.js"></script>
</body>
</html>