124 lines
4.7 KiB
HTML
124 lines
4.7 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Workshop</title>
|
|
<link rel="stylesheet" href="style.css">
|
|
</head>
|
|
<body>
|
|
<!--
|
|
workshop's frontend. Vanilla JS, no build step, no framework — the same
|
|
"vendored, dependency-free" choice as the digest/admin canvas SDKs and
|
|
pantry-vision's kiosk page. Config (API URL + bearer token) arrives as URL query
|
|
params, never baked in, so this stays a static asset with no secret in git.
|
|
|
|
Scope: editing the hardware inventory by hand. Everything else the workshop service
|
|
holds — projects, decisions, workflow notes, facts — is written by the assistant or
|
|
over the API; the inventory is the one table a person needs to sit down and correct,
|
|
because it is the one that describes physical reality and drifts from it.
|
|
-->
|
|
<header id="top">
|
|
<h1>Workshop</h1>
|
|
<nav id="tabs">
|
|
<button class="tab active" data-tab="inventory">Inventory</button>
|
|
<button class="tab" data-tab="cameras">Cameras</button>
|
|
<button class="tab" data-tab="fleet">Fleet scripts</button>
|
|
</nav>
|
|
<span id="counts" class="muted"></span>
|
|
<!-- System health, always visible, never a separate screen you have to remember to
|
|
open. One dot: green/amber/red, with the detail behind a click. -->
|
|
<button id="health-pill" class="pill" title="System health">…</button>
|
|
</header>
|
|
|
|
<dialog id="health-dialog">
|
|
<h2>System health</h2>
|
|
<div id="health-body"><p class="muted">Loading…</p></div>
|
|
<form method="dialog"><button class="primary">Close</button></form>
|
|
</dialog>
|
|
|
|
<main>
|
|
<section id="inventory" class="panel active">
|
|
<div id="controls">
|
|
<input id="search" type="search" placeholder="Search designation, kind or location…" autocomplete="off">
|
|
<select id="filter-status">
|
|
<option value="">Any status</option>
|
|
<option value="available">Available — on the shelf, unpromised</option>
|
|
<option value="assigned">Reserved — spoken for, still on the shelf</option>
|
|
<option value="in_use">In use — installed and working</option>
|
|
<option value="retired">Retired — dead, sold, given away</option>
|
|
</select>
|
|
<select id="filter-project"><option value="">Any project</option></select>
|
|
<button id="add-btn" class="primary">Add hardware</button>
|
|
</div>
|
|
|
|
<p id="status" class="muted"></p>
|
|
|
|
<form id="add-form" hidden>
|
|
<div class="grid">
|
|
<label>What is printed on it
|
|
<input id="f-designation" type="text" required placeholder="LSI 9211-8i">
|
|
</label>
|
|
<label>Kind
|
|
<input id="f-kind" type="text" placeholder="HBA, PSU, RAM…">
|
|
</label>
|
|
<label>How many
|
|
<input id="f-quantity" type="number" min="0" step="1" value="1">
|
|
</label>
|
|
<label>Where it is
|
|
<input id="f-location" type="text" placeholder="drawer 3, antistatic bag">
|
|
</label>
|
|
<label>Status
|
|
<select id="f-status">
|
|
<option value="available">Available</option>
|
|
<option value="assigned">Reserved for a project</option>
|
|
<option value="in_use">In use</option>
|
|
<option value="retired">Retired</option>
|
|
</select>
|
|
</label>
|
|
<label>Project
|
|
<select id="f-project"><option value="">— none —</option></select>
|
|
</label>
|
|
<label class="wide">Notes
|
|
<input id="f-notes" type="text" placeholder="anything worth knowing next time you pick it up">
|
|
</label>
|
|
</div>
|
|
<div class="actions">
|
|
<button type="button" id="add-cancel">Cancel</button>
|
|
<button type="submit" class="primary">Add it</button>
|
|
</div>
|
|
</form>
|
|
|
|
<div id="list"><p class="muted">Loading…</p></div>
|
|
</section>
|
|
|
|
<section id="fleet" class="panel">
|
|
<p class="muted">
|
|
One monitoring-agent script per platform, fetched by each endpoint's
|
|
<code>fleet-bootstrap</code> timer. <strong>Uploading is not deploying</strong> —
|
|
a new upload is a draft until you publish it, because the thing you are confirming
|
|
runs as root on every machine in the house.
|
|
</p>
|
|
<div id="fleet-slots"><p class="muted">Loading…</p></div>
|
|
<h2>What the endpoints report</h2>
|
|
<p class="muted">
|
|
Reported by each machine after it runs, never assumed here: a script that was
|
|
served is not a script that succeeded.
|
|
</p>
|
|
<div id="fleet-reports"></div>
|
|
</section>
|
|
|
|
<section id="cameras" class="panel">
|
|
<p class="muted">
|
|
The network cameras, straight from go2rtc. The USB cameras in this house are all
|
|
aimed at one fixed thing at an angle useless for anything else, so they are not
|
|
here.
|
|
</p>
|
|
<div id="camera-grid" class="camera-grid"><p class="muted">Loading…</p></div>
|
|
</section>
|
|
</main>
|
|
|
|
<script src="app.js"></script>
|
|
</body>
|
|
</html>
|