<?php $__env->startSection('content'); ?>
    <?php
        $request = request();

        $currentRoute = Request::route();
        $currentRouteName = $currentRoute->getName();

        if ($currentRouteName == 'product.by.category' || $currentRouteName == 'product.by.brand') {
            $routeParameters = $currentRoute->parameters();
            $firstParameter = reset($routeParameters);
            $baseURL = route($currentRouteName, $firstParameter);
        } else {
            $baseURL = route($currentRouteName);
        }
        $brand = $request->has('brand') ? explode(',', $request->brand) : [];
        $attributeValues = $request->has('attribute_values') ? explode(',', $request->attribute_values) : [];
        $rating = $request->has('rating');
    ?>

    <!-- Category Section Starts Here -->



    <div class="py-60">
        <div class="container">

            <?php if(!blank($breadcrumbs)): ?>
                <ul class="mb-4 breadcrumb">
                    <?php $__currentLoopData = $breadcrumbs; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $key => $link): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                        <li class="breadcrumb-item">
                            <?php if(!$loop->last): ?>
                                <a href="<?php echo e($link); ?>"><?php echo e(__($key)); ?></a>
                            <?php else: ?>
                                <span>
                                    <?php echo e(__($key)); ?>

                                </span>
                            <?php endif; ?>
                        </li>
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                </ul>
            <?php endif; ?>

            <div class="product-shop">
                <aside class="category-sidebar">
                    <button type="button" class="close-sidebar text--secondary d-xl-none"><i class="las la-times"></i></button>
                    <form action="" method="get" id="filterForm" class="product-filter-form">

                        <?php if(isset($categories) && $categories->count()): ?>
                            <div class="widget">
                                <h5 class="title"><?php echo app('translator')->get('Categories'); ?></h5>
                                <div class="widget-body">
                                    <ul class="filter-category filter-overflow">
                                        <?php $__currentLoopData = $categories; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                            <li>
                                                <a href="<?php echo e(route('product.by.category', $item->slug)); ?>" class="" data-slug="<?php echo e($item->slug); ?>"><i class="las la-angle-right"></i>
                                                    <?php echo e(__($item->name)); ?> </a>
                                            </li>
                                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                    </ul>
                                </div>
                            </div>
                        <?php endif; ?>

                        <?php if(isset($brands) && $brands->count()): ?>
                            <div class="widget">
                                <h5 class="title"><?php echo app('translator')->get('Filter by Brand'); ?></h5>
                                <div class="widget-body filter-overflow">
                                    <?php $__currentLoopData = $brands; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                        <div class="widget-check-group brand-filter">
                                            <input type="checkbox" class="form-check-input brand-item" value="<?php echo e($item->slug); ?>" name="brand[]" id="brand-<?php echo e($loop->iteration); ?>" <?php if(in_array($item->slug, $brand)): echo 'checked'; endif; ?>>
                                            <label for="brand-<?php echo e($loop->iteration); ?>"><?php echo e(__($item->name)); ?></label>
                                        </div>
                                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                </div>
                            </div>
                        <?php endif; ?>

                        <div class="widget">
                            <h5 class="title"><?php echo app('translator')->get('Filter by Price'); ?></h5>
                            <div class="widget-body">
                                <div class="price-range d-flex flex-wrap mb-4">
                                    <div class="widget-check-group">
                                        <input type="checkbox" class="form-check-input" id="priceCheck" <?php if($request->has('min_price') || $request->has('max_price')): echo 'checked'; endif; ?>>
                                        <label class="form-check-label" for="priceCheck"><?php echo app('translator')->get('Price Filter'); ?></label>
                                    </div>
                                    <div class="input-group">
                                        <input type="number" step="any" class="form-control" min="0" name="min_price" value="<?php echo e(getAmount($minPrice)); ?>" disabled>
                                        <input type="number" step="any" class="form-control" min="0" name="max_price" value="<?php echo e(getAmount($maxPrice)); ?>" disabled>
                                    </div>
                                </div>

                                <div id="slider-range"></div>

                            </div>
                        </div>

                        <?php $__currentLoopData = $attributes; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $attribute): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                            <div class="widget">
                                <h5 class="title"><?php echo e(__($attribute->name)); ?></h5>
                                <div class="widget-body">
                                    <?php if($attribute->type == Status::ATTRIBUTE_TYPE_COLOR): ?>
                                        <ul class="list list--row flex-wrap">
                                            <?php $__currentLoopData = $attribute->values; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $attributeValue): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                                <li>
                                                    <label class="select-color" for="attr-color-val-<?php echo e($attributeValue->id); ?>" style="color:#<?php echo e($attributeValue->value); ?>; background-color:#<?php echo e($attributeValue->value); ?>" data-bs-title="<?php echo e(__($attributeValue->name)); ?>">
                                                        <input class="select-color__input attributes" type="checkbox" name="attribute_values[]" data-type="<?php echo e($attribute->type); ?>" value="<?php echo e($attributeValue->id); ?>" id="attr-color-val-<?php echo e($attributeValue->id); ?>" <?php if(in_array($attributeValue->id, $attributeValues)): echo 'checked'; endif; ?>>
                                                    </label>
                                                </li>
                                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                        </ul>
                                    <?php else: ?>
                                        <div class="product-size-filter">
                                            <?php $__currentLoopData = $attribute->values; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $attributeValue): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                                <div class="widget-check-group">
                                                    <input class="form-check-input attributes" type="checkbox" data-type="<?php echo e($attribute->type); ?>" name="attribute_values[]" value="<?php echo e($attributeValue->id); ?>" id="attr-value-<?php echo e($attributeValue->id); ?>" <?php if(in_array($attributeValue->id, $attributeValues)): echo 'checked'; endif; ?>>
                                                    <label class="form-check-label" for="attr-value-<?php echo e($attributeValue->id); ?>">
                                                        <?php echo e(__($attributeValue->name)); ?>

                                                    </label>
                                                </div>
                                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                        </div>
                                    <?php endif; ?>
                                </div>
                            </div>
                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>

                        <div class="widget">
                            <h5 class="title"><?php echo app('translator')->get('Ratings'); ?></h5>
                            <div class="widget-body">
                                <div class="product-filter__card">
                                    <ul class="list">
                                        <li>
                                            <div class="widget-check-group">
                                                <input class="form-check-input rating" name="rating" value="5" type="radio" id="five-star" <?php if($rating == 5): echo 'checked'; endif; ?>>
                                                <label class="form-check-label" for="five-star">
                                                    <span class="list list--row rating-list">
                                                        <?php echo formattedFilterParameterRatings(5) ?>
                                                    </span>
                                                </label>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="widget-check-group">
                                                <input class="form-check-input rating" name="rating" value="4" type="radio" id="four-star" <?php if($rating == 4): echo 'checked'; endif; ?>>
                                                <label class="form-check-label" for="four-star">
                                                    <span class="list list--row rating-list">
                                                        <?php echo formattedFilterParameterRatings(4) ?>
                                                        <span class="rating-up-text"><?php echo app('translator')->get('and Up'); ?></span>
                                                    </span>
                                                </label>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="widget-check-group">
                                                <input class="form-check-input rating" name="rating" value="3" type="radio" id="three-star" <?php if($rating == 3): echo 'checked'; endif; ?>>
                                                <label class="form-check-label" for="three-star">
                                                    <span class="list list--row rating-list">
                                                        <?php echo formattedFilterParameterRatings(3) ?>
                                                        <span class="rating-up-text"><?php echo app('translator')->get('and Up'); ?></span>
                                                    </span>
                                                </label>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="widget-check-group">
                                                <input class="form-check-input rating" name="rating" value="2" type="radio" id="two-star" <?php if($rating == 2): echo 'checked'; endif; ?>>
                                                <label class="form-check-label" for="two-star">
                                                    <span class="list list--row rating-list">
                                                        <?php echo formattedFilterParameterRatings(2) ?>
                                                        <span class="rating-up-text"><?php echo app('translator')->get('and Up'); ?></span>
                                                    </span>
                                                </label>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="widget-check-group">
                                                <input class="form-check-input rating" name="rating" value="1" type="radio" id="one-star" <?php if($rating == 1): echo 'checked'; endif; ?>>
                                                <label class="form-check-label" for="one-star">
                                                    <span class="list list--row rating-list">
                                                        <?php echo formattedFilterParameterRatings(1) ?>
                                                        <span class="rating-up-text"><?php echo app('translator')->get('and up'); ?></span>
                                                    </span>
                                                </label>
                                            </div>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </form>
                </aside>

                <div class="products-container w-100">
                    
                    <div class="filter-category-header d-flex align-items-center justify-content-between flex-wrap gap-3">
                        <div class="d-flex gap-2 align-items-center flex-grow-1 flex-md-grow-0 justify-content-between">
                            <div class="filter-select-item d-xl-none pl-0 ">
                                <button class="filter-in flex-shrink-0">
                                    <i class="las la-sliders-h"></i> <?php echo app('translator')->get('Filter'); ?>
                                </button>
                            </div>
                            <span class="small text-muted flex-shrink-0">
                                <?php echo app('translator')->get('Total'); ?>
                                <span class="fw-semibold totalProducts"><?php echo e($products->total()); ?></span>
                                <?php echo e(Str::plural('product', $products->total())); ?> <?php echo app('translator')->get('found'); ?>
                            </span>
                        </div>

                        <div class="d-flex align-items-center gap-3 filter-select-right flex-grow-1">

                            <div class="d-flex gap-2 justify-content-between">
                                <div class="filter-select-item d-flex gap-1 align-items-center">
                                    <p class="mb-0"><?php echo app('translator')->get('Sort By'); ?> : </p>
                                    <div class="select-item">
                                        <select class="form--control form--select" name="sort_by" form="#filterForm">
                                            <option value="" selected><?php echo app('translator')->get('Default'); ?> </option>
                                            <option value="price_htl" <?php if($request->sort_by == 'price_htl'): echo 'selected'; endif; ?>><?php echo app('translator')->get('Price Hight to Low'); ?> </option>
                                            <option value="price_lth" <?php if($request->sort_by == 'price_lth'): echo 'selected'; endif; ?>><?php echo app('translator')->get('Price Low to High'); ?> </option>
                                            <option value="latest" <?php if($request->sort_by == 'latest'): echo 'selected'; endif; ?>><?php echo app('translator')->get('Latest'); ?> </option>
                                            <option value="oldest" <?php if($request->sort_by == 'oldest'): echo 'selected'; endif; ?>><?php echo app('translator')->get('Oldest'); ?> </option>
                                        </select>
                                    </div>
                                </div>
                                <div class="filter-select-item d-flex gap-1 align-items-center">
                                    <p class="mb-0"><?php echo app('translator')->get('Show'); ?> : </p>
                                    <div class="select-item">
                                        <select class="form--control form--select" name="per_page" form="#filterForm">
                                            <option value="4" <?php if($request->per_page == 4): echo 'selected'; endif; ?>>4</option>
                                            <option value="8" <?php if($request->per_page == 8): echo 'selected'; endif; ?>>8</option>
                                            <option value="16" <?php if($request->per_page == 16): echo 'selected'; endif; ?>>16</option>
                                            <option value="24" <?php if(!$request->per_page || $request->per_page == 24): echo 'selected'; endif; ?>>24</option>
                                            <option value="32" <?php if($request->per_page == 32): echo 'selected'; endif; ?>>32</option>
                                            <option value="64" <?php if($request->per_page == 64): echo 'selected'; endif; ?>>64</option>
                                            <option value="80" <?php if($request->per_page == 80): echo 'selected'; endif; ?>>80</option>
                                            <option value="100" <?php if($request->per_page == 100): echo 'selected'; endif; ?>>100</option>
                                        </select>
                                    </div>
                                </div>
                            </div>

                            <div class="filter-select-item">
                                <ul class="view-style d-flex gap-2  align-items-center">
                                    <li>
                                        <a href="javascript:void(0)" class="active view-grid-style"><i class="las la-th-large"></i></a>
                                    </li>
                                    <li>
                                        <a href="javascript:void(0)" class="view-list-style"><i class="las la-list-ul"></i></a>
                                    </li>
                                </ul>
                            </div>

                        </div>
                    </div>

                    <div class="position-relative">
                        <div id="overlay">
                            <div class="cv-spinner">
                                <span class="spinner"></span>
                            </div>
                        </div>
                        <div class="overlay-2" id="overlay2"></div>
                        <div class="page-main-content">
                            <?php echo $__env->make('Template::partials.products_filter', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Category Section Ends Here -->
<?php $__env->stopSection(); ?>

<?php $__env->startPush('script-lib'); ?>
    <script src="<?php echo e(asset('assets/global/js/jquery-ui.min.js')); ?>"></script>
    <script src="<?php echo e(asset($activeTemplateTrue . 'js/owl.carousel.min.js')); ?>"></script>
    <script src="<?php echo e(asset($activeTemplateTrue . 'js/owl-carousel.js')); ?>"></script>
    <script src="<?php echo e(asset($activeTemplateTrue . 'js/xzoom/xzoom.min.js')); ?>"></script>
    <script src="<?php echo e(asset($activeTemplateTrue . 'js/xzoom/magnific-popup.js')); ?>"></script>
    <script src="<?php echo e(asset($activeTemplateTrue . 'js/xzoom/setup.js')); ?>"></script>
<?php $__env->stopPush(); ?>

<?php $__env->startPush('style-lib'); ?>
    <link href="<?php echo e(asset($activeTemplateTrue . 'css/owl.carousel.min.css')); ?>" rel="stylesheet">
    <link rel="stylesheet" href="<?php echo e(asset($activeTemplateTrue . 'css/xzoom/xzoom.css')); ?>">
    <link rel="stylesheet" href="<?php echo e(asset($activeTemplateTrue . 'css/xzoom/magnific-popup.css')); ?>">
<?php $__env->stopPush(); ?>

<?php $__env->startPush('script'); ?>
    <script>
        (function($) {

            $(".close-sidebar").on("click", (function() {
                $(".category-sidebar").removeClass("active");
                $(".body-overlay").removeClass("active")
            }));

            $(".filter-in").on("click", (function() {
                $(".category-sidebar").addClass("active");
                $(".body-overlay").addClass("active")
            }));

            $(".view-list-style").on("click", (function() {
                $(".view-grid-style").removeClass("active");
                $(this).addClass("active");
                $("#grid-view .grid-control").addClass("list-view-active");
                $("#grid-view .grid-control .single_content").show()
            }));

            $(".view-grid-style").on("click", (function() {
                $(".view-list-style").removeClass("active");
                $(this).addClass("active");
                $("#grid-view .grid-control").removeClass("list-view-active");
                $("#grid-view .grid-control .single_content").hide()
            }));

            var min = '<?php echo e($minPrice); ?>';
            var max = '<?php echo e($maxPrice); ?>';
            var search = `<?php echo e($request->search); ?>`;

            $(document).on('change', '.brand-item, .attributes, .rating', function() {
                fetchProducts();
            });


            $("#slider-range").slider({
                range: true,
                min: <?php echo e($minPrice ?? 0); ?>,
                max: <?php echo e($maxPrice ?? 0); ?>,
                values: [<?php echo e($minPrice); ?>, <?php echo e($maxPrice); ?>],
                slide: function(event, ui) {
                    $('input[name=min_price]').val(ui.values[0]);
                    $('input[name=max_price]').val(ui.values[1]);
                },
                change: function(event, ui) {
                    min = ui.values[0];
                    max = ui.values[1];
                    fetchProducts();
                }
            });

            $('[name=sort_by], [name=per_page]').on('change', function() {
                fetchProducts();
            });

            $('#filterForm [name=min_price], #filterForm [name=max_price]').on('focusout', function() {
                fetchProducts();
            })

            $('#priceCheck').on('change', function() {
                if ($(this).prop('checked')) {
                    $('#filterForm [name=min_price], #filterForm [name=max_price]').attr('disabled', false);
                    $("#slider-range").slider("enable")
                } else {
                    $('#filterForm [name=min_price], #filterForm [name=max_price]').attr('disabled', true);
                    $("#slider-range").slider("disable")
                }
            }).change();


            $(document).on('click', 'a.page-link', function(e) {
                e.preventDefault();
                fetchProducts(this.href);
            });


            function getFormDataAsQuery() {
                let formData = $('#filterForm').serializeArray();

                let queryParams = {};

                formData.forEach(function(field) {

                    if (field.name.endsWith('[]')) {
                        var fieldName = field.name.replace(/\[\]$/, '');
                        queryParams[fieldName] = queryParams[fieldName] || [];
                        queryParams[fieldName].push(field.value);
                    } else {
                        queryParams[field.name] = field.value;
                    }
                });

                for (const [key, value] of Object.entries(queryParams)) {
                    if (Array.isArray(value)) {
                        queryParams[key] = queryParams[key].join(',');
                    }
                }

                let queryString = $.param(queryParams);
                return queryString;
            }

            function decodeHtmlEntities(str) {
                let txt = document.createElement('textarea');
                txt.innerHTML = str;
                return txt.value;
            }


            function fetchProducts(url = `<?php echo e($request->fullUrl()); ?>`, data = null) {
                $("#overlay, #overlay2").fadeIn(300);

                url = decodeHtmlEntities(url);
                let formData = getFormDataAsQuery();


                let urlObject = new URL(url);
                let params = new URLSearchParams(urlObject.search);

                if (formData) {
                    let newParams = new URLSearchParams(formData);
                    for (let [key, value] of newParams.entries()) {
                        params.set(key, decodeHtmlEntities(value));
                    }
                }

                if ($('[name=sort_by]').val()) {
                    params.set('sort_by', decodeHtmlEntities($('[name=sort_by]').val()));
                }

                if ($('[name=per_page]').val()) {
                    params.set('per_page', decodeHtmlEntities($('[name=per_page]').val()));
                }

                urlObject.search = params.toString();
                url = urlObject.toString();

                $.ajax({
                    url: url,
                    method: "get",
                    success: function(response) {
                        $('.totalProducts').text(response.total_products);
                        $('.page-main-content').html(response.html);
                        window.history.pushState(null, null, url);
                        lazyload();
                        scrollToTop();

                    }
                }).done(function() {
                    $('.ajax-preloader').addClass('d-none');
                    setTimeout(function() {
                        $("#overlay, #overlay2").fadeOut(300);
                    }, 500);
                });
            }

            function scrollToTop() {
                $('html, body').animate({
                    scrollTop: 0
                }, 'fast');
            }
        })(jQuery)
    </script>
<?php $__env->stopPush(); ?>

<?php echo $__env->make($activeTemplate . 'layouts.master', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /home/creativedesignbd/ecommerce8.creativedesign.com.bd/core/resources/views/templates/basic/products.blade.php ENDPATH**/ ?>