document.addEventListener('DOMContentLoaded', function() {
    // Charger les indicatifs de pays depuis un fichier local
    fetch('/pays.json')
        .then(response => response.json())
        .then(data => {
            const select = document.getElementById('country-code');
            data.data.forEach(country => {
                const option = document.createElement('option');
                option.value = country.indicatif;
                option.textContent = `${country.name_fr} (+${country.indicatif})`;
                select.appendChild(option);
            });
        })
        .catch(error => console.error('Erreur chargement JSON:', error));

    // Gestion du formulaire
    document.getElementById('modal-form').addEventListener('submit', function(e) {
        e.preventDefault();
        
        const countryCode = document.getElementById('country-code').value;
        const phoneNumber = document.getElementById('modal-phone').value;
        const ticketId = document.getElementById('modal-ticket-id').value;
        
        if (!countryCode || !phoneNumber) {
            alert('Veuillez sélectionner un pays et entrer un numéro');
            return;
        }

        const fullPhone = `+${countryCode}${phoneNumber}`;
        console.log('Numéro complet:', fullPhone);
        
        // Traitement du numéro ici
    });
});

let selectedItemId = null;

function openAuthModal(itemId) {
    selectedItemId = itemId; // On sauvegarde l'itemId
    const modal = document.getElementById('auth-choice-modal');
    modal.classList.remove('hidden');
    modal.classList.add('flex');
}


function selectAuthMethod() {
    closeAuthModal();
    if (selectedItemId !== null) {
        openModal(selectedItemId); // Réutilise l'itemId sauvegardé
      }
}

function closeModalConnexion() {
    const modal = document.getElementById('auth-choix-modal');
    modal.classList.remove('flex');
    modal.classList.add('hidden');
}




function loginWithGoogle() {
    closeAuthModal();
    if (selectedItemId !== null) {
        const googleLoginUrl = `/login/google/${selectedItemId}`;
        window.location.href = googleLoginUrl;
    } else {
        alert("Veuillez sélectionner un ticket avant de vous connecter.");
    }
}



function loginWithFacebook() {
    closeAuthModal();
    if (selectedItemId !== null) {
        const facebookLoginUrl = `/auth/facebook/${selectedItemId}`;
        window.location.href = facebookLoginUrl;
    } else {
        alert("Veuillez sélectionner un ticket avant de vous connecter.");
    }
}





function closeAuthModal() {
    const modal = document.getElementById('auth-choice-modal');
    modal.classList.remove('flex');
    modal.classList.add('hidden');
}



function closeModal() {
    document.getElementById('global-modal').classList.add('hidden');
}


function openModal(itemId) {
    const modal = document.getElementById('global-modal');
    const phoneInput = document.getElementById('modal-phone');
    const hiddenInput = document.getElementById('modal-ticket-id');

    // Réinitialise les champs
    phoneInput.value = '';
    hiddenInput.value = itemId;

    // Affiche la modale (centrée)
    modal.classList.remove('hidden');
    modal.classList.add('flex');
    // Optionnel : empêcher le scroll du body
   //document.body.style.overflow = 'hidden';
}




function closeModal() {
    const modal = document.getElementById('global-modal');
    modal.classList.add('hidden');
    modal.classList.remove('flex');
   // //modal.style.display = 'none';
}


function closeModalValidateOTP() {
	document.getElementById('otp-modal').style.display = 'none';
}

let selectedPhone = null;

// Le reste est du JS normal
const SMSHandler = {
    send: async function(phoneNumber, sender = 'GuichetBi') {
        const params = new URLSearchParams();
		params.append('PhoneNumber', phoneNumber);
		params.append('Sender', sender);
		selectedPhone = phoneNumber;
		alert(phoneNumber);
		alert(sender);
 
const response = await fetch('/send-sms', {
    method: 'POST',
    headers: {
        'Content-Type': 'application/x-www-form-urlencoded',
        'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content')
    },
    body: params
});

	//alert(response.body);
 
 //alert(response.json());
//const data = await response.json();
//alert(data);
//return data;
//console.log(data);
    }
};

// Fonction pour démarrer le compte à rebours
function startOTPTimer(duration, display) {
  let timer = duration, minutes, seconds;
  const interval = setInterval(function () {
    minutes = parseInt(timer / 60, 10);
    seconds = parseInt(timer % 60, 10);

    minutes = minutes < 10 ? "0" + minutes : minutes;
    seconds = seconds < 10 ? "0" + seconds : seconds;

    display.textContent = minutes + ":" + seconds;

    if (--timer < 0) {
      clearInterval(interval);
      // Masquer le timer et afficher le bouton renvoyer
      document.getElementById('otp-timer').style.display = 'none';
      document.getElementById('otp-resend').style.display = 'block';
    }
  }, 1000);
}

// Lorsque la modal s'affiche, démarrer le timer
function showOTPModal() {
  document.getElementById('otp-modal').style.display = 'flex';
  
  // Réinitialiser l'affichage
  document.getElementById('otp-timer').style.display = 'block';
  document.getElementById('otp-resend').style.display = 'none';
  
  // Démarrer le timer (2 minutes = 120 secondes)
  const display = document.querySelector('#otp-time');
  startOTPTimer(120, display);
}

// Fonction pour fermer la modal
function closeModalValidateOTP() {
  document.getElementById('otp-modal').style.display = 'none';
}

// Fonction pour renvoyer le code OTP
function resendOTP() {
  // Ici vous ajouteriez le code pour renvoyer le SMS OTP
  
      SMSHandler.send(selectedPhone, "GuichetBi")
        .then(response => {
           //console.log("✅ SMS envoyé avec succès :", response);
			alert('Un nouveau code OTP a été envoyé');
        })
        .catch(error => {
            console.error("❌ Erreur lors de l'envoi du SMS :", error);
        });
  
  // Réinitialiser le timer
  document.getElementById('otp-timer').style.display = 'block';
  document.getElementById('otp-resend').style.display = 'none';
  const display = document.querySelector('#otp-time');
  startOTPTimer(120, display);
}

// Écouteurs d'événements
document.getElementById('resend-otp')?.addEventListener('click', resendOTP);

document.getElementById('modal-form').addEventListener('submit', function(e) {
    e.preventDefault();

    const phone = document.getElementById('modal-phone').value;
    const ticketId = document.getElementById('modal-ticket-id').value;
    const countryCode = document.getElementById('country-code').value;

    if (!phone) {
        alert("Veuillez entrer un numéro valide.");
        return;
    }

    const numeroTelephone = countryCode + phone;
	
	alert(numeroTelephone);

    SMSHandler.send(numeroTelephone, "GuichetBi")
        .then(response => {
            console.log("✅ SMS envoyé avec succès :", response);

			closeModal();
			
            // Affiche la boîte OTP
			showOTPModal();
            const otpModal = document.getElementById('otp-modal');
            otpModal.style.display = 'flex';
			const otpMessage = document.getElementById('otp-message'); // 🔥 cible du messag
			 

            // Écouteur sur le bouton de validation
            document.getElementById('validate-otp').onclick = () => {
                const enteredOTP = document.getElementById('otp-code').value;

                fetch('/verify', {
                    method: 'POST',
					credentials: 'include',
                    headers: {
						'Content-Type': 'application/x-www-form-urlencoded',
						'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content')
					},
                    body: new URLSearchParams({
                        phone: numeroTelephone,
                        otp: enteredOTP,
						ticket_id: ticketId
                    })
                })
                .then(res => res.json())
                .then(data => {
					alert(data.success);
                    if (data.success) {
                        //alert("✅ Code OTP vérifié avec succès !");
						 document.getElementById('modal-phone').value = "";
                        document.getElementById('otp-code').value = "";
						//document.cookie = `laravel_session=${data.session_id}; path=/`;
            
						// Redirection vers /checkout/{id}
						window.location.href = data.redirect;
                        //otpModal.style.display = 'none';
                        // Action suivante ici
						
                    } else {
                       // alert("❌ Code OTP incorrect.");
					    document.getElementById('modal-phone').value = "";
                        document.getElementById('otp-code').value = "";
						otpMessage.textContent = "❌ Code OTP incorrect. Veuillez réessayer.";
						
                    }
                });
            };
        })
        .catch(error => {
            console.error("❌ Erreur lors de l'envoi du SMS :", error);
        });
});