mirror of
https://github.com/ParkerTenBroeck/automata.git
synced 2026-06-07 05:28:45 -04:00
152 lines
No EOL
5.7 KiB
HTML
152 lines
No EOL
5.7 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width,initial-scale=1" />
|
|
<title>Automata</title>
|
|
|
|
<link rel="icon" type="image/x-icon" href="icon.jpg">
|
|
<link href="style.css" rel="stylesheet">
|
|
<script src="./index-6JPGH2PA.js" type="module" crossorigin></script></head>
|
|
|
|
<body>
|
|
<div class="centered" id="center_text">
|
|
<p style="font-size:16px">
|
|
Loading…
|
|
</p>
|
|
<div class="lds-dual-ring"></div>
|
|
</div>
|
|
|
|
|
|
|
|
<div class="app" style="display:none" id="app">
|
|
<section>
|
|
<section>
|
|
<div id="graph" class="graph"></div>
|
|
</section>
|
|
|
|
<div class="hSplit" style="--split-default: 50%" title="Drag to resize canvas width"></div>
|
|
|
|
<div class="flexCol">
|
|
<div class="controls" style="background: var(--bg-0)">
|
|
<button id="togglePhysics" class="btn btn-red btn-toggle active" title="Toggle physics layout">
|
|
Physics: ON
|
|
</button>
|
|
|
|
<button id="resetLayout" class="btn btn-grey" title="Re-enable physics on nodes and reset layout">
|
|
Reset Layout
|
|
</button>
|
|
|
|
<span class="spacer"></span>
|
|
|
|
<button id="reloadSim" class="btn btn-blue" title="Stop and Reload simulation">
|
|
⟲ Reload
|
|
</button>
|
|
<button id="clearSim" class="btn btn-red" title="Stop and Clear simulation">
|
|
✖ Clear
|
|
</button>
|
|
|
|
|
|
<button id="stepSim" class="btn btn-yellow" title="Advance one step">
|
|
⏭ Step
|
|
</button>
|
|
<button id="playPauseSim" class="btn btn-green" title="Run / pause simulation">
|
|
▶ Play
|
|
</button>
|
|
|
|
<label class="speed">
|
|
Speed
|
|
<input id="speedSim" type="range" min="1" max="60" value="1" />
|
|
<span id="speedSimLabel">10x</span>
|
|
</label>
|
|
</div>
|
|
<div class="hSplit styleOnly"></div>
|
|
<div class="vscroll">
|
|
<div id="editor" class="editor"></div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
</section>
|
|
|
|
<div class="vSplit" style="--split-default: 40%" title="Drag to resize canvas height"></div>
|
|
|
|
<div class="flexCol">
|
|
|
|
<section class="flexCol gap marginTop">
|
|
<div class="flexCenter sidePadding gap">
|
|
<button id="themeToggle" class="btn btn-blue" title="Toggle light/dark">
|
|
🌙 Dark
|
|
</button>
|
|
<button class="btn btm-grey" style="position: relative" id="shareBtn" type="button">
|
|
Share
|
|
<span class="share-toast" id="shareToast">
|
|
Copied to clipboard
|
|
</span>
|
|
</button>
|
|
</div>
|
|
<div class="flexCenter sidePadding">
|
|
<select id="exampleSelect" class="ex-select">
|
|
<option value="" selected disabled>Choose an example…</option>
|
|
</select>
|
|
</div>
|
|
<div class="hSplit styleOnly" title="Drag to resize canvas height"></div>
|
|
|
|
<div class="flexCenter sidePadding" style="font-size: calc(16px);font-weight: bold;color: var(--fg-1)">
|
|
<span style="margin-right: 0.5em;">Status: </span><span style="color: var(--fg-2)"
|
|
id="simulationStatus">N/A</span>
|
|
</div>
|
|
<div class="flexCenter sidePadding">
|
|
<input id="machineInput" type="text" class="test-input" placeholder="Enter machine input…" />
|
|
</div>
|
|
|
|
<div class="hSplit styleOnly" title="Drag to resize canvas height"></div>
|
|
|
|
<div class="sidePadding scroll">
|
|
<div class="pathsGrid">
|
|
|
|
<details class="group group-accepted">
|
|
<summary class="groupTitle" open>
|
|
<span>Accepted</span>
|
|
<span class="count" id="acceptedCount">0</span>
|
|
</summary>
|
|
<div class="groupBody" id="acceptedPaths"></div>
|
|
</details>
|
|
|
|
<details class="group group-running" open>
|
|
<summary class="groupTitle">
|
|
<span>Running</span>
|
|
<span class="count" id="runningCount">0</span>
|
|
</summary>
|
|
<div class="groupBody" id="runningPaths"></div>
|
|
</details>
|
|
|
|
<details class="group group-rejected" open>
|
|
<summary class="groupTitle">
|
|
<span>Rejected</span>
|
|
<span class="count" id="rejectedCount">0</span>
|
|
</summary>
|
|
<div class="groupBody" id="rejectedPaths"></div>
|
|
</details>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
</section>
|
|
|
|
|
|
<div class="hSplit" style="--split-default: 50%" title="Drag to resize canvas width"></div>
|
|
|
|
<div style="height:100%">
|
|
<div id="terminal" class="terminal"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
</body>
|
|
|
|
</html> |