Finally add and wire up most of the debug panel
This commit is contained in:
Eevee (Evelyn Woods) committed
1 parent
c1ba299e9f
commit
aeac5c285b
4 files changed
+303
-69
No files matched your search
+79
-39
@@ -109,6 +109,85 @@
|
||||
</div>
|
||||
<div class="inventory"></div>
|
||||
</section>
|
||||
<form id="player-debug">
|
||||
<div class="-time">
|
||||
<table class="-time-controls">
|
||||
<tr>
|
||||
<td><button type="button" class="-time-button" data-dt="-1">← 1 tic</button></td>
|
||||
<td id="player-debug-time-tics">0</td>
|
||||
<td>tics</td>
|
||||
<td><button type="button" class="-time-button" data-dt="1">1 tic →</button></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><button type="button" class="-time-button" data-dt="-4">← 1 move</button></td>
|
||||
<td id="player-debug-time-moves">0</td>
|
||||
<td>moves</td>
|
||||
<td><button type="button" class="-time-button" data-dt="4">1 move →</button></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><button type="button" class="-time-button" data-dt="-20">← 1 s</button></td>
|
||||
<td id="player-debug-time-secs">0</td>
|
||||
<td>seconds</td>
|
||||
<td><button type="button" class="-time-button" data-dt="20">1 s →</button></td>
|
||||
</tr>
|
||||
</table>
|
||||
<p>Game speed:
|
||||
<select name="speed">
|
||||
<option value="6">6× — 120 tics per second</option>
|
||||
<option value="3">3× — 60 tics per second</option>
|
||||
<option value="2">2× — 40 tics per second</option>
|
||||
<option value="3/2">1½× — 30 tics per second</option>
|
||||
<option value="1" selected>1× — 20 tics per second</option>
|
||||
<option value="1/2">½× — 10 tics per second</option>
|
||||
<option value="1/3">⅓× — 6⅔ tics per second</option>
|
||||
<option value="1/4">¼× — 5 tics per second</option>
|
||||
</select>
|
||||
</p>
|
||||
</div>
|
||||
<div class="input"></div>
|
||||
<div class="-options">
|
||||
<p> Viewport size:
|
||||
<select id="player-debug-viewport" disabled>
|
||||
<option value="default" selected>Level default (9 or 10)</option>
|
||||
<option value="12">12 × 12</option>
|
||||
<option value="16">16 × 16</option>
|
||||
<option value="24">24 × 24</option>
|
||||
<option value="32">32 × 32</option>
|
||||
<option value="max">Entire level</option>
|
||||
</select>
|
||||
</p>
|
||||
<ul>
|
||||
<li><input type="checkbox" disabled> Show actor info</li>
|
||||
<li><input type="checkbox" disabled> Show actor bounding boxes</li>
|
||||
<li><input type="checkbox" disabled> Freeze time for everything else</li>
|
||||
<li><input type="checkbox" disabled> Player is immortal</li>
|
||||
<li><input type="checkbox" disabled> Player ignores collision</li>
|
||||
<li><input type="checkbox" disabled> Player levitates</li>
|
||||
</ul>
|
||||
<p>(Middle-click to teleport.)</p>
|
||||
</div>
|
||||
<div class="-inventory">
|
||||
<!-- populated in js -->
|
||||
</div>
|
||||
<div class="-buttons">
|
||||
<!-- populated in js -->
|
||||
</div>
|
||||
|
||||
<!-- TODO?
|
||||
- inspect with mouse
|
||||
- list of actors, or currently pointed-to actor?
|
||||
- activate something manually?
|
||||
- click a button ingame?
|
||||
- pan viewport (like editor)
|
||||
- show connections, directions, other editor features
|
||||
- look under anything
|
||||
|
||||
- other game info?
|
||||
- count tiles?
|
||||
- total hearts?
|
||||
- total bonus flags?
|
||||
-->
|
||||
</form>
|
||||
<div id="player-music">
|
||||
<div id="player-music-left">
|
||||
🎵 <a id="player-music-title">title</a> by <a id="player-music-author">author</a>
|
||||
@@ -157,45 +236,6 @@
|
||||
<button class="demo-play" type="button">View replay</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="player-debug">
|
||||
<p>Play time: A tics, B moves, C seconds</p>
|
||||
<p>
|
||||
<button class="demo-step-1" type="button">Step 1 tic</button>
|
||||
<button class="demo-step-4" type="button">Step 1 move</button>
|
||||
<button>« 4 tics</button>
|
||||
<button>« 1 tic</button>
|
||||
<button>1 tic »</button>
|
||||
<button>4 tics »</button>
|
||||
</p>
|
||||
<p>Speed: 6× (0.5 frame), 3× (1 frame), 2× (???), 1.5× (2 frames), 1× (3 frames), ½× (6 frames), ⅓× (9 frames), ¼× (12 frames)</p>
|
||||
<p>Viewport: 9/10, 12, 16, 24, 32, map size</p>
|
||||
<div class="input"></div>
|
||||
|
||||
<p><input type="checkbox"> Show actor info</p>
|
||||
<p><input type="checkbox"> Show actor bounding boxes</p>
|
||||
|
||||
<p><input type="checkbox"> Freeze time for everything else</p>
|
||||
<p><input type="checkbox"> Immortal / intangible?</p>
|
||||
<p><input type="checkbox"> Ignore collisions</p>
|
||||
<p><input type="checkbox"> Levitate</p>
|
||||
<p><input type="checkbox"> Stop clock</p> <!-- TODO toggle clock like the ingame tile? -->
|
||||
<p>Give item: <img src="icons/tool-bg-selected.png"> (Click inventory to destroy items)</p>
|
||||
|
||||
<p>
|
||||
<button>Green button</button>
|
||||
<button>Blue button</button>
|
||||
</p>
|
||||
|
||||
<!-- TODO?
|
||||
- inspect with mouse
|
||||
- list of actors, or currently pointed-to actor?
|
||||
- activate something manually?
|
||||
- click a button ingame?
|
||||
- pan viewport (like editor)
|
||||
- show connections, directions, other editor features
|
||||
- look under anything
|
||||
-->
|
||||
</div>
|
||||
</main>
|
||||
<main id="editor" hidden>
|
||||
<header>
|
||||
|
||||
Reference in new issue
Block a user