47 lines
1.5 KiB
Plaintext
47 lines
1.5 KiB
Plaintext
---
|
|
import ManualLayout from '../layouts/ManualLayout.astro';
|
|
---
|
|
<ManualLayout title="Decodal Playground" playground>
|
|
<section class="playground-page">
|
|
<div class="playground-header">
|
|
<div>
|
|
<h1>Playground</h1>
|
|
<p>Virtual files are evaluated in the browser through WebAssembly. Use import paths such as <code>./schemas/service.dcdl</code>.</p>
|
|
</div>
|
|
<div class="playground-actions">
|
|
<label class="example-picker">
|
|
<span>Example</span>
|
|
<select id="example-select" aria-label="Playground example"></select>
|
|
</label>
|
|
<button id="load-example" type="button">Load</button>
|
|
<p id="status" class="status">Loading WASM...</p>
|
|
<button id="run" disabled>Run</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="playground-shell">
|
|
<aside class="file-panel">
|
|
<div class="panel-header">
|
|
<span>Files</span>
|
|
<button id="new-file" type="button">New</button>
|
|
</div>
|
|
<div id="file-tree" class="file-tree"></div>
|
|
<button id="delete-file" class="danger-button" type="button">Delete file</button>
|
|
</aside>
|
|
|
|
<section class="pane input-pane">
|
|
<span id="active-file">Input</span>
|
|
<div id="editor" class="code-editor"></div>
|
|
</section>
|
|
|
|
<section class="pane output-pane">
|
|
<span>Output</span>
|
|
<pre id="output"></pre>
|
|
</section>
|
|
</div>
|
|
</section>
|
|
<script>
|
|
import '../scripts/playground.js';
|
|
</script>
|
|
</ManualLayout>
|