74ba8a63e1
regroups the 7 stacked sections into three semantic columns backed by a CSS grid (single column under 1400px, 3 columns above). column headers are sticky so vertical scrolling inside a column doesn't lose context. - SW4RM (left, slightly wider): containers + kept-state + spawn-agent form + meta-input update form. all swarm-mutating operator knobs live here. - 0PER4T0R 1N (middle): mind-questions + pending approvals. the two things waiting on operator action. - M3SS4G3S (right): operator-inbox + msg-flow tail + the @-mention compose box. broker traffic in one place. spawn form moves out of renderApprovals into static HTML under sw4rm; renderApprovals no longer injects it. cosmetic: per-section h2/divider replaced with smaller cyan sub-heads + a dashed underline so each column reads as one cohesive unit instead of seven competing banners. body max-width grows 70em → 110em to actually use the new horizontal real estate.
106 lines
5.3 KiB
HTML
106 lines
5.3 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>hyperhive // h1ve-c0re</title>
|
|
<link rel="stylesheet" href="/static/dashboard.css">
|
|
</head>
|
|
<body>
|
|
<pre class="banner">
|
|
░▒▓█▓▒░ HYPERHIVE ░▒▓█▓▒░ HIVE-C0RE ░▒▓█▓▒░ WE ARE THE WIRED ░▒▓█▓▒░
|
|
</pre>
|
|
|
|
<div id="notif-row" class="notif-row">
|
|
<button type="button" id="notif-enable" class="btn btn-notif" hidden>🔔 enable notifications</button>
|
|
<button type="button" id="notif-mute" class="btn btn-notif" hidden>🔕 mute</button>
|
|
<button type="button" id="notif-unmute" class="btn btn-notif" hidden>🔔 unmute</button>
|
|
<span id="notif-status" class="meta" hidden></span>
|
|
</div>
|
|
|
|
<div class="columns">
|
|
<!-- ── SW4RM ─────────────────────────────────────────────────
|
|
Live + dormant agents, plus the operator-driven knobs that
|
|
change the swarm itself: spawn-new-agent form, meta flake
|
|
input bumps.
|
|
───────────────────────────────────────────────────────────── -->
|
|
<section class="dash-col" aria-labelledby="col-swarm">
|
|
<h2 id="col-swarm" class="col-head">◆ SW4RM ◆</h2>
|
|
|
|
<h3 class="sub-head">containers</h3>
|
|
<div id="containers-section">
|
|
<p class="meta">loading…</p>
|
|
</div>
|
|
|
|
<h3 class="sub-head">kept state</h3>
|
|
<div id="tombstones-section">
|
|
<p class="meta">loading…</p>
|
|
</div>
|
|
|
|
<h3 class="sub-head">spawn agent</h3>
|
|
<form method="POST" action="/request-spawn" class="spawnform" data-async>
|
|
<input name="name"
|
|
placeholder="new agent name (≤9 chars)"
|
|
maxlength="9" required autocomplete="off">
|
|
<button type="submit" class="btn btn-spawn">◆ R3QU3ST SP4WN</button>
|
|
</form>
|
|
|
|
<h3 class="sub-head">update meta inputs</h3>
|
|
<p class="meta">checkbox per input; submitting runs <code>nix flake update</code> in <code>/meta/</code> and rebuilds affected agents (sequentially).</p>
|
|
<div id="meta-inputs-section">
|
|
<p class="meta">loading…</p>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- ── 0PER4T0R 1N ───────────────────────────────────────────
|
|
Things waiting on the operator to decide — questions the
|
|
manager surfaced via ask_operator and config-change
|
|
proposals from the manager's request_apply_commit / spawn.
|
|
───────────────────────────────────────────────────────────── -->
|
|
<section class="dash-col" aria-labelledby="col-operator-in">
|
|
<h2 id="col-operator-in" class="col-head">◆ 0PER4T0R 1N ◆</h2>
|
|
|
|
<h3 class="sub-head">m1nd has questions</h3>
|
|
<div id="questions-section">
|
|
<p class="meta">loading…</p>
|
|
</div>
|
|
|
|
<h3 class="sub-head">pending approvals</h3>
|
|
<div id="approvals-section">
|
|
<p class="meta">loading…</p>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- ── M3SS4G3S ──────────────────────────────────────────────
|
|
Broker traffic: the operator's inbox (messages addressed
|
|
to `operator`) and the live message flow tail. Compose
|
|
box at the bottom — @name picks the recipient, sticky.
|
|
───────────────────────────────────────────────────────────── -->
|
|
<section class="dash-col" aria-labelledby="col-messages">
|
|
<h2 id="col-messages" class="col-head">◆ M3SS4G3S ◆</h2>
|
|
|
|
<h3 class="sub-head">operator inbox</h3>
|
|
<div id="inbox-section">
|
|
<p class="meta">loading…</p>
|
|
</div>
|
|
|
|
<h3 class="sub-head">message flow</h3>
|
|
<p class="meta">live tail — newest at the top; each row is one broker event. compose below: <code>@name</code> picks the recipient (sticky until you @ someone else); <code>tab</code> completes.</p>
|
|
<div id="msgflow" class="msgflow"><span class="meta">connecting…</span></div>
|
|
<div id="op-compose" class="op-compose">
|
|
<span id="op-compose-prompt" class="op-compose-prompt">@—></span>
|
|
<textarea id="op-compose-input" class="op-compose-input"
|
|
placeholder="@agent message… (enter sends, shift+enter newline, tab completes @-mention)"
|
|
rows="1" autocomplete="off"></textarea>
|
|
<div id="op-compose-suggest" class="op-compose-suggest" hidden></div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
|
|
<footer>
|
|
<div class="divider">══════════════════════════════════════════════════════════════</div>
|
|
<p>▲△▲ <a href="https://git.berlin.ccc.de/vinzenz/hyperhive">hyperhive</a> ▲△▲ hive-c0re on this host ▲△▲</p>
|
|
</footer>
|
|
|
|
<script src="/static/app.js" defer></script>
|
|
</body>
|
|
</html>
|