@extends('layouts.siteLayouts')

@section('head')
    <link href="{{url('assets/css/plugins/placeholder-loading.min.css')}}" rel="stylesheet">

@stop

@section('content')
    <!-- Start All Category News Area -->
    <section class="all-category-news ptb-40">
        <div class="container">
            <div class="row">
                <div class="col-lg-8 col-md-12">
                    <div class="section-title">
                        <h2>نتایج</h2>
                    </div>
                    @include('site.include.search.load')
                </div>


                <div class="col-lg-4 col-md-12">
                    @include('site.side')
                </div>
            </div>
        </div>
    </section>
    <!-- End All Category News Area -->
    @include('site.suggested')
@stop

@section('footer')
    <!--  theia-sticky-sidebar -->
    <script src="{{ url('assets/js/plugins/ResizeSensor.min.js')}}"></script>
    <script src="{{ url('assets/js/plugins/theia-sticky-sidebar.min.js')}}"></script>
    <script>
        const boxs = document.querySelectorAll('input[type="checkbox"]');
        const queries = window.location.search ?
            window.location.search.slice(1).split('&') :
            [];
        boxs.forEach(box => {
            box.addEventListener('change', onFilter)
        });

        function onFilter(e) {
            const {name, checked} = e.target;
            const value = e.target.dataset.value;
            const searchName = queries.map(query => query.split('=')[0])
            const queryIndex = searchName.indexOf(name);

            if (queryIndex !== -1 && !checked) {
                queries.splice(queryIndex, 1);
            } else if (queryIndex === -1 && checked) {
                queries.push(`${name}=${value}`)
            }

            const newSearch = queries.join('&');
            window.history.pushState("", "", `?${newSearch}`);
            var url = window.location.href;
            getProducts(url);
        }

        priceFilter = function () {
            var min = document.getElementById('skip-value-lower').value;
            var max = document.getElementById('skip-value-upper').value;
            var url = new URL(window.location.href);
            var query_string = url.search;
            var search_params = new URLSearchParams(query_string);
            search_params.delete('price_min');
            search_params.delete('price_max');
            search_params.append('price_min', min);
            search_params.append('price_max', max);
            url.search = search_params.toString();
            var new_url = url.toString();
            window.history.pushState("", "", new_url);
            getProducts(url);
        };

        sortBy = function (sort) {
            var url = new URL(window.location.href);
            var query_string = url.search;
            var search_params = new URLSearchParams(query_string);
            search_params.delete('sortBy');
            search_params.append('sortBy', sort);
            url.search = search_params.toString();
            var new_url = url.toString();
            window.history.pushState("", "", new_url);
            getProducts(url);
        };

        function getProducts(url) {
            // $('#loading').show();
            $('.skeleton-loader-post-card').show();
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
                }
            });
            $.ajax({
                url: url,
                type: 'POST',
            }).done(function (data) {
                $('.products').html('');
                $('.products').html(data);
                lazyload();
                console.log(data.filters);
                // $('#loading').hide();
                $('.skeleton-loader-post-card').hide();
            }).fail(function () {
                // $('#loading').hide();
                $('.skeleton-loader-post-card').hide();
                toastr.warning('خطایی در حین انجام عملیات رخ داد', 'اوپس...');
            });
        }
    </script>
    <script type="text/javascript">

        $(function () {
            $('body').on('click', '.pagination a', function (e) {
                e.preventDefault();
                var url = $(this).attr('href');
                getProducts(url);
                window.history.pushState("", "", url);
            });


            function getProducts(url) {
                $.ajax({
                    url: url
                }).done(function (data) {
                    $('.products').html(data);
                    lazyload();
                    // $('#loading').hide();
                    $('.skeleton-loader-post-card').hide();
                }).fail(function () {
                    toastr.warning('خطایی در حین انجام عملیات رخ داد', 'اوپس...');
                });
            }
        });
    </script>


<script>
    $(document).ready(function(){
        $(".filterItem").on("keyup", function() {
            var value = $(this).val();
            $(this).parent().siblings('.filter-option').find('.checkbox').filter(function() {
                $(this).toggle($("> label ",this).text().indexOf(value) > -1)
            });
        });
    });
</script>

@stop