George Lambert
e89e006542
Some checks are pending
offline / test (push) Waiting to run
NS1 is marchon@70.88.205.138 using ~/.ssh/id_ed25519. Private key bytes stay off git. Spawn, health, and kill go through ssh; remote workers bind loopback only.
148 lines
8 KiB
HTML
148 lines
8 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8"/>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
|
<title>Verae fleet monitor</title>
|
|
<style>
|
|
:root { --ink:#12202c; --muted:#5b6d78; --line:#d5dee4; --bg:#f3efe8; --ok:#0f6e56; --err:#a32020; --warn:#8a5a00; }
|
|
* { box-sizing: border-box; }
|
|
body { margin:0; font:14px/1.45 system-ui,sans-serif; color:var(--ink); background:var(--bg); }
|
|
header { background:var(--ink); color:#f6f3ee; padding:.9rem 1.1rem; }
|
|
header h1 { margin:0; font-size:1.1rem; }
|
|
header p { margin:.35rem 0 0; color:#c5d0d8; font-size:13px; }
|
|
main { padding:1rem; max-width:1280px; margin:0 auto; }
|
|
h2 { font-size:13px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin:1.2rem 0 .4rem; }
|
|
table { width:100%; border-collapse:collapse; background:#fff; }
|
|
th, td { text-align:left; padding:.4rem .5rem; border-bottom:1px solid var(--line); font-size:13px; vertical-align:top; }
|
|
th { font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
|
|
tr.state-operational { background:#e3f6e8; }
|
|
tr.state-degraded { background:#fff3bf; }
|
|
tr.state-down { background:#f9d4d4; }
|
|
.pill { font:700 10px system-ui; letter-spacing:.06em; text-transform:uppercase; padding:.12rem .35rem; border-radius:4px; }
|
|
.good { background:#c8efd4; color:var(--ok); }
|
|
.bad { background:#f3c0c0; color:var(--err); }
|
|
.warn { background:#ffe08a; color:var(--warn); }
|
|
button { margin-right:.25rem; font:650 12px system-ui; border:1px solid var(--line); background:#fff; border-radius:5px; padding:.25rem .45rem; cursor:pointer; }
|
|
code { font:12px ui-monospace,Menlo,monospace; }
|
|
.inst { font:12px ui-monospace,Menlo,monospace; margin:.15rem 0; }
|
|
.rtt { font:12px ui-monospace,Menlo,monospace; white-space:nowrap; }
|
|
form.add { display:flex; flex-wrap:wrap; gap:.4rem; margin:.5rem 0 1rem; align-items:end; }
|
|
form.add label { font-size:11px; color:var(--muted); display:flex; flex-direction:column; gap:.15rem; }
|
|
form.add input, form.add select { padding:.35rem .45rem; border:1px solid var(--line); border-radius:5px; font:13px ui-monospace,Menlo,monospace; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<h1>Verae fleet monitor</h1>
|
|
<p>Spread replicas across machines. Track message-processing RTT (min / avg / p50 / p90) for capacity planning. Paused copies do not count toward the tree-node floor.</p>
|
|
</header>
|
|
<main>
|
|
<p id="meta"></p>
|
|
<h2>Machines</h2>
|
|
<form class="add" id="addMachine">
|
|
<label>id <input name="id" required placeholder="ns1-b"/></label>
|
|
<label>host <input name="host" required placeholder="10.0.0.12"/></label>
|
|
<label>kind
|
|
<select name="kind"><option value="local">local</option><option value="ssh">ssh</option><option value="agent">agent</option></select>
|
|
</label>
|
|
<label>user <input name="user" value="marchon"/></label>
|
|
<label>ssh port <input name="sshPort" type="number" value="22"/></label>
|
|
<label>identity file <input name="identityFile" placeholder="~/.ssh/id_ed25519" value="~/.ssh/id_ed25519"/></label>
|
|
<label>capacity <input name="capacity" type="number" min="1" value="8"/></label>
|
|
<label>roles <input name="roles" value="*" placeholder="tree-node,archive-worm"/></label>
|
|
<button type="submit">Add machine</button>
|
|
</form>
|
|
<table>
|
|
<thead><tr><th>Machine</th><th>SSH / host</th><th>Kind</th><th>Capacity</th><th>Running</th><th>RTT ms min / avg / p50 / p90</th><th></th></tr></thead>
|
|
<tbody id="machines"></tbody>
|
|
</table>
|
|
<h2>Services</h2>
|
|
<table>
|
|
<thead><tr><th>Service</th><th>State</th><th>min/max</th><th>available</th><th>RTT ms min / avg / p50 / p90</th><th>instances</th><th>actions</th></tr></thead>
|
|
<tbody id="rows"></tbody>
|
|
</table>
|
|
</main>
|
|
<script>
|
|
async function j(url, opts) { const r = await fetch(url, opts); return r.json(); }
|
|
async function act(path) { await j(path, { method:'POST' }); await draw(); }
|
|
function rttCell(r) {
|
|
if (!r || !r.count) return '<span class="rtt">—</span>';
|
|
return `<span class="rtt">${r.minMs} / ${r.avgMs} / ${r.p50Ms} / ${r.p90Ms} <span style="color:#5b6d78">n=${r.count}</span></span>`;
|
|
}
|
|
async function draw() {
|
|
const s = await j('/api/status');
|
|
document.getElementById('meta').textContent = 'probe ' + (s.monitor?.t || '—') + ' · NATS ' + (s.nats?.url || '') + ' · machines ' + (s.machines || []).filter(m => m.enabled).length;
|
|
document.getElementById('machines').innerHTML = (s.machines || []).map((m) => {
|
|
const on = m.enabled;
|
|
return `<tr class="${on ? (m.running > 0 ? 'state-operational' : '') : 'state-down'}">
|
|
<td><strong>${m.id}</strong><br><span style="color:#5b6d78">${m.title || ''}</span></td>
|
|
<td><code>${m.kind === 'ssh' ? (m.user || 'marchon') + '@' : ''}${m.host}${m.kind === 'agent' ? ':' + m.agentPort : ''}${m.kind === 'ssh' && m.identityFile ? ' key=' + m.identityFile : ''}</code></td>
|
|
<td>${m.kind} ${on ? '<span class="pill good">on</span>' : '<span class="pill bad">off</span>'}</td>
|
|
<td>${m.running} / ${m.capacity}</td>
|
|
<td>${m.available} avail</td>
|
|
<td>${rttCell(m.rtt)}</td>
|
|
<td>
|
|
<button onclick="act('/api/machines/${m.id}/${on ? 'disable' : 'enable'}')">${on ? 'disable' : 'enable'}</button>
|
|
${m.kind === 'ssh' ? `<button onclick="act('/api/machines/${m.id}/check')">ssh-check</button>` : ''}
|
|
</td>
|
|
</tr>`;
|
|
}).join('');
|
|
document.getElementById('rows').innerHTML = Object.values(s.services).map((sv) => {
|
|
const health = sv.health || 'down';
|
|
const healthLabel = health === 'operational' ? 'operational' : health === 'degraded' ? 'degraded' : 'not operational';
|
|
const healthCls = health === 'operational' ? 'good' : health === 'degraded' ? 'warn' : 'bad';
|
|
const floor = sv.belowFloor ? '<span class="pill bad">below floor</span>' : (sv.keepFloor ? '<span class="pill good">floor ok</span>' : '');
|
|
const inst = (sv.instances || []).map((i) => {
|
|
const st = !i.pid ? 'dead' : i.paused ? 'paused' : i.healthy === false ? 'unhealthy' : 'up';
|
|
const cls = st === 'up' ? 'good' : st === 'paused' ? 'warn' : 'bad';
|
|
return `<div class="inst"><span class="pill ${cls}">${st}</span> ${i.id} @${i.machine || 'local'} pid=${i.pid || '—'} :${i.healthPort}
|
|
${i.rtt && i.rtt.count ? `rtt ${i.rtt.minMs}/${i.rtt.avgMs}/${i.rtt.p50Ms}/${i.rtt.p90Ms}` : ''}
|
|
<button onclick="act('/api/instances/${i.id}/pause')">pause</button>
|
|
<button onclick="act('/api/instances/${i.id}/resume')">resume</button>
|
|
<button onclick="act('/api/instances/${i.id}/restart')">restart</button>
|
|
</div>`;
|
|
}).join('') || '<span style="color:#5b6d78">none</span>';
|
|
return `<tr class="state-${health}">
|
|
<td><strong>${sv.id}</strong><br><span style="color:#5b6d78">${sv.title || ''}</span></td>
|
|
<td><span class="pill ${healthCls}">${healthLabel}</span></td>
|
|
<td>${sv.min} / ${sv.max} ${floor}</td>
|
|
<td>${sv.available} run=${sv.running} paused=${sv.paused}</td>
|
|
<td>${rttCell(sv.rtt)}</td>
|
|
<td>${inst}</td>
|
|
<td>
|
|
<button onclick="act('/api/services/${sv.id}/start')">on</button>
|
|
<button onclick="act('/api/services/${sv.id}/pause')">pause</button>
|
|
<button onclick="act('/api/services/${sv.id}/resume')">resume</button>
|
|
<button onclick="act('/api/services/${sv.id}/stop')">off</button>
|
|
</td>
|
|
</tr>`;
|
|
}).join('');
|
|
}
|
|
document.getElementById('addMachine').addEventListener('submit', async (e) => {
|
|
e.preventDefault();
|
|
const f = e.target;
|
|
const roles = f.roles.value.split(',').map((s) => s.trim()).filter(Boolean);
|
|
await j('/api/machines', {
|
|
method: 'POST',
|
|
headers: { 'content-type': 'application/json' },
|
|
body: JSON.stringify({
|
|
id: f.id.value,
|
|
host: f.host.value,
|
|
kind: f.kind.value,
|
|
user: f.user.value,
|
|
sshPort: Number(f.sshPort.value || 22),
|
|
identityFile: f.identityFile.value,
|
|
capacity: Number(f.capacity.value || 8),
|
|
roles,
|
|
enabled: true,
|
|
}),
|
|
});
|
|
f.reset();
|
|
await draw();
|
|
});
|
|
draw();
|
|
setInterval(draw, 1500);
|
|
</script>
|
|
</body>
|
|
</html>
|