@sailingrotevista/rotevista-dash 7.0.19 → 7.0.23

package/app.js

@@ -216,16 +216,25 @@ function checkDepthAlarm(m) {
 function computeTrueWind() {
     const aws = store.raw["environment.wind.speedApparent"], awa = store.raw["environment.wind.angleApparent"];
     const stw = store.raw["navigation.speedThroughWater"], sog = store.raw["navigation.speedOverGround"] || 0;
-    const hdg = store.raw["navigation.headingTrue"] || 0, cog = store.raw["navigation.courseOverGroundTrue"] || 0;
+    const hdg = store.raw["navigation.headingTrue"] || 0; // Il COG qui non serve più per il calcolo stabile
     if (aws === undefined || awa === undefined) return;
 
-    // Usiamo il tempo esatto di arrivo del pacchetto del vento per la coerenza dei buffer
     const now = store.timestamps["environment.wind.speedApparent"] || Date.now();
 
-    // Verifica se lo STW fisicamente attivo ha trasmesso dati negli ultimi 15 secondi
-    const hasStw = store.timestamps["navigation.speedThroughWater"] && (now - store.timestamps["navigation.speedThroughWater"] < 15000);
-    // Se lo STW non è disponibile, usa automaticamente la velocità del GPS (SOG) come riferimento
-    const speedRef = hasStw && stw !== undefined ? stw : sog;
+    // RILEVAMENTO "LOG BLOCCATO" (Fouled Paddlewheel)
+    const hasFreshStw = store.timestamps["navigation.speedThroughWater"] && (now - store.timestamps["navigation.speedThroughWater"] < 15000);
+    let speedRef = 0;
+    
+    if (hasFreshStw && stw !== undefined) {
+        // Se la barca naviga a GPS (> 1.5 nodi) ma l'elichetta legge quasi zero (< 0.5 nodi), il log è sporco/bloccato.
+        if (sog > 0.77 && stw < 0.25) {
+            speedRef = sog; // Forza il backup su SOG ignorando lo "0" fittizio del log
+        } else {
+            speedRef = stw;
+        }
+    } else {
+        speedRef = sog;
+    }
 
     // ==========================================================================
     // 1. GESTIONE TWS (NATIVO vs FALLBACK)
@@ -234,47 +243,51 @@ function computeTrueWind() {
     let tws_water = 0;
 
     if (hasNativeTws) {
-        // Se la barca invia il TWS nativo, usiamo direttamente quello
         tws_water = store.raw["environment.wind.speedTrue"] ? msToKts(store.raw["environment.wind.speedTrue"]) : 0;
     } else {
-        // Altrimenti eseguiamo il calcolo vettoriale tattico utilizzando la velocità di riferimento (STW o SOG)
         tws_water = Math.sqrt(aws * aws + speedRef * speedRef - 2 * aws * speedRef * Math.cos(awa));
         store.raw["environment.wind.speedTrue"] = tws_water;
     }
     
-    // BUG RISOLTO: Calcoliamo il TWA sempre, indipendentemente dal TWS nativo!
-    if (tws_water > 0.05) {
-        const twa = Math.atan2(aws * Math.sin(awa), aws * Math.cos(awa) - speedRef);
-        store.raw["environment.wind.angleTrueWater"] = twa;
-        
-        // Inserimento atomico e sincronizzato di TWA e AWA nei relativi buffer mobili
-        // per garantire che le medie vettoriali siano perfettamente allineate in fase
+    let twa = 0;
+    // Verifica se riceviamo un TWA nativo valido ed efficiente negli ultimi 5 secondi
+    const hasNativeTwa = store.timestamps["environment.wind.angleTrueWater"] && (Date.now() - store.timestamps["environment.wind.angleTrueWater"] < 5000);
+
+    if (hasNativeTwa && store.raw["environment.wind.angleTrueWater"] !== undefined) {
+        // "Native First": diamo la precedenza assoluta al valore calcolato dalla centralina
+        twa = store.raw["environment.wind.angleTrueWater"];
+    } else {
+        // "Fallback Second": se manca il dato nativo, eseguiamo il calcolo vettoriale a mano
+        if (tws_water > 0.05) {
+            twa = Math.atan2(aws * Math.sin(awa), aws * Math.cos(awa) - speedRef);
+            store.raw["environment.wind.angleTrueWater"] = twa;
+        }
+    }
+
+    // Salviamo e allineiamo i buffer delle medie se abbiamo un angolo valido (nativo o calcolato)
+    if (tws_water > 0.05 || hasNativeTwa) {
         safePush(store.smoothBuf.twa, twa, now);
         safePush(store.longBuf.twa, twa, now);
-        safePush(store.smoothBuf.awa, awa, now);
-        safePush(store.longBuf.awa, awa, now);
+        
+        // Salviamo l'angolo apparente solo se il relativo sensore fisico è effettivamente attivo
+        if (awa !== undefined) {
+            safePush(store.smoothBuf.awa, awa, now);
+            safePush(store.longBuf.awa, awa, now);
+        }
     }
 
     // ==========================================================================
-    // 2. GESTIONE TWD (NATIVO vs FALLBACK)
+    // 2. GESTIONE TWD (NATIVO vs FALLBACK MATEMATICO STABILE)
     // ==========================================================================
     const hasNativeTwd = store.timestamps["environment.wind.directionTrue"] && (Date.now() - store.timestamps["environment.wind.directionTrue"] < 5000);
 
-    if (hasNativeTwd) {
-        // Se il TWD è nativo della centralina, lo lasciamo scorrere passivamente
-    } else {
-        // Altrimenti calcoliamo lo scarroccio e ricaviamo il TWD geografico sul fondo
-        const drift = (cog - hdg + Math.PI * 3) % (2 * Math.PI) - Math.PI;
-        const tw_ground_x = aws * Math.cos(awa) - sog * Math.cos(drift);
-        const tw_ground_y = aws * Math.sin(awa) - sog * Math.sin(drift);
-        const tws_ground = Math.sqrt(tw_ground_x * tw_ground_x + tw_ground_y * tw_ground_y);
-
-        if (tws_ground > 0.05) {
-            let twd = (hdg + Math.atan2(tw_ground_y, tw_ground_x) + 2 * Math.PI) % (2 * Math.PI);
-            store.raw["environment.wind.directionTrue"] = twd;
-            safePush(store.smoothBuf.twd, twd, now);
-            safePush(store.longBuf.twd, twd, now); // Alimenta la bussola meteo strategica!
-        }
+    if (!hasNativeTwd && tws_water > 0.05) {
+        // Calcolo TWD stabile e immune dal rollio: Prua + TWA
+        // Elimina i sobbalzi legati al brandeggio del COG e dello scarroccio fasullo
+        let twd = (hdg + twa + 2 * Math.PI) % (2 * Math.PI);
+        store.raw["environment.wind.directionTrue"] = twd;
+        safePush(store.smoothBuf.twd, twd, now);
+        safePush(store.longBuf.twd, twd, now);
     }
 }
 
@@ -387,6 +400,12 @@ function processIncomingData(path, val, source, timeMs) {
         let speedVal = (val && typeof val === 'object' && val.val !== undefined) ? val.val : val;
         store.raw["environment.wind.speedTrue"] = speedVal;
     }
+
+    // INTERCETTAZIONE TWA NATIVO (Angolo Vento Reale pronto all'uso)
+    if (path === "environment.wind.angleTrueWater") {
+        let angleVal = (val && typeof val === 'object' && val.val !== undefined) ? val.val : val;
+        store.raw["environment.wind.angleTrueWater"] = angleVal;
+    }
     
     // --- GESTIONE PRUA VERA / MAGNETICA CON AUTODIVIAZIONE ---
     if (path === "navigation.headingTrue") {
@@ -665,7 +684,16 @@ function startDisplayLoop() {
         
         // --- LOGICA SOG / VMG ---
         if (store.raw["navigation.speedOverGround"] !== undefined) {
-            const vmgVal = Math.abs(stwKts * Math.cos(store.raw["environment.wind.angleTrueWater"] || 0));
+            // RILEVAMENTO "LOG BLOCCATO" PER IL CALCOLO VMG
+            const hasFreshStw = store.timestamps["navigation.speedThroughWater"] && (now - store.timestamps["navigation.speedThroughWater"] < 15000);
+            let speedRefKts = sogKts; // Fallback predefinito su GPS
+            
+            if (hasFreshStw) {
+                // Se viaggiamo a più di 1.5 nodi (GPS) ma il log segna meno di 0.5 nodi, usa il SOG come backup
+                speedRefKts = (sogKts > 1.5 && stwKts < 0.5) ? sogKts : stwKts;
+            }
+
+            const vmgVal = Math.abs(speedRefKts * Math.cos(store.raw["environment.wind.angleTrueWater"] || 0));
             manageHistory('vmg', vmgVal);
             manageHistory('sog', sogKts);
             
@@ -679,13 +707,22 @@ function startDisplayLoop() {
                 if (labelSogVmg) labelSogVmg.textContent = 'SOG';
                 
                 if (isNavigating) {
-                    const lastSog = store.histories.sog.length > 0 ? store.histories.sog[store.histories.sog.length - 1].val : sogKts;
-                    const lastStw = store.histories.stw.length > 0 ? store.histories.stw[store.histories.stw.length - 1].val : stwKts;
-                    const drift = lastSog - lastStw;
-
-                    if (drift < -0.3) ui.sog.style.setProperty('color', '#ff3b30', 'important'); // Contro
-                    else if (drift > 0.3) ui.sog.style.setProperty('color', '#00C851', 'important'); // Favore
-                    else ui.sog.style.setProperty('color', '#ffbb33', 'important'); // Neutro SOG
+                    const hasFreshStw = store.timestamps["navigation.speedThroughWater"] && (now - store.timestamps["navigation.speedThroughWater"] < 15000);
+                    // Rileviamo se il log è plausibilmente sporco o bloccato (SOG in movimento, STW a zero)
+                    const isFouledLog = (sogKts > 1.5 && stwKts < 0.5);
+
+                    // Se non abbiamo un log affidabile, è impossibile calcolare la corrente. Evitiamo falsi colori tattici.
+                    if (!hasFreshStw || isFouledLog) {
+                        ui.sog.style.removeProperty('color');
+                    } else {
+                        const lastSog = store.histories.sog.length > 0 ? store.histories.sog[store.histories.sog.length - 1].val : sogKts;
+                        const lastStw = store.histories.stw.length > 0 ? store.histories.stw[store.histories.stw.length - 1].val : stwKts;
+                        const drift = lastSog - lastStw;
+
+                        if (drift < -0.3) ui.sog.style.setProperty('color', '#ff3b30', 'important'); // Contro
+                        else if (drift > 0.3) ui.sog.style.setProperty('color', '#00C851', 'important'); // Favore
+                        else ui.sog.style.setProperty('color', '#ffbb33', 'important'); // Neutro SOG
+                    }
                 } else {
                     ui.sog.style.removeProperty('color');
                 }
@@ -902,23 +939,74 @@ async function fetchServerHistory() {
         const data = await response.json();
         
         if (data && typeof data === 'object') {
+            // 1. RILEVAMENTO DEL DELTA DI COERENZA TEMPORALE
+            // Troviamo il timestamp più recente in assoluto presente nei dati storici del server
+            let maxServerTime = 0;
+            for (let key in data) {
+                if (store.histories[key] !== undefined && Array.isArray(data[key]) && data[key].length > 0) {
+                    const lastPoint = data[key][data[key].length - 1];
+                    if (lastPoint && lastPoint.time > maxServerTime) {
+                        maxServerTime = lastPoint.time;
+                    }
+                }
+            }
+
+            // Calcoliamo lo sfasamento in millisecondi rispetto all'orologio del client (MacBook/Tablet)
+            const nowMac = Date.now();
+            const timeDelta = (maxServerTime > 0) ? (nowMac - maxServerTime) : 0;
+
+            if (Math.abs(timeDelta) > 500) {
+                console.log(`⏱️ [Clock Sync] Rilevato scostamento di ${(timeDelta/1000).toFixed(1)}s rispetto a einstein. Calibrazione attiva.`);
+            }
+
+            // 2. TRASLAZIONE DEI DATI STORICI
+            // Spostiamo nel tempo tutti i punti passati per incollarli millimetricamente al "now" del client
             for (let key in data) {
                 if (store.histories[key] !== undefined) {
-                    store.histories[key] = data[key];
+                    if (Array.isArray(data[key])) {
+                        store.histories[key] = data[key].map(p => ({
+                            val: p.val,
+                            time: p.time + timeDelta, // Sposta il punto nel tempo per allinearlo al Mac
+                            min: p.min !== undefined ? p.min : undefined,
+                            max: p.max !== undefined ? p.max : undefined
+                        }));
+                    } else {
+                        store.histories[key] = data[key];
+                    }
                 }
             }
-            // Sincronizza i dati specifici del radar storici, previsionali e i buffer minuto per minuto
-            if (data.windRadarSlots) store.windRadarSlots = data.windRadarSlots;
-            if (data.futureForecast) store.futureForecast = data.futureForecast;
-            if (data.twd) store.twdMinuteBuffer = data.twd;
-            if (data.tws) store.twsMinuteBuffer = data.tws;
+
+            // Sincronizza i dati specifici del radar storici, previsionali e i buffer minuto per minuto (applicando il Delta)
+            if (data.windRadarSlots) {
+                store.windRadarSlots = data.windRadarSlots.map(s => ({
+                    ...s,
+                    timestamp: s.timestamp + timeDelta
+                }));
+            }
+            if (data.futureForecast) {
+                store.futureForecast = {
+                    ...data.futureForecast,
+                    timestamp: data.futureForecast.timestamp + timeDelta
+                };
+            }
+            if (data.twd) {
+                store.twdMinuteBuffer = data.twd.map(p => ({
+                    ...p,
+                    time: p.time + timeDelta
+                }));
+            }
+            if (data.tws) {
+                store.twsMinuteBuffer = data.tws.map(p => ({
+                    ...p,
+                    time: p.time + timeDelta
+                }));
+            }
             
             // --- SILLABAZIONE STRATEGICA DELLA BUSSOLA METEO (TWD) ---
-            // Se il server ci invia lo storico del TWD, lo inseriamo calcolando i seni e coseni per i vettori
             if (data.twd && data.twd.length > 0) {
                 store.longBuf.twd = data.twd.map(p => ({
                     val: p.val,
-                    time: p.time,
+                    time: p.time + timeDelta, // Allinea il tempo strategico del radar
                     sin: Math.sin(p.val),
                     cos: Math.cos(p.val)
                 }));
@@ -928,7 +1016,7 @@ async function fetchServerHistory() {
         }
     } catch (err) {
         console.warn("⚠️ Impossibile caricare lo storico dal server. Utilizzo dati vuoti/simulati.");
-        throw err; // Rilancia l'errore per far attivare il fallback nella funzione init()
+        throw err;
     }
 }
 
@@ -1176,6 +1264,7 @@ function connect() {
                     { path: "environment.wind.speedApparent", minPeriod: 333 },     // AWS a 3 Hz
                     { path: "environment.wind.angleApparent", minPeriod: 333 },     // AWA a 3 Hz
                     { path: "environment.wind.speedTrue", minPeriod: 333 },         // TWS (Nativo) a 3 Hz
+                    { path: "environment.wind.angleTrueWater", minPeriod: 333 },    // TWA (Nativo) a 3 Hz (AGGIUNTO)
                     { path: "environment.wind.directionTrue", minPeriod: 333 }      // TWD (Nativo) a 3 Hz
                 ]
             };
@@ -1264,14 +1353,11 @@ async function init() {
             if (activeInstrument === 'gauge') {
                 twdPressTimer = setTimeout(() => {
                     activeInstrument = 'radar';
-                    
-                    // Spegne l'INTERO contenitore multilivello della bussola analogica
-                    document.querySelector('.wind-gauge-container').style.display = 'none';
+                    document.getElementById('wind-gauge').style.display = 'none';
                     document.getElementById('wind-radar').style.display = 'block';
-                    
                     renderRadar(); // Disegna immediatamente il radar all'attivazione
                     twdPressTimer = null;
-                    longPressTriggered = true;
+                    longPressTriggered = true; // Segnala che la transizione al radar è avvenuta con successo
                 }, 1000);
             }
         });
@@ -1283,13 +1369,13 @@ async function init() {
                 }
             } else if (activeInstrument === 'radar') {
                 if (longPressTriggered) {
+                    // Se l'evento di rilascio appartiene al tocco prolungato che ha appena attivato il radar, lo ignoriamo
                     longPressTriggered = false;
                 } else {
+                    // Altrimenti è un tocco rapido indipendente: torna alla bussola analogica
                     activeInstrument = 'gauge';
                     document.getElementById('wind-radar').style.display = 'none';
-                    
-                    // Riaccende l'intero contenitore multilivello della bussola analogica
-                    document.querySelector('.wind-gauge-container').style.display = 'flex';
+                    document.getElementById('wind-gauge').style.display = 'block';
                 }
             }
         });
@@ -1301,7 +1387,7 @@ async function init() {
             longPressTriggered = false;
         });
     }
-    
+
     // 2. COMANDO TATTICO: Click in qualsiasi punto del radar per tornare all'analogico
     const windRadarSvg = document.getElementById('wind-radar');
     if (windRadarSvg) {
@@ -1309,9 +1395,7 @@ async function init() {
             if (activeInstrument === 'radar') {
                 activeInstrument = 'gauge';
                 windRadarSvg.style.display = 'none';
-                
-                // Riaccende l'intero contenitore multilivello della bussola analogica
-                document.querySelector('.wind-gauge-container').style.display = 'flex';
+                document.getElementById('wind-gauge').style.display = 'block';
             }
         });
     }
@@ -1336,11 +1420,12 @@ async function init() {
     startDisplayLoop();
     connect(); // Si collegherà in tempo reale al WebSocket reale della barca
     
-    // 5. POLL LENTO (15 secondi): aggiorna i dati radar in background e, se attivo, li ridisegna
+    // 5. POLL LENTO (15 secondi): aggiorna i dati radar in background SOLO se lo strumento attivo è il radar,
+    // evitando di sovraccaricare la rete ed eliminando il salto visivo di reset dei grafici a 1Hz
     setInterval(async () => {
         try {
-            await fetchServerHistory();
             if (activeInstrument === 'radar') {
+                await fetchServerHistory();
                 renderRadar();
             }
         } catch (err) {

package/charts.js

@@ -19,7 +19,9 @@ function calculateScale(type, data, mode) {
 
     if (!store.herculesScales) store.herculesScales = {};
     if (!store.herculesScales[type]) {
-        store.herculesScales[type] = { min: 0, max: s ? s.stdMax : 10 };
+        // Inizializzazione a NULL dello stato di partenza per consentire un allineamento istantaneo
+        // e perfettamente centrato al primo doppio clic
+        store.herculesScales[type] = { min: null, max: null };
     }
     let currentScale = store.herculesScales[type];
 
@@ -65,9 +67,10 @@ function calculateScale(type, data, mode) {
                 targetMax = targetMin + 4;
             }
 
-            if (currentVal < currentScale.min || currentVal > currentScale.max) {
-                currentScale.min = Math.min(currentScale.min, targetMin);
-                currentScale.max = Math.max(currentScale.max, targetMax);
+            // Gestione dell'allineamento iniziale o dello scostamento dei limiti della scala
+            if (currentScale.min === null || currentVal < currentScale.min || currentVal > currentScale.max) {
+                currentScale.min = currentScale.min === null ? targetMin : Math.min(currentScale.min, targetMin);
+                currentScale.max = currentScale.max === null ? targetMax : Math.max(currentScale.max, targetMax);
             } else {
                 const allStableInTarget = recentVals.every(val => val >= targetMin && val <= targetMax);
                 if (allStableInTarget) {
@@ -90,8 +93,25 @@ function calculateScale(type, data, mode) {
         const oneThirdCount = Math.max(1, Math.floor(data.length / 3));
         const recentThirdData = data.slice(-oneThirdCount);
 
-        const localMin = Math.min(...recentThirdData);
-        const localMax = Math.max(...recentThirdData);
+        let localMin = Math.min(...recentThirdData);
+        let localMax = Math.max(...recentThirdData);
+
+        // SMART MOTORING DETECTION (Specifica per i grafici di velocità: STW, SOG, VMG)
+        const isSpeedType = (type === 'stw' || type === 'sog' || type === 'vmg');
+        if (isSpeedType && data.length > oneThirdCount) {
+            const olderData = data.slice(0, data.length - oneThirdCount);
+            const olderMin = Math.min(...olderData);
+            const olderMax = Math.max(...olderData);
+            const olderRange = olderMax - olderMin; // Variazione nello storico passato
+
+            // Se lo storico passato non era piatto (range > 0.2 nodi) oppure eravamo fermi/all'ancora (< 1.5 nodi),
+            // significa che il passato è rilevante per il trend. Includiamo il passato nel calcolo della scala Y.
+            // Se invece era piatto (motore), lo ignoriamo per zoomare subito sulla vela attuale.
+            if (olderRange > 0.2 || olderMin < 0.77) {
+                localMin = Math.min(localMin, olderMin);
+                localMax = Math.max(localMax, olderMax);
+            }
+        }
 
         let targetMin = Math.max(0, Math.floor(localMin / roundStep) * roundStep);
         let targetMax = Math.ceil(localMax / roundStep) * roundStep;
@@ -100,9 +120,10 @@ function calculateScale(type, data, mode) {
             targetMax = targetMin + roundStep;
         }
 
-        if (currentVal < currentScale.min || currentVal > currentScale.max) {
-            currentScale.min = Math.min(currentScale.min, targetMin);
-            currentScale.max = Math.max(currentScale.max, targetMax);
+        // Gestione dell'allineamento iniziale o dello scostamento dei limiti della scala
+        if (currentScale.min === null || currentVal < currentScale.min || currentVal > currentScale.max) {
+            currentScale.min = currentScale.min === null ? targetMin : Math.min(currentScale.min, targetMin);
+            currentScale.max = currentScale.max === null ? targetMax : Math.max(currentScale.max, targetMax);
         } else {
             const allStableInTarget = recentThirdData.every(val => val >= targetMin && val <= targetMax);
             if (allStableInTarget) {
@@ -256,7 +277,12 @@ function drawGraph(d, id, min, max, isTws, isHercules) {
         gradientStops += `<stop offset="${offset1}%" stop-color="${props.color}" stop-opacity="${props.opacity}" />`;
         gradientStops += `<stop offset="${offset2}%" stop-color="${props.color}" stop-opacity="${props.opacity}" />`;
 
-        if (isGap) {
+        // CALCOLO ELASTICO DELL'INTERRUZIONE: Tollera buchi storici fino a 90 secondi (es. i 30s di einstein)
+        // per permettere di disegnare linee solide e continue anche se mostrate in una timeline corta e veloce
+        const maxAllowedGap = Math.max(expectedInterval * 2.5, 90000);
+        const isHistoryGap = deltaTime > maxAllowedGap;
+
+        if (isHistoryGap) {
             if (started) {
                 areaPath += `L ${x1} ${h} `;
                 started = false;

package/index.html

@@ -67,108 +67,101 @@
                     <!-- STATO CONNESSIONE -->
                     <div id="status" class="offline">OFFLINE</div>
                     
-                    <!-- BUSSOLA 1: ANALOGICA STANDARD (Struttura Multilivello a Risparmio Energetico) -->
-                    <div class="wind-gauge-container">
+                    <!-- BUSSOLA 1: ANALOGICA STANDARD (Visibile all'avvio) -->
+                    <svg id="wind-gauge" viewBox="35 38 330 395" preserveAspectRatio="xMidYMid meet">
+                        <defs>
+                            <clipPath id="boat-clip"><circle cx="200" cy="200" r="50" /></clipPath>
+                            <linearGradient id="axiom-grad" x1="0%" y1="0%" x2="0%" y2="100%">
+                                <stop offset="0%" style="stop-color:#ffffff;stop-opacity:1" />
+                                <stop offset="100%" style="stop-color:#888888;stop-opacity:1" />
+                            </linearGradient>
+                            <linearGradient id="leeway-grad" x1="0%" y1="0%" x2="100%" y2="0%">
+                                <stop offset="0%" style="stop-color:#ff0000;stop-opacity:1" />
+                                <stop offset="25%" style="stop-color:#ff8800;stop-opacity:1" />
+                                <stop offset="50%" style="stop-color:#00ff00;stop-opacity:1" />
+                                <stop offset="75%" style="stop-color:#ff8800;stop-opacity:1" />
+                                <stop offset="100%" style="stop-color:#ff0000;stop-opacity:1" />
+                            </linearGradient>
+                            <linearGradient id="leeway-night-grad" x1="0%" y1="0%" x2="100%" y2="0%">
+                                <stop offset="0%" style="stop-color:#ff0000;stop-opacity:1" />
+                                <stop offset="50%" style="stop-color:#330000;stop-opacity:1" />
+                                <stop offset="100%" style="stop-color:#ff0000;stop-opacity:1" />
+                            </linearGradient>
+                            <clipPath id="leeway-clip">
+                                <rect id="leeway-mask-rect" x="125" y="0" width="0" height="12" rx="2" />
+                            </clipPath>
+                            <filter id="center-glow" x="-20%" y="-20%" width="140%" height="140%">
+                                <feDropShadow dx="0" dy="0" stdDeviation="8" flood-color="#aaaaaa" flood-opacity="0.5" />
+                            </filter>
+                        </defs>
                         
-                        <!-- LIVELLO 1: SFONDO COMPLETAMENTE STATICO (CPU a riposo 0% per i ricalcoli di layout) -->
-                        <svg id="wind-gauge" viewBox="35 38 330 395" preserveAspectRatio="xMidYMid meet">
-                            <defs>
-                                <clipPath id="boat-clip"><circle cx="200" cy="200" r="50" /></clipPath>
-                                <linearGradient id="axiom-grad" x1="0%" y1="0%" x2="0%" y2="100%">
-                                    <stop offset="0%" style="stop-color:#ffffff;stop-opacity:1" />
-                                    <stop offset="100%" style="stop-color:#888888;stop-opacity:1" />
-                                </linearGradient>
-                                <linearGradient id="leeway-grad" x1="0%" y1="0%" x2="100%" y2="0%">
-                                    <stop offset="0%" style="stop-color:#ff0000;stop-opacity:1" />
-                                    <stop offset="25%" style="stop-color:#ff8800;stop-opacity:1" />
-                                    <stop offset="50%" style="stop-color:#00ff00;stop-opacity:1" />
-                                    <stop offset="75%" style="stop-color:#ff8800;stop-opacity:1" />
-                                    <stop offset="100%" style="stop-color:#ff0000;stop-opacity:1" />
-                                </linearGradient>
-                                <linearGradient id="leeway-night-grad" x1="0%" y1="0%" x2="100%" y2="0%">
-                                    <stop offset="0%" style="stop-color:#ff0000;stop-opacity:1" />
-                                    <stop offset="50%" style="stop-color:#330000;stop-opacity:1" />
-                                    <stop offset="100%" style="stop-color:#ff0000;stop-opacity:1" />
-                                </linearGradient>
-                                <clipPath id="leeway-clip">
-                                    <rect id="leeway-mask-rect" x="125" y="0" width="0" height="12" rx="2" />
-                                </clipPath>
-                                <filter id="center-glow" x="-20%" y="-20%" width="140%" height="140%">
-                                    <feDropShadow dx="0" dy="0" stdDeviation="8" flood-color="#aaaaaa" flood-opacity="0.5" />
-                                </filter>
-                            </defs>
-                            
-                            <circle cx="200" cy="200" r="160" fill="#050505" />
-                            <circle cx="200" cy="200" r="125" fill="#121212" />
-                            
-                            <path d="M 82.0 101.0 A 154 154 0 0 1 142.3 57.2" fill="none" stroke="#ff0000" stroke-width="12" />
-                            <path d="M 257.7 57.2 A 154 154 0 0 1 318.0 101.0" fill="none" stroke="#00ff00" stroke-width="12" />
-                            <path d="M 265.1 339.6 A 154 154 0 0 1 134.9 339.6" fill="none" stroke="#ff8800" stroke-width="12" />
-                            
-                            <g id="ticks"></g>
-                            
-                            <g id="tick-labels" fill="#bbb" text-anchor="middle" dominant-baseline="middle" font-family="Arial" font-weight="bold">
-                                <text font-size="16" transform="translate(200, 74)">0</text>
-                                <text font-size="16" transform="translate(326, 200) rotate(90)">90</text>
-                                <text font-size="16" transform="translate(74, 200) rotate(-90)">90</text>
-                                <text font-size="16" transform="translate(200, 326) rotate(180)">180</text>
-                                <text font-size="11" transform="translate(262.5, 91.7) rotate(30)">30</text>
-                                <text font-size="11" transform="translate(308.3, 137.5) rotate(60)">60</text>
-                                <text font-size="11" transform="translate(308.3, 262.5) rotate(120)">120</text>
-                                <text font-size="11" transform="translate(262.5, 308.3) rotate(150)">150</text>
-                                <text font-size="11" transform="translate(137.5, 91.7) rotate(-30)">30</text>
-                                <text font-size="11" transform="translate(91.7, 137.5) rotate(-60)">60</text>
-                                <text font-size="11" transform="translate(91.7, 262.5) rotate(-120)">120</text>
-                                <text font-size="11" transform="translate(137.5, 308.3) rotate(-150)">150</text>
-                            </g>
-                            
-                            <circle id="fullscreen-hotspot" cx="200" cy="200" r="55" fill="#181818" stroke="#333" stroke-width="1" filter="url(#center-glow)" cursor="pointer" />
-                            
-                            <path id="boat-icon" d="M200,150 Q165,185 170,250 Q165,190 200,173 Q235,190 230,250 Q235,185 200,150 Z"
-                                  fill="url(#axiom-grad)" transform="translate(0, 5)" clip-path="url(#boat-clip)" style="pointer-events: none;" />
-                            
-                            <g id="aws-display-group" transform="translate(200, 265)">
-                                <text x="0" y="0" fill="#777" font-size="10" font-weight="bold" text-anchor="middle" text-transform="uppercase">Apparent Wind kts</text>
-                                <text id="aws-val-svg" x="0" y="42" fill="#fff" font-size="52" font-weight="bold" text-anchor="middle">0.0</text>
-                            </g>
-                            
-                            <g transform="translate(75, 395)">
-                                <text x="125" y="-12" id="leeway-val" fill="#aaa" font-size="11" text-anchor="middle" font-weight="bold">LEEWAY: 0.0&deg;</text>
-                                <rect x="0" y="0" width="250" height="12" fill="#222" rx="3" />
-                                <rect x="0" y="0" width="250" height="12" fill="url(#leeway-grad)" clip-path="url(#leeway-clip)" rx="3" />
-                                <g stroke="#555" stroke-width="1">
-                                    <line x1="0" y1="-2" x2="0" y2="14" /><line x1="62.5" y1="2" x2="62.5" y2="10" />
-                                    <line x1="125" y1="-2" x2="125" y2="14" /><line x1="187.5" y1="2" x2="187.5" y2="10" />
-                                    <line x1="250" y1="-2" x2="250" y2="14" />
-                                </g>
-                                <g fill="#555" font-size="8" text-anchor="middle" font-weight="bold">
-                                    <text x="0" y="24">-20&deg;</text><text x="62.5" y="24">-10</text>
-                                    <text x="125" y="24">0&deg;</text><text x="187.5" y="24">10</text>
-                                    <text x="250" y="24">20&deg;</text>
-                                </g>
-                            </g>
-                        </svg>
+                        <circle cx="200" cy="200" r="160" fill="#050505" />
+                        <circle cx="200" cy="200" r="125" fill="#121212" />
+                        
+                        <path d="M 82.0 101.0 A 154 154 0 0 1 142.3 57.2" fill="none" stroke="#ff0000" stroke-width="12" />
+                        <path d="M 257.7 57.2 A 154 154 0 0 1 318.0 101.0" fill="none" stroke="#00ff00" stroke-width="12" />
+                        <path d="M 265.1 339.6 A 154 154 0 0 1 134.9 339.6" fill="none" stroke="#ff8800" stroke-width="12" />
+                        
+                        <g id="ticks"></g>
+                        
+                        <g id="tick-labels" fill="#bbb" text-anchor="middle" dominant-baseline="middle" font-family="Arial" font-weight="bold">
+                            <text font-size="16" transform="translate(200, 74)">0</text>
+                            <text font-size="16" transform="translate(326, 200) rotate(90)">90</text>
+                            <text font-size="16" transform="translate(74, 200) rotate(-90)">90</text>
+                            <text font-size="16" transform="translate(200, 326) rotate(180)">180</text>
+                            <text font-size="11" transform="translate(262.5, 91.7) rotate(30)">30</text>
+                            <text font-size="11" transform="translate(308.3, 137.5) rotate(60)">60</text>
+                            <text font-size="11" transform="translate(308.3, 262.5) rotate(120)">120</text>
+                            <text font-size="11" transform="translate(262.5, 308.3) rotate(150)">150</text>
+                            <text font-size="11" transform="translate(137.5, 91.7) rotate(-30)">30</text>
+                            <text font-size="11" transform="translate(91.7, 137.5) rotate(-60)">60</text>
+                            <text font-size="11" transform="translate(91.7, 262.5) rotate(-120)">120</text>
+                            <text font-size="11" transform="translate(137.5, 308.3) rotate(-150)">150</text>
+                        </g>
+                        
+                        <g id="track-pointer" transform="rotate(0, 200, 200)">
+                            <path d="M200,42 L194,58 L206,58 Z" fill="#007aff" stroke="#fff" stroke-width="0.5" />
+                        </g>
+                        
+                        <circle id="fullscreen-hotspot" cx="200" cy="200" r="55" fill="#181818" stroke="#333" stroke-width="1" filter="url(#center-glow)" cursor="pointer" />
+                        
+                        <path id="boat-icon" d="M200,150 Q165,185 170,250 Q165,190 200,173 Q235,190 230,250 Q235,185 200,150 Z"
+                              fill="url(#axiom-grad)" transform="translate(0, 5)" clip-path="url(#boat-clip)" style="pointer-events: none;" />
+                        
+                        <g id="aws-display-group" transform="translate(200, 265)">
+                            <text x="0" y="0" fill="#777" font-size="10" font-weight="bold" text-anchor="middle" text-transform="uppercase">Apparent Wind kts</text>
+                            <text id="aws-val-svg" x="0" y="42" fill="#fff" font-size="52" font-weight="bold" text-anchor="middle">0.0</text>
+                        </g>
 
-                        <!-- LIVELLO 2: OVERLAY LANGETTE (Leggerissimo, promosso alla GPU hardware a 60fps con micro-layouts/sec) -->
-                        <svg id="wind-gauge-pointers" viewBox="35 38 330 395" preserveAspectRatio="xMidYMid meet">
-                            <g id="track-pointer" transform="rotate(0, 200, 200)">
-                                <path d="M200,42 L194,58 L206,58 Z" fill="#007aff" stroke="#fff" stroke-width="0.5" />
-                            </g>
+                        <g id="awa-pointer" transform="rotate(0, 200, 200)" opacity="0.9">
+                            <path d="M 200,70 L 213,95 L 200,145 L 187,95 Z" fill="#ff8c00" stroke="#000" stroke-width="1" />
+                            <text x="200" y="90" fill="#000" font-size="10" font-weight="900" text-anchor="middle" font-family="Arial Black">A</text>
+                        </g>
 
-                            <g id="awa-pointer" transform="rotate(0, 200, 200)" opacity="0.9">
-                                <path d="M 200,70 L 213,95 L 200,145 L 187,95 Z" fill="#ff8c00" stroke="#000" stroke-width="1" />
-                                <text x="200" y="90" fill="#000" font-size="10" font-weight="900" text-anchor="middle" font-family="Arial Black">A</text>
+                        <g id="twa-pointer" transform="rotate(0, 200, 200)" opacity="0.9">
+                            <path d="M 200,92 A 8,8 0 0 1 208,100 C 208,108 200,128 200,128 C 200,128 192,108 192,100 A 8,8 0 0 1 200,92 Z"
+                                  fill="#ffff00" stroke="#000" stroke-width="0.8" />
+                            <text x="200" y="106" fill="#000" font-size="9" font-weight="900" text-anchor="middle" font-family="Arial Black">T</text>
+                            <circle id="trend-gauge-cw"  cx="215" cy="110" r="4" fill="#bbb" />
+                            <circle id="trend-gauge-ccw" cx="185" cy="110" r="4" fill="#bbb" />
+                        </g>
+                        
+                        <g transform="translate(75, 395)">
+                            <text x="125" y="-12" id="leeway-val" fill="#aaa" font-size="11" text-anchor="middle" font-weight="bold">LEEWAY: 0.0&deg;</text>
+                            <rect x="0" y="0" width="250" height="12" fill="#222" rx="3" />
+                            <rect x="0" y="0" width="250" height="12" fill="url(#leeway-grad)" clip-path="url(#leeway-clip)" rx="3" />
+                            <g stroke="#555" stroke-width="1">
+                                <line x1="0" y1="-2" x2="0" y2="14" /><line x1="62.5" y1="2" x2="62.5" y2="10" />
+                                <line x1="125" y1="-2" x2="125" y2="14" /><line x1="187.5" y1="2" x2="187.5" y2="10" />
+                                <line x1="250" y1="-2" x2="250" y2="14" />
                             </g>
-
-                            <g id="twa-pointer" transform="rotate(0, 200, 200)" opacity="0.9">
-                                <path d="M 200,92 A 8,8 0 0 1 208,100 C 208,108 200,128 200,128 C 200,128 192,108 192,100 A 8,8 0 0 1 200,92 Z"
-                                      fill="#ffff00" stroke="#000" stroke-width="0.8" />
-                                <text x="200" y="106" fill="#000" font-size="9" font-weight="900" text-anchor="middle" font-family="Arial Black">T</text>
-                                <circle id="trend-gauge-cw" cx="215" cy="110" r="4" fill="#bbb" />
-                                <circle id="trend-gauge-ccw" cx="185" cy="110" r="4" fill="#bbb" />
+                            <g fill="#555" font-size="8" text-anchor="middle" font-weight="bold">
+                                <text x="0" y="24">-20&deg;</text><text x="62.5" y="24">-10</text>
+                                <text x="125" y="24">0&deg;</text><text x="187.5" y="24">10</text>
+                                <text x="250" y="24">20&deg;</text>
                             </g>
-                        </svg>
-                    </div>
+                        </g>
+                    </svg>
 
                     <!-- BUSSOLA 2: RADAR HISTORICAL (Nascosto all'avvio) -->
                     <svg id="wind-radar" viewBox="35 38 330 395" preserveAspectRatio="xMidYMid meet" style="display: none;">

package/index.js

@@ -277,32 +277,40 @@ module.exports = function (app) {
         const stw = raw["navigation.speedThroughWater"];
         const sog = raw["navigation.speedOverGround"] || 0;
         const hdg = raw["navigation.headingTrue"];
-        const cog = raw["navigation.courseOverGroundTrue"] || 0;
 
         if (aws !== undefined && awa !== undefined) {
             const awsKts = aws * 1.94384;
             
-            // Verifica se lo STW fisicamente attivo ha trasmesso dati negli ultimi 15 secondi
+            // RILEVAMENTO "LOG BLOCCATO" SUL SERVER
             const hasStw = lastPathProcessTimes["navigation.speedThroughWater"] && (now - lastPathProcessTimes["navigation.speedThroughWater"] < 15000);
-            // Se lo STW non è disponibile, usa automaticamente la velocità del GPS (SOG) come riferimento
-            const speedKtsRef = hasStw && stw !== undefined ? (stw * 1.94384) : (sog * 1.94384);
+            let speedRef = 0;
+            
+            if (hasStw && stw !== undefined) {
+                if (sog > 0.77 && stw < 0.25) {
+                    speedRef = sog; // Log sporco: forza il SOG
+                } else {
+                    speedRef = stw;
+                }
+            } else {
+                speedRef = sog;
+            }
+            
+            const speedKtsRef = speedRef * 1.94384;
 
             const tw_water_x = awsKts * Math.cos(awa) - speedKtsRef;
             const tw_water_y = awsKts * Math.sin(awa);
 
-            // Calcoliamo il TWS di fallback solo se non abbiamo visto dati nativi negli ultimi 5 secondi
+            // Calcolo TWS
             if (now - lastNativeTwsTime > 5000) {
                 const tws = Math.sqrt(tw_water_x * tw_water_x + tw_water_y * tw_water_y);
                 manageHistory('tws', tws);
             }
 
             const twa = Math.atan2(tw_water_y, tw_water_x);
-            
-            // La VMG viene calcolata usando la velocità di riferimento (STW reale o SOG di fallback)
             const vmg = Math.abs(speedKtsRef * Math.cos(twa));
             manageHistory('vmg', vmg);
 
-            // Calcoliamo il TWD di fallback solo se non abbiamo visto dati nativi negli ultimi 5 secondi
+            // Calcolo TWD stabile (Prua + TWA)
             if (hdg !== undefined && (now - lastNativeTwdTime > 5000)) {
                 const twd = (hdg + twa + 2 * Math.PI) % (2 * Math.PI);
                 manageHistory('twd', twd);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sailingrotevista/rotevista-dash",
-  "version": "7.0.19",
+  "version": "7.0.23",
   "description": "Wind Dashboard with navigation and course aids",
   "main": "index.js",
   "publishConfig": {

package/style.css

@@ -602,36 +602,6 @@ body.night-mode {
     stroke: #440000 !important;
 }
 
-/* ==========================================================================
-   13. ARCHITETTURA MULTILIVELLO GPU (60FPS EXTRA LOW-POWER NEEDLES)
-   ========================================================================== */
-
-/* Contenitore di posizionamento assoluto speculare per i due livelli */
-.wind-gauge-container {
-    position: relative;
-    width: 100%;
-    height: 100%;
-    max-height: 100%;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-}
-
-/* Forziamo l'overlay delle sole lancette ad allinearsi perfettamente sopra lo sfondo */
-#wind-gauge-pointers {
-    position: absolute;
-    top: 0; left: 0;
-    width: 100%; height: 100%;
-    object-fit: contain;
-    pointer-events: none; /* Cruciale: permette ai clic del mouse/tocco di passare sotto su #fullscreen-hotspot */
-    will-change: transform; /* Promuove l'intero overlay a livello GPU composited */
-}
-
-/* Applichiamo lo smorzamento fluido a 60fps solo alle frecce ultra-leggere */
-#awa-pointer, #twa-pointer, #track-pointer {
-    transition: transform 0.9s cubic-bezier(0.15, 0.85, 0.3, 1);
-}
-
 /* ==========================================================================
    13. SMORZAMENTO FLUIDO AGHI A 60FPS (DAMPING HARDWARE) non utilizzato consuma troppa cpu
    ==========================================================================