Tutorial: GridStack initialisieren bei Demo-View Injektion

Ohne GridStack-Init werden alle Kacheln uebereinander gestapelt,
da die Positionierung fehlt. Jetzt wird LayoutManager.init()
aufgerufen und ein Compact-Layout erzwungen.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

src/static/dashboard.html

@@ -764,7 +764,7 @@
     <script src="/static/js/api_network.js?v=20260316a"></script>
     <script src="/static/js/network-graph.js?v=20260316a"></script>
     <script src="/static/js/app_network.js?v=20260316a"></script>
-    <script src="/static/js/tutorial.js?v=20260316k"></script>
+    <script src="/static/js/tutorial.js?v=20260316l"></script>
     <script src="/static/js/chat.js?v=20260316f"></script>
     <script>document.addEventListener("DOMContentLoaded",function(){Chat.init();Tutorial.init()});</script>
 

src/static/js/tutorial.js

@@ -92,6 +92,7 @@ const Tutorial = {
         var incidentView = document.getElementById('incident-view');
         var emptyState = document.getElementById('empty-state');
         this._savedState = {
+            gridWasInitialized: typeof LayoutManager !== 'undefined' && LayoutManager._initialized,
             incidentViewDisplay: incidentView ? incidentView.style.display : 'none',
             emptyStateDisplay: emptyState ? emptyState.style.display : '',
             incidentTitle: document.getElementById('incident-title') ? document.getElementById('incident-title').textContent : '',
@@ -136,6 +137,26 @@ const Tutorial = {
         var toolbar = document.getElementById('layout-toolbar');
         if (toolbar) toolbar.style.display = '';
 
+        // GridStack initialisieren falls noch nicht geschehen
+        if (typeof LayoutManager !== 'undefined' && !LayoutManager._initialized) {
+            LayoutManager.init();
+        }
+        // GridStack Resize triggern damit Kacheln korrekt positioniert werden
+        if (typeof LayoutManager !== 'undefined' && LayoutManager._grid) {
+            LayoutManager._grid.engine.nodes.forEach(function(n) {
+                LayoutManager._grid.update(n.el, { x: n.x, y: n.y, w: n.w, h: n.h });
+            });
+            // Sicherheits-Relayout
+            setTimeout(function() {
+                if (LayoutManager._grid) {
+                    LayoutManager._grid.compact();
+                    LayoutManager._grid.engine.nodes.forEach(function(n) {
+                        if (n.el) n.el.style.position = '';
+                    });
+                }
+            }, 100);
+        }
+
         // Lagebild
         var summaryText = document.getElementById('summary-text');
         if (summaryText) summaryText.innerHTML = this._DEMO_SUMMARY;