"Refactor template files for improved readability (feat)"

backend/app/templates/base.html

@@ -584,6 +584,7 @@
     <script src="{{ url_for('static', filename='js/global-refresh-functions.js') }}"></script>
     <script src="{{ url_for('static', filename='js/event-handlers.js') }}"></script>
     <script src="{{ url_for('static', filename='js/csp-violation-handler.js') }}"></script>
+    <script src="{{ url_for('static', filename='js/printer_monitor.js') }}"></script>
     {% if current_user.is_authenticated %}
     <script src="{{ url_for('static', filename='js/notifications.js') }}"></script>
     <script src="{{ url_for('static', filename='js/auto-logout.js') }}"></script>

backend/app/templates/printers.html

@@ -1287,13 +1287,48 @@ class PrinterManager {
         try {
             this.showLoadingState();
             
+            // Nutze das neue PrinterMonitor-System für Live-Status
+            if (window.printerMonitor) {
+                // Registriere Update-Callback für Live-Daten
+                window.printerMonitor.onUpdate((data) => {
+                    if (data.type === 'update') {
+                        // Konvertiere Map zu Array für kompatibilität
+                        allPrinters = Array.from(data.printers.values());
+                        console.log(`${allPrinters.length} Drucker mit Live-Status geladen:`, allPrinters);
+                        this.applyFilters();
+                        this.updateStatistics();
+                        this.populateFilterDropdowns();
+                        this.updateLastUpdateTime();
+                        this.hideLoadingState();
+                    } else if (data.type === 'error') {
+                        console.error('PrinterMonitor Fehler:', data.message);
+                        this.showError('Live-Status nicht verfügbar: ' + data.message);
+                        // Fallback zu normaler API
+                        this.loadPrintersFromAPI();
+                    }
+                });
+                
+                // Force update für sofortige Daten
+                await window.printerMonitor.forceUpdate();
+            } else {
+                // Fallback falls PrinterMonitor nicht verfügbar
+                this.loadPrintersFromAPI();
+            }
+        } catch (error) {
+            console.error('Error in loadPrinters:', error);
+            // Fallback zu normaler API
+            this.loadPrintersFromAPI();
+        }
+    }
+    
+    async loadPrintersFromAPI() {
+        try {
             const response = await fetch('/api/printers');
             const data = await response.json();
             
-            // Korrigierte Überprüfung - API sendet direkt das printers Array
             if (response.ok && data.printers) {
                 allPrinters = data.printers || [];
-                console.log(`${allPrinters.length} Drucker erfolgreich geladen:`, allPrinters);
+                console.log(`${allPrinters.length} Drucker über API geladen:`, allPrinters);
                 this.applyFilters();
                 this.updateStatistics();
                 this.populateFilterDropdowns();
@@ -1301,14 +1336,12 @@ class PrinterManager {
             } else {
                 console.error('Fehler beim Laden der Drucker:', data);
                 this.showError('Fehler beim Laden der Drucker: ' + (data.error || data.message || 'Unbekannter Fehler'));
-                // Auch bei Fehlern leere Liste anzeigen
                 allPrinters = [];
                 this.applyFilters();
             }
         } catch (error) {
-            console.error('Error loading printers:', error);
+            console.error('Error loading printers from API:', error);
             this.showError('Netzwerkfehler beim Laden der Drucker: ' + error.message);
-            // Bei Netzwerkfehlern auch leere Liste anzeigen
             allPrinters = [];
             this.applyFilters();
         } finally {