signalk-mareas-ihm 2.1.2 → 2.1.4

package/dist/build-info.json

@@ -1,7 +1,7 @@
 {
-  "version": "2.1.2",
-  "timestamp": "20260609-0141",
+  "version": "2.1.4",
+  "timestamp": "20260609-0204",
   "gitHash": null,
   "gitDirty": true,
-  "builtAt": "2026-06-08T23:41:36.818Z"
+  "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 = "Rev313";
+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
@@ -1320,30 +1352,30 @@ body.mobile-ui #shelter-hours .sh-hr{flex:0 0 60px!important}
      mismas funciones que el desktop -->
 <div id="m-sidebar">
   <!-- Rev187: orden Echar, Centrar, Info, AIS, Cartas, Abrigo, Curvas, Mareas, Alarmas, Fondeo -->
-  <button class="m-sb-btn" id="m-sb-anchor" onclick="m_onAnchorBtn()" title="Fondear/Levar"><span class="ico">⚓</span><span id="m-sb-anchor-lbl" data-i18n="sb_echar">Echar</span></button>
-  <button class="m-sb-btn" id="m-sb-center" onclick="centerOnAnchor&&centerOnAnchor()||m_centerOnBoat()" title="Centrar mapa">
+  <button class="m-sb-btn" id="m-sb-anchor" onclick="m_onAnchorBtn()" data-i18n-title="sb_anchor_tip" title="Fondear/Levar"><span class="ico">⚓</span><span id="m-sb-anchor-lbl" data-i18n="sb_echar">Echar</span></button>
+  <button class="m-sb-btn" id="m-sb-center" onclick="centerOnAnchor&&centerOnAnchor()||m_centerOnBoat()" data-i18n-title="sb_centrar_tip" title="Centrar mapa">
     <span class="ico" style="display:inline-flex;align-items:center;justify-content:center"><svg viewBox="0 0 44 44" width="34" height="34"><circle cx="22" cy="22" r="18" fill="none" stroke="#f44336" stroke-width="2.5" stroke-dasharray="4 3"/><line x1="22" y1="0" x2="22" y2="44" stroke="#f44336" stroke-width="1.5"/><line x1="0" y1="22" x2="44" y2="22" stroke="#f44336" stroke-width="1.5"/><circle cx="22" cy="22" r="3" fill="#f44336"/><text x="22" y="27" text-anchor="middle" font-size="18" fill="#fff" style="filter:drop-shadow(0 0 2px #000)">⚓</text></svg></span>
     <span data-i18n="sb_centrar">Centrar</span>
   </button>
-  <button class="m-sb-btn" id="m-sb-info"   onclick="m_openInfoModal()" title="Datos del fondeo">
+  <button class="m-sb-btn" id="m-sb-info"   onclick="m_openInfoModal()" data-i18n-title="sb_info_tip" title="Datos del fondeo">
     <span class="ico" style="background:#fff;color:#000;width:32px;height:32px;border-radius:50%;font-family:Georgia,serif;font-style:italic;font-weight:900;font-size:22px;display:inline-flex;align-items:center;justify-content:center;line-height:1">i</span>
     <span data-i18n="sb_info">Info</span>
   </button>
-  <button class="m-sb-btn" id="m-sb-ais"    onclick="m_toggleAisList()" title="AIS en zona"><span class="ico">🚢</span><span id="m-sb-ais-lbl" data-i18n="sb_ais">AIS</span></button>
-  <button class="m-sb-btn" id="m-sb-panel"  onclick="m_togglePanel()" title="Cartas y Capas"><span class="ico">🗺️</span><span data-i18n="sb_cartas">Cartas</span></button>
-  <button class="m-sb-btn" id="m-sb-abrigo" onclick="openShelterConfig()" title="Previsión abrigo"><span class="ico">🏔️</span><span data-i18n="sb_abrigo">Abrigo</span></button>
+  <button class="m-sb-btn" id="m-sb-ais"    onclick="m_toggleAisList()" data-i18n-title="ais_en_zona" title="AIS en zona"><span class="ico">🚢</span><span id="m-sb-ais-lbl" data-i18n="sb_ais">AIS</span></button>
+  <button class="m-sb-btn" id="m-sb-panel"  onclick="m_togglePanel()" data-i18n-title="panel_cartas_capas" title="Cartas y Capas"><span class="ico">🗺️</span><span data-i18n="sb_cartas">Cartas</span></button>
+  <button class="m-sb-btn" id="m-sb-abrigo" onclick="openShelterConfig()" data-i18n-title="sb_abrigo_tip" title="Previsión abrigo"><span class="ico">🏔️</span><span data-i18n="sb_abrigo">Abrigo</span></button>
   <!-- Rev297: Curvas y Mareas se han movido al left bar (entre Favorito y KIP).
        Se quitan de aquí para no duplicar. -->
-  <button class="m-sb-btn" id="m-sb-alarm"  onclick="toggleAlarmPanel()" title="Panel de alarmas"><span class="ico">🔔</span><span data-i18n="sb_alarmas">Alarmas</span></button>
-  <button class="m-sb-btn" id="m-sb-fondeo" onclick="openPopup('fondeo-pop');fetchFondeoData()" title="Cálculo fondeo"><span class="ico">⛓️</span><span data-i18n="sb_fondeo">Fondeo</span></button>
+  <button class="m-sb-btn" id="m-sb-alarm"  onclick="toggleAlarmPanel()" data-i18n-title="sb_alarmas_tip" title="Panel de alarmas"><span class="ico">🔔</span><span data-i18n="sb_alarmas">Alarmas</span></button>
+  <button class="m-sb-btn" id="m-sb-fondeo" onclick="openPopup('fondeo-pop');fetchFondeoData()" data-i18n-title="sb_fondeo_tip" title="Cálculo fondeo"><span class="ico">⛓️</span><span data-i18n="sb_fondeo">Fondeo</span></button>
 </div>
 
 <!-- Bottom info bar (icon-led + mini sparkline presión + grade abrigo) -->
 <!-- Rev285: viento con flecha grande+kt dentro, junto a SOG.
      Donut de abrigo con letra dentro. SOG sin click. -->
 <div id="m-bottom-bar">
-  <div class="it" title="Velocidad sobre fondo"><span class="lb" data-i18n="bb_velocidad">Velocidad</span><span class="vl" id="m-bb-sog">—</span></div>
-  <div class="it m-bb-wind" title="Viento real (veleta) · flecha apunta hacia DONDE VA (TO) · click → Meteo" onclick="toggleMeteo&&toggleMeteo()">
+  <div class="it" data-i18n-title="bb_velocidad_tip" title="Velocidad sobre fondo"><span class="lb" data-i18n="bb_velocidad">Velocidad</span><span class="vl" id="m-bb-sog">—</span></div>
+  <div class="it m-bb-wind" data-i18n-title="bb_viento_tip" title="Viento real (veleta) · flecha apunta hacia DONDE VA (TO) · click → Meteo" onclick="toggleMeteo&&toggleMeteo()">
     <span class="lb" data-i18n="bb_viento">Viento</span>
     <!-- Rev295: alineación correcta con el resto de .vl. El SVG con margin
          negativo compensa el padding interno del viewBox 28 con flecha hasta
@@ -1357,10 +1389,10 @@ body.mobile-ui #shelter-hours .sh-hr{flex:0 0 60px!important}
       <span class="vl" id="m-bb-wind-kt-txt">—<span style="font-size:11px;font-weight:700;opacity:.75;margin-left:2px">kts</span></span>
     </div>
   </div>
-  <div class="it" title="Profundidad bajo quilla · Sonda" onclick="openPopup&&openPopup('sonda-pop')"><span class="lb" data-i18n="bb_sonda">Sonda</span><span class="vl" id="m-bb-sonda">—</span><span id="m-bb-sonda-status" style="display:none;font-size:9px;font-weight:800;margin-top:2px;text-align:center;line-height:1.1"></span></div>
-  <div class="it" title="Cadena recomendada" onclick="m_openInfoModal&&m_openInfoModal()"><span class="lb" data-i18n="bb_cadena_rec">Cadena rec.</span><span class="vl" id="m-bb-cad">—</span></div>
-  <div class="it" title="Distancia al ancla" onclick="m_openInfoModal&&m_openInfoModal()"><span class="lb" data-i18n="bb_dist_ancla">Dist. ancla</span><span class="vl" id="m-bb-dist">—</span></div>
-  <div class="it m-bb-graph" title="Presión barométrica · línea naranja = AHORA · click → Meteo" onclick="toggleMeteo&&toggleMeteo()">
+  <div class="it" data-i18n-title="bb_sonda_tip" title="Profundidad bajo quilla · Sonda" onclick="openPopup&&openPopup('sonda-pop')"><span class="lb" data-i18n="bb_sonda">Sonda</span><span class="vl" id="m-bb-sonda">—</span><span id="m-bb-sonda-status" style="display:none;font-size:9px;font-weight:800;margin-top:2px;text-align:center;line-height:1.1"></span></div>
+  <div class="it" data-i18n-title="bb_cadena_tip" title="Cadena recomendada" onclick="m_openInfoModal&&m_openInfoModal()"><span class="lb" data-i18n="bb_cadena_rec">Cadena rec.</span><span class="vl" id="m-bb-cad">—</span></div>
+  <div class="it" data-i18n-title="bb_dist_tip" title="Distancia al ancla" onclick="m_openInfoModal&&m_openInfoModal()"><span class="lb" data-i18n="bb_dist_ancla">Dist. ancla</span><span class="vl" id="m-bb-dist">—</span></div>
+  <div class="it m-bb-graph" data-i18n-title="bb_presion_tip" title="Presión barométrica · línea naranja = AHORA · click → Meteo" onclick="toggleMeteo&&toggleMeteo()">
     <span class="lb" data-i18n="bb_presion">Presión</span>
     <!-- Rev288: viewBox extendido 0-80 para reservar espacio a la previsión
          (a la derecha del AHORA). El histórico ocupa 0-60 (línea AHORA en
@@ -1373,11 +1405,11 @@ body.mobile-ui #shelter-hours .sh-hr{flex:0 0 60px!important}
     </svg>
     <span class="vl" id="m-bb-pres-val" style="font-size:13px!important">—</span>
   </div>
-  <div class="it m-bb-grade" title="Grado de abrigo · click → Abrigo" onclick="openShelterConfig&&openShelterConfig()">
+  <div class="it m-bb-grade" data-i18n-title="bb_abrigo_tip" title="Grado de abrigo · click → Abrigo" onclick="openShelterConfig&&openShelterConfig()">
     <span class="lb" data-i18n="bb_abrigo">Abrigo</span>
     <span id="m-bb-grade" style="display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:8px;background:rgba(120,120,120,.35);color:#fff;font-weight:900;font-size:18px;line-height:1">—</span>
   </div>
-  <div class="it m-bb-donut" title="Calidad de abrigo (gauge) · click → Abrigo" onclick="openShelterConfig&&openShelterConfig()">
+  <div class="it m-bb-donut" data-i18n-title="bb_calidad_tip" title="Calidad de abrigo (gauge) · click → Abrigo" onclick="openShelterConfig&&openShelterConfig()">
     <span class="lb" data-i18n="bb_calidad">Calidad</span>
     <svg viewBox="0 0 36 36" width="38" height="38" style="display:block">
       <circle cx="18" cy="18" r="15.5" fill="none" stroke="rgba(255,255,255,.15)" stroke-width="3.5"/>
@@ -1777,14 +1809,14 @@ body.mobile-ui #shelter-hours .sh-hr{flex:0 0 60px!important}
 <!-- Rev286: modal propio para guardar fondeo favorito (en vez del prompt() nativo cutre). -->
 <div class="popup-overlay" id="m-fav-save-pop" onclick="if(event.target.id==='m-fav-save-pop')closePopup('m-fav-save-pop')">
   <div class="popup-box" onclick="event.stopPropagation()">
-    <h4>❤ Guardar fondeo favorito</h4>
-    <p style="opacity:.85;margin:8px 0 14px">Nombre del favorito (vacío = nombre automático por geolocalización):</p>
-    <input type="text" id="m-fav-save-name" placeholder="p.ej. Cangas - Massó"
+    <h4 data-i18n="fav_guardar_title">❤ Guardar fondeo favorito</h4>
+    <p style="opacity:.85;margin:8px 0 14px" data-i18n="fav_guardar_hint">Nombre del favorito (vacío = nombre automático por geolocalización):</p>
+    <input type="text" id="m-fav-save-name" data-i18n-placeholder="fav_placeholder" placeholder="p.ej. Cangas - Massó"
       style="width:100%;padding:14px 16px;font-size:20px;border-radius:10px;border:2px solid rgba(255,255,255,.25);background:rgba(0,0,0,.35);color:#fff;box-sizing:border-box"
       onkeydown="if(event.key==='Enter')m_favSaveConfirm();">
     <div style="display:flex;gap:10px;justify-content:flex-end;margin-top:18px">
-      <button onclick="closePopup('m-fav-save-pop')" style="padding:12px 22px;background:rgba(255,255,255,.15);color:#fff;border:none;border-radius:10px;cursor:pointer;font-size:17px;font-weight:700">Cancelar</button>
-      <button onclick="m_favSaveConfirm()" style="padding:12px 22px;background:var(--org);color:#0a1929;border:none;border-radius:10px;cursor:pointer;font-size:17px;font-weight:900">Guardar</button>
+      <button onclick="closePopup('m-fav-save-pop')" style="padding:12px 22px;background:rgba(255,255,255,.15);color:#fff;border:none;border-radius:10px;cursor:pointer;font-size:17px;font-weight:700" data-i18n="m_cancelar">Cancelar</button>
+      <button onclick="m_favSaveConfirm()" style="padding:12px 22px;background:var(--org);color:#0a1929;border:none;border-radius:10px;cursor:pointer;font-size:17px;font-weight:900" data-i18n="m_guardar">Guardar</button>
     </div>
   </div>
 </div>
@@ -1797,7 +1829,7 @@ body.mobile-ui #shelter-hours .sh-hr{flex:0 0 60px!important}
       <div style="margin:4px 0;font-size:21px;display:flex;gap:10px;align-items:center;flex-wrap:wrap">
         <span style="opacity:.6;flex-shrink:0"><span data-i18n="meteo_modelo">Modelo:</span></span>
         <select id="meteo-model" style="background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:4px;padding:4px 8px;font-size:21px;flex-shrink:0" onchange="fetchMeteo()">
-          <option value="" style="background:#1a2a3a;color:#fff">Mejor (automático)</option><option value="&models=icon_seamless" style="background:#1a2a3a;color:#fff">ICON (DWD)</option><option value="&models=gfs_seamless" style="background:#1a2a3a;color:#fff">GFS (NOAA)</option><option value="&models=ecmwf_ifs025" style="background:#1a2a3a;color:#fff">ECMWF IFS</option><option value="&models=meteofrance_seamless" style="background:#1a2a3a;color:#fff">Météo-France</option><option value="&models=gem_seamless" style="background:#1a2a3a;color:#fff">GEM (Canada)</option><option value="&models=jma_seamless" style="background:#1a2a3a;color:#fff">JMA (Japan)</option>
+          <option value="" style="background:#1a2a3a;color:#fff" data-i18n="meteo_modelo_auto">Mejor (automático)</option><option value="&models=icon_seamless" style="background:#1a2a3a;color:#fff">ICON (DWD)</option><option value="&models=gfs_seamless" style="background:#1a2a3a;color:#fff">GFS (NOAA)</option><option value="&models=ecmwf_ifs025" style="background:#1a2a3a;color:#fff">ECMWF IFS</option><option value="&models=meteofrance_seamless" style="background:#1a2a3a;color:#fff">Météo-France</option><option value="&models=gem_seamless" style="background:#1a2a3a;color:#fff">GEM (Canada)</option><option value="&models=jma_seamless" style="background:#1a2a3a;color:#fff">JMA (Japan)</option>
         </select>
         <span id="meteo-model-desc" style="font-size:20px;color:#cde;font-weight:600;flex:1;min-width:200px;line-height:1.25;white-space:normal"></span>
       </div>
@@ -1806,7 +1838,7 @@ body.mobile-ui #shelter-hours .sh-hr{flex:0 0 60px!important}
          como TEXTO HTML — se renderizaba tal cual hasta que fetchMeteo()
          reemplazaba el innerHTML. Ahora simplemente "Cargando…" en plano; JS
          lo sobreescribe en cuanto llega el primer fetch. -->
-    <div id="meteo-panel" style="overflow-y:auto;flex:1;padding:0"><div style="text-align:center;padding:20px;opacity:.5;font-size:15px">Cargando…</div></div>
+    <div id="meteo-panel" style="overflow-y:auto;flex:1;padding:0"><div style="text-align:center;padding:20px;opacity:.5;font-size:15px" data-i18n="m_cargando">Cargando…</div></div>
   </div>
 </div>
 <div class="popup-overlay" id="ais-pop" onclick="closePopup('ais-pop')" style="background:transparent;pointer-events:none"><div class="popup-box" onclick="event.stopPropagation()" style="position:fixed;bottom:80px;left:10px;pointer-events:auto;width:321px;max-height:445px;overflow-y:auto;z-index:2001;padding:10px 12px;box-sizing:border-box"><button onclick="closePopup('ais-pop')" style="position:absolute;top:6px;right:8px;background:none;border:none;color:#aaa;font-size:20px;cursor:pointer;padding:2px 6px;line-height:1">✕</button><h4 id="ais-pop-title" style="margin-right:28px">🚢 Target AIS</h4><div id="ais-pop-actions"></div><div id="ais-pop-body"></div></div></div>
@@ -1814,7 +1846,7 @@ body.mobile-ui #shelter-hours .sh-hr{flex:0 0 60px!important}
   <div class="popup-box" onclick="event.stopPropagation()" style="width:520px;max-width:94vw;max-height:85vh;overflow-y:auto">
     <button onclick="closePopup('sonda-pop')" style="position:absolute;top:6px;right:10px;background:none;border:none;color:#aaa;font-size:22px;cursor:pointer;line-height:1">✕</button>
     <h4 style="font-size:18px" data-i18n="calc_sonda_title">📐 Cálculo de Sonda</h4>
-    <div id="sonda-content" style="margin-top:10px"><div style="text-align:center;padding:20px;opacity:.5">Cargando...</div></div>
+    <div id="sonda-content" style="margin-top:10px"><div style="text-align:center;padding:20px;opacity:.5" data-i18n="m_cargando">Cargando…</div></div>
   </div>
 </div>
 <div class="popup-overlay" id="fondeo-pop" onclick="closePopup('fondeo-pop')">
@@ -2007,6 +2039,52 @@ var _i18n={
   m_calma:{es:'Calma',en:'Calm'},
   sh_detected:{es:'Detectado',en:'Detected'},
   sh_sectores:{es:'sectores abrigados',en:'sheltered sectors'},
+  /* Rev313: tooltips bottom bar */
+  bb_velocidad_tip:{es:'Velocidad sobre fondo',en:'Speed over ground'},
+  bb_viento_tip:{es:'Viento real (veleta) · flecha apunta hacia DONDE VA (TO) · click → Meteo',en:'True wind (vane) · arrow points TO where it goes · click → Weather'},
+  bb_sonda_tip:{es:'Profundidad bajo quilla · Sonda',en:'Depth under keel · Sounder'},
+  bb_cadena_tip:{es:'Cadena recomendada',en:'Recommended chain'},
+  bb_dist_tip:{es:'Distancia al ancla',en:'Distance to anchor'},
+  bb_presion_tip:{es:'Presión barométrica · línea naranja = AHORA · click → Meteo',en:'Barometric pressure · orange line = NOW · click → Weather'},
+  bb_abrigo_tip:{es:'Grado de abrigo · click → Abrigo',en:'Shelter grade · click → Shelter'},
+  bb_calidad_tip:{es:'Calidad de abrigo (gauge) · click → Abrigo',en:'Shelter quality (gauge) · click → Shelter'},
+  /* Rev313: tooltips sidebar derecha */
+  sb_anchor_tip:{es:'Fondear / Levar',en:'Drop / Lift anchor'},
+  sb_centrar_tip:{es:'Centrar mapa',en:'Center map'},
+  sb_info_tip:{es:'Datos del fondeo',en:'Anchorage data'},
+  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):'},
+  fav_placeholder:{es:'p.ej. Cangas - Massó',en:'e.g. Cangas - Massó'},
+  m_cancelar:{es:'Cancelar',en:'Cancel'},
+  m_guardar:{es:'Guardar',en:'Save'},
+  meteo_modelo_auto:{es:'Mejor (automático)',en:'Best (automatic)'},
   otras_capas:{es:'Otras capas base',en:'Other base layers'},
   cartas_mbt:{es:'Cartas MBTiles',en:'MBTiles Charts'},
   cartas_sk:{es:'Cartas registradas (Signal K)',en:'Registered charts (Signal K)'},
@@ -2226,6 +2304,15 @@ function applyLang(){
     var k=el.getAttribute('data-i18n-html');
     var t=T(k);if(t)el.innerHTML=t;
   });
+  /* Rev313: traducir atributos title (tooltips on hover) y placeholders. */
+  document.querySelectorAll('[data-i18n-title]').forEach(function(el){
+    var k=el.getAttribute('data-i18n-title');
+    var t=T(k);if(t)el.setAttribute('title',t);
+  });
+  document.querySelectorAll('[data-i18n-placeholder]').forEach(function(el){
+    var k=el.getAttribute('data-i18n-placeholder');
+    var t=T(k);if(t)el.setAttribute('placeholder',t);
+  });
   /* Special elements */
   var bl=document.getElementById('ais-borneo-label');if(bl)bl.textContent=T('colision');
   /* Flag active state */
@@ -5092,7 +5179,11 @@ function _shelterRenderPopup(){
         if(typeof _boatWave.heightSigM==='number'&&_boatWave.heightSigM>=0.05){
           waveLblTxt=_boatWave.heightSigM.toFixed(1).replace('.',',')+' m'+(_wavePer?' '+_wavePer:'');
         }else{
-          var _waveIntShort={calma:'Cal',rizada:'Riz',moderada:'Mod',agitada:'Agi',fuerte:'Fue'}[_boatWave.intensity||'']||(_boatWave.intensity||'');
+          /* Rev313: i18n abreviaturas intensidad ola. */
+          var _waveIntMap=(_lang==='en')
+            ? {calma:'Calm',rizada:'Rip',moderada:'Mod',agitada:'Rou',fuerte:'Str'}
+            : {calma:'Cal',rizada:'Riz',moderada:'Mod',agitada:'Agi',fuerte:'Fue'};
+          var _waveIntShort=_waveIntMap[_boatWave.intensity||'']||(_boatWave.intensity||'');
           waveLblTxt=_waveIntShort+(_wavePer?' '+_wavePer:'');
         }
         waveLblHalfW=Math.max(30, waveLblTxt.length*4+8);
@@ -5288,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;
@@ -5445,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>';
@@ -5489,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 */
@@ -5860,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);}
@@ -5874,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;
@@ -5889,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'});
@@ -8997,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>'+
@@ -9010,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>' +
@@ -9167,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 '–';
@@ -9302,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.2",
+  "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",