jQuery(document).ready(function ($) {
    let email = '';
    const modal = $('#modal');
	const ajaxUrl = adventCalendarAjax.ajaxUrl;
	const lottiePlayer = document.getElementById('lottie-animation');
	

   // Submit email form
$('#advent_login_form').on('submit', function (e) {
    e.preventDefault(); // Prevent the form from submitting normally
   // e.stopPropagation(); // Stop event propagation

    email = $('#cal_email').val();

    // Ensure the URL doesn't append the query string
    //history.pushState({}, document.title, window.location.pathname);

    $.post(ajaxUrl, {
        action: 'advent_calendar_submit_email',
        email: email
    }, function (response) {
        if (response.success) {
            // Hide the login form and show progress
            $('.if-advent-cal-left-col h2').text('Your Advent Calendar');
            $('.if-advent-cal-left-col p').html('Unlock daily surprises by <span style="color: #bfff38;">clicking on the cells</span> and make this season unforgettable');
            $('#advent_login_form').hide();

            // Append logout section above <h2>
            const maskedEmail = maskEmail(response.data.email);
            $('.if-advent-cal-left-col h2').before(
                '<div class="logout-container">' +
                '<span class="logged-in-info">Logged in as <strong>' + maskedEmail + '</strong></span>' +
                '<button id="logout-button" class="logout-btn"><img src="/wp-content/plugins/advent-calendar/images/log-out.svg">Log out</button>' +
                '</div>'
            );

            // Attach logout functionality
            $('#logout-button').on('click', logoutUser);

            // Load the calendar with the retrieved progress
            loadCalendar(response.data.progress);
        } else {
            alert(response.data.message);
        }
    });
	
});

// Function to mask the email
function maskEmail(email) {
    const parts = email.split('@');
    const localPart = parts[0];
    const domain = parts[1];
    return localPart.slice(0, 4) + '***@' + domain;
}

// Function to log out the user
function logoutUser() {
    email = ''; // Clear stored email
	
	$('.if-advent-cal-right-col .if-advent-cal-blocks').each(function () {
	   const block = $(this);
       block.removeClass('opened unlocked'); 
       block.css({
            'background-color': '', // Remove background color
        });

        // Show the background image if it was hidden
        block.find('.if-advent-cal-block-bg').show();
        block.off('click');		
    });

    // Remove the logout section
    $('.logout-container').remove();

    // Show the login form again
    $('#advent_login_form')[0].reset(); // Reset the form fields
    $('#advent_login_form').show(); // Make the form visible


    // Reset the text in the <h2> and <p>
    $('.if-advent-cal-left-col h2').text('Trading Advent Calendar: Unlock 25 festive rewards with just your email');
    $('.if-advent-cal-left-col p').html('Claim past rewards and check in daily to discover new surprises');
}


    // Load calendar
function loadCalendar(progress) {
    if (!progress || typeof progress !== 'object') {
        console.error('Invalid progress data:', progress);
        return;
    }

    const currentDate = new Date().getDate(); // Get today's date

    $('.if-advent-cal-right-col .if-advent-cal-blocks').each(function () {
        const block = $(this);
        const day = parseInt(block.find('h4').text(), 10); // Extract the day number

        const isLocked = day > currentDate; // Check if the day is in the future
        const isOpened = progress[day] === true; // Check if the day is marked as opened

        block.off('click'); // Ensure no duplicate click handlers are attached

        if (isLocked) {
            // If the day is locked (future days), mark it as locked
            block.addClass('locked').removeClass('opened unlocked');
        } else if (isOpened) {
            // If the day is opened and user is logged in, attach the modal click
            block.addClass('opened').removeClass('locked unlocked');

            block.on('click', function () {
                if (email) {
                    openModal(day); // Open modal only if logged in
                }
            });
        } else {
            // If the day is unlocked but not opened, allow unlocking
            block.removeClass('locked opened').addClass('unlocked');
            block.on('click', function () {
                openDay(day, email, block); // Unlock the day via AJAX
            });
        }
    });
}



    // Open a day and update its state
    function openDay(day, userEmail, block) {
    if (block.hasClass('opened')) {
        openModal(day); // Directly open modal for already opened days
        return; // Exit the function to avoid redundant AJAX calls
    }

    // Proceed with unlocking via AJAX
    $.post(ajaxUrl, {
        action: 'advent_calendar_open_day',
        email: userEmail,
        day: day
    }, function (response) {
        if (response.success) {
            block.addClass('opened').removeClass('unlocked');
            block.css('background-color', '#000'); // Example style
            block.find('.if-advent-cal-block-bg').hide();

            openModal(day); // Open modal with gift content for the day
        } else {
            alert('Error opening the day: ' + response.data.message);
        }
    });
}


    // Open modal with gift content
    function openModal(day) {
    const giftContent = getGiftContent(day); // Fetch gift content for the day

    if (!giftContent) {
        alert('No gift available for this day.');
        return;
    }
	
	//clear previous content
	const modalGiftWrap = $('.modal-gift-wrap img');
	if (modalGiftWrap.length) {
        modalGiftWrap.attr('src', '').attr('alt', ''); // Clear previous image and alt
    }
    $('#modal-content-text h4').text(''); // Clear previous title
    $('#modal-content-text p').html(''); // Clear previous description

    // Update modal content
    $('#modal-content-text h4').text(giftContent.title); // Update title
    $('#modal-content-text p').html(giftContent.description); // Update description
    
    if (modalGiftWrap.length) {
    var timestamp = new Date().getTime(); // Unique timestamp
    var imageUrl = giftContent.image + '?v=