Change layout.js

Author: jacquesbach

static/js/layout.js

@@ -76,4 +76,55 @@ async function resetDatabaseLayout() {
     if (res.ok) {
         location.reload(); // Seite neu laden, um Standard-HTML zu zeigen
     }
-}
+}
+
+document.addEventListener("DOMContentLoaded", async () => {
+    // --- PHASE 1: Das Gerüst aufbauen ---
+    initGridstack();
+    await loadLayout(); // Wartet, bis Boxen aus DB oder LocalStorage da sind
+
+    // --- PHASE 2: Startwerte für Datumsfelder setzen ---
+    const t = new Date().toISOString().split('T')[0];
+    const startInput = document.getElementById('start');
+    const endInput = document.getElementById('end');
+
+    if (startInput && endInput) {
+        startInput.value = t;
+        endInput.value = t;
+        startInput.addEventListener('change', updateQuickButtonsActiveState);
+        endInput.addEventListener('change', updateQuickButtonsActiveState);
+    }
+
+    // --- PHASE 3: Daten in die Boxen pumpen ---
+    // Wir prüfen bei jeder Funktion, ob sie existiert, um Fehler zu vermeiden
+    try {
+        if (typeof fetchData === "function") await fetchData();
+        if (typeof updateWeather === "function") updateWeather();
+        if (typeof updateLive === "function") updateLive();
+        if (typeof updatePeaks === "function") updatePeaks();
+        if (typeof updateQuickButtonsActiveState === "function") updateQuickButtonsActiveState();
+        
+        // ML-Funktionen
+        if (typeof loadForecast === "function") loadForecast();
+        if (typeof loadGlobalShap === "function") loadGlobalShap();
+        if (typeof loadFeatureImportance === "function") loadFeatureImportance();
+        
+        // Heatmaps
+        if (typeof initHeatmapYears === "function") initHeatmapYears();
+        if (typeof initHourlyHeatmap === "function") initHourlyHeatmap();
+
+    } catch (err) {
+        console.error("Fehler beim initialen Daten-Load:", err);
+    }
+
+    // --- PHASE 4: Intervalle für Updates starten ---
+    setInterval(() => { if (typeof updateLive === "function") updateLive(); }, 5000);
+    setInterval(() => { if (typeof fetchData === "function") fetchData(); }, 60000);
+    setInterval(() => { if (typeof updatePeaks === "function") updatePeaks(); }, 60000);
+    setInterval(() => { if (typeof checkLoadingStatus === "function") checkLoadingStatus(); }, 500);
+
+    // WICHTIG: Einmal kräftig schütteln, damit Charts ihre Größe im neuen Grid finden
+    setTimeout(() => {
+        window.dispatchEvent(new Event('resize'));
+    }, 200); 
+});