feat: add http, snmp, docker plugins; new widgets and routes for traefik/unifi/ups

- Add HTTP monitor plugin: endpoint checking with status history, latency tracking, time-range views - Add SNMP plugin: OID polling, device management, metric recording - Add Docker plugin: container status, resource usage, widget - Traefik: access log widget, request chart widget, expanded routes - UniFi: clients widget, devices widget, expanded poll routes - UPS: history widget, additional routes - Update plugin index with new entries Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-03-23 17:40:36 -04:00
parent d9886e8680
commit be4654fc72
45 changed files with 2701 additions and 1 deletions
@@ -0,0 +1,84 @@
+{# plugins/snmp/templates/snmp/device.html #}
+{% extends "base.html" %}
+{% block title %}SNMP — {{ device_name }} — Fabled Scryer{% endblock %}
+{% block content %}
+<div style="display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem;flex-wrap:wrap;">
+  <a href="/plugins/snmp/" style="color:var(--text-muted);font-size:0.85rem;">&#8592; SNMP</a>
+  <h1 class="page-title" style="margin:0;">{{ device_name }}</h1>
+  <span style="font-size:0.8rem;color:var(--text-dim);">{{ device.host }}</span>
+  <div style="margin-left:auto;display:flex;gap:0.5rem;">
+    {% for h in [1, 6, 24, 168] %}
+    <a href="?hours={{ h }}"
+       class="btn btn-ghost"
+       style="font-size:0.78rem;padding:0.2rem 0.6rem;{% if hours == h %}background:var(--accent);color:#fff;border-color:var(--accent);{% endif %}">
+      {% if h < 24 %}{{ h }}h{% elif h == 24 %}24h{% else %}7d{% endif %}
+    </a>
+    {% endfor %}
+  </div>
+</div>
+
+{% if oid_labels %}
+<div class="card">
+  <canvas id="snmp-chart" style="width:100%;max-height:320px;"></canvas>
+</div>
+
+<script>
+(function(){
+  const raw = {{ history_json | safe }};
+  const labels = {{ oid_labels | tojson }};
+  const palette = ["#6060c0","#e07040","#40b080","#c040c0","#4080e0","#e0c040","#c08040"];
+
+  // Collect all unique timestamps, sorted
+  const tsSet = new Set();
+  for (const pts of Object.values(raw)) {
+    for (const [ts] of pts) tsSet.add(ts);
+  }
+  const allTs = Array.from(tsSet).sort();
+
+  if (allTs.length < 2) {
+    document.getElementById("snmp-chart").parentElement.innerHTML =
+      '<p style="color:var(--text-muted);padding:1rem;">Not enough data for a chart yet.</p>';
+    return;
+  }
+
+  const datasets = [];
+  labels.forEach((label, i) => {
+    const pts = raw[label] || [];
+    const map = Object.fromEntries(pts.map(([ts, v]) => [ts, v]));
+    datasets.push({
+      label,
+      data: allTs.map(ts => map[ts] ?? null),
+      borderColor: palette[i % palette.length],
+      backgroundColor: "transparent",
+      borderWidth: 1.5,
+      pointRadius: 0,
+      tension: 0.2,
+      spanGaps: true,
+    });
+  });
+
+  const ctx = document.getElementById("snmp-chart").getContext("2d");
+  new Chart(ctx, {
+    type: "line",
+    data: { labels: allTs.map(ts => ts.substring(11, 16)), datasets },
+    options: {
+      responsive: true,
+      interaction: { mode: "index", intersect: false },
+      plugins: {
+        legend: { position: "top", labels: { color: "#aaa", boxWidth: 12 } },
+        tooltip: { backgroundColor: "#1e1e2e", titleColor: "#ccc", bodyColor: "#aaa" },
+      },
+      scales: {
+        x: { ticks: { color: "#888", maxTicksLimit: 12 }, grid: { color: "#2a2a3a" } },
+        y: { ticks: { color: "#888" }, grid: { color: "#2a2a3a" } },
+      },
+    },
+  });
+})();
+</script>
+{% else %}
+<div class="card" style="color:var(--text-muted);text-align:center;padding:2rem;">
+  No OIDs configured for this device.
+</div>
+{% endif %}
+{% endblock %}
@@ -0,0 +1,57 @@
+{# plugins/snmp/templates/snmp/index.html #}
+{% extends "base.html" %}
+{% block title %}SNMP — Fabled Scryer{% endblock %}
+{% block content %}
+<div style="display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem;">
+  <h1 class="page-title" style="margin:0;">SNMP Devices</h1>
+  <span style="font-size:0.8rem;color:var(--text-dim);">{{ devices|length }} device(s) configured</span>
+</div>
+
+{% if not devices %}
+<div class="card" style="color:var(--text-muted);text-align:center;padding:2rem;">
+  No SNMP devices configured. Add devices to <code>plugin.yaml</code>.
+</div>
+{% else %}
+
+{% for device in devices %}
+<div class="card" style="margin-bottom:1rem;">
+  <div style="display:flex;align-items:center;gap:1rem;margin-bottom:1rem;">
+    <h2 style="margin:0;font-size:1rem;font-weight:600;">{{ device.name }}</h2>
+    <span style="font-size:0.78rem;color:var(--text-dim);">{{ device.host }}</span>
+    {% if device.readings %}
+    <span style="font-size:0.75rem;color:var(--green);margin-left:auto;">&#9679; reachable</span>
+    {% else %}
+    <span style="font-size:0.75rem;color:var(--text-dim);margin-left:auto;">&#9675; no data yet</span>
+    {% endif %}
+    <a href="/plugins/snmp/device/{{ device.name }}" class="btn btn-ghost" style="font-size:0.78rem;padding:0.2rem 0.6rem;">History</a>
+  </div>
+
+  {% if device.readings %}
+  <div style="display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:0.75rem;">
+    {% for oid_cfg in device.oids %}
+    {% set label = oid_cfg.label if oid_cfg.label else oid_cfg.oid %}
+    {% set val = device.readings.get(label) %}
+    <div style="background:var(--bg-alt);border-radius:6px;padding:0.6rem 0.9rem;">
+      <div style="font-size:0.72rem;color:var(--text-dim);margin-bottom:0.2rem;font-family:monospace;">{{ label }}</div>
+      {% if val is not none %}
+      <div style="font-size:1.1rem;font-weight:600;font-variant-numeric:tabular-nums;">
+        {% if val >= 1000000 %}{{ "%.2f"|format(val / 1000000) }}<span style="font-size:0.75rem;color:var(--text-muted);">M</span>
+        {% elif val >= 1000 %}{{ "%.1f"|format(val / 1000) }}<span style="font-size:0.75rem;color:var(--text-muted);">K</span>
+        {% else %}{{ "%.4g"|format(val) }}{% endif %}
+      </div>
+      {% else %}
+      <div style="font-size:0.85rem;color:var(--text-dim);">—</div>
+      {% endif %}
+    </div>
+    {% endfor %}
+  </div>
+  {% else %}
+  <p style="font-size:0.85rem;color:var(--text-muted);margin:0;">
+    No readings yet — waiting for next poll cycle.
+  </p>
+  {% endif %}
+</div>
+{% endfor %}
+
+{% endif %}
+{% endblock %}
@@ -0,0 +1,49 @@
+{# plugins/snmp/templates/snmp/widget.html #}
+{% if devices %}
+{% for device in devices %}
+<div class="ping-row" style="align-items:flex-start;flex-direction:column;gap:0.3rem;padding:0.4rem 0;">
+  <div style="display:flex;align-items:center;gap:0.6rem;width:100%;">
+    <span style="font-size:0.82rem;font-weight:500;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">
+      {{ device.name }}
+    </span>
+    {% if device.readings %}
+    <span style="font-size:0.7rem;color:var(--green);">&#9679;</span>
+    {% else %}
+    <span style="font-size:0.7rem;color:var(--text-dim);">&#9675;</span>
+    {% endif %}
+    <a href="/plugins/snmp/device/{{ device.name }}" style="font-size:0.72rem;color:var(--text-muted);">detail →</a>
+  </div>
+  {% if device.readings %}
+  <div style="display:flex;flex-wrap:wrap;gap:0.5rem 1rem;padding-left:0.1rem;">
+    {% for oid_cfg in device.oids[:4] %}
+    {% set label = oid_cfg.label if oid_cfg.label else oid_cfg.oid %}
+    {% set val = device.readings.get(label) %}
+    {% if val is not none %}
+    <span style="font-size:0.78rem;font-variant-numeric:tabular-nums;">
+      <span style="color:var(--text-muted);">{{ label }}</span>
+      <span style="margin-left:0.25rem;">
+        {% if val >= 1000000 %}{{ "%.1f"|format(val / 1000000) }}M
+        {% elif val >= 1000 %}{{ "%.0f"|format(val / 1000) }}K
+        {% else %}{{ "%.4g"|format(val) }}{% endif %}
+      </span>
+    </span>
+    {% endif %}
+    {% endfor %}
+    {% if device.oids|length > 4 %}
+    <span style="font-size:0.72rem;color:var(--text-dim);">+{{ device.oids|length - 4 }} more</span>
+    {% endif %}
+  </div>
+  {% endif %}
+</div>
+{% if not loop.last %}
+<div style="height:1px;background:var(--border-low);margin:0.1rem 0;"></div>
+{% endif %}
+{% endfor %}
+{% if total > devices|length %}
+<div style="color:var(--text-dim);font-size:0.75rem;padding:0.25rem 0;">
+  +{{ total - devices|length }} more — <a href="/plugins/snmp/">view all →</a>
+</div>
+{% endif %}
+{% else %}
+<p class="empty" style="padding:0.5rem 0;font-size:0.85rem;">No SNMP devices configured.</p>
+{% endif %}