diff options
Diffstat (limited to 'public/index.html')
| -rw-r--r-- | public/index.html | 190 |
1 files changed, 190 insertions, 0 deletions
diff --git a/public/index.html b/public/index.html new file mode 100644 index 0000000..47b6245 --- /dev/null +++ b/public/index.html @@ -0,0 +1,190 @@ +<!doctype html> +<html lang="zh-CN"> +<head> + <meta charset="utf-8"> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <meta name="theme-color" content="#080b0d"> + <title>Somhairle's Dream · 实时重建台</title> + <link rel="stylesheet" href="/styles.css"> + <script src="https://cdn.jsdelivr.net/npm/[email protected]/build/three.min.js"></script> +</head> +<body> + <main class="shell" aria-labelledby="page-title"> + <header class="masthead"> + <div class="brand-lockup"> + <span class="eyebrow">SOMHAIRLE'S DREAM / CONTROL SURFACE</span> + <h1 id="page-title">实时重建台</h1> + </div> + <div class="connection-readout" aria-live="polite"> + <span class="signal-mark" aria-hidden="true"></span> + <span id="stream-state">实时链路 · 等待启动</span> + </div> + </header> + + <section class="mission-strip" aria-label="当前任务"> + <div> + <span class="eyebrow">PROJECT</span> + <strong id="project-id">heritage-001</strong> + </div> + <div> + <span class="eyebrow">RUN</span> + <strong id="run-id">run-001</strong> + </div> + <div class="mission-note"> + <span class="eyebrow">MODE</span> + <strong>F# / LIVE GEOMETRY</strong> + </div> + </section> + + <section class="workspace" aria-label="实时运行工作区"> + <aside class="telemetry-panel panel"> + <div class="panel-heading"> + <span class="eyebrow">RUN TELEMETRY</span> + <div id="status-chip" class="status-chip status-idle" data-status="idle"> + <span class="status-dot" aria-hidden="true"></span> + <span id="status-label">待机</span> + </div> + </div> + <p id="run-message" class="status-message">等待下一个设计运行</p> + <form id="run-controls" class="run-controls"> + <div class="control-grid"> + <label> + <span>项目 ID</span> + <input id="project-id-input" value="heritage-001" autocomplete="off"> + </label> + <label> + <span>运行 ID</span> + <input id="run-id-input" value="run-001" autocomplete="off"> + </label> + <label> + <span>基准 ID</span> + <input id="base-id-input" value="base-000" autocomplete="off"> + </label> + <label> + <span>目标 ID</span> + <input id="target-id-input" value="target-003" autocomplete="off"> + </label> + </div> + <div class="control-actions"> + <label class="render-toggle"> + <input id="run-render-input" type="checkbox"> + <span>渲染预览 PNG</span> + </label> + <button id="run-start-button" class="run-start-button" type="submit">启动设计运行</button> + </div> + <a id="artifact-manifest-link" class="artifact-link is-hidden" target="_blank" rel="noreferrer">打开 artifact manifest</a> + </form> + <div class="version-block"> + <div class="label-row"> + <span>设计版本</span> + <strong id="version-readout">00 / 03</strong> + </div> + <div class="progress-track" aria-hidden="true"> + <span id="progress-fill" class="progress-fill" style="width: 0%"></span> + </div> + </div> + <dl class="telemetry-list"> + <div> + <dt>当前版本</dt> + <dd id="current-version">V00</dd> + </div> + <div> + <dt>目标版本</dt> + <dd id="target-version">V03</dd> + </div> + <div> + <dt>最后更新</dt> + <dd id="updated-at">等待心跳</dd> + </div> + </dl> + </aside> + + <section id="viewport-panel" class="viewport-panel panel" aria-labelledby="viewport-title"> + <div class="panel-heading viewport-heading"> + <div> + <span class="eyebrow">GEOMETRY VIEWPORT</span> + <h2 id="viewport-title">结构重建视图</h2> + </div> + <span id="mesh-label" class="mesh-label">重建起点</span> + </div> + <div class="viewport-frame"> + <canvas id="viewport-canvas" aria-label="设计几何三维视图"></canvas> + <div class="axis-readout" aria-hidden="true">X / Y / Z</div> + <div id="viewport-note" class="viewport-note">实时几何 · V00</div> + </div> + </section> + + <aside class="event-panel panel" aria-labelledby="event-title"> + <div class="panel-heading"> + <div> + <span class="eyebrow">EVENT STREAM</span> + <h2 id="event-title">运行记录</h2> + </div> + <span class="event-count">LIVE</span> + </div> + <ol class="event-list"> + <li class="event-item event-item-active"> + <span class="event-index">01</span> + <div> + <strong>实时监视</strong> + <span>服务端心跳与版本状态</span> + </div> + </li> + <li class="event-item"> + <span class="event-index">02</span> + <div> + <strong>目标检查</strong> + <span>等候下一次设计运行</span> + </div> + </li> + <li class="event-item"> + <span class="event-index">03</span> + <div> + <strong>发布闸门</strong> + <span>验证通过后写入快照</span> + </div> + </li> + </ol> + </aside> + </section> + + <section class="timeline panel" aria-labelledby="timeline-title"> + <div class="timeline-header"> + <div> + <span class="eyebrow">RECONSTRUCTION TIMELINE</span> + <h2 id="timeline-title">几何版本轨迹</h2> + </div> + <span id="replay-state" class="replay-state">可回放 · 三个确定性快照</span> + </div> + <div class="timeline-track" aria-label="几何版本"> + <span class="timeline-line" aria-hidden="true"></span> + <div class="timeline-step timeline-step-complete"> + <span class="timeline-dot" aria-hidden="true"></span> + <span class="timeline-version">V01</span> + <span class="timeline-label">重建起点</span> + </div> + <div class="timeline-step timeline-step-complete"> + <span class="timeline-dot" aria-hidden="true"></span> + <span class="timeline-version">V02</span> + <span class="timeline-label">主承力骨架</span> + </div> + <div class="timeline-step"> + <span class="timeline-dot" aria-hidden="true"></span> + <span class="timeline-version">V03</span> + <span class="timeline-label">舱段重构</span> + </div> + </div> + <div class="timeline-footer"> + <span id="timeline-current">V01 · 重建起点</span> + <button id="replay-button" class="replay-button" type="button">重建演示</button> + </div> + </section> + + <footer class="footer-note"> + <span>状态快照 · 原子发布 · 心跳监视</span> + <span>OPEN CODE / F# FIRST</span> + </footer> + </main> + <script type="module" src="/App.js"></script> +</body> +</html> |