57 lines
2.4 KiB
HTML
57 lines
2.4 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Aego Playground</title>
|
|
<link rel="icon" href="data:,">
|
|
<link rel="stylesheet" href="play.css?v=dev">
|
|
</head>
|
|
<body>
|
|
<header class="bar">
|
|
<a class="brand" href="../">Aego</a>
|
|
<span class="sep">/</span>
|
|
<span class="title">Playground</span>
|
|
<select id="examples" aria-label="Examples"><option value="">Examples…</option></select>
|
|
<label class="frames" id="frames-label">Frames <input id="frames" type="number" min="1" max="3600" value="120"></label>
|
|
<button id="run" disabled>Run <kbd>Ctrl+Enter</kbd></button>
|
|
<button id="stop" class="ghost" disabled>Stop</button>
|
|
<span id="status" class="status">Loading…</span>
|
|
</header>
|
|
<main class="layout">
|
|
<section class="editor" aria-label="Script">
|
|
<div id="loader" class="loader" role="status" aria-live="polite" data-wasm-size="0" data-version="dev">
|
|
<div class="spinner" aria-hidden="true"></div>
|
|
<div id="loader-title" class="loader-title">Loading engine…</div>
|
|
<div class="progress"><div id="loader-bar" class="progress-bar indeterminate"></div></div>
|
|
<div id="loader-detail" class="loader-detail"></div>
|
|
</div>
|
|
<div class="code">
|
|
<div id="marks" class="marks" aria-hidden="true"></div>
|
|
<pre id="highlight" class="highlight" aria-hidden="true"></pre>
|
|
<textarea id="source" spellcheck="false" autocapitalize="off" autocomplete="off" wrap="off"></textarea>
|
|
</div>
|
|
</section>
|
|
<section class="side">
|
|
<div id="game-pane" class="game">
|
|
<div class="game-view">
|
|
<canvas id="game" data-aego tabindex="0" aria-label="Game view"></canvas>
|
|
<div id="game-hint" class="game-hint">Pick an example with a scene and press Run</div>
|
|
</div>
|
|
<div class="game-bar"><span id="stats" class="stats"></span><span class="hint">Click the view to play · click outside to release</span></div>
|
|
</div>
|
|
<div class="pane">
|
|
<h2>Problems <span id="problem-count" class="count"></span></h2>
|
|
<ul id="problems" class="list"></ul>
|
|
</div>
|
|
<div class="pane grow">
|
|
<h2>Console <button id="clear" class="link">Clear</button></h2>
|
|
<ul id="console" class="list mono"></ul>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
<script src="wasm_exec.js?v=dev"></script>
|
|
<script src="play.js?v=dev"></script>
|
|
</body>
|
|
</html>
|