<?php $__env->startSection('title', 'Cart Page'); ?>
<?php $__env->startSection('content'); ?>
    <section class="inner-banner">
        <img src="<?php echo e($data->cmsImages('banner_image')); ?>" alt="image" class="img-fluid w-100 h-100">
        <div class="container">
            <div class="inner-banner__content">
                <h1><?php echo e($data->content['banner_heading'] ?? ''); ?></h1>
            </div>
        </div>
    </section>

    <section class="check-out-section">
        <div class="container">
            <div class="check-out-form check-out-2">
                <h2 class="primary-heading"><?php echo e($data->content['heading'] ?? ''); ?></h2>

                <div class="col-12 offset-lg-1 col-lg-10">
                    <?php
                        $cartItems = session('cart', []);
                        $productIds = collect($cartItems)->pluck('product_id')->toArray();
                        $products = \App\Models\Product::whereIn('id', $productIds)->get()->keyBy('id');
                    ?>

                    <?php if(!empty($cartItems)): ?>
                        <?php $__currentLoopData = $cartItems; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $id => $product): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                            <?php
                                $productData = $products[$product['product_id']] ?? null;
                            ?>
                            <?php if($productData): ?>
                                <div class="row card-row">
                                    <div class="col-md-2">
                                        <a href="<?php echo e(route('front.product.detail', $product['product_id'])); ?>" class="card-hover">
                                            <figure>
                                                <img src="<?php echo e($productData->getFirstMediaUrl('product_image')); ?>" alt="image">
                                            </figure>
                                        </a>
                                    </div>
                                    <div class="col-md-5">
                                        <a href="<?php echo e(route('front.product.detail', $product['product_id'])); ?>">
                                            <h4 class="red"><?php echo e($product['name']); ?></h4>
                                        </a>
                                        <ul class="stckst " style="text-align: justify">
                                            <li>Color Name: <?php echo e($product['colour_name']); ?></li>
                                        </ul>
                                    </div>
                                    <div class="col-md-2">
                                        <span class="price red">USD <?php echo e(number_format($product['price'])); ?></span>
                                    </div>
                                    <div class="col-md-2">
                                        <div class="shop-details">
                                            <div class="numberone">
                                                <span class="minus" onclick="changeQuantity('<?php echo e($id); ?>', 'minus')">-</span>
                                                <input type="text" id="quantity-<?php echo e($id); ?>" name="quantity" class="in-num"
                                                       value="<?php echo e($product['quantity'] ?? 1); ?>">
                                                <span class="plus" onclick="changeQuantity('<?php echo e($id); ?>', 'add')">+</span>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-md-1">
                                        <form action="<?php echo e(route('cart.remove', $id)); ?>" method="POST">
                                            <?php echo csrf_field(); ?>
                                            <?php echo method_field('DELETE'); ?>
                                            <button type="submit" class="bg-transparent border-0 delete-btn">
                                                <i class="fas fa-trash-alt"></i>
                                            </button>
                                        </form>
                                    </div>
                                </div>
                            <?php endif; ?>
                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                    <?php endif; ?>

                    <div class="row">
                        <div class="offset-1 col-lg-10 offset-1">
                            <div class="row fields-row mt-60">
                                <?php if(empty($cartItems)): ?>
                                    <div class="col-12">
                                        <a href="<?php echo e(route('front.index')); ?>" class="btn d-btn w-100">Continue Shopping</a>
                                    </div>
                                <?php else: ?>
                                    <div class="col-12">
                                        <button class="btn d-btn w-100" onclick="window.location.href='<?php echo e(route('checkout')); ?>'">
                                            PROCEED To Pay
                                        </button>
                                    </div>
                                <?php endif; ?>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
<?php $__env->stopSection(); ?>

<?php $__env->startSection('script'); ?>

    <script>
        function changeQuantity(productId, action) {
            var inputElement = document.getElementById('quantity-' + productId);
            var minusButton = inputElement.closest('.shop-details').querySelector('.minus');
            var currentValue = parseInt(inputElement.value);

            if (action === 'add') {
                $('#loader-container').show();
                inputElement.value = currentValue + 1;
            } else if (action === 'minus' && currentValue > 1) {
                $('#loader-container').show();
                inputElement.value = currentValue - 1;
            }

            // Disable the minus button if value is 1
            if (parseInt(inputElement.value) <= 1) {
                minusButton.classList.add('disabled');
                minusButton.style.pointerEvents = 'none';
                minusButton.style.opacity = '0.5';
            } else {
                minusButton.classList.remove('disabled');
                minusButton.style.pointerEvents = 'auto';
                minusButton.style.opacity = '1';
            }

            // Send an AJAX request to update the cart
            $.ajax({
                url: "<?php echo e(route('update.to.cart')); ?>", // Laravel route for cart update
                method: "POST",
                data: {
                    _token: "<?php echo e(csrf_token()); ?>", // CSRF protection
                    product_id: productId,
                    quantity: inputElement.value
                },
                success: function(response) {
                    $('#loader-container').hide();
                    toastr.success('Cart updated successfully');
                },
                error: function(xhr, status, error) {
                    $('#loader-container').hide();
                    console.error("AJAX Error:", xhr.responseText); // Log full response
                    console.error("Status:", status);
                    console.error("Error:", error);

                    // Show error details in toastr
                    toastr.error('Failed to update cart: ' + (xhr.responseJSON?.message || error));
                }

            });
        }

        // Ensure minus button is disabled on page load if the value is 1
        document.addEventListener('DOMContentLoaded', function () {
            document.querySelectorAll('.in-num').forEach(function (inputElement) {
                var minusButton = inputElement.closest('.shop-details').querySelector('.minus');

                if (parseInt(inputElement.value) <= 1) {
                    minusButton.classList.add('disabled');
                    minusButton.style.pointerEvents = 'none';
                    minusButton.style.opacity = '0.5';
                }
            });
        });

    </script>


<?php $__env->stopSection(); ?>

<?php echo $__env->make('front.layout.app', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /home/servicedemoweb/public_html/luxury-candles/resources/views/front/cart.blade.php ENDPATH**/ ?>