{% extends "base.html" %}
{% block title %}Workbench layouts{% endblock %}
{% block page_id %}workbench{% endblock %}
{% block head %}<style>
.wb-toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:end}.wb-toolbar label{min-width:170px}.wb-toolbar input,.wb-toolbar select{width:100%}.wb-split{display:flex;gap:8px;min-width:0;min-height:300px}.wb-split.wb-v{flex-direction:column}.wb-child{min-width:0;min-height:120px;overflow:auto;flex-grow:0;flex-shrink:1}.wb-stack{border:1px solid var(--line);border-radius:8px;min-height:280px;min-width:0;display:flex;flex-direction:column;background:var(--bg-2)}.wb-tabs{display:flex;flex-wrap:wrap;gap:4px;padding:6px}.wb-tabs button[aria-selected="true"]{border-color:var(--accent)}.wb-frame{width:100%;height:560px;border:0;background:var(--bg)}.wb-group{margin:12px 0}.wb-fields{display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}.wb-placeholder{padding:22px;overflow-wrap:anywhere}.wb-preview{font-family:var(--mono);white-space:pre-wrap;overflow-wrap:anywhere;max-height:250px;overflow:auto}.wb-window-title{display:flex;gap:8px;align-items:center}.wb-import{width:100%;min-height:160px}.wb-layout{overflow:auto}.wb-layout>.wb-group{min-width:400px}.wb-status{overflow-wrap:anywhere}
</style>{% endblock %}
{% block content %}
<div class="a-page-head"><h1>Workbench layouts</h1><p class="a-sub">The native SCHEMA3 named arrangements saved on this PC, with the same model operations for tabs, groups and splits.</p></div>
<div id="wb-message" class="wb-status" role="status" aria-live="polite"></div><p id="wb-status" class="a-hint wb-status"></p>
<p class="a-hint">Supported tabs mount existing browser pages with their own permissions. Private panel state and retained metadata stay on the server. Browser groups do not restore desktop geometry, SSH connections, credentials, or processes. Public downloads omit private state and geometry. Removing a panel changes the arrangement; it does not stop tasks launched inside that page.</p>
<section class="a-card"><h2>Canonical named layouts</h2><div class="wb-toolbar">
<button id="wb-refresh" type="button" class="a-btn">Refresh saved catalog</button>
<label class="a-field" for="wb-saved"><span>Saved layout</span><select id="wb-saved" class="a-input"><option value="">Select a saved layout</option></select></label>
<button id="wb-review" type="button" class="a-btn">Review selected saved revision</button><button id="wb-load" type="button" class="a-btn">Open selected in draft</button>
<label class="a-field" for="wb-name"><span>Save as name</span><input id="wb-name" class="a-input" maxlength="256" autocomplete="off"></label><button id="wb-save" type="button" class="a-btn">Save arrangement</button>
<button id="wb-new" type="button" class="a-btn">New empty draft</button><button id="wb-reload" type="button" class="a-btn">Reload current server draft</button><button id="wb-export" type="button" class="a-btn">Download public SCHEMA3 JSON</button>
</div><p id="wb-catalog-note" class="a-hint"></p><div id="wb-catalog-errors"></div>
<div class="wb-toolbar"><label class="a-field" for="wb-delete-confirm"><span>Type DELETE to delete selected saved layout</span><input id="wb-delete-confirm" class="a-input" autocomplete="off"></label><button id="wb-delete" type="button" class="a-btn">Delete selected saved layout</button></div></section>
<section class="a-card"><h2>Native panel palette and placement</h2><div class="wb-fields">
<label class="a-field" for="wb-palette"><span>Native panel spec</span><select id="wb-palette" class="a-input"></select></label>
<label class="a-field" for="wb-panel"><span>Placed panel</span><select id="wb-panel" class="a-input"></select></label>
<label class="a-field" for="wb-target"><span>Drop target group / node</span><select id="wb-target" class="a-input"></select></label>
<label class="a-field" for="wb-zone"><span>Native drop zone</span><select id="wb-zone" class="a-input"><option value="center">Center (join tabs)</option><option value="left">Left</option><option value="right">Right</option><option value="top">Top</option><option value="bottom">Bottom</option></select></label>
<label class="a-field" for="wb-index"><span>Tab index (blank appends)</span><input id="wb-index" type="number" min="0" max="256" class="a-input"></label>
<label class="a-field" for="wb-share"><span>Split share (0.02 to 0.98)</span><input id="wb-share" type="number" min="0.02" max="0.98" step="0.01" value="0.5" class="a-input"></label>
</div><div class="wb-toolbar"><button id="wb-add" type="button" class="a-btn">Add supported panel</button><button id="wb-move" type="button" class="a-btn">Move / reorder selected panel</button><button id="wb-active" type="button" class="a-btn">Select active tab</button><button id="wb-float" type="button" class="a-btn">Float as browser group</button><button id="wb-remove" type="button" class="a-btn">Remove selected panel</button></div>
<div class="wb-toolbar"><label class="a-field" for="wb-split"><span>Split to resize</span><select id="wb-split" class="a-input"></select></label><label class="a-field" for="wb-weights"><span>Positive weights, comma separated</span><input id="wb-weights" class="a-input" placeholder="3, 7" spellcheck="false"></label><button id="wb-resize" type="button" class="a-btn">Apply native split weights</button></div><p class="a-hint">Native-only saved panels can be arranged, exported, or saved while remaining unmounted. Palette specs are native singletons. Open or import replaces this private draft; Save writes only after the saved revision still matches.</p></section>
<div id="wb-layout" class="wb-layout" aria-label="Workbench arrangement"></div>
<section class="a-card"><h2>Review a native SCHEMA3 import</h2><label class="a-field" for="wb-import-text"><span>Exact layout JSON text</span><textarea id="wb-import-text" class="a-textarea wb-import" spellcheck="false"></textarea></label><div class="wb-toolbar"><button id="wb-import-preview" type="button" class="a-btn">Validate and preview import</button><label class="a-field" for="wb-import-confirm"><span>Type IMPORT after reviewing preview</span><input id="wb-import-confirm" class="a-input" autocomplete="off"></label><button id="wb-import-accept" type="button" class="a-btn">Use reviewed import in draft</button></div><div id="wb-import-preview-content" class="wb-preview"></div><p class="a-hint">Import retains original private metadata on the server and mounts only supported browser pages. It changes the draft; Save arrangement writes a named file separately. Invalid or stale imports leave the draft and source file intact.</p></section>
{% endblock %}
{% block scripts %}<script src="{{ aida_rel('static/js/workbench.js') }}"></script>{% endblock %}