// --- VARIABLES D'ÉTAT --- let isOnline = true; let lastHeartbeat = Date.now(); const TIMEOUT_MS = 5000; // --- ÉLÉMENTS DU DOM PRINCIPAUX --- const statusDot = document.getElementById('system-status'); const statusText = document.getElementById('status-text'); const tempEl = document.getElementById('temp-val'); const humEl = document.getElementById('hum-val'); const apiTempEl = document.getElementById('api-temp'); const apiDescEl = document.getElementById('api-desc'); const apiIconEl = document.getElementById('api-icon'); // --- ÉLÉMENTS DOM BATTERIE (Étudiant 2) --- const batValEl = document.getElementById('bat-val'); const batCircleEl = document.getElementById('bat-circle'); const batAlertBadge = document.getElementById('bat-alert-badge'); const batAlertIcon = document.getElementById('bat-alert-icon'); const batAlertText = document.getElementById('bat-alert'); // --- CONSTANTES SOLAIRE (Étudiant 1) --- const MAX_POWER = 100; // Puissance maximum du panneau en Watts (à adapter si besoin) const gaugeCircle = document.querySelector('.gauge-fill circle'); const halfCircumference = 283 / 2; // ================================================================= // --- GESTION DE LA VRAIE API MÉTÉO WEB (Open-Meteo) --- // ================================================================= function getWeatherDetails(code) { if (code === 0) return { desc: "Dégagé", icon: "bi-brightness-high", color: "text-warning" }; if (code >= 1 && code <= 3) return { desc: "Nuageux", icon: "bi-cloud", color: "text-light" }; if (code >= 45 && code <= 48) return { desc: "Brouillard", icon: "bi-cloud-haze", color: "text-secondary" }; if (code >= 51 && code <= 67) return { desc: "Pluie", icon: "bi-cloud-rain", color: "text-info" }; if (code >= 71 && code <= 77) return { desc: "Neige", icon: "bi-cloud-snow", color: "text-white" }; if (code >= 95) return { desc: "Orage", icon: "bi-cloud-lightning", color: "text-danger" }; return { desc: "Inconnu", icon: "bi-thermometer", color: "text-muted" }; } async function fetchRealWeather() { try { const lat = 48.8566; // Tu peux changer avec la latitude de ta ville const lon = 2.3522; // Tu peux changer avec la longitude de ta ville const url = `https://api.open-meteo.com/v1/forecast?latitude=${lat}&longitude=${lon}¤t=temperature_2m,weather_code`; const response = await fetch(url); const data = await response.json(); const temp = data.current.temperature_2m; const code = data.current.weather_code; const weather = getWeatherDetails(code); apiTempEl.innerText = temp + "°C"; apiDescEl.innerText = weather.desc; apiIconEl.className = "bi " + weather.icon + " " + weather.color + " display-4 me-3"; } catch (error) { console.error("Erreur Météo:", error); } } // ================================================================= // --- MISE À JOUR VISUELLE DES WIDGETS --- // ================================================================= function updateBattery(percent) { batValEl.innerText = percent + "%"; let color = "#34d399"; let shadowColor = "rgba(52, 211, 153, 0.4)"; if (percent <= 20) { color = "#ef4444"; shadowColor = "rgba(239, 68, 68, 0.6)"; batAlertText.innerText = "Tension Critique !"; batAlertIcon.className = "bi bi-exclamation-triangle-fill text-danger"; batAlertBadge.className = "badge bg-dark border border-danger text-secondary w-100 py-2"; } else if (percent <= 50) { color = "#fbbf24"; shadowColor = "rgba(251, 191, 36, 0.5)"; batAlertText.innerText = "Niveau Moyen"; batAlertIcon.className = "bi bi-exclamation-circle text-warning"; batAlertBadge.className = "badge bg-dark border border-warning text-secondary w-100 py-2"; } else { batAlertText.innerText = "Système Normal"; batAlertIcon.className = "bi bi-check-circle text-success"; batAlertBadge.className = "badge bg-dark border border-secondary text-secondary w-100 py-2"; } const angle = percent * 3.6; batCircleEl.style.background = `conic-gradient(${color} ${angle}deg, #0f172a 0deg)`; batCircleEl.style.boxShadow = `0 0 15px ${shadowColor}, inset 0 0 15px ${shadowColor}`; batValEl.style.textShadow = `0 0 10px ${shadowColor}`; } function updateSolar(voltage, current, power, lux) { // On s'assure que ce sont des nombres et on les formate const v = Number(voltage).toFixed(1); const c = Number(current).toFixed(2); const p = Number(power).toFixed(1); const l = Math.floor(Number(lux)); // Le serveur de l'étudiant 4 ne stocke pas l'efficacité, on simule ~15% quand il y a du soleil const efficiency = (p > 0) ? (14 + Math.random() * 2).toFixed(1) : "0.0"; document.getElementById('powerValue').textContent = p; document.getElementById('voltage').innerHTML = v + ' V'; document.getElementById('current').innerHTML = c + ' A'; document.getElementById('lux').innerHTML = l.toLocaleString() + ' Lux'; document.getElementById('efficiency').innerHTML = efficiency + ' %'; // Animation de la jauge SVG const ratio = Math.min(p / MAX_POWER, 1); const offset = halfCircumference - (ratio * halfCircumference); if (gaugeCircle) { gaugeCircle.style.strokeDashoffset = offset; } } // ================================================================= // --- NOUVEAU : CONNEXION AU SERVEUR PYTHON (BASE DE DONNÉES) --- // ================================================================= async function fetchDatabaseData() { if (!isOnline) return; try { // On interroge l'URL magique de l'étudiant 4 const response = await fetch('/api/latest'); if (!response.ok) { throw new Error("Base de données vide ou serveur injoignable"); } const data = await response.json(); // 1. Mise à jour de ton capteur local DHT11 tempEl.innerText = data.temperature_ext !== null ? Number(data.temperature_ext).toFixed(1) : "--"; humEl.innerText = data.humidity_ext !== null ? Math.floor(data.humidity_ext) : "--"; // 2. Mise à jour de la Batterie if (data.battery_level !== null) { updateBattery(Math.floor(data.battery_level)); } // 3. Mise à jour du Solaire updateSolar( data.voltage_pv || 0, data.current_pv || 0, data.power_pv || 0, data.luminosity || 0 ); // Si on arrive ici, c'est qu'on a bien communiqué avec le serveur : on met à jour le Heartbeat lastHeartbeat = Date.now(); } catch (error) { console.error("En attente de données capteurs...", error); } } // --- FONCTION WATCHDOG --- function checkSystemStatus() { if (Date.now() - lastHeartbeat > TIMEOUT_MS) { statusDot.className = "status-dot rounded-circle pulse-offline"; statusText.innerText = "HORS LIGNE"; statusText.style.color = "#ef4444"; } else { statusDot.className = "status-dot rounded-circle pulse-online"; statusText.innerText = "EN LIGNE"; statusText.style.color = "#e2e8f0"; } } // ================================================================= // --- LANCEMENT DES BOUCLES --- // ================================================================= // Météo Web (1 fois au lancement, puis toutes les 15 min) fetchRealWeather(); setInterval(fetchRealWeather, 900000); // Base de données locale (toutes les 3 secondes) setInterval(fetchDatabaseData, 3000); // Watchdog (toutes les secondes) setInterval(checkSystemStatus, 1000); // Bouton de simulation de panne document.getElementById('btn-test').addEventListener('click', function () { isOnline = !isOnline; if (isOnline) { this.innerHTML = ' Simuler Coupure'; this.classList.replace('btn-outline-success', 'btn-outline-danger'); lastHeartbeat = Date.now(); } else { this.innerHTML = ' Rétablir Connexion'; this.classList.replace('btn-outline-danger', 'btn-outline-success'); } });