// js/app.js — al final, cuando lo esencial ya funciona
if ('serviceWorker' in navigator) {                    // ← mejora progresiva
  window.addEventListener('load', async () => {        // no compitas con la carga inicial
    try {
      const registro = await navigator.serviceWorker.register('/sw.js', { scope: '/' });
      console.log('[nomada] Service worker registrado. Ámbito:', registro.scope);
    } catch (error) {
      console.error('[nomada] Fallo al registrar el service worker:', error);
    }
  });
}

nomada-tareas/
  index.html
  manifest.json        ← nuevo
  sw.js                ← nuevo, EN LA RAÍZ (ámbito '/')
  offline.html         ← nuevo, página de respaldo
  css/estilos.css
  js/app.js
  js/…

self.addEventListener('install', (evento) => {
  evento.waitUntil(                                  // ← sin esto, el worker puede morir a mitad
    caches.open('nomada-v1').then((cache) => cache.addAll(RECURSOS))
  );
});

// Desde la página, hacia el worker
navigator.serviceWorker.controller?.postMessage({ tipo: 'limpiar-cache-api' });

// Desde la página, escuchando al worker
navigator.serviceWorker.addEventListener('message', (evento) => {
  if (evento.data.tipo === 'sincronizado') {
    vista.avisar(`${evento.data.cuantos} cambios enviados al servidor.`);
  }
});

// Dentro de sw.js
self.addEventListener('message', (evento) => {
  if (evento.data?.tipo === 'saltar-espera') self.skipWaiting();
});

/** Avisa a TODAS las pestañas controladas. */
async function avisarAClientes(mensaje) {
  const clientes = await self.clients.matchAll({ includeUncontrolled: true });
  for (const cliente of clientes) cliente.postMessage(mensaje);
}

// Abrir (o crear) una caché con nombre
const cache = await caches.open('nomada-shell-v1');

// Guardar: descarga y almacena
await cache.add('/css/estilos.css');
await cache.addAll(['/index.html', '/js/app.js', '/css/estilos.css']);

// Guardar una respuesta que ya tienes
await cache.put('/api/tareas', respuesta.clone());     // ← clone(), el cuerpo se lee una vez (07-02)

// Buscar
const guardada = await cache.match('/css/estilos.css');
const enCualquiera = await caches.match('/css/estilos.css');   // busca en TODAS las cachés

// Gestionar
await cache.delete('/js/viejo.js');
const nombres = await caches.keys();                   // ['nomada-shell-v1', 'nomada-datos-v1']
await caches.delete('nomada-shell-v0');

// sw.js
const VERSION = 'v3';                                   // ← súbela en cada despliegue
const CACHE_SHELL = `nomada-shell-${VERSION}`;

const RECURSOS_SHELL = [
  '/',                          // importante: la raíz, además del index.html
  '/index.html',
  '/offline.html',
  '/manifest.json',
  '/css/estilos.css',
  '/js/app.js',
  '/js/modelo/tarea.js',
  '/js/modelo/tablero.js',
  '/js/modelo/errores.js',
  '/js/datos/backlog.js',
  '/js/datos/repositorio-local.js',
  '/js/datos/api-tareas.js',
  '/js/datos/http.js',
  '/js/datos/tiempo-real.js',
  '/js/util/fechas.js',
  '/js/util/formato.js',
  '/js/util/tiempo.js',
  '/js/vista/dom.js',
  '/js/vista/tarjeta.js',
  '/js/vista/pintar.js',
  '/js/vista/tablero-vista.js',
  '/js/vista/eventos.js',
  '/js/vista/controlador.js',
  '/js/vista/formulario.js',
  '/iconos/icono-192.png',
  '/iconos/icono-512.png'
];

self.addEventListener('install', (evento) => {
  console.log(`[sw] Instalando ${VERSION}`);
  evento.waitUntil(
    caches.open(CACHE_SHELL)
      .then((cache) => cache.addAll(RECURSOS_SHELL))
      .then(() => console.log('[sw] App shell precacheado'))
  );
});

self.addEventListener('activate', (evento) => {
  console.log(`[sw] Activando ${VERSION}`);
  evento.waitUntil((async () => {
    const nombres = await caches.keys();

    await Promise.all(
      nombres
        .filter((nombre) => nombre.startsWith('nomada-') && !nombre.endsWith(VERSION))
        .map((nombre) => {
          console.log('[sw] Borrando caché antigua:', nombre);
          return caches.delete(nombre);
        })
    );

    await self.clients.claim();      // toma el control de las pestañas ya abiertas
  })());
});

/** Cache first: para lo que no cambia dentro de una misma versión. */
async function cacheFirst(peticion) {
  const guardada = await caches.match(peticion);
  if (guardada) return guardada;

  const respuesta = await fetch(peticion);
  if (respuesta.ok) {
    const cache = await caches.open(CACHE_SHELL);
    cache.put(peticion, respuesta.clone());       // clone: el original se devuelve
  }
  return respuesta;
}

/** Network first: para datos, con la caché como red de seguridad. */
async function networkFirst(peticion, nombreCache = CACHE_DATOS) {
  try {
    const respuesta = await fetch(peticion);
    if (respuesta.ok) {
      const cache = await caches.open(nombreCache);
      cache.put(peticion, respuesta.clone());
    }
    return respuesta;
  } catch {
    const guardada = await caches.match(peticion);
    if (guardada) {
      // Marcamos la respuesta para que la interfaz pueda avisar de que es antigua
      const cabeceras = new Headers(guardada.headers);
      cabeceras.set('X-Desde-Cache', 'true');
      return new Response(guardada.body, { status: 200, headers: cabeceras });
    }
    throw new Error('Sin red y sin copia en caché');
  }
}

/** Stale-while-revalidate: lo mejor de los dos mundos para datos poco críticos. */
async function staleWhileRevalidate(peticion, nombreCache = CACHE_DATOS) {
  const cache = await caches.open(nombreCache);
  const guardada = await cache.match(peticion);

  const actualizando = fetch(peticion)
    .then((respuesta) => {
      if (respuesta.ok) cache.put(peticion, respuesta.clone());
      return respuesta;
    })
    .catch(() => null);                            // sin red: no pasa nada, ya devolvimos la caché

  return guardada ?? await actualizando;           // ← devuelve YA lo guardado si lo hay
}

self.addEventListener('fetch', (evento) => {
  const peticion = evento.request;
  const url = new URL(peticion.url);

  // 1 · Solo GET: nunca interceptes escrituras
  if (peticion.method !== 'GET') return;                    // sin respondWith: va a la red normal

  // 2 · Solo nuestro origen (y lo que decidamos permitir)
  if (url.origin !== self.location.origin && !esApiPermitida(url)) return;

  // 3 · Navegaciones (el usuario abre o recarga la página)
  if (peticion.mode === 'navigate') {
    evento.respondWith(manejarNavegacion(peticion));
    return;
  }

  // 4 · Llamadas a la API: network first
  if (url.pathname.startsWith('/api/') || esApiPermitida(url)) {
    evento.respondWith(networkFirst(peticion));
    return;
  }

  // 5 · Todo lo demás (CSS, JS, imágenes): cache first
  evento.respondWith(cacheFirst(peticion));
});

async function manejarNavegacion(peticion) {
  try {
    return await fetch(peticion);                    // network first: siempre el HTML más fresco
  } catch {
    const guardada = await caches.match('/index.html');
    return guardada ?? await caches.match('/offline.html');
  }
}

<!-- offline.html — autónomo: no puede depender de nada que no esté cacheado -->
<main class="offline">
  <h1>Sin conexión</h1>
  <p>Nómada Tareas no puede contactar con el servidor ahora mismo.</p>
  <p>Tus cambios se están guardando en el dispositivo y se enviarán en cuanto vuelva la conexión.</p>
  <button type="button" onclick="location.reload()">Reintentar</button>
</main>

// js/app.js
function actualizarConectividad() {
  const enLinea = navigator.onLine;
  $('#estado-red').textContent = enLinea ? '' : 'Sin conexión — trabajando en local';
  $('#estado-red').hidden = enLinea;
  document.body.classList.toggle('sin-conexion', !enLinea);
}

window.addEventListener('online',  () => { actualizarConectividad(); sincronizarPendientes(); });
window.addEventListener('offline', actualizarConectividad);
actualizarConectividad();

// js/datos/cola-pendientes.js (en la PÁGINA, no en el worker)
const BD = 'nomada-pendientes';
const ALMACEN = 'cambios';

function abrir() {
  return new Promise((resolver, rechazar) => {
    const solicitud = indexedDB.open(BD, 1);
    solicitud.onupgradeneeded = () => {
      solicitud.result.createObjectStore(ALMACEN, { keyPath: 'id', autoIncrement: true });
    };
    solicitud.onsuccess = () => resolver(solicitud.result);
    solicitud.onerror = () => rechazar(solicitud.error);
  });
}

export async function encolar(cambio) {
  const bd = await abrir();
  const tx = bd.transaction(ALMACEN, 'readwrite');
  tx.objectStore(ALMACEN).add({ ...cambio, ts: Date.now() });
  return new Promise((r) => { tx.oncomplete = r; });
}

export async function leerTodos() {
  const bd = await abrir();
  return new Promise((resolver) => {
    const solicitud = bd.transaction(ALMACEN).objectStore(ALMACEN).getAll();
    solicitud.onsuccess = () => resolver(solicitud.result);
  });
}

export async function eliminar(id) {
  const bd = await abrir();
  bd.transaction(ALMACEN, 'readwrite').objectStore(ALMACEN).delete(id);
}

// js/app.js — envía lo acumulado cuando vuelve la red
export async function sincronizarPendientes() {
  const pendientes = await leerTodos();
  if (pendientes.length === 0) return;

  vista.avisar(`Enviando ${pendientes.length} cambios pendientes…`);

  for (const cambio of pendientes) {
    try {
      await api.actualizarTarea(cambio.id, cambio.datos);   // con reintentos de 07-03
      await eliminar(cambio.claveCola);
    } catch (error) {
      if (!error.reintentable) await eliminar(cambio.claveCola);   // no insistas con un 400
      break;                                                       // el resto, en el próximo intento
    }
  }
  vista.avisar('Sincronización completada.');
}

// Desde la página
const registro = await navigator.serviceWorker.ready;
if ('sync' in registro) await registro.sync.register('enviar-cambios');

// Dentro de sw.js
self.addEventListener('sync', (evento) => {
  if (evento.tag === 'enviar-cambios') evento.waitUntil(enviarCambiosPendientes());
});

{
  "name": "Nómada Tareas — Taller Nómada",
  "short_name": "Nómada",
  "description": "Gestión de tareas del taller y el coworking",
  "start_url": "/?origen=pwa",
  "scope": "/",
  "display": "standalone",
  "orientation": "any",
  "background_color": "#faf7f2",
  "theme_color": "#2b6b5b",
  "lang": "es",
  "dir": "ltr",
  "icons": [
    { "src": "/iconos/icono-192.png", "sizes": "192x192", "type": "image/png" },
    { "src": "/iconos/icono-512.png", "sizes": "512x512", "type": "image/png" },
    { "src": "/iconos/icono-mascara.png", "sizes": "512x512", "type": "image/png", "purpose": "maskable" }
  ],
  "shortcuts": [
    { "name": "Nueva tarea", "url": "/?accion=nueva", "description": "Crear una tarea" }
  ]
}

<!-- index.html, dentro de <head> -->
<link rel="manifest" href="/manifest.json">
<meta name="theme-color" content="#2b6b5b">
<link rel="apple-touch-icon" href="/iconos/icono-192.png">

let promesaInstalacion = null;

window.addEventListener('beforeinstallprompt', (evento) => {
  evento.preventDefault();                       // ← evita el aviso automático del navegador
  promesaInstalacion = evento;
  $('#instalar').hidden = false;                 // muestra TU botón, en TU momento
});

$('#instalar').addEventListener('click', async () => {
  if (promesaInstalacion === null) return;

  promesaInstalacion.prompt();
  const { outcome } = await promesaInstalacion.userChoice;
  console.log('[nomada] Instalación:', outcome);       // 'accepted' | 'dismissed'

  promesaInstalacion = null;                     // el evento es de un solo uso
  $('#instalar').hidden = true;
});

window.addEventListener('appinstalled', () => {
  $('#instalar').hidden = true;
  console.log('[nomada] Instalada');
});

// sw.js
self.addEventListener('install', (evento) => {
  evento.waitUntil(caches.open(CACHE_SHELL).then((c) => c.addAll(RECURSOS_SHELL)));
  // ← NO llamamos a skipWaiting() aquí: esperamos a que el usuario acepte
});

self.addEventListener('message', (evento) => {
  if (evento.data?.tipo === 'saltar-espera') self.skipWaiting();
});

// js/app.js
const registro = await navigator.serviceWorker.register('/sw.js');

// 1 · Detectar que hay un worker nuevo esperando
registro.addEventListener('updatefound', () => {
  const nuevo = registro.installing;

  nuevo.addEventListener('statechange', () => {
    // 'installed' + hay un controlador = es una ACTUALIZACIÓN, no la primera instalación
    if (nuevo.state === 'installed' && navigator.serviceWorker.controller) {
      mostrarAvisoDeActualizacion(nuevo);
    }
  });
});

function mostrarAvisoDeActualizacion(trabajadorNuevo) {
  $('#aviso-version').hidden = false;
  $('#aviso-version-actualizar').addEventListener('click', () => {
    trabajadorNuevo.postMessage({ tipo: 'saltar-espera' });    // 2 · el usuario acepta
  }, { once: true });
}

// 3 · Cuando el nuevo toma el control, recargar UNA vez
let recargando = false;
navigator.serviceWorker.addEventListener('controllerchange', () => {
  if (recargando) return;                                       // ← guardia contra bucles
  recargando = true;
  window.location.reload();
});

// Comprobar si hay actualizaciones al volver a la pestaña
document.addEventListener('visibilitychange', () => {
  if (document.visibilityState === 'visible') registro.update();
});

const ENTORNO_LOCAL = ['localhost', '127.0.0.1'].includes(location.hostname);
if ('serviceWorker' in navigator && (!ENTORNO_LOCAL || location.search.includes('sw=1'))) {
  navigator.serviceWorker.register('/sw.js');
}

// 1 · La página pide permiso y se suscribe (con la clave pública VAPID del servidor)
const registro = await navigator.serviceWorker.ready;
const suscripcion = await registro.pushManager.subscribe({
  userVisibleOnly: true,
  applicationServerKey: CLAVE_PUBLICA_VAPID
});
await api.guardarSuscripcion(suscripcion);        // el servidor la necesita para enviarte cosas

// 2 · En sw.js: llega el push
self.addEventListener('push', (evento) => {
  const datos = evento.data?.json() ?? {};
  evento.waitUntil(self.registration.showNotification('Nómada Tareas', {
    body: datos.mensaje ?? 'Hay novedades en el tablero',
    icon: '/iconos/icono-192.png',
    data: { url: datos.url ?? '/' }
  }));
});

// 3 · El usuario pulsa la notificación
self.addEventListener('notificationclick', (evento) => {
  evento.notification.close();
  evento.waitUntil(self.clients.openWindow(evento.notification.data.url));
});

// sw.js — en la RAÍZ del sitio, para que el ámbito sea '/'
const VERSION = 'v3';
const CACHE_SHELL = `nomada-shell-${VERSION}`;
const CACHE_DATOS = `nomada-datos-${VERSION}`;
const API = 'http://localhost:3000';                     // en producción, la URL real de la API

const RECURSOS_SHELL = [
  '/', '/index.html', '/offline.html', '/manifest.json',
  '/css/estilos.css',
  '/js/app.js',
  '/js/modelo/tarea.js', '/js/modelo/tablero.js', '/js/modelo/errores.js',
  '/js/datos/backlog.js', '/js/datos/repositorio-local.js',
  '/js/datos/api-tareas.js', '/js/datos/http.js', '/js/datos/tiempo-real.js',
  '/js/util/fechas.js', '/js/util/formato.js', '/js/util/tiempo.js',
  '/js/vista/dom.js', '/js/vista/tarjeta.js', '/js/vista/pintar.js',
  '/js/vista/tablero-vista.js', '/js/vista/eventos.js',
  '/js/vista/controlador.js', '/js/vista/formulario.js',
  '/iconos/icono-192.png', '/iconos/icono-512.png'
];

// ══════════════════ INSTALACIÓN ══════════════════
self.addEventListener('install', (evento) => {
  console.log(`[sw] install ${VERSION}`);
  evento.waitUntil(
    caches.open(CACHE_SHELL).then((cache) => cache.addAll(RECURSOS_SHELL))
  );
  // Sin skipWaiting(): la actualización la decide el usuario (apartado 14)
});

// ══════════════════ ACTIVACIÓN ══════════════════
self.addEventListener('activate', (evento) => {
  console.log(`[sw] activate ${VERSION}`);
  evento.waitUntil((async () => {
    const nombres = await caches.keys();
    await Promise.all(
      nombres
        .filter((n) => n.startsWith('nomada-') && !n.endsWith(VERSION))
        .map((n) => caches.delete(n))
    );
    await self.clients.claim();
  })());
});

// ══════════════════ MENSAJES DESDE LA PÁGINA ══════════════════
self.addEventListener('message', (evento) => {
  if (evento.data?.tipo === 'saltar-espera') self.skipWaiting();
});

// ══════════════════ ESTRATEGIAS ══════════════════
async function cacheFirst(peticion) {
  const guardada = await caches.match(peticion);
  if (guardada) return guardada;
  try {
    const respuesta = await fetch(peticion);
    if (respuesta.ok) (await caches.open(CACHE_SHELL)).put(peticion, respuesta.clone());
    return respuesta;
  } catch (error) {
    if (peticion.destination === 'image') return caches.match('/iconos/icono-192.png');
    throw error;
  }
}

async function networkFirst(peticion) {
  try {
    const respuesta = await fetch(peticion);
    if (respuesta.ok) (await caches.open(CACHE_DATOS)).put(peticion, respuesta.clone());
    return respuesta;
  } catch {
    const guardada = await caches.match(peticion);
    if (guardada) {
      const cabeceras = new Headers(guardada.headers);
      cabeceras.set('X-Desde-Cache', 'true');            // la interfaz avisará de que es antiguo
      return new Response(guardada.body, { status: 200, headers: cabeceras });
    }
    // Respuesta JSON de respaldo: mejor que un error de red opaco
    return new Response(
      JSON.stringify({ error: 'sin-conexion', mensaje: 'Sin conexión y sin copia local.' }),
      { status: 503, headers: { 'Content-Type': 'application/json' } }
    );
  }
}

async function manejarNavegacion(peticion) {
  try {
    return await fetch(peticion);
  } catch {
    return (await caches.match('/index.html')) ?? (await caches.match('/offline.html'));
  }
}

// ══════════════════ INTERCEPCIÓN ══════════════════
self.addEventListener('fetch', (evento) => {
  const peticion = evento.request;
  const url = new URL(peticion.url);

  if (peticion.method !== 'GET') return;                 // nunca POST/PATCH/DELETE
  if (url.protocol.startsWith('ws')) return;             // el WebSocket de 07-04 va aparte

  if (peticion.mode === 'navigate') {
    evento.respondWith(manejarNavegacion(peticion));
    return;
  }
  if (url.origin === API) {
    evento.respondWith(networkFirst(peticion));
    return;
  }
  if (url.origin === self.location.origin) {
    evento.respondWith(cacheFirst(peticion));
  }
  // Cualquier otro origen: sin respondWith, va a la red tal cual
});

const CABECERA_FECHA = 'X-Cacheado-En';

async function guardarConMarca(nombreCache, peticion, respuesta) {
  const cabeceras = new Headers(respuesta.headers);
  cabeceras.set(CABECERA_FECHA, String(Date.now()));

  // Hay que reconstruir la Response: sus cabeceras son inmutables
  const conMarca = new Response(await respuesta.clone().blob(), {
    status: respuesta.status,
    statusText: respuesta.statusText,
    headers: cabeceras
  });

  const cache = await caches.open(nombreCache);
  await cache.put(peticion, conMarca);
}

function estaCaducada(respuesta, maxEdadMs) {
  const marca = Number(respuesta.headers.get(CABECERA_FECHA));
  if (!Number.isFinite(marca)) return true;          // sin marca: la tratamos como caducada
  return Date.now() - marca > maxEdadMs;
}

async function cacheConCaducidad(peticion, maxEdadMs = 3600000) {
  try {
    const respuesta = await fetch(peticion);
    if (respuesta.ok) await guardarConMarca(CACHE_DATOS, peticion, respuesta);
    return respuesta;
  } catch (error) {
    const cache = await caches.open(CACHE_DATOS);
    const guardada = await cache.match(peticion);

    if (!guardada) throw error;
    if (estaCaducada(guardada, maxEdadMs)) {
      await cache.delete(peticion);
      throw new Error('Copia en caché demasiado antigua');
    }
    return guardada;
  }
}

async function limpiarCaducados(nombreCache, maxEdadMs) {
  const cache = await caches.open(nombreCache);
  const peticiones = await cache.keys();

  await Promise.all(peticiones.map(async (peticion) => {
    const respuesta = await cache.match(peticion);
    if (respuesta && estaCaducada(respuesta, maxEdadMs)) await cache.delete(peticion);
  }));
}

const CLAVE_RECHAZO = 'nomada:actualizacion-rechazada';

export function vigilarActualizaciones(registro, { alHaberVersion }) {
  let recargando = false;

  function evaluar(trabajador) {
    if (trabajador.state !== 'installed') return;
    if (!navigator.serviceWorker.controller) return;        // primera instalación, no actualización
    if (sessionStorage.getItem(CLAVE_RECHAZO) === 'si') return;

    alHaberVersion(() => trabajador.postMessage({ tipo: 'saltar-espera' }));
  }

  // Un worker que ya estaba esperando cuando cargamos
  if (registro.waiting && navigator.serviceWorker.controller) evaluar(registro.waiting);

  registro.addEventListener('updatefound', () => {
    const nuevo = registro.installing;
    nuevo?.addEventListener('statechange', () => evaluar(nuevo));
  });

  navigator.serviceWorker.addEventListener('controllerchange', () => {
    if (recargando) return;                                 // ← guardia contra el bucle infinito
    recargando = true;
    window.location.reload();
  });

  document.addEventListener('visibilitychange', () => {
    if (document.visibilityState === 'visible') registro.update().catch(() => {});
  });
  setInterval(() => registro.update().catch(() => {}), 3600000);
}

<div id="aviso-version" role="status" aria-live="polite" hidden>
  <p>Hay una versión nueva de Nómada Tareas.</p>
  <button type="button" id="version-actualizar">Actualizar ahora</button>
  <button type="button" id="version-luego">Más tarde</button>
</div>

vigilarActualizaciones(registro, {
  alHaberVersion(aplicar) {
    const aviso = document.querySelector('#aviso-version');
    aviso.hidden = false;
    document.querySelector('#version-actualizar')
      .addEventListener('click', aplicar, { once: true });
    document.querySelector('#version-luego').addEventListener('click', () => {
      sessionStorage.setItem(CLAVE_RECHAZO, 'si');          // no insistir en esta sesión
      aviso.hidden = true;
    }, { once: true });
  }
});

// auditar-shell.js — ejecutar con: node auditar-shell.js
import { readdirSync, readFileSync, statSync } from 'node:fs';
import { join, relative } from 'node:path';

const RAIZ = process.cwd();

/** Recorre un directorio recursivamente devolviendo las rutas de los .js */
function listarJs(directorio) {
  const salida = [];
  for (const entrada of readdirSync(directorio)) {
    const ruta = join(directorio, entrada);
    if (statSync(ruta).isDirectory()) salida.push(...listarJs(ruta));
    else if (entrada.endsWith('.js')) salida.push('/' + relative(RAIZ, ruta).replaceAll('\\', '/'));
  }
  return salida;
}

const enDisco = new Set(listarJs(join(RAIZ, 'js')));

// Extrae las cadenas entre comillas de la lista RECURSOS_SHELL
const sw = readFileSync(join(RAIZ, 'sw.js'), 'utf8');
const bloque = sw.match(/const RECURSOS_SHELL\s*=\s*\[([\s\S]*?)\]/)?.[1] ?? '';
const declarados = new Set([...bloque.matchAll(/'([^']+)'/g)].map((m) => m[1]));

const faltan = [...enDisco].filter((r) => !declarados.has(r));
const sobran = [...declarados].filter((r) => r.startsWith('/js/') && !enDisco.has(r));

if (faltan.length) console.error('❌ Faltan en RECURSOS_SHELL:\n  ' + faltan.join('\n  '));
if (sobran.length) console.error('❌ Declarados pero inexistentes:\n  ' + sobran.join('\n  '));

if (faltan.length === 0 && sobran.length === 0) {
  console.log(`✅ La precaché está al día (${enDisco.size} módulos).`);
  process.exit(0);
}
process.exit(1);