Expand render graph playground editing

Amp-Thread-ID: https://ampcode.com/threads/T-01a033d4-0e44-708e-af0e-6166283416ff
Co-authored-by: Heaust Azure <heaust.azure@gmail.com>
This commit is contained in:
Amp
2026-08-25 05:18:14 +00:00
co-authored by heaust
parent d71da85307
commit e7546e4b78
20 changed files with 3058 additions and 303 deletions
+43 -5
View File
@@ -125,6 +125,20 @@
render graph
<i id="graph-tab-dirty"></i>
</button>
<button
class="pane-tab"
id="shader-tab"
type="button"
role="tab"
aria-selected="false"
aria-controls="shader-workspace"
data-editor-tab="shader"
title="Select a render or compute pipeline to edit its WGSL"
disabled
>
<span class="wgsl-icon">WG</span>
shader.wgsl
</button>
</div>
<div
id="editor"
@@ -182,11 +196,35 @@
id="render-graph-canvas"
aria-label="Render graph node editor"
></canvas>
<div class="render-graph-empty-hint" id="render-graph-hint">
<span>+</span>
<strong>Add another pass</strong>
<small>Right click anywhere to browse the node catalog</small>
</div>
</div>
</section>
<section
id="shader-workspace"
class="shader-workspace coding-panel"
role="tabpanel"
aria-labelledby="shader-tab"
hidden
>
<header class="shader-toolbar">
<span>Selected pipeline</span>
<strong id="shader-node-name">Select a pipeline node</strong>
<small
>Changes stay in this loadout until the playground is
saved.</small
>
</header>
<div
id="shader-editor"
class="shader-editor"
aria-label="WGSL shader editor"
></div>
<div id="shader-empty" class="shader-empty">
<span>WGSL</span>
<strong>Select a pipeline in the render graph</strong>
<small
>Render and compute pipeline nodes contain editable shader
source.</small
>
</div>
</section>
<footer class="editor-status">