signalk-mareas-ihm 2.1.3 → 2.1.4

package/dist/build-info.json

@@ -1,7 +1,7 @@
 {
-  "version": "2.1.3",
-  "timestamp": "20260609-0150",
+  "version": "2.1.4",
+  "timestamp": "20260609-0204",
   "gitHash": null,
   "gitDirty": true,
-  "builtAt": "2026-06-08T23:50:21.804Z"
+  "builtAt": "2026-06-09T00:04:55.082Z"
 }

package/dist/index.js

@@ -49,7 +49,7 @@ function isPositionValue(v) {
 // timestamp + git hash so we can verify exactly which build is running on the Pi
 // without ambiguity. ("¿Qué versión tengo deployada?" → /api/paths or landing.)
 const PLUGIN_VERSION = esmRequire("../package.json").version;
-const PLUGIN_REVISION = "Rev314";
+const PLUGIN_REVISION = "Rev315";
 let _buildInfo = null;
 try {
     _buildInfo = esmRequire("./build-info.json");

package/dist/mobile.html

@@ -755,6 +755,33 @@ body.mobile-ui #m-bottom-bar .m-bb-grade .ic{font-size:10px}
 body.mobile-ui #m-bottom-bar .m-bb-grade #m-bb-grade{width:28px!important;height:28px!important;font-size:18px!important}
 body.mobile-ui #m-bottom-bar #m-bb-pres-svg{width:50px!important;height:18px!important}
 
+/* Rev315: estilos UNIFICADOS de back-button y título en TODAS las ventanas.
+   Estas clases utility se pueden aplicar a cualquier botón/título de un modal
+   para forzar la misma apariencia visual en todo el plugin. Color principal
+   var(--org) naranja, peso 900, tamaño 22px back y 28px título. */
+.m-back-btn{
+  background:rgba(255,178,63,.15)!important;
+  border:1px solid var(--org)!important;
+  color:var(--org)!important;
+  font-size:18px!important;
+  font-weight:800!important;
+  padding:12px 18px!important;
+  border-radius:12px!important;
+  cursor:pointer!important;
+  min-height:48px!important;
+  display:inline-flex!important;align-items:center!important;gap:4px!important;
+  letter-spacing:-.2px!important;
+}
+.m-back-btn:active{opacity:.6!important;transform:scale(.95)!important}
+.m-modal-title{
+  font-size:28px!important;
+  font-weight:900!important;
+  color:#fff!important;
+  letter-spacing:-.3px!important;
+  text-align:center!important;
+  margin:0!important;
+}
+
 /* === MODALES fullscreen Rev173: contenido MUCHO más grande, sin pinch, sin scroll horizontal === */
 body.mobile-ui .popup-overlay{
   align-items:stretch!important;justify-content:stretch!important;
@@ -790,19 +817,24 @@ body.mobile-ui .m-modal-hdr{
   display:flex;align-items:center;justify-content:space-between;
   padding:0 12px;
 }
+/* Rev315: m-back UNIFICADO (alineado con clase utility .m-back-btn). Ya no
+   necesita min-width:110px ni height fija — es más compacto y consistente
+   con todos los demás botones Back del proyecto (Anchor Calculation, etc). */
 body.mobile-ui .m-modal-hdr .m-back{
   background:rgba(255,178,63,.15);border:1px solid var(--org);color:var(--org);
-  font-size:22px;font-weight:800;cursor:pointer;padding:14px 20px;
-  display:flex;align-items:center;gap:6px;min-width:110px;height:56px;
-  border-radius:12px;
+  font-size:18px;font-weight:800;cursor:pointer;padding:12px 18px;
+  display:flex;align-items:center;gap:4px;min-height:48px;
+  border-radius:12px;letter-spacing:-.2px;
 }
 body.mobile-ui .m-modal-hdr .m-back:active{opacity:.6;transform:scale(.95)}
+/* Rev315: título UNIFICADO 28px (antes 38px). Coherente con la clase
+   utility .m-modal-title y con todos los modales del proyecto. */
 body.mobile-ui .m-modal-hdr .m-title{
-  flex:1;text-align:center;font-size:38px;font-weight:900;color:#fff;
+  flex:1;text-align:center;font-size:28px;font-weight:900;color:#fff;
   overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
-  padding:0 8px;letter-spacing:-.4px;
+  padding:0 8px;letter-spacing:-.3px;
 }
-body.mobile-ui .m-modal-hdr .m-close-spacer{min-width:110px}
+body.mobile-ui .m-modal-hdr .m-close-spacer{min-width:80px}
 
 /* === Tipografía GIGANTE dentro de modales (legibilidad marítima de sol) ===
    Rev183: subimos todo +2-4 px más. El usuario insiste en que todavía
@@ -2023,6 +2055,29 @@ var _i18n={
   sb_abrigo_tip:{es:'Previsión abrigo',en:'Shelter forecast'},
   sb_alarmas_tip:{es:'Panel de alarmas',en:'Alarms panel'},
   sb_fondeo_tip:{es:'Cálculo fondeo',en:'Anchorage calculator'},
+  /* Rev315: meteo panel AHORA + row labels */
+  met_viento:{es:'VIENTO',en:'WIND'},
+  met_aire:{es:'AIRE',en:'AIR'},
+  met_mar:{es:'MAR',en:'SEA'},
+  met_resumen:{es:'Resumen',en:'Summary'},
+  met_row_aire:{es:'Aire',en:'Air'},
+  met_row_presion:{es:'Presión',en:'Pressure'},
+  met_row_lluvia:{es:'Lluvia',en:'Rain'},
+  met_row_tmar:{es:'T. Mar',en:'Sea T.'},
+  met_row_ola:{es:'Ola',en:'Wave'},
+  met_row_periodo:{es:'Período',en:'Period'},
+  met_row_dirola:{es:'Dir ola',en:'Wave dir'},
+  /* Rev315: shelter NOW box */
+  sh_veleta:{es:'Veleta',en:'Vane'},
+  sh_sensor:{es:'Sensor',en:'Sensor'},
+  sh_racha:{es:'racha',en:'gust'},
+  sh_aire:{es:'aire',en:'air'},
+  sh_agua:{es:'agua',en:'water'},
+  m_ahora_low:{es:'ahora',en:'now'},
+  /* Rev315: labels flotantes visor (mapa) */
+  m_viento:{es:'Viento',en:'Wind'},
+  m_olas:{es:'Olas',en:'Waves'},
+  m_mar_calma:{es:'Mar en calma',en:'Calm sea'},
   /* Rev313: modal guardar favorito */
   fav_guardar_title:{es:'❤ Guardar fondeo favorito',en:'❤ Save favourite anchorage'},
   fav_guardar_hint:{es:'Nombre del favorito (vacío = nombre automático por geolocalización):',en:'Favourite name (empty = auto name by geolocation):'},
@@ -5324,8 +5379,11 @@ function _shelterRenderPopup(){
        temperaturas. Sin sensor → forecast Open-Meteo (sin badge).
        _BADGE_VELETA y _BADGE_SENSOR son verdes (#3aa856), mismo tono que
        el badge "IMU" pre-existente para coherencia visual. */
-    var _BADGE_VELETA=' <span style="color:#3aa856;font-size:11px;font-weight:800;margin-left:4px">Veleta</span>';
-    var _BADGE_SENSOR=' <span style="color:#3aa856;font-size:10px;font-weight:800;margin-left:3px">Sensor</span>';
+    /* Rev315: badges Veleta/Sensor i18n. */
+    var _badgeVeletaTxt=(typeof T==='function')?T('sh_veleta','Veleta'):'Veleta';
+    var _badgeSensorTxt=(typeof T==='function')?T('sh_sensor','Sensor'):'Sensor';
+    var _BADGE_VELETA=' <span style="color:#3aa856;font-size:11px;font-weight:800;margin-left:4px">'+_badgeVeletaTxt+'</span>';
+    var _BADGE_SENSOR=' <span style="color:#3aa856;font-size:10px;font-weight:800;margin-left:3px">'+_badgeSensorTxt+'</span>';
     var _useSensorWind=isNow&&_boatWind;
     var _useSensorEnv=isNow&&_envSensors;
     var stWindKt,stDirDeg,windBadge;
@@ -5481,7 +5539,7 @@ function _shelterRenderPopup(){
       var axis=
         '<text x="'+x_24h.toFixed(1)+'" y="'+(H-6)+'" text-anchor="start" fill="rgba(255,255,255,.78)" font-size="13" font-weight="700">-24 h</text>'+
         '<text x="'+x_12h.toFixed(1)+'" y="'+(H-6)+'" text-anchor="middle" fill="rgba(255,255,255,.65)" font-size="13" font-weight="700">-12 h</text>'+
-        '<text x="'+nowX.toFixed(1)+'" y="'+(H-6)+'" text-anchor="middle" fill="#ffeb3b" font-size="13" font-weight="900">ahora</text>'+
+        '<text x="'+nowX.toFixed(1)+'" y="'+(H-6)+'" text-anchor="middle" fill="#ffeb3b" font-size="13" font-weight="900">'+((typeof T==='function')?T('m_ahora_low','ahora'):'ahora')+'</text>'+
         '<text x="'+x_max.toFixed(1)+'" y="'+(H-6)+'" text-anchor="end" fill="rgba(255,235,59,.85)" font-size="13" font-weight="800">+'+maxFutureH+' h</text>'+
         '<text x="2" y="'+(padTop+10)+'" text-anchor="start" fill="rgba(255,255,255,.6)" font-size="11" font-weight="700">'+Math.round(pMax)+'</text>'+
         '<text x="2" y="'+(H-padBot-2)+'" text-anchor="start" fill="rgba(255,255,255,.6)" font-size="11" font-weight="700">'+Math.round(pMin)+'</text>';
@@ -5525,11 +5583,13 @@ function _shelterRenderPopup(){
     /* Rev128: reorden infobox — wind, gust, wave, TEMPS, pressure-num, sparkline.
        La sparkline queda al final para visual cleanliness (es el elemento más
        alto y rompía si quedaba en medio). */
+    /* Rev315: labels i18n (racha/aire/agua). */
+    var _ts=function(k,fb){ return (typeof T==='function')?T(k,fb):fb; };
     statusBody.innerHTML=
       '<div>🌬 <b style="font-size:24px">'+Math.round(stWindKt)+' kt</b> <span style="color:#9ad">'+stDir+'</span>'+windBadge+'</div>'+
-      '<div>💨 racha <b style="font-size:21px">'+Math.round(stGustKt)+' kt</b>'+gustBadge+'</div>'+
+      '<div>💨 '+_ts('sh_racha','racha')+' <b style="font-size:21px">'+Math.round(stGustKt)+' kt</b>'+gustBadge+'</div>'+
       '<div>'+waveLine+'</div>'+
-      '<div>🌡 aire <b style="font-size:20px">'+tempA+'</b>'+tempABadge+'  &nbsp;&nbsp; 🌊 agua <b style="font-size:20px">'+tempW+'</b>'+tempWBadge+'</div>'+
+      '<div>🌡 '+_ts('sh_aire','aire')+' <b style="font-size:20px">'+tempA+'</b>'+tempABadge+'  &nbsp;&nbsp; 🌊 '+_ts('sh_agua','agua')+' <b style="font-size:20px">'+tempW+'</b>'+tempWBadge+'</div>'+
       pressureNumLine+
       sparkRow;
     /* Botón AHORA: resaltado si NO hay hora seleccionada */
@@ -5896,7 +5956,7 @@ function _wxMapMarkerUpdate(){
   if(_wDeg!==null){
     var wEdge=geoEdge(pos.lat,pos.lng,alarmR,_wDeg);
     var wDirTxt=_wxC16?_wxC16(_wDeg):'';
-    var wLabel='Viento '+(wDirTxt?wDirTxt+' ':'')+Math.round(_wKt)+' kt';
+    var wLabel=((typeof T==='function')?T('m_viento','Viento'):'Viento')+' '+(wDirTxt?wDirTxt+' ':'')+Math.round(_wKt)+' kt';
     var html=_wxMarkerHtml('#ffeb3b',wLabel,_wDeg,'wind',_labOffW);
     var icon=L.divIcon({html:html,iconSize:[1,1],iconAnchor:[0,0],className:'wx-map-marker'});
     if(_wxMapMarkers.wind){_wxMapMarkers.wind.setIcon(icon);_wxMapMarkers.wind.setLatLng(wEdge);_wxMapMarkers.wind.setZIndexOffset(300);if(!map.hasLayer(_wxMapMarkers.wind))_wxMapMarkers.wind.addTo(map);}
@@ -5910,13 +5970,12 @@ function _wxMapMarkerUpdate(){
     var oEdge=geoEdge(pos.lat,pos.lng,alarmR,_vDirEff);
     var oDirTxt=_wxC16?_wxC16(_vDirEff):'';
     var oLabel;
+    /* Rev315: labels "Olas" y "Mar en calma" i18n. */
+    var _tw=function(k,fb){ return (typeof T==='function')?T(k,fb):fb; };
     if(_boatWave){
-      /* Rev128: si la ola es despreciable (intensidad calma), no marear con
-         direcciones y períodos cortos sin sentido — decir simplemente
-         "Mar en calma". Si hay movimiento medible, mostrar altura+dir+período. */
       var _vbCalm=(_boatWave.intensity==='calma')&&(typeof _boatWave.heightSigM!=='number'||_boatWave.heightSigM<0.05);
       if(_vbCalm){
-        oLabel='Mar en calma';
+        oLabel=_tw('m_mar_calma','Mar en calma');
       }else{
         var _vbPer=(typeof _boatWave.periodSec==='number'&&_boatWave.periodSec>0)?Math.round(_boatWave.periodSec)+'s':'';
         var _vbMain;
@@ -5925,10 +5984,10 @@ function _wxMapMarkerUpdate(){
         }else{
           _vbMain=(_boatWave.intensity||'').charAt(0).toUpperCase()+(_boatWave.intensity||'').slice(1);
         }
-        oLabel='Olas '+(oDirTxt?oDirTxt+' ':'')+_vbMain+(_vbPer?' · '+_vbPer:'');
+        oLabel=_tw('m_olas','Olas')+' '+(oDirTxt?oDirTxt+' ':'')+_vbMain+(_vbPer?' · '+_vbPer:'');
       }
     }else{
-      oLabel='Olas '+(oDirTxt?oDirTxt+' ':'')+h.waveHeightM.toFixed(1).replace('.',',')+' m'+(h.wavePeriodSec>0?' · '+Math.round(h.wavePeriodSec)+' s':'');
+      oLabel=_tw('m_olas','Olas')+' '+(oDirTxt?oDirTxt+' ':'')+h.waveHeightM.toFixed(1).replace('.',',')+' m'+(h.wavePeriodSec>0?' · '+Math.round(h.wavePeriodSec)+' s':'');
     }
     var oHtml=_wxMarkerHtml('#4dd0ff',oLabel,_vDirEff,'wave',_labOffV);
     var oIcon=L.divIcon({html:oHtml,iconSize:[1,1],iconAnchor:[0,0],className:'wx-map-marker'});
@@ -9033,12 +9092,14 @@ function m_renderMeteoWindy(d, seaD){
   var nowColW = (nowWindKt!=null) ? wColor(nowWindKt) : '#fff';
   var nowColG = (nowGustKt!=null) ? wColor(nowGustKt) : '#fff';
   /* Rev238: panel AHORA — sin iconos en labels (limpio). */
+  /* Rev315: AHORA panel — labels i18n. */
+  var _tn = function(k,fb){ return (typeof T==='function')?T(k,fb):fb; };
   var nowPanelHtml =
     '<div style="display:flex;flex-direction:column;height:100%;background:var(--bg);border:3px solid var(--org);box-sizing:border-box">' +
-      '<div style="background:var(--org);color:#000;font-size:22px;font-weight:900;text-align:center;padding:4px 4px;letter-spacing:2px;line-height:1">AHORA</div>' +
+      '<div style="background:var(--org);color:#000;font-size:22px;font-weight:900;text-align:center;padding:4px 4px;letter-spacing:2px;line-height:1">'+_tn('m_ahora','AHORA')+'</div>' +
       '<div style="display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;flex:1;gap:0;color:#fff;text-align:center">' +
         '<div style="border-right:1px solid rgba(255,255,255,.4);border-bottom:1px solid rgba(255,255,255,.4);padding:4px 4px;display:flex;flex-direction:column;justify-content:center">' +
-          '<div style="font-size:16px;color:var(--org);font-weight:700;letter-spacing:1px;line-height:1">VIENTO'+srcBadge(srcWind)+'</div>' +
+          '<div style="font-size:16px;color:var(--org);font-weight:700;letter-spacing:1px;line-height:1">'+_tn('met_viento','VIENTO').toUpperCase()+srcBadge(srcWind)+'</div>' +
           '<div style="font-size:32px;font-weight:900;color:#fff;line-height:1.05;display:flex;align-items:center;justify-content:center;gap:4px">'+
             '<span>'+fmtKt(nowWindKt)+'</span>'+
             '<span style="font-size:14px;color:#9aa;font-weight:700">kt</span>'+
@@ -9046,15 +9107,15 @@ function m_renderMeteoWindy(d, seaD){
           '</div>' +
         '</div>' +
         '<div style="border-bottom:1px solid rgba(255,255,255,.4);padding:4px 4px;display:flex;flex-direction:column;justify-content:center">' +
-          '<div style="font-size:16px;color:var(--org);font-weight:700;letter-spacing:1px;line-height:1">RACHA'+srcBadge(srcGust)+'</div>' +
+          '<div style="font-size:16px;color:var(--org);font-weight:700;letter-spacing:1px;line-height:1">'+_tn('met_racha','RACHA').toUpperCase()+srcBadge(srcGust)+'</div>' +
           '<div style="font-size:32px;font-weight:900;color:#fff;line-height:1.05">'+fmtKt(nowGustKt)+'<span style="font-size:14px;color:#9aa;font-weight:700"> kt</span></div>' +
         '</div>' +
         '<div style="border-right:1px solid rgba(255,255,255,.4);padding:4px 4px;display:flex;flex-direction:column;justify-content:center">' +
-          '<div style="font-size:16px;color:var(--org);font-weight:700;letter-spacing:1px;line-height:1">AIRE'+srcBadge(srcAir)+'</div>' +
+          '<div style="font-size:16px;color:var(--org);font-weight:700;letter-spacing:1px;line-height:1">'+_tn('met_aire','AIRE').toUpperCase()+srcBadge(srcAir)+'</div>' +
           '<div style="font-size:32px;font-weight:900;color:#fff;line-height:1.05">'+fmtT(nowTAir)+'</div>' +
         '</div>' +
         '<div style="padding:4px 4px;display:flex;flex-direction:column;justify-content:center">' +
-          '<div style="font-size:16px;color:var(--org);font-weight:700;letter-spacing:1px;line-height:1">MAR'+srcBadge(srcSea)+'</div>' +
+          '<div style="font-size:16px;color:var(--org);font-weight:700;letter-spacing:1px;line-height:1">'+_tn('met_mar','MAR').toUpperCase()+srcBadge(srcSea)+'</div>' +
           '<div style="font-size:32px;font-weight:900;color:#fff;line-height:1.05">'+fmtT(nowTSea)+'</div>' +
         '</div>' +
       '</div>' +
@@ -9203,32 +9264,27 @@ function m_renderMeteoWindy(d, seaD){
       if (kn == null) return '–';
       return '<span style="color:'+wColor(kn)+';font-size:32px">'+kn.toFixed(0)+'</span>';
     });
-  /* Aire */
-  if (h.temperature_2m) rows += rowMetric('Aire','🌡️','#ffb23f','°C',
+  /* Rev315: row labels i18n. */
+  var _tr=function(k,fb){ return (typeof T==='function')?T(k,fb):fb; };
+  if (h.temperature_2m) rows += rowMetric(_tr('met_row_aire','Aire'),'🌡️','#ffb23f','°C',
     function(col){ return getVal(h.temperature_2m, col); },
     function(v){ return v==null?'–':'<span style="font-size:30px">'+v.toFixed(0)+'°</span>'; });
-  /* Presión */
-  if (h.pressure_msl || h.surface_pressure) rows += rowMetric('Presión','🔵','#9ad','mbar',
+  if (h.pressure_msl || h.surface_pressure) rows += rowMetric(_tr('met_row_presion','Presión'),'🔵','#9ad','mbar',
     function(col){ return getVal(h.pressure_msl || h.surface_pressure, col); },
     function(v){ return v==null?'–':'<span style="font-size:26px">'+Math.round(v)+'</span>'; });
-  /* Lluvia */
-  if (h.precipitation || h.rain) rows += rowMetric('Lluvia','💧','#4dd0ff','mm',
+  if (h.precipitation || h.rain) rows += rowMetric(_tr('met_row_lluvia','Lluvia'),'💧','#4dd0ff','mm',
     function(col){ return getVal(h.precipitation || h.rain, col); },
     function(v){ return (v==null||v===0)?'–':'<span style="font-size:28px">'+v.toFixed(1)+'</span>'; });
-  /* T. Mar */
-  if (seaH.sea_surface_temperature) rows += rowMetric('T. Mar','🐟','#4dd0ff','°C',
+  if (seaH.sea_surface_temperature) rows += rowMetric(_tr('met_row_tmar','T. Mar'),'🐟','#4dd0ff','°C',
     function(col){ return getSeaVal(seaH.sea_surface_temperature, col); },
     function(v){ return v==null?'–':'<span style="font-size:30px">'+v.toFixed(0)+'°</span>'; });
-  /* Ola altura */
-  if (seaH.wave_height) rows += rowMetric('Ola','🌊','#4dd0ff','m',
+  if (seaH.wave_height) rows += rowMetric(_tr('met_row_ola','Ola'),'🌊','#4dd0ff','m',
     function(col){ return getSeaVal(seaH.wave_height, col); },
     function(v){ return v==null?'–':'<span style="font-size:30px">'+v.toFixed(1)+'</span>'; });
-  /* Período */
-  if (seaH.wave_period) rows += rowMetric('Período','⏱️','#9ad','s',
+  if (seaH.wave_period) rows += rowMetric(_tr('met_row_periodo','Período'),'⏱️','#9ad','s',
     function(col){ return getSeaVal(seaH.wave_period, col); },
     function(v){ return v==null?'–':'<span style="font-size:28px">'+Math.round(v)+'</span>'; });
-  /* Dir ola — número de grados + flecha rotada pequeña (Rev228). */
-  if (seaH.wave_direction) rows += rowMetric('Dir ola','🧭','#4dd0ff','°',
+  if (seaH.wave_direction) rows += rowMetric(_tr('met_row_dirola','Dir ola'),'🧭','#4dd0ff','°',
     function(col){ return getSeaVal(seaH.wave_direction, col); },
     function(v){
       if (v == null) return '–';
@@ -9338,7 +9394,7 @@ function m_renderMeteoWindy(d, seaD){
     try { collapsed = localStorage.getItem('m-met-summary-collapsed') === '1'; } catch(_){}
     return '<div id="m-met-summary" class="' + (collapsed ? 'collapsed' : '') + '" style="background:rgba(20,40,60,.7);border-top:2px solid var(--org);color:#dde;flex-shrink:0">' +
            '<button id="m-met-summary-toggle" onclick="m_toggleMeteoSummary()" style="display:flex;align-items:center;justify-content:space-between;width:100%;background:none;border:none;color:var(--org);font-size:28px;font-weight:900;padding:18px 24px;cursor:pointer;text-align:left">' +
-             '<span>📰 Resumen</span>' +
+             '<span>📰 '+((typeof T==='function')?T('met_resumen','Resumen'):'Resumen')+'</span>' +
              '<span id="m-met-summary-chev" style="font-size:24px">' + (collapsed ? '▼' : '▲') + '</span>' +
            '</button>' +
            '<div id="m-met-summary-body" style="padding:0 24px 18px;font-size:24px;line-height:1.55;' + (collapsed ? 'display:none' : '') + '">' +

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "signalk-mareas-ihm",
-  "version": "2.1.3",
+  "version": "2.1.4",
   "description": "Complete SignalK anchor watch & marine safety webapp. Voice alarms for anchor drag, AIS collision risk and grounding. Shelter / anchorage forecast (wind exposure + wave history). Weather forecast (Open-Meteo). Depth & scope calculator. Multi-source nautical charts (Esri Satellite, IHM ENC S-52, bathymetry, MBTiles offline, OpenStreetMap, OpenSeaMap). Favourite anchorages. Multi-device real-time sync (SSE). Includes official IHM Spain tide predictions. Mobile-first UI in ES/EN.",
   "type": "module",
   "main": "./dist/index.js",