import {dic_edos} from './99_functions.js';

map.on("load", () => {

  if (map.getSource("edos")) return; // 🔐 protección

  map.addSource("edos", {
    type: "geojson",
    data: "/api/poligonos-edos",
    generateId: true
  });

  map.addLayer({
    id: "edos-fill",
    type: "fill",
    source: "edos",
    paint: { "fill-opacity": 0 }
  });

  map.addLayer({
    id: "edos-outline",
    type: "line",
    source: "edos",
    paint: {
      "line-color": [
        "case",
        ["boolean", ["feature-state", "hover"], false],
        "#9b2226",
        "#ffb703"
      ],
      "line-width": [
        "case",
        ["boolean", ["feature-state", "hover"], false],
        4,
        1.5
      ]
    }
  });

  let hoveredId = null;


map.on("mousemove", "edos-fill", e => {
    
    let id_entidad = e.features[0].properties.cve_ent;
    let nombreEstado = dic_edos[id_entidad] || "No identificado";


    // ACTUALIZACIÓN: Mostrar en el formulario
    const labelEstado = document.getElementById("nombre-estado-activo");
    if (labelEstado) {
        labelEstado.innerText = nombreEstado;
    }

    if (e.features.length) {
        if (hoveredId !== null) {
            map.setFeatureState({ source: "edos", id: hoveredId }, { hover: false });
        }
        hoveredId = e.features[0].id;
        map.setFeatureState({ source: "edos", id: hoveredId }, { hover: true });
        map.getCanvas().style.cursor = "pointer";
    }
});

// También es buena idea limpiar el texto cuando el mouse sale del mapa
map.on("mouseleave", "edos-fill", () => {
    if (hoveredId !== null) {
        map.setFeatureState({ source: "edos", id: hoveredId }, { hover: false });
    }
    
    // ACTUALIZACIÓN: Limpiar el nombre al salir
    const labelEstado = document.getElementById("nombre-estado-activo");
    if (labelEstado) {
        labelEstado.innerText = "Ninguno";
    }

    hoveredId = null;
    map.getCanvas().style.cursor = "";
});




});
