// Descripción de servicios para modal
const descripcionServicios = {
  camara: {
    titulo: "Cámaras de Seguridad",
    descripcion:
      "Implementamos sistemas de cámaras de última generación para monitorear y proteger tus instalaciones las 24 horas del día.",
  },
  incendio: {
    titulo: "Alarma contra Incendios",
    descripcion:
      "Sistemas de alarma y detección temprana para prevenir y alertar ante cualquier riesgo de incendio, garantizando la seguridad de tus activos.",
  },
  intercom: {
    titulo: "Intercomunicadores",
    descripcion:
      "Soluciones de intercomunicación industrial y residencial para mejorar la comunicación y el control de accesos.",
  },
};

// Modal elementos
const modal = document.getElementById("modal");
const modalTitle = document.getElementById("modal-title");
const modalDesc = document.getElementById("modal-description");
const closeButton = document.querySelector(".close-button");
const modalImage = document.getElementById("modal-image");

// Abrir modal al hacer clic en servicio
document.querySelectorAll(".servicio-card").forEach((card) => {
  card.addEventListener("click", () => {
    const servicio = card.getAttribute("data-servicio");
    modalTitle.textContent = descripcionServicios[servicio].titulo;
    modalDesc.textContent = descripcionServicios[servicio].descripcion;
    modal.classList.add("show");
    modal.setAttribute("aria-hidden", "false");
  });
  card.addEventListener("keydown", (e) => {
    if (e.key === "Enter" || e.key === " ") {
      e.preventDefault();
      card.click();
    }
  });
});

// Cerrar modal con botón
closeButton.addEventListener("click", () => {
  modal.classList.remove("show");
  modal.setAttribute("aria-hidden", "true");
});

// Cerrar modal al hacer clic fuera del contenido
modal.addEventListener("click", (e) => {
  if (e.target === modal) {
    modal.classList.remove("show");
    modal.setAttribute("aria-hidden", "true");
  }
});

// Hero slider imágenes (asegúrate de tener las imágenes en /img)
const imagesHero = [
  "img/fondo1.jpg",
  "img/fondo2.jpg",
  "img/fondo3.jpg",
];

const heroSlider = document.querySelector(".hero-slider");
let currentIndex = 0;

function cambiarImagen() {
  heroSlider.style.backgroundImage = `url('${imagesHero[currentIndex]}')`;
  currentIndex = (currentIndex + 1) % imagesHero.length;
}

cambiarImagen();
setInterval(cambiarImagen, 6000);

// WhatsApp Bot toggle chat
const whatsappIcon = document.getElementById("whatsapp-icon");
const whatsappChat = document.getElementById("whatsapp-chat");
const whatsappInput = document.getElementById("whatsapp-input");
const whatsappSend = document.getElementById("whatsapp-send");

whatsappIcon.addEventListener("click", () => {
  if (whatsappChat.style.display === "flex") {
    whatsappChat.style.display = "none";
    whatsappIcon.setAttribute("aria-pressed", "false");
    whatsappChat.setAttribute("aria-hidden", "true");
  } else {
    whatsappChat.style.display = "flex";
    whatsappIcon.setAttribute("aria-pressed", "true");
    whatsappChat.setAttribute("aria-hidden", "false");
    whatsappInput.focus();
  }
});
whatsappIcon.addEventListener("keydown", (e) => {
  if (e.key === "Enter" || e.key === " ") {
    e.preventDefault();
    whatsappIcon.click();
  }
});

// Función para responder automáticamente
function responderBot(mensaje) {
  mensaje = mensaje.toLowerCase();

  if (mensaje.includes("hola")) return "¡Hola! ¿En qué podemos ayudarte?";
  if (mensaje.includes("cámara") || mensaje.includes("camara")) return "Contamos con cámaras de seguridad analógicas, digitales e IP.";
  if (mensaje.includes("intercomunicador") || mensaje.includes("intercom")) return "Tenemos intercomunicadores para hogares y empresas.";
  if (mensaje.includes("incendio")) return "Ofrecemos alarmas contra incendios con certificaciones.";
  if (mensaje.includes("precio") || mensaje.includes("costo")) return "Puedes llamarnos al 954843578 para una cotización personalizada.";

  return "Gracias por tu mensaje. En breve un asesor se comunicará contigo.";
}

// Enviar mensaje y mostrar en el chat
whatsappSend.addEventListener("click", () => {
  const mensajeUsuario = whatsappInput.value.trim();
  if (!mensajeUsuario) {
    alert("Por favor, ingresa un mensaje para iniciar la conversación.");
    whatsappInput.focus();
    return;
  }

  // Crear mensaje del usuario
  const userMsg = document.createElement("p");
  userMsg.innerHTML = `<strong>Tú:</strong> ${mensajeUsuario}`;
  whatsappChat.appendChild(userMsg);

  // Generar y mostrar respuesta del bot
  const respuesta = responderBot(mensajeUsuario);
  setTimeout(() => {
    const botMsg = document.createElement("p");
    botMsg.innerHTML = `<strong>Bot:</strong> ${respuesta}`;
    whatsappChat.appendChild(botMsg);
  }, 800); // Simula una pequeña espera de respuesta

  whatsappInput.value = "";
});

// Descripciones de imágenes de galería
const descripcionGaleria = {
  img1: {
    titulo: "Instalación de cámaras en planta industrial",
    descripcion: "Sistema de videovigilancia implementado en una planta con cobertura de 360° en zonas críticas.",
  },
  img2: {
    titulo: "Control de acceso con intercomunicador",
    descripcion: "Acceso seguro con intercomunicadores y lector biométrico en edificios corporativos.",
  },
  img3: {
    titulo: "Sistema contra incendios en almacén",
    descripcion: "Instalación de sensores térmicos y detectores de humo en áreas de alto riesgo.",
  },
  img4: {
    titulo: "Cerco eléctrico en perímetro de fábrica",
    descripcion: "Protección perimetral de instalaciones con sensores y alarmas de intrusión.",
  },
  img5: {
    titulo: "Cableado estructurado en oficinas",
    descripcion: "Infraestructura de red profesional para garantizar conectividad eficiente y segura.",
  },
  img6: {
    titulo: "Sala de monitoreo centralizado",
    descripcion: "Centro de control con visualización en tiempo real de todos los sistemas de seguridad.",
  },
};

// Funcionalidad para abrir modal con imágenes
document.querySelectorAll(".galeria-item").forEach((item) => {
  item.addEventListener("click", () => {
    const key = item.getAttribute("data-img");
    modalImage.src = `img/${key}.jpeg`; // O usa .jpg según el nombre real
    modalImage.alt = descripcionGaleria[key].titulo;
    modalTitle.textContent = descripcionGaleria[key].titulo;
    modalDesc.textContent = descripcionGaleria[key].descripcion;
    modal.classList.add("show");
    modal.setAttribute("aria-hidden", "false");
  });

  item.addEventListener("keydown", (e) => {
    if (e.key === "Enter" || e.key === " ") {
      e.preventDefault();
      item.click();
    }
  });
});
