$(document).ready(function() {
    // Au clic sur le bouton
    $('.wishlist-button').on('click', function(e) {
        e.preventDefault();

        var $btn = $(this);
        var idProduct = $btn.data('product-id');

        $.ajax({
            url: prestashop.urls.base_url + 'module/lcvprestatheme/ajaxWishlist',
            type: 'POST',
            data: { id_product: idProduct, back: window.location.href },
            dataType: 'json',
            success: function(data) {
                if (data.success) {
                    if (data.action === 'added') {
                        // Ajout à la wishlist => cœur noir
                        $btn.addClass('active');
                    } else if (data.action === 'removed') {
                        // Suppression => cœur vide
                        $btn.removeClass('active');
                    }
                } else if (data.requireLogin) {
                    // Client non connecté : on propose connexion / création de compte
                    showWishlistAuthModal(data.loginUrl, data.registerUrl);
                } else {
                    alert(data.message);
                }
            },
            error: function() {
                alert('Erreur lors de la mise à jour de la wishlist.');
            }
        });
    });

    //  Au chargement de la page : coche les produits déjà dans la wishlist
    if (window.userWishlist && Array.isArray(window.userWishlist)) {
        $('.wishlist-button').each(function() {
            var idProduct = parseInt($(this).data('product-id'));
            if (window.userWishlist.includes(idProduct)) {
                $(this).addClass('active');
            }
        });
    }
});

/**
 * Modale « connexion requise » affichée quand un visiteur non connecté
 * clique sur le cœur wishlist. Propose connexion ou création de compte
 * (les deux URLs portent le paramètre `back` pour revenir sur la page courante).
 */
function showWishlistAuthModal(loginUrl, registerUrl) {
    var existing = document.getElementById('mrd-wishlist-auth');
    if (existing) { existing.remove(); }

    var modal = document.createElement('div');
    modal.className = 'mrd-auth-modal';
    modal.id = 'mrd-wishlist-auth';
    modal.setAttribute('role', 'dialog');
    modal.setAttribute('aria-modal', 'true');
    modal.setAttribute('aria-labelledby', 'mrd-auth-title');
    modal.innerHTML =
        '<div class="mrd-auth-overlay" data-auth-close></div>'
      + '<div class="mrd-auth-box">'
      + '  <button type="button" class="mrd-auth-close" aria-label="Fermer" data-auth-close>&times;</button>'
      + '  <span class="mrd-auth-ico" aria-hidden="true">'
      + '    <svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 24 24" fill="none">'
      + '      <path d="M12 6.00019C10.2006 3.90317 7.19377 3.2551 4.93923 5.17534C2.68468 7.09558 2.36727 10.3061 4.13778 12.5772C5.60984 14.4654 10.0648 18.4479 11.5249 19.7369C11.6882 19.8811 11.7699 19.9532 11.8652 19.9815C11.9483 20.0062 12.0393 20.0062 12.1225 19.9815C12.2178 19.9532 12.2994 19.8811 12.4628 19.7369C13.9229 18.4479 18.3778 14.4654 19.8499 12.5772C21.6204 10.3061 21.3417 7.07538 19.0484 5.17534C16.7551 3.2753 13.7994 3.90317 12 6.00019Z" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>'
      + '    </svg>'
      + '  </span>'
      + '  <h3 class="mrd-auth-title" id="mrd-auth-title">Connectez-vous</h3>'
      + '  <p class="mrd-auth-text">Connectez-vous ou créez un compte pour enregistrer ce produit dans votre liste de souhaits.</p>'
      + '  <div class="mrd-auth-actions">'
      + '    <a class="mrd-btn mrd-btn-solid" href="' + (loginUrl || '#') + '">Se connecter</a>'
      + '    <a class="mrd-btn mrd-btn-outline" href="' + (registerUrl || loginUrl || '#') + '">Créer un compte</a>'
      + '  </div>'
      + '</div>';

    document.body.appendChild(modal);
    document.body.style.overflow = 'hidden';
    // reflow puis ouverture pour déclencher la transition
    requestAnimationFrame(function() { modal.classList.add('is-open'); });

    function close() {
        modal.classList.remove('is-open');
        document.body.style.overflow = '';
        document.removeEventListener('keydown', onKey);
        setTimeout(function() { if (modal.parentNode) { modal.remove(); } }, 320);
    }
    function onKey(e) { if (e.key === 'Escape') { close(); } }

    var closers = modal.querySelectorAll('[data-auth-close]');
    for (var i = 0; i < closers.length; i++) { closers[i].addEventListener('click', close); }
    document.addEventListener('keydown', onKey);
}
