$(document).on("click", ".upsell-checkbox", function (e) {
    let productId = $(this).attr("product-id");
    let variationId = $(this).attr("variation-id");
    let isChecked = "input[name='upsell-checkbox-" + productId + "']:checked";
    let checked = $(isChecked).val();

    if (
        checked === "on" ||
        checked === "true" ||
        checked == true ||
        checked == 1
    ) {
        addProductToCart(productId, variationId);
    } else {
        removeProductFromCart(productId, variationId);
    }
});

$(document).on("click", ".js-cart-btn", function (e) {
    e.preventDefault();

    let productId = $(this).attr("product-id");
    let variationId = $(this).attr("variation-id");
    let isAdded = $(this).hasClass("added");

    if (isAdded) {
        removeProductFromCart(productId, variationId);
        $(this).removeClass("added");
        $(this).find("i").removeClass("fa-check");
        $(this).find("i").addClass("fa-shopping-cart");
    } else {
        addProductToCart(productId, variationId);
        $(this).addClass("added");
        $(this).find("i").addClass("fa-check");
        $(this).find("i").removeClass("fa-shopping-cart");
    }
});

function addProductToCart(productId, variationId) {
    let url = "/add-product-to-cart/" + productId + "/" + variationId;

    $.ajax({
        url: url,
        type: "GET",
        dataType: "json",
        success: function (data) {

            if(!data.success) {
                $(".message-cart-out-of-stock").show();
                $(".message-cart-out-of-stock").addClass(
                    "animate__animated animate__bounceInRight"
                );
                checkCartItems();
                var timeout = setTimeout(fadeOutMessageStock, 2000);
                
            } else {
                $(".message-cart").show();
                $(".message-cart").addClass(
                    "animate__animated animate__bounceInRight"
                );
                checkCartItems();
                var timeout = setTimeout(fadeOutMessageAdd, 2000);
            }
        },
        error: function (xhr, status, error) {
            console.error("Error fetching data:", error);
        },
    });
}

function removeProductFromCart(productId, variationId) {
    let url = "/remove-product/" + productId + "/" + variationId;

    $.ajax({
        url: url,
        type: "GET",
        dataType: "json",
        success: function (data) {
            $(".message-cart-delete").show();
            $(".message-cart-delete").addClass(
                "animate__animated animate__bounceInRight"
            );
            checkCartItems();
            var timeout = setTimeout(fadeOutMessageDelete, 2000);
        },
        error: function (xhr, status, error) {
            console.error("Error fetching data:", error);
        },
    });
}

function fadeOutMessageAdd() {
    $(".message-cart").removeClass("animate__animated animate__bounceInRight");
    $(".message-cart").addClass("animate__animated animate__slideOutRight");
    $(".message-cart").removeClass("animate__animated animate__slideOutRight");
    $(".message-cart").fadeOut("slow");
}

function fadeOutMessageDelete() {
    $(".message-cart-delete").removeClass("animate__animated animate__bounceInRight");
    $(".message-cart-delete").addClass("animate__animated animate__slideOutRight");
    $(".message-cart-delete").removeClass("animate__animated animate__slideOutRight");
    $(".message-cart-delete").fadeOut("slow");
}

function fadeOutMessageStock() {
    $(".message-cart-out-of-stock").removeClass("animate__animated animate__bounceInRight");
    $(".message-cart-out-of-stock").addClass("animate__animated animate__slideOutRight");
    $(".message-cart-out-of-stock").removeClass("animate__animated animate__slideOutRight");
    $(".message-cart-out-of-stock").fadeOut("slow");
}

function checkCartItems() {
    $.ajax({
        type: "GET",
        headers: {
            "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
        },
        date: { _token: "{{ csrf_token() }}" },
        url: "/cart/getItems",
    }).done(function (resp) {
        if (resp.items == 0) {
            $(".cart-items").hide();
        } else {
            $(".cart-items").show();
            $(".cart-items").text(resp.items);
        }
    });
}

$(".open-images-popup").on("click", function (e) {
    let popup = ".upsell-popup-" + $(this).attr("attr-popup");

    if (!e.target.classList.contains("color")) {
        showUpsell(popup);
    }
});

$('.popup-btn').on('click', function(e) {
    e.preventDefault();
    closeUpsellPopup();
});

$('.popup-close a').on('click', function(e) {
    e.preventDefault();
    closeUpsellPopup();
});

$('.upsell-popup-overlay').on('click', function(e) {
    e.preventDefault();
    closeUpsellPopup();
});

function showUpsell(popupClass) {
    $(".upsell-popup-overlay").show();
    $(popupClass).show();
}

function closeUpsellPopup()
{
    $(".upsell-popup-overlay").hide();
    $(".upsell-popup").hide();   
}

$('.upsell-colors .js-upsell-color').on('click', function(e) {
    let thumb = $(this).attr('thumb');
    let productId = $(this).attr('product-id');
    let variationId = $(this).attr('variation-id');
    let title = $(this).attr('title');
    let unique = $(this).attr('unique');

    $('.upsell-colors .js-upsell-color-' + unique).removeClass('selected');
    $(this).addClass('selected');

    $('.upsell-product-' + productId).attr('src', thumb);
    $('.upsell-checkbox-' + productId).attr('variation-id', variationId);
    $('.upsell-title-' + productId).text(title);
});

$('.upsell-colors .js-upsell-color-big').on('click', function(e) {
    let thumb = $(this).attr('thumb');
    let productId = $(this).attr('product-id');
    let variationId = $(this).attr('variation-id');
    let title = $(this).attr('title');
    let unique = $(this).attr('unique');

    $('.upsell-colors .js-upsell-color-big-' + unique).removeClass('selected');
    $(this).addClass('selected');

    $('.upsell-product-big-' + productId).attr('src', thumb);
    $('.js-cart-btn-' + productId).attr('variation-id', variationId);
    $('.upsell-title-big-' + productId).text(title);
});