1 files changed, 49 insertions, 0 deletions
diff --git a/static/modules/stats.js b/static/modules/stats.js
new file mode 100644
index 0000000..b29b4ae
--- /dev/null
+++ b/static/modules/stats.js
@@ -0,0 +1,49 @@
+const gb = (kb) => (kb / 1048576).toFixed(1);
+const rate = (b) => (b >= 1048576 ? `${(b / 1048576).toFixed(1)} MB/s` : `${Math.round(b / 1024)} KB/s`);
+const uptime = (s) => {
+  const d = Math.floor(s / 86400);
+  const h = Math.floor((s % 86400) / 3600);
+  const m = Math.floor((s % 3600) / 60);
+  return d ? `${d}d ${h}h` : `${h}h ${m}m`;
+};
+const gpu = (g) => {
+  if (!g) return "—";
+  if (g.asleep) return `${g.name} (asleep)`;
+  return `${g.name} ${g.util}%${g.temp != null ? ` · ${g.temp}°C` : ""}`;
+};
+
+function row(label, value) {
+  const div = document.createElement("div");
+  div.className = "row";
+  const name = document.createElement("span");
+  name.className = "muted";
+  name.textContent = label;
+  const val = document.createElement("span");
+  val.className = "num";
+  val.textContent = value;
+  div.append(name, val);
+  return div;
+}
+
+export default {
+  title: "System",
+  interval: 1,
+
+  mount(el) {
+    const box = document.createElement("div");
+    box.className = "stats";
+    el.append(box);
+  },
+
+  update(st, el) {
+    const box = el.querySelector(".stats");
+    box.textContent = "";
+    box.append(
+      row("CPU", `${st.cpu}%${st.cpuTemp != null ? ` · ${st.cpuTemp}°C` : ""}`),
+      row("Memory", `${gb(st.memUsed)} / ${gb(st.memTotal)} GiB`),
+      row("GPU", gpu(st.gpu)),
+      row("Network", `↓ ${rate(st.net.down)}  ↑ ${rate(st.net.up)}`),
+      row("Uptime", uptime(st.uptime)),
+    );
+  },
+};