Initial import of HEROLL source and design documents
This commit is contained in:
toshiocn
+124
@@ -0,0 +1,124 @@
|
||||
<!doctype html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" />
|
||||
<meta name="theme-color" content="#11101d" />
|
||||
<title>HEROLL 玩法验证 MVP</title>
|
||||
<link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Crect width='64' height='64' rx='10' fill='%23503b62'/%3E%3Ccircle cx='19' cy='19' r='5' fill='%23ffe77f'/%3E%3Ccircle cx='45' cy='45' r='5' fill='%23ffe77f'/%3E%3C/svg%3E" />
|
||||
<link rel="stylesheet" href="./styles.css" />
|
||||
</head>
|
||||
<body>
|
||||
<main id="app" aria-label="HEROLL 玩法验证 MVP">
|
||||
<div id="legal-strip">仅限本机内部验证 · 不得公开或分发</div>
|
||||
|
||||
<section id="start-screen" class="screen active">
|
||||
<div class="start-art" aria-hidden="true"></div>
|
||||
<div class="title-mark">
|
||||
<small>10 层 · 公平双骰 · 单机 H5</small>
|
||||
<h1>HEROLL</h1>
|
||||
<p>玩法验证 MVP</p>
|
||||
</div>
|
||||
<div class="start-actions panel">
|
||||
<label class="seed-field">种子 <input id="seed-input" maxlength="32" autocomplete="off" /></label>
|
||||
<button id="new-run-button" class="button primary">开始新局</button>
|
||||
<button id="continue-button" class="button secondary" hidden>继续安全点</button>
|
||||
<button id="clear-save-button" class="button ghost" hidden>清除本局存档</button>
|
||||
<p class="scope-note">无账号、局外成长、体力、抽卡、付费和广告按钮。</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="game-screen" class="screen">
|
||||
<header id="top-hud">
|
||||
<div class="resource-chip"><span class="point-gem">◆</span><strong id="points-value">0</strong></div>
|
||||
<div id="auto-indicator" aria-label="自动模式关闭">AUTO</div>
|
||||
<button id="pause-button" class="icon-button" aria-label="暂停">Ⅱ</button>
|
||||
</header>
|
||||
|
||||
<div id="board-view" class="play-view active">
|
||||
<div class="scene-back"></div>
|
||||
<div id="boss-figure" aria-hidden="true"></div>
|
||||
<div id="board-ring" aria-label="十格逻辑棋盘，四十格表现路径"></div>
|
||||
<div id="hero-marker" aria-label="玩家位置"></div>
|
||||
<aside id="floor-meter" data-mode="BUILDUP" aria-label="Boss：玩家 ROLL 两次后开始四次 ROLL 倒计时，结束时转换四个地块">
|
||||
<span class="boss-meter-icon"></span>
|
||||
<div class="meter-rail"><i id="floor-meter-fill"></i></div>
|
||||
<span class="floor-step-icon"></span>
|
||||
<strong id="floor-value">0/2</strong>
|
||||
</aside>
|
||||
<div id="floor-banner" aria-live="polite"></div>
|
||||
</div>
|
||||
|
||||
<div id="battle-view" class="play-view">
|
||||
<div class="battle-sky"></div>
|
||||
<div id="battle-versus" aria-label="双方生命对比">
|
||||
<i class="versus-player"></i><strong>VS</strong><i class="versus-enemy"></i>
|
||||
</div>
|
||||
<div id="battle-enemies"></div>
|
||||
<div id="battle-player" class="combatant player">
|
||||
<div class="pixel-fighter player-silhouette"></div>
|
||||
<div class="entity-name">剑士</div>
|
||||
</div>
|
||||
<div id="battle-log" aria-live="polite"></div>
|
||||
<div id="battle-speed" hidden>1×</div>
|
||||
<div id="battle-announcer" aria-live="assertive"></div>
|
||||
</div>
|
||||
|
||||
<div id="dice-result" aria-live="polite"></div>
|
||||
|
||||
<footer id="bottom-hud">
|
||||
<div class="hp-row">
|
||||
<span class="level-diamond" id="hud-floor">1</span>
|
||||
<div class="bar hp"><i id="hp-fill"></i><strong id="hp-label">150/150</strong></div>
|
||||
<div class="battle-mode-lock" aria-label="战斗速度锁定为一倍">» 🔒</div>
|
||||
</div>
|
||||
<div id="gear-slots" aria-label="装备槽">
|
||||
<button data-slot="WEAPON" title="武器">⚔</button>
|
||||
<button data-slot="RING" title="戒指">◉</button>
|
||||
<button data-slot="GAUNTLET" title="护手">✊</button>
|
||||
<button data-slot="BOOTS" title="鞋子">♞</button>
|
||||
</div>
|
||||
<div class="action-row">
|
||||
<button id="debug-toggle" class="map-button" aria-label="地图与调试台"><span></span></button>
|
||||
<button id="roll-button" class="roll-button">ROLL</button>
|
||||
<button id="potion-button" class="potion-button"><span></span><strong id="potion-count">1/1</strong></button>
|
||||
</div>
|
||||
</footer>
|
||||
</section>
|
||||
|
||||
<div id="modal-layer" aria-live="polite"></div>
|
||||
<div id="toast-layer" aria-live="polite"></div>
|
||||
<div id="tutorial-layer"></div>
|
||||
|
||||
<aside id="debug-panel" class="panel" hidden>
|
||||
<div class="debug-title"><strong>验证调试台</strong><button id="debug-close">×</button></div>
|
||||
<label>种子 <output id="debug-seed"></output></label>
|
||||
<label>楼层 <input id="debug-floor" type="number" min="1" max="10" /></label>
|
||||
<label>点数 <input id="debug-points" type="number" min="0" max="999" /></label>
|
||||
<div class="debug-grid">
|
||||
<button data-debug="apply">应用</button>
|
||||
<button data-debug="chest">宝箱</button>
|
||||
<button data-debug="campfire">营火</button>
|
||||
<button data-debug="smithy">铁匠</button>
|
||||
<button data-debug="blessing">祝福</button>
|
||||
<button data-debug="dig">挖掘</button>
|
||||
<button data-debug="merchant">商人</button>
|
||||
<button data-debug="legend">传奇装备</button>
|
||||
<button data-debug="lotto">彩票</button>
|
||||
<button data-debug="blackjack">21点</button>
|
||||
<button data-debug="claw">抓娃娃</button>
|
||||
<button data-debug="carriage">黄金马车</button>
|
||||
<button data-debug="machine">骰子机</button>
|
||||
<button data-debug="bubble">泡泡龙</button>
|
||||
<button data-debug="battle">战斗</button>
|
||||
<button data-debug="win">结束战斗</button>
|
||||
<button data-debug="death">强制死亡</button>
|
||||
<button data-debug="boss">跳到 Boss</button>
|
||||
<button data-debug="speed">战斗 4×</button>
|
||||
<button data-debug="export">导出日志</button>
|
||||
</div>
|
||||
</aside>
|
||||
</main>
|
||||
<script type="module" src="./dist/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user