From 3fb2b6939952f6711b257de769f08b69b9f09b21cc667abc30f3ade46e09cabf Mon Sep 17 00:00:00 2001
From: victor <victor@paravatti.com.br>
Date: Mon, 29 Jun 2026 21:44:53 -0300
Subject: [PATCH] =?UTF-8?q?Corre=C3=A7=C3=A3o=20do=20Mapa=20com=20otimiza?=
 =?UTF-8?q?=C3=A7=C3=A3o=20por=20demanda=20das=20fotos=20nos=20cards?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/views/operacoes_dashboard/index.html.erb | 35 +++++++++++---------
 1 file changed, 20 insertions(+), 15 deletions(-)

diff --git a/app/views/operacoes_dashboard/index.html.erb b/app/views/operacoes_dashboard/index.html.erb
index 980b811..a0fa2bb 100644
--- a/app/views/operacoes_dashboard/index.html.erb
+++ b/app/views/operacoes_dashboard/index.html.erb
@@ -404,28 +404,33 @@
           {}, { position: 'topright', collapsed: true }
         ).addTo(mapa);
 
-        // Camada de calor
+        // Camada de calor (leve — entra por padrão)
         const heatLayer = (heat.length && L.heatLayer)
           ? L.heatLayer(heat, { radius: 18, blur: 22, maxZoom: 14 }) : null;
 
-        // Camada de pontos (marcadores em balão com popup)
-        const marcadores = L.layerGroup();
-        pontos.forEach(function (p) {
-          L.marker([p.lat, p.lng], { icon: ICONE })
-            .bindPopup(popupHtml(p))
-            .addTo(marcadores);
-        });
+        // Camada de pontos: criada SOB DEMANDA (só na 1ª vez que abrir "Pontos").
+        // O popup é uma FUNÇÃO, então o HTML da foto só é montado/baixado quando
+        // o balão é clicado — nada de imagem é requisitado ao carregar o mapa.
+        let marcadores = null;
+        function construirMarcadores() {
+          if (marcadores) return marcadores;
+          marcadores = L.layerGroup();
+          pontos.forEach(function (p) {
+            L.marker([p.lat, p.lng], { icon: ICONE })
+              .bindPopup(function () { return popupHtml(p); }, { maxWidth: 260 })
+              .addTo(marcadores);
+          });
+          return marcadores;
+        }
 
         // Começa no Calor (cai para Pontos se não houver calor)
-        let atual = heatLayer || marcadores;
-        atual.addTo(mapa);
+        (heatLayer || construirMarcadores()).addTo(mapa);
 
         function mostrar(view) {
-          mapa.removeLayer(heatLayer || marcadores);
-          if (marcadores) mapa.removeLayer(marcadores);
-          if (heatLayer)  mapa.removeLayer(heatLayer);
-          if (view === 'pontos') { marcadores.addTo(mapa); }
-          else { (heatLayer || marcadores).addTo(mapa); }
+          if (heatLayer)   mapa.removeLayer(heatLayer);
+          if (marcadores)  mapa.removeLayer(marcadores);
+          if (view === 'pontos') { construirMarcadores().addTo(mapa); }
+          else { (heatLayer || construirMarcadores()).addTo(mapa); }
           box.querySelectorAll('.map-toggle button').forEach(function (b) {
             const on = b.dataset.view === view;
             b.classList.toggle('bg-orange-500', on);