'; } function pintarGrilla(id, lista, small){ var el = document.getElementById(id); if(!lista || !lista.length){ el.innerHTML = '
Sin datos disponibles por el momento.
'; return; } el.innerHTML = lista.map(function(e){ return tarjeta(e, small); }).join(''); } function pintarResumen(lista){ var el = document.getElementById('rd-summary-list'); if(!lista || !lista.length){ el.innerHTML = '
Sin datos.
'; return; } el.innerHTML = lista.map(function(e){ var cls = estadoClase(e.estado); var color = cls==='crece'?'var(--crece)':cls==='baja'?'var(--baja)':cls==='alerta'?'var(--alerta)':'var(--estable)'; return '
'+e.nombre+''+(e.altura!=null?e.altura+' m':'—')+'
'; }).join(''); } function pintarMapa(lista){ var g = document.getElementById('rd-pins'); var tooltip = document.getElementById('rd-tooltip'); if(!g) return; g.innerHTML = ''; (lista||[]).forEach(function(e){ var pos = MAP_POS[(e.nombre||'').toUpperCase()]; if(!pos) return; var cls = estadoClase(e.estado); var color = cls==='crece'?'var(--crece)':cls==='baja'?'var(--baja)':cls==='alerta'?'var(--alerta)':'var(--estable)'; var ns = "http://www.w3.org/2000/svg"; var pin = document.createElementNS(ns,'g'); pin.setAttribute('class','rd-pin'); pin.setAttribute('transform','translate('+pos.x+','+pos.y+')'); var ring = document.createElementNS(ns,'circle'); ring.setAttribute('class','rd-ring'); ring.setAttribute('r','46'); ring.setAttribute('fill', color); ring.setAttribute('opacity','0.45'); pin.appendChild(ring); var icon = document.createElementNS(ns,'image'); icon.setAttributeNS('http://www.w3.org/1999/xlink','href', RD_ICON_B64); icon.setAttribute('href', RD_ICON_B64); icon.setAttribute('x','-42'); icon.setAttribute('y','-42'); icon.setAttribute('width','84'); icon.setAttribute('height','84'); icon.setAttribute('class','rd-icon-pin'); pin.appendChild(icon); var estadoDot = document.createElementNS(ns,'circle'); estadoDot.setAttribute('cx','30'); estadoDot.setAttribute('cy','-30'); estadoDot.setAttribute('r','12'); estadoDot.setAttribute('fill', color); estadoDot.setAttribute('stroke','#fff'); estadoDot.setAttribute('stroke-width','3'); pin.appendChild(estadoDot); var label = document.createElementNS(ns,'text'); label.setAttribute('x','54'); label.setAttribute('y','8'); label.setAttribute('font-size','34'); label.textContent = e.nombre; pin.appendChild(label); pin.addEventListener('mouseenter', function(evt){ tooltip.innerHTML = '
'+e.nombre+' ('+e.rio+')
' + (e.altura!=null ? e.altura+' m — '+(e.estado||'') : 'Sin dato') + '
Actualizado: '+fmtFecha(e.actualizado)+''; tooltip.style.opacity = '1'; tooltip.style.left = (pos.x / 2123.9 * 100) + '%'; tooltip.style.top = (pos.y / 2339.7 * 100) + '%'; }); pin.addEventListener('mouseleave', function(){ tooltip.style.opacity = '0'; }); g.appendChild(pin); }); } function cargar(){ fetch(PROXY_URL, {cache:'no-store'}) .then(function(r){ return r.json(); }) .then(function(data){ pintarGrilla('rd-grid-prefectura', data.prefectura, false); pintarGrilla('rd-grid-ina', data.ina, true); pintarResumen((data.prefectura||[]).concat(data.ina||[])); pintarMapa((data.prefectura||[]).concat(data.ina||[])); document.getElementById('rd-global-updated').textContent = 'Actualizado ' + fmtFecha(data.generado_en || new Date().toISOString()); }) .catch(function(err){ console.error('Error cargando rios-proxy:', err); document.getElementById('rd-grid-prefectura').innerHTML = '
No se pudo conectar con el proxy. Revisá PROXY_URL en el script.
'; document.getElementById('rd-grid-ina').innerHTML = ''; document.getElementById('rd-summary-list').innerHTML = ''; document.getElementById('rd-global-updated').textContent = 'Sin conexión con la fuente de datos'; }); } cargar(); setInterval(cargar, 15 * 60 * 1000); // refresca cada 15 minutos })();