sorted code

static/app.js

@@ -1,3 +1,24 @@
+// Initialization
+const UPDATE_INTERVALS = {
+    deviceStatus: 30000,
+    diagnostics: 60000
+};
+
+// Core update functions
+function updateDeviceStatus() {
+    console.log('Updating device status...');
+    fetch('/api/status')
+        .then(response => response.json())
+        .then(data => {
+            console.log('Received status data:', data);
+            Object.entries(data).forEach(([deviceName, status]) => {
+                console.log(`Updating ${deviceName} status to ${status}`);
+                updateDeviceIndicator(deviceName, status);
+            });
+        })
+        .catch(error => console.error('Error updating status:', error));
+}
+
 function updateDiagnostics() {
     fetch('/api/diagnostics')
         .then(response => response.json())
@@ -12,6 +33,7 @@ function updateDiagnostics() {
         });
 }
 
+// Element creation functions
 function createDiagnosticElement(device, diagnostics) {
     const element = document.createElement('div');
     element.className = `diagnostic-item ${diagnostics.connection_type}-diagnostic`;
@@ -63,20 +85,16 @@ function createInterfaceHTML(interfaces) {
     return html;
 }
 
-function updateDeviceStatus() {
-    fetch('/api/status')
-        .then(response => response.json())
-        .then(data => {
-            Object.entries(data).forEach(([deviceName, status]) => {
-                updateDeviceIndicator(deviceName, status);
-            });
-        });
+// Initialize updates
+function initializeUpdates() {
+    // Set update intervals
+    setInterval(updateDeviceStatus, UPDATE_INTERVALS.deviceStatus);
+    setInterval(updateDiagnostics, UPDATE_INTERVALS.diagnostics);
+
+    // Initial updates
+    updateDeviceStatus();
+    updateDiagnostics();
 }
 
-// Update intervals
-setInterval(updateDeviceStatus, 30000);
-setInterval(updateDiagnostics, 60000);
-
-// Initial updates
-updateDeviceStatus();
-updateDiagnostics();
+// Start the application
+initializeUpdates();