// popup.js

function closePopup() {
  document.getElementById("popup-wrapper").style.display = "none";
}

document.addEventListener("DOMContentLoaded", function () {
  // Importar o HTML do popup
  fetch("https://robson-landing-page.vercel.app/popuphtml")
    .then((response) => response.text())
    .then((html) => {
      // Injetar o HTML do popup dentro do body do site hospedeiro
      document.body.insertAdjacentHTML("beforeend", html);
      localStorage.removeItem("popupClosed");

      document
        .querySelector("#popup-content .close-button")
        .addEventListener("click", closePopup);

      // Adicionar comportamento ao popup
      document.addEventListener("mouseleave", function (e) {
        if (!localStorage.getItem("popupClosed") && !localStorage.getItem("popupFilled")) {
          document.getElementById("popup-wrapper").style.display = "block";
          localStorage.setItem("popupClosed", "true");
        }
      });

      const tel = document.getElementById("phone"); // Seletor do campo de telefone

      tel.addEventListener("keypress", (e) => mascaraTelefone(e.target.value)); // Dispara quando digitado no campo
      tel.addEventListener("change", (e) => mascaraTelefone(e.target.value)); // Dispara quando autocompletado o campo

      const mascaraTelefone = (valor) => {
        valor = valor.replace(/\D/g, "");
        valor = valor.replace(/^(\d{2})(\d)/g, "($1) $2");
        valor = valor.replace(/(\d)(\d{4})$/, "$1-$2");
        tel.value = valor; // Insere o(s) valor(es) no campo
      };

      document
        .getElementById("popup-form")
        .addEventListener("submit", function (e) {
          e.preventDefault();

          // Obtendo os dados do formulário
          var formData = {
            nome: document.getElementById("name").value,
            email: document.getElementById("email").value,
            telefone: document.getElementById("phone").value,
            pretensao: document.getElementById("intention").value,
            source: "LP do Site Flip",
            mensagem: "Deixei meu contato no Site pelo PopUp"
          };

          // Convertendo os dados do formulário para JSON
          var jsonData = JSON.stringify(formData);

          // Enviando os dados para a API
          fetch("https://integracaolp.imobiliaria.eurekalabs.com.br/interests?clientId=89e92daa-f088-4861-bdbd-b26186ce50e7", {
            method: "POST",
            headers: {
              "Content-Type": "application/json",
            },
            body: jsonData,
          })
            .then((response) => {
              if (response.ok) {
                localStorage.setItem("popupClosed", "true");
                localStorage.setItem("popupFilled", "true")
                document.getElementById("popup-wrapper").style.display = "none";
                console.log("Dados enviados com sucesso!");
              } else {
                console.error("Erro ao enviar os dados para a API.");
              }
            })
            .catch((error) => {
              console.error("Erro ao enviar os dados para a API:", error);
            });
        });
    })
    .catch((error) =>
      console.error("Erro ao carregar o HTML do popup:", error)
    );
});