/* Mappa dei posti ([informations]) — port vanilla di map-new.js (agosto 2026), niente jQuery.
   Gestisce il selettore "Seleziona sede:" per i posti con piu' sedi: cambio descrizione,
   punti vicini, link "ingrandisci" e "apri mappa", hash nell'URL. */
document.addEventListener("DOMContentLoaded", function () {
  "use strict";

  document.querySelectorAll(".inform-google-map").forEach(function (mapWrapper) {

    var map = mapWrapper.querySelector(".map");
    if (!map) return;
    var additionalMapEls = Array.prototype.slice.call(document.querySelectorAll(".additional-map"));
    var mapDescription = document.querySelector(".map-description-wrapper"); // ce n'e' al massimo una per pagina
    var near = mapWrapper.querySelector(".map-near-wrapper");
    var nearHidden = mapWrapper.querySelector(".map-near-wrapper-hidden");
    var loadingNear = mapWrapper.querySelector(".js-loading-near");

    var postID = map.dataset.postId;
    var mapName = map.dataset.name;
    var showMap = String(map.dataset.showMap) === "1";
    var centerLat = map.dataset.centerLat;
    var centerLng = map.dataset.centerLng;
    var initialized = false;

    var hide = function () {
      map.style.display = "none";
      if (near) near.style.display = "none";
    };

    var show = function () {
      if (near) near.style.display = "";

      if (initialized) {
        map.style.display = "";
      } else {
        if (near) {
          near.querySelectorAll("img").forEach(function (img) {
            if (img.dataset.src) img.src = img.dataset.src;
          });
        }
        if (loadingNear) loadingNear.style.display = "";
        initMap();
      }
    };

    function initMap() {
      initialized = true;

      var mainMap = {
        postID: postID,
        lat: centerLat,
        long: centerLng,
        name: mapName,
        descHtml: mapDescription ? mapDescription.innerHTML : "",
        nearHtml: nearHidden ? nearHidden.innerHTML : ""
      };

      var additionalMaps = [mainMap].concat(additionalMapEls.map(function (el) {
        var desc = el.querySelector(".js-map-desc");
        var nearEl = el.querySelector(".js-map-near");
        return {
          postID: el.dataset.postId,
          lat: el.dataset.lat,
          long: el.dataset.long,
          name: el.dataset.name,
          descHtml: desc ? desc.innerHTML : "",
          nearHtml: nearEl ? nearEl.innerHTML : ""
        };
      }));

      // Il menu a tendina compare solo se ci sono sedi aggiuntive
      if (additionalMaps.length > 1 && mapDescription) {
        var nearWrapper = document.createElement("div");
        nearWrapper.className = "additional-map-near-wrapper";
        mapWrapper.appendChild(nearWrapper);

        var select = document.createElement("select");
        select.className = "map-place-select";
        select.innerHTML = additionalMaps.reduce(function (sum, a, ind) {
          return sum + '<option value="' + ind + '">' + a.name + "</option>";
        }, "");

        var isInitDispatch = false;

        select.addEventListener("change", function () {
          var isInitTrigger = isInitDispatch;
          var selectedPoint = additionalMaps[this.value];
          nearWrapper.innerHTML = "";
          mapDescription.innerHTML = "";
          if (!selectedPoint) return;

          mapDescription.innerHTML = selectedPoint.descHtml;
          nearWrapper.innerHTML = selectedPoint.nearHtml;

          var enlargeButton = mapWrapper.querySelector(".map-enlarge__button");
          if (enlargeButton && enlargeButton.getAttribute("href")) {
            enlargeButton.setAttribute("href", enlargeButton.getAttribute("href").replace(/#[0-9.]+,[0-9.]+,/, "#" + selectedPoint.lat + "," + selectedPoint.long + ","));
          }

          var apriMappaBtn = mapWrapper.querySelector(".js-apri-mappa");
          if (apriMappaBtn) {
            var tpl = apriMappaBtn.getAttribute("data-template");
            var zoom = apriMappaBtn.getAttribute("data-zoom") || "17";
            if (tpl) {
              var newHref = tpl.replace("{lat}", selectedPoint.lat)
                               .replace("{long}", selectedPoint.long)
                               .replace("{zoom}", zoom);
              apriMappaBtn.setAttribute("href", newHref);
              apriMappaBtn.setAttribute("data-lat", selectedPoint.lat);
              apriMappaBtn.setAttribute("data-long", selectedPoint.long);
            }
          }

          // Aggiorna l'hash nell'URL, ma NON al trigger automatico iniziale
          if (!isInitTrigger) {
            var tempDiv = document.createElement("div");
            tempDiv.innerHTML = selectedPoint.descHtml;
            var withDataId = tempDiv.querySelector("p[data-id]");
            var withId = tempDiv.querySelector("p[id]");
            var newHash = (withDataId && withDataId.getAttribute("data-id")) || (withId && withId.id);

            if (newHash && history.replaceState) {
              history.replaceState(null, null, "#" + newHash);
            }
          }
        });

        var seleziona = document.createElement("h3");
        seleziona.className = "map-seleziona-text";
        seleziona.textContent = "Seleziona sede:";
        mapDescription.parentNode.insertBefore(seleziona, mapDescription);
        mapDescription.parentNode.insertBefore(select, mapDescription);

        // Pre-selezione della sede dall'hash nell'URL
        if (window.location.hash) {
          var hashStr = window.location.hash.substring(1);
          var targetIndex = 0;
          for (var i = 0; i < additionalMaps.length; i++) {
            if ((additionalMaps[i].descHtml || "").indexOf(hashStr) !== -1) {
              targetIndex = i;
              break;
            }
          }
          select.value = targetIndex;
        }

        // Trigger iniziale: evento nativo che raggiunge anche i listener delegati
        // (es. il nome della mappa nel footer), con il flag "init" attivo.
        isInitDispatch = true;
        select.dispatchEvent(new Event("change", { bubbles: true }));
        isInitDispatch = false;
      }
    }

    if (showMap) show();
    else hide();
  });
});