changing layout

This commit is contained in:
Parker TenBroeck 2026-01-13 19:38:35 -05:00
parent 2b96dd420f
commit e3a0370025
4 changed files with 90 additions and 54 deletions

View file

@ -26,7 +26,54 @@
<div id="graph" class="graph"></div>
</section>
<div class="vSplit" style="--split-default: 20%" title="Drag to resize canvas width"></div>
<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">
@ -56,7 +103,7 @@
</div>
<div class="hSplit styleOnly" title="Drag to resize canvas height"></div>
<div class="sidePadding scroll">
<div class="pathsGrid">
@ -88,52 +135,11 @@
</div>
</section>
</section>
<div class="hSplit" style="--split-default: 50%" title="Drag to resize canvas height"></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" title="Drag to resize canvas height"></div>
<div class="hSplit" style="--split-default: 50%" title="Drag to resize canvas width"></div>
<div style="height:100%">
<div class="vscroll">
<div id="editor" class="editor"></div>
</div>
<div class="vSplit" style="--split-default: 40%" title="Drag to resize terminal/editor width"></div>
<div id="terminal" class="terminal"></div>
</div>
</div>