11

js/mapGlobal.js

@@ -1,5 +1,5 @@
 // ===============================
-// MAPPA GLOBALE (marker personalizzati + bottom sheet)
+// MAPPA GLOBALE (marker personalizzati + bottom sheet + cluster intelligenti)
 // ===============================
 
 document.getElementById("openMapBtn").addEventListener("click", openGlobalMap);
@@ -29,13 +29,88 @@ function openGlobalMap() {
       maxZoom: 19
     }).addTo(globalMap);
 
+    // ===============================
+    // FUNZIONE: calcola luminosità miniatura
+    // ===============================
+    function getBrightness(photo) {
+      return new Promise(resolve => {
+        const img = new Image();
+        img.crossOrigin = "anonymous";
+        img.src = `https://prova.patachina.it/${photo.thub1}`;
+
+        img.onload = () => {
+          const canvas = document.createElement("canvas");
+          canvas.width = 20;
+          canvas.height = 20;
+          const ctx = canvas.getContext("2d");
+
+          ctx.drawImage(img, 0, 0, 20, 20);
+          const data = ctx.getImageData(0, 0, 20, 20).data;
+
+          let total = 0;
+          for (let i = 0; i < data.length; i += 4) {
+            total += (data[i] + data[i + 1] + data[i + 2]) / 3;
+          }
+
+          resolve(total / (20 * 20));
+        };
+
+        img.onerror = () => resolve(0);
+      });
+    }
+
+    // ===============================
+    // FUNZIONE: sceglie la foto migliore (recenti + luminosa)
+    // ===============================
+    async function chooseBestRepresentative(photos) {
+      // Ordina per data
+      photos.sort((a, b) => new Date(b.taken_at) - new Date(a.taken_at));
+
+      // Prendi le 3 più recenti
+      const candidates = photos.slice(0, 3);
+
+      // Calcola luminosità
+      const brightnessValues = await Promise.all(
+        candidates.map(p => getBrightness(p))
+      );
+
+      // Trova la più luminosa
+      let bestIndex = 0;
+      let bestValue = brightnessValues[0];
+
+      for (let i = 1; i < brightnessValues.length; i++) {
+        if (brightnessValues[i] > bestValue) {
+          bestValue = brightnessValues[i];
+          bestIndex = i;
+        }
+      }
+
+      return candidates[bestIndex];
+    }
+
     // ===============================
     // CLUSTER PERSONALIZZATI
     // ===============================
     globalMarkers = L.markerClusterGroup({
       iconCreateFunction: function (cluster) {
         const markers = cluster.getAllChildMarkers();
-        const representative = markers[0].photoData;
+        const photos = markers.map(m => m.photoData);
+
+        // Mostra SUBITO la più recente (velocissimo)
+        photos.sort((a, b) => new Date(b.taken_at) - new Date(a.taken_at));
+        const representative = photos[0];
+
+        // Aggiorna in background con la più luminosa
+        chooseBestRepresentative(photos).then(best => {
+          const icon = cluster._icon;
+          if (!icon) return;
+
+          const back = icon.querySelector(".cluster-back");
+          const front = icon.querySelector(".cluster-front");
+
+          if (back) back.src = `https://prova.patachina.it/${best.thub1}`;
+          if (front) front.src = `https://prova.patachina.it/${best.thub1}`;
+        });
 
         return L.divIcon({
           html: `
@@ -82,10 +157,8 @@ function openGlobalMap() {
         icon: markerIcon
       });
 
-      // Salviamo i dati della foto nel marker
       marker.photoData = photo;
 
-      // CLICK SU MARKER → BOTTOM SHEET CON 1 FOTO
       marker.on("click", () => {
         openBottomSheet([photo]);
       });