From 1bf42250b422e6a73ce42d078a565a098b5ba211 Mon Sep 17 00:00:00 2001
From: Christian Mueller <christian@cynfo.com>
Date: Thu, 23 Apr 2026 21:57:07 +0200
Subject: [PATCH] feat: add WLED device status check (online/offline, LEDs,
 version)

- Query WLED JSON API (/json/info) for device info
- Show online/offline status dot, LED count and firmware version
- Auto-check all devices on page load
- Button to manually check individual or all devices
- Fix hostname placeholder to volksheimstaette.de

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 app.py                 | 11 ++++++++
 templates/devices.html | 64 ++++++++++++++++++++++++++++++++++++++++--
 wled_client.py         | 21 ++++++++++++++
 3 files changed, 93 insertions(+), 3 deletions(-)

diff --git a/app.py b/app.py
index 0be192a..ee5e1a9 100644
--- a/app.py
+++ b/app.py
@@ -243,6 +243,17 @@ async def delete_device(device_id: int):
     return RedirectResponse("/devices", status_code=303)
 
 
+@app.get("/api/devices/{device_id}/status")
+async def device_status(device_id: int):
+    from wled_client import get_wled_info
+    conn = database.get_db()
+    dev = conn.execute("SELECT hostname FROM wled_devices WHERE id=?", (device_id,)).fetchone()
+    conn.close()
+    if not dev:
+        return {"online": False}
+    return get_wled_info(dev["hostname"])
+
+
 # ── Assignments ────────────────────────────────────────────────────────────
 
 @app.get("/assignments", response_class=HTMLResponse)
diff --git a/templates/devices.html b/templates/devices.html
index 52591b7..db6d95b 100644
--- a/templates/devices.html
+++ b/templates/devices.html
@@ -2,7 +2,12 @@
 {% block title %}WLED-Geraete - Busylight{% endblock %}
 
 {% block content %}
-<h4 class="mb-4">WLED-Geraete</h4>
+<div class="d-flex justify-content-between align-items-center mb-4">
+    <h4 class="mb-0">WLED-Geraete</h4>
+    <button class="btn btn-sm btn-outline-secondary" onclick="checkAllDevices()">
+        <i class="bi bi-arrow-clockwise"></i> Alle pruefen
+    </button>
+</div>
 
 <div class="row g-4">
     <div class="col-lg-8">
@@ -12,8 +17,11 @@
                     <table class="table table-hover mb-0">
                         <thead>
                             <tr>
+                                <th>Status</th>
                                 <th>Hostname / IP</th>
                                 <th>Name</th>
+                                <th>LEDs</th>
+                                <th>Version</th>
                                 <th>Segmente</th>
                                 <th>Aktionen</th>
                             </tr>
@@ -21,12 +29,21 @@
                         <tbody>
                             {% for device in devices %}
                             <tr>
+                                <td>
+                                    <span class="status-dot" id="status-{{ device.id }}"
+                                          style="background: #999;" title="Nicht geprueft"></span>
+                                </td>
                                 <td>
                                     <code>{{ device.hostname }}</code>
                                 </td>
                                 <td>{{ device.name }}</td>
+                                <td><span id="leds-{{ device.id }}" class="text-muted">-</span></td>
+                                <td><span id="version-{{ device.id }}" class="text-muted">-</span></td>
                                 <td>{{ device.segment_count }}</td>
                                 <td>
+                                    <button class="btn btn-sm btn-outline-secondary" onclick="checkDevice({{ device.id }})" title="Status pruefen">
+                                        <i class="bi bi-wifi"></i>
+                                    </button>
                                     <button class="btn btn-sm btn-outline-primary" data-bs-toggle="modal"
                                             data-bs-target="#edit-{{ device.id }}">
                                         <i class="bi bi-pencil"></i>
@@ -79,7 +96,7 @@
 
                             {% if not devices %}
                             <tr>
-                                <td colspan="4" class="text-center text-muted py-4">
+                                <td colspan="7" class="text-center text-muted py-4">
                                     Noch keine Geraete vorhanden.
                                 </td>
                             </tr>
@@ -101,7 +118,7 @@
                     <div class="mb-3">
                         <label class="form-label">Hostname / IP</label>
                         <input type="text" name="hostname" class="form-control"
-                               placeholder="doorlight0027.intra.example.de" required>
+                               placeholder="doorlight0027.intra.volksheimstaette.de" required>
                     </div>
                     <div class="mb-3">
                         <label class="form-label">Name (optional)</label>
@@ -122,3 +139,44 @@
     </div>
 </div>
 {% endblock %}
+
+{% block scripts %}
+<script>
+    const deviceIds = [{% for d in devices %}{{ d.id }}{% if not loop.last %},{% endif %}{% endfor %}];
+
+    function checkDevice(id) {
+        const dot = document.getElementById('status-' + id);
+        const leds = document.getElementById('leds-' + id);
+        const ver = document.getElementById('version-' + id);
+        dot.style.background = '#ffc107';
+        dot.title = 'Pruefe...';
+
+        fetch('/api/devices/' + id + '/status')
+            .then(r => r.json())
+            .then(data => {
+                if (data.online) {
+                    dot.style.background = '#28a745';
+                    dot.title = 'Online';
+                    leds.textContent = data.leds || '-';
+                    ver.textContent = data.version || '-';
+                } else {
+                    dot.style.background = '#dc3545';
+                    dot.title = 'Offline';
+                    leds.textContent = '-';
+                    ver.textContent = '-';
+                }
+            })
+            .catch(() => {
+                dot.style.background = '#dc3545';
+                dot.title = 'Fehler';
+            });
+    }
+
+    function checkAllDevices() {
+        deviceIds.forEach(id => checkDevice(id));
+    }
+
+    // Auto-check on page load
+    checkAllDevices();
+</script>
+{% endblock %}
diff --git a/wled_client.py b/wled_client.py
index 154e72b..dd99a84 100644
--- a/wled_client.py
+++ b/wled_client.py
@@ -24,3 +24,24 @@ def call_wled(url):
     except requests.exceptions.RequestException as e:
         logger.warning("WLED nicht erreichbar: %s - %s", url, e)
         return False, str(e)
+
+
+def get_wled_info(hostname):
+    """Query WLED JSON API for device info. Returns dict or None."""
+    try:
+        r = requests.get(f"http://{hostname}/json/info", timeout=TIMEOUT)
+        if r.status_code == 200:
+            data = r.json()
+            return {
+                "online": True,
+                "name": data.get("name", ""),
+                "version": data.get("ver", ""),
+                "brand": data.get("brand", "WLED"),
+                "mac": data.get("mac", ""),
+                "ip": data.get("ip", ""),
+                "leds": data.get("leds", {}).get("count", 0),
+                "power_on": data.get("state", {}).get("on", False) if "state" not in data else None,
+            }
+        return {"online": False}
+    except requests.exceptions.RequestException:
+        return {"online": False}