Add Prometheus-backed home server status
This commit is contained in:
+23
-2
@@ -10,6 +10,7 @@
|
||||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">
|
||||
<link rel="stylesheet" href="style.css?v=home-hardcore-preline-20260610-1">
|
||||
<script src="app.js?v=account-status-label-20260609" defer></script>
|
||||
<script src="server-status.js?v=prometheus-status-1" defer></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="site-shell">
|
||||
@@ -53,9 +54,29 @@
|
||||
<h1 id="server-status-heading" class="section-title">Server Status</h1>
|
||||
|
||||
<div class="status-list" role="list" aria-label="Current server player counts">
|
||||
<div class="status-row status-parent" role="listitem"><span>US Server</span><span></span></div>
|
||||
<div class="status-row status-parent status-server" role="listitem"><span>US Server</span><span>0 Players</span></div>
|
||||
<div class="status-row status-parent status-ship" role="listitem"><span>Alis</span><span></span></div>
|
||||
<div class="status-row status-child" role="listitem"><span>V2</span><span>0 Players</span></div>
|
||||
<div class="status-row status-child" role="listitem"><span>V3</span><span>0 Players</span></div>
|
||||
<div class="status-row status-child" role="listitem"><span>BB</span><span>0 Players</span></div>
|
||||
<div class="status-row status-parent status-ship" role="listitem"><span>Abion</span><span></span></div>
|
||||
<div class="status-row status-child" role="listitem"><span>HC/BB</span><span>0 Players</span></div>
|
||||
<div class="status-row status-parent status-ship" role="listitem"><span>AdHoc-US</span><span></span></div>
|
||||
<div class="status-row status-child" role="listitem"><span>PSP1</span><span>0 Players</span></div>
|
||||
<div class="status-row status-child" role="listitem"><span>PSP2i</span><span>0 Players</span></div>
|
||||
|
||||
<div class="status-row status-parent" role="listitem"><span>Alis</span><span>0 Players</span></div>
|
||||
<div class="status-row status-parent status-server" role="listitem"><span>EU Server</span><span>0 Players</span></div>
|
||||
<div class="status-row status-parent status-ship" role="listitem"><span>Palma</span><span></span></div>
|
||||
<div class="status-row status-child" role="listitem"><span>V2</span><span>0 Players</span></div>
|
||||
<div class="status-row status-child" role="listitem"><span>V3</span><span>0 Players</span></div>
|
||||
<div class="status-row status-child" role="listitem"><span>BB</span><span>0 Players</span></div>
|
||||
<div class="status-row status-parent status-ship" role="listitem"><span>Aiedo</span><span></span></div>
|
||||
<div class="status-row status-child" role="listitem"><span>HC/BB</span><span>0 Players</span></div>
|
||||
<div class="status-row status-parent status-ship" role="listitem"><span>AdHoc-EU</span><span></span></div>
|
||||
<div class="status-row status-child" role="listitem"><span>PSP1</span><span>0 Players</span></div>
|
||||
<div class="status-row status-child" role="listitem"><span>PSP2i</span><span>0 Players</span></div>
|
||||
</div>
|
||||
<div class="status-row status-parent" role="listitem"><span>Alis</span><span>0 Players</span></div>
|
||||
<div class="status-row status-child" role="listitem"><span>V2</span><span>0 Players</span></div>
|
||||
<div class="status-row status-child" role="listitem"><span>V3</span><span>0 Players</span></div>
|
||||
<div class="status-row status-child" role="listitem"><span>BB</span><span>0 Players</span></div>
|
||||
|
||||
@@ -0,0 +1,43 @@
|
||||
(() => {
|
||||
const list = document.querySelector(".status-list");
|
||||
if (!list) return;
|
||||
|
||||
const esc = (value) => String(value ?? "").replace(/[&<>"']/g, (ch) => ({
|
||||
"&": "&",
|
||||
"<": "<",
|
||||
">": ">",
|
||||
"\"": """,
|
||||
"'": "'",
|
||||
}[ch]));
|
||||
|
||||
const players = (value) => {
|
||||
const n = Number(value || 0);
|
||||
return `${n.toLocaleString()} ${n === 1 ? "Player" : "Players"}`;
|
||||
};
|
||||
|
||||
const render = (data) => {
|
||||
const servers = Array.isArray(data?.servers) ? data.servers : [];
|
||||
if (!servers.length) return;
|
||||
|
||||
list.innerHTML = servers.map((server) => `
|
||||
<div class="status-row status-parent status-server" role="listitem">
|
||||
<span>${esc(server.label)}</span><span>${players(server.players)}</span>
|
||||
</div>
|
||||
${(server.ships || []).map((ship) => `
|
||||
<div class="status-row status-parent status-ship" role="listitem">
|
||||
<span>${esc(ship.label)}</span><span></span>
|
||||
</div>
|
||||
${(ship.rows || []).map((row) => `
|
||||
<div class="status-row status-child" role="listitem">
|
||||
<span>${esc(row.label)}</span><span>${players(row.players)}</span>
|
||||
</div>
|
||||
`).join("")}
|
||||
`).join("")}
|
||||
`).join("");
|
||||
};
|
||||
|
||||
fetch("/api/server-status", { cache: "no-store" })
|
||||
.then((res) => res.ok ? res.json() : null)
|
||||
.then((data) => data && render(data))
|
||||
.catch(() => {});
|
||||
})();
|
||||
Reference in New Issue
Block a user