105 lines
6.3 KiB
HTML
105 lines
6.3 KiB
HTML
{{/*
|
|
Editor surface — v0.25.0 rebuild.
|
|
Three-pane layout: files | code-editor | <chat, notes>
|
|
Uses PaneContainer for resizable splits and tabbed right pane.
|
|
|
|
Components are SERVER-RENDERED via Go template partials into hidden
|
|
containers (#editorComponents). The boot script moves them into
|
|
pane slots created by PaneContainer. This ensures full DOM parity
|
|
with the chat surface — same buttons, same features, same behavior.
|
|
*/}}
|
|
|
|
{{define "surface-editor"}}
|
|
<div class="surface-editor" id="editorSurface">
|
|
|
|
{{/* ── Top Bar ─────────────────────────── */}}
|
|
<div class="editor-topbar" id="editorTopbar">
|
|
<a href="{{.BasePath}}/" class="editor-topbar-back" title="Back to chat">
|
|
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="19" y1="12" x2="5" y2="12"/><polyline points="12 19 5 12 12 5"/></svg>
|
|
Back
|
|
</a>
|
|
<div class="editor-topbar-sep"></div>
|
|
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="color:var(--accent);"><polyline points="16 18 22 12 16 6"/><polyline points="8 6 2 12 8 18"/></svg>
|
|
|
|
{{/* Workspace selector dropdown */}}
|
|
<div class="editor-ws-selector" id="editorWsSelector">
|
|
<button class="editor-ws-selector-btn" id="editorWsSelectorBtn">
|
|
<span id="editorWorkspaceName">{{if .Data}}{{.Data.WorkspaceName}}{{else}}Editor{{end}}</span>
|
|
<svg width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"/></svg>
|
|
</button>
|
|
<div class="editor-ws-dropdown" id="editorWsDropdown">
|
|
<div id="editorWsList" class="editor-ws-list">
|
|
{{/* Populated by JS */}}
|
|
</div>
|
|
<div class="editor-ws-dropdown-divider"></div>
|
|
<button class="editor-ws-dropdown-item editor-ws-new" id="editorWsNewBtn">
|
|
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>
|
|
New Workspace
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="editor-topbar-branch" id="editorBranchBadge" style="display:none;">
|
|
<svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="var(--purple)" stroke-width="2"><circle cx="12" cy="18" r="3"/><circle cx="12" cy="6" r="3"/><line x1="12" y1="9" x2="12" y2="15"/></svg>
|
|
<span id="editorBranchName" class="editor-topbar-branch-text">main</span>
|
|
</div>
|
|
<div style="flex:1;"></div>
|
|
<button class="icon-btn" id="editorRefreshBtn" title="Refresh files">
|
|
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="23 4 23 10 17 10"/><path d="M20.49 15a9 9 0 1 1-2.12-9.36L23 10"/></svg>
|
|
</button>
|
|
{{template "user-menu" dict "ID" ""}}
|
|
</div>
|
|
|
|
{{/* ── Pane Body ───────────────────────── */}}
|
|
<div class="editor-body" id="editorBody"></div>
|
|
|
|
{{/* ── Bootstrap (no workspace) ────────── */}}
|
|
<div class="editor-bootstrap" id="editorBootstrap" style="display:none;">
|
|
<div class="editor-bootstrap-card">
|
|
<svg width="40" height="40" viewBox="0 0 24 24" fill="none" stroke="var(--accent)" stroke-width="1.5" style="opacity:0.6;margin-bottom:12px;">
|
|
<path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"/>
|
|
</svg>
|
|
<h3 style="margin:0 0 16px;font-size:16px;">Open a Workspace</h3>
|
|
<div id="editorBootstrapList" style="margin-bottom:16px;">
|
|
<div style="font-size:12px;color:var(--text-3);">Loading workspaces…</div>
|
|
</div>
|
|
<div style="display:flex;align-items:center;gap:8px;margin-bottom:12px;">
|
|
<div style="flex:1;height:1px;background:var(--border);"></div>
|
|
<span style="font-size:11px;color:var(--text-3);text-transform:uppercase;">or create new</span>
|
|
<div style="flex:1;height:1px;background:var(--border);"></div>
|
|
</div>
|
|
<input type="text" id="editorBootstrapName" class="editor-bootstrap-input" placeholder="Workspace name" value="workspace">
|
|
<button id="editorBootstrapBtn" class="editor-bootstrap-btn">Create Workspace</button>
|
|
</div>
|
|
</div>
|
|
|
|
{{/* ── Server-Rendered Components ──────── */}}
|
|
{{/* Hidden until moved into pane slots by editor-surface.js.
|
|
Full DOM from Go template partials = feature parity with chat surface. */}}
|
|
<div id="editorComponents" style="display:none;">
|
|
{{template "file-tree" dict "ID" "ed"}}
|
|
{{template "code-editor" dict "ID" "ed"}}
|
|
{{template "chat-pane" dict "ID" "ed"}}
|
|
{{template "note-editor" dict "ID" "edNotes"}}
|
|
</div>
|
|
</div>
|
|
|
|
<div id="toastContainer" class="toast-container"></div>
|
|
{{end}}
|
|
|
|
{{/* ── CSS ─────────────────────────────────── */}}
|
|
{{define "css-editor"}}
|
|
<link rel="stylesheet" href="{{.BasePath}}/css/editor-surface.css?v={{.Version}}">
|
|
{{end}}
|
|
|
|
{{/* ── Scripts ─────────────────────────────── */}}
|
|
{{define "scripts-editor"}}
|
|
<script nonce="{{.CSPNonce}}" src="{{.BasePath}}/vendor/marked.min.js"></script>
|
|
<script nonce="{{.CSPNonce}}" src="{{.BasePath}}/vendor/purify.min.js"></script>
|
|
<script nonce="{{.CSPNonce}}" src="{{.BasePath}}/vendor/codemirror/codemirror.bundle.js?v={{.Version}}" onerror="console.warn('[CM6] Bundle not available')"></script>
|
|
<script nonce="{{.CSPNonce}}" src="{{.BasePath}}/js/ui-format.js?v={{.Version}}"></script>
|
|
<script nonce="{{.CSPNonce}}" src="{{.BasePath}}/js/chat-pane.js?v={{.Version}}"></script>
|
|
<script nonce="{{.CSPNonce}}" src="{{.BasePath}}/js/editor-surface.js?v={{.Version}}"></script>
|
|
<script nonce="{{.CSPNonce}}" src="{{.BasePath}}/js/app.js?v={{.Version}}"></script>
|
|
{{end}}
|