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

// ===============================
// 1. LÓGICA DE PINES UNITARIOS (FORMULARIO)
// ===============================
const allMarkers = [];

// 💡 DESCOMENTADA: Necesaria para que el validador funcione
function isValidCoord(value, min, max) {
  return !isNaN(value) && value >= min && value <= max;
}

function hasFourDecimals(value) {
  const s = value.toString();
  if (!s.includes('.')) return false;
  return s.split(".")[1].length >= 4;
}

document.getElementById("add-pin").addEventListener("click", () => {
  const labelInput = document.getElementById("pin-label");
  const latInput = document.getElementById("pin-lat");
  const lngInput = document.getElementById("pin-lng");

  const label = labelInput.value.trim();
  const lat = parseFloat(latInput.value);
  const lng = parseFloat(lngInput.value);

  // Validación unificada mejorada
  const isInvalid =
    !label ||
    !isValidCoord(lat, -90, 90) ||
    !isValidCoord(lng, -180, 180) ||
    !hasFourDecimals(latInput.value) ||
    !hasFourDecimals(lngInput.value);

  if (isInvalid) {
    showNotification("Todos los campos son obligatorios: Etiqueta, Lat/Lng válidas y mínimo 4 decimales.", "error");
    return;
  }

  // Si pasa la validación, procedemos:
  const newMarker = new maplibregl.Marker({ color: "#d32f2f" })
    .setLngLat([lng, lat])
    .setPopup(
      new maplibregl.Popup({ offset: 25 })
        .setHTML(`<strong>${label}</strong><br/>Lat: ${lat}<br/>Lng: ${lng}`)
    )
    .addTo(map);

  allMarkers.push(newMarker);

  map.flyTo({
    center: [lng, lat],
    zoom: 12,
    essential: true
  });

  // Limpiar campos
  labelInput.value = "";
  latInput.value = "";
  lngInput.value = "";

  showNotification("Marcador agregado con éxito", "success");

 
});

