@extends('frontend.include.layout')

@section('content')


    <section class="mt-50 mb-50">
        <div class="container">
            <div class="row" id="display_assetlist_design_field">

                <div id="loader" class="loader" style="display: none;">Loading...</div>

                <div class="col-lg-9">
                    <div class="shop-product-fillter">
                        <div class="all-product">
                            <p id="displayasset_filter_count_overall">
                                    0-0 of 0 results
                            </p>
                        </div>

                        <div class="sort-by-product-area">
                            <div class="sort-by-cover mr-10" id="displayassetfilterremoveshow">
                                <div class="sort-by-product-wrap">
                                    <div class="sort-by">
                                        <span><i class="fi-rs-apps"></i>Show:</span>
                                    </div>
                                    <div class="sort-by-dropdown-wrap">
                                        <span> <span class="displayassetfilterchoosecount">2</span> <i class="fi-rs-angle-small-down"></i></span>
                                    </div>
                                </div>
                                <div class="sort-by-dropdown" id="displayassetfiltercount">
                                    <ul>
{{--                                        <li><a class="active">20</a></li>--}}
{{--                                        <li><a>40</a></li>--}}
{{--                                        <li><a>60</a></li>--}}
{{--                                        <li><a>80</a></li>--}}

                                        <li><a class="active">2</a></li>
                                        <li><a>4</a></li>
                                        <li><a>6</a></li>
                                        <li><a>8</a></li>

                                    </ul>
                                </div>
                            </div>
                            <div class="sort-by-cover" id="displayassetsortbyremoveshow">
                                <div class="sort-by-product-wrap">
                                    <div class="sort-by">
                                        <span><i class="fi-rs-apps-sort"></i>Sort by:</span>
                                    </div>
                                    <div class="sort-by-dropdown-wrap">
                                        <span> <span class="displayassetsortbyvalue" sortbyid="0"> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span>  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<i class="fi-rs-angle-small-down"></i></span>
                                    </div>
                                </div>
                                <div class="sort-by-dropdown" id="displayassetsortbygettext">
                                    <ul>
                                        <li><a sortbyid="1">Price: Low to High</a></li>
                                        <li><a sortbyid="2">Price: High to Low</a></li>
                                        <li><a sortbyid="3">Release Date</a></li>
                                        <li><a sortbyid="4">Avg. Rating</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>

                    </div>

                    <div class="row">
                        <div class="col-md-12">
                            <div class="totall-product" id="display_all_asset_filter_option">

                                {{--                                <button type="button" class="button button-keywords clickremoveassetlist">On Sale &nbsp;<span>X</span></button>--}}

                            </div>


                            <br><br>

                        </div>
                    </div>



                    <div class="row product-grid-4" id="displayfilterassetlist">

                        @if($filter_publishassetdetails)
                            @foreach($filter_publishassetdetails as $key => $publish_asset_detail)

                                @include('frontend.include.assetsearch')

                            @endforeach
                        @endif

                    </div>


                    <!--pagination-->


                    <br>

                    <div class="row product-grid-4" >
                        <div class="col-md-12">
                            <div class="pagination-area mt-15 mb-sm-5 mb-lg-0">
                                <nav aria-label="Page navigation example">
                                    <ul class="pagination justify-content-center" id="displayfilterassetlistpagination">

                                    </ul>
                                </nav>
                            </div>
                        </div>
                    </div>





                </div>

                <div class="col-lg-3 primary-sidebar sticky-sidebar">

                    <form method="POST" enctype="multipart/form-data" id="asset_all_field_filter_form">

                    <div class="row">
                        <div class="col-lg-12 col-mg-6"></div>
                        <div class="col-lg-12 col-mg-6"></div>
                    </div>

                    <div class="widget-category">
                        <div class="row">
                            <div class="col-md-6"><h5 class="section-title style-1 wow fadeIn animated">Refine by</h5></div>
                            <div class="col-md-6"><a href="{{ route('asset.index') }}"><h5 class="section-title style-1  wow fadeIn animated designclearfilter">Clear filters</h5></a></div>
                        </div>

                    </div>
                    <hr>
                    <div class="widget-category">
                        <div class="row">
                            <div class="col-md-12">
                                <table class="mb-0">
                                    <tr class="clickfilteroption">
                                        <td><h5 class="section-title style-1 wow fadeIn animated">Sales</h5></td>
                                        <td><h5 class="section-title style-1 wow fadeIn animated text-right displayplusminusicon"><i class="fa fa-minus" aria-hidden="true"></i></h5></td>
                                    </tr>
                                </table>

                            </div>

                            <div class="col-md-12 mt-15 showhidefilteroption">

                                @if(isset($_GET['popularasset']) && $_GET['popularasset'] != '' && $_GET['popularasset'] == 1)
                                    <input class="form-check-input filterassetdetails" type="checkbox" name="salestype" displaytext="On Sale" id="exampleCheckbox1" value="1" checked>
                                @else
                                    <input class="form-check-input filterassetdetails" type="checkbox" name="salestype" displaytext="On Sale" id="exampleCheckbox1" value="1">
                                @endif


                                <label class="form-check-label" for="exampleCheckbox1">On Sale<span id="dispay_count_assetlist_onsale">(0)</span></label>
                                <br>
                                @if(isset($_GET['popularasset']) && $_GET['popularasset'] != '' && $_GET['popularasset'] == 2)
                                        <input class="form-check-input filterassetdetails" type="checkbox" name="salestype" displaytext="Top Selling" id="exampleCheckbox2" value="2" checked>
                                @else
                                        <input class="form-check-input filterassetdetails" type="checkbox" name="salestype" displaytext="Top Selling" id="exampleCheckbox2" value="2">
                                @endif

                                <label class="form-check-label" for="exampleCheckbox2">Top Selling<span id="dispay_count_assetlist_topselling"> (0)</span></label>
                                <br>
                                @if(isset($_GET['popularasset']) && $_GET['popularasset'] != '' && $_GET['popularasset'] == 3)
                                        <input class="form-check-input filterassetdetails" type="checkbox" name="salestype" displaytext="Top New" id="exampleCheckbox3" value="3" checked>
                                @else
                                        <input class="form-check-input filterassetdetails" type="checkbox" name="salestype" displaytext="Top New" id="exampleCheckbox3" value="3">
                                @endif

                                <label class="form-check-label" for="exampleCheckbox3">Top New<span id="dispay_count_assetlist_topnew"> (0)</span></label>
                                <br>
                                @if(isset($_GET['popularasset']) && $_GET['popularasset'] != '' && $_GET['popularasset'] == 4)
                                        <input class="form-check-input filterassetdetails" type="checkbox" name="salestype" displaytext="Top Free" id="exampleCheckbox4" value="4" checked>
                                @else
                                        <input class="form-check-input filterassetdetails" type="checkbox" name="salestype" displaytext="Top Free" id="exampleCheckbox4" value="4">
                                @endif

                                <label class="form-check-label" for="exampleCheckbox4">Top Free<span id="dispay_count_assetlist_topfree">(0)</span></label>
                                <br>
                            </div>
                        </div>

                    </div>
                    <hr>
                    <div class="widget-category">

                        <div class="row">

                            <div class="col-md-12">
                                <table class="mb-0">
                                    <tr class="clickfilteroption">
                                        <td><h5 class="section-title style-1 wow fadeIn animated">Category</h5></td>
                                        <td><h5 class="section-title style-1 wow fadeIn animated text-right displayplusminusicon"><i class="fa fa-minus" aria-hidden="true"></i></h5></td>
                                    </tr>
                                </table>

                            </div>


                            <div class="col-md-12 mt-15 showhidefilteroption">

                                @php
                                    $asset_categorys = \App\Models\AssetCategory::orderByDesc('created_at')->get();
                                @endphp
                                @if (count($asset_categorys) > 0)
                                    @foreach ($asset_categorys as $key => $asset_category)

                                        @php
                                            $asset_detail_count= \App\Models\AssetDetails::where('category_id',$asset_category->id)->count();
                                           if(isset($_GET['asset_category']) && $_GET['asset_category'] != '' && $_GET['asset_category'] == $asset_category->id)
                                           {
                                        @endphp
                                        <input class="form-check-input filterassetdetails" type="checkbox" keys="{{ $key }}" name="asset_category" displaytext="{{ $asset_category->asset_categories_name }}" id="examplecategory{{ $key }}" value="{{ $asset_category->id }}" checked>
                                        @php

                                            }
                                            else
                                                {
                                        @endphp
                                        <input class="form-check-input filterassetdetails" type="checkbox" keys="{{ $key }}" name="asset_category" displaytext="{{ $asset_category->asset_categories_name }}" id="examplecategory{{ $key }}" value="{{ $asset_category->id }}">
                                        @php
                                            }
                                        @endphp


                                        <label class="form-check-label" for="examplecategory{{ $key }}">{{ $asset_category->asset_categories_name }}<span class="dispay_count_assetlist_category" catid="{{ $asset_category->id }}" id="dispay_count_assetlist_category{{ $asset_category->id }}"> (0)</span></label>
                                        <br>
                                    @endforeach
                                @endif

                            </div>

                        </div>



                    </div>
                    <hr>
                    <div class="widget-category">
                        <div class="row">
                            <div class="col-md-12">
                                <table class="mb-0">
                                    <tr class="clickfilteroption">
                                        <td><h5 class="section-title style-1 wow fadeIn animated">Verification</h5></td>
                                        <td><h5 class="section-title style-1 wow fadeIn animated text-right displayplusminusicon"><i class="fa fa-minus" aria-hidden="true"></i></h5></td>
                                    </tr>
                                </table>

                            </div>

                            <div class="col-md-12 mt-15 showhidefilteroption">
                                @if(isset($_GET['popularasset']) && $_GET['popularasset'] != '' && $_GET['popularasset'] == 5)
                                    <input class="form-check-input filterassetdetails" type="checkbox" name="verificationtype" displaytext="Asset Verified" id="exampleVerification1" value="1" checked>
                                @else
                                    <input class="form-check-input filterassetdetails" type="checkbox" name="verificationtype" displaytext="Asset Verified" id="exampleVerification1" value="1">
                                @endif

                                <label class="form-check-label" for="exampleVerification1">Asset Verified<span id="dispay_count_assetlist_verified"> (0)</span></label>
                                <br>
                                <input class="form-check-input filterassetdetails" type="checkbox" name="verificationtype" displaytext="Asset Unverified" id="exampleVerification2" value="2">
                                <label class="form-check-label" for="exampleVerification2">Asset Unverified<span id="dispay_count_assetlist_unverified"> (0)</span></label>

                            </div>
                        </div>

                    </div>
                    <hr>
                    <div class="widget-category">
                        <div class="row">
                            <div class="col-md-12">
                                <table class="mb-0">
                                    <tr class="clickfilteroption">
                                        <td><h5 class="section-title style-1 wow fadeIn animated">Class</h5></td>
                                        <td><h5 class="section-title style-1 wow fadeIn animated text-right displayplusminusicon"><i class="fa fa-minus" aria-hidden="true"></i></h5></td>
                                    </tr>
                                </table>

                            </div>

                            <div class="col-md-12 mt-15 showhidefilteroption">
                                @php
                                    $asset_classs = \App\Models\ClassDetails::orderByDesc('created_at')->get();
                                @endphp
                                @if (count($asset_classs) > 0)
                                    @foreach ($asset_classs as $key => $asset_class)
                                        <input class="form-check-input filterassetdetails" type="checkbox" displaytext="{{ $asset_class->classname }}" name="asset_classid" id="exampleclass{{ $key }}" value="{{ $asset_class->id }}">
                                        <label class="form-check-label" for="exampleclass{{ $key }}">{{ $asset_class->classname }}<span class="dispay_count_assetlist_class" classid="{{ $asset_class->id }}" id="dispay_count_assetlist_class{{ $asset_class->id }}"> (0)</span></label>
                                        <br>
                                    @endforeach
                                @endif
                            </div>
                        </div>

                    </div>
                    <hr>
                    <div class="widget-category">
                        <div class="row">
                            <div class="col-md-12">
                                <table class="mb-0">
                                    <tr class="clickfilteroption">
                                        <td><h5 class="section-title style-1 wow fadeIn animated">LOD</h5></td>
                                        <td><h5 class="section-title style-1 wow fadeIn animated text-right displayplusminusicon"><i class="fa fa-minus" aria-hidden="true"></i></h5></td>
                                    </tr>
                                </table>

                            </div>

                            <div class="col-md-12 mt-15 showhidefilteroption">
                                @php
                                    $asset_lods= \App\Models\LevelofDevelopment::orderByDesc('created_at')->get();
                                @endphp
                                @if (count($asset_lods) > 0)
                                    @foreach ($asset_lods as $key => $asset_lod)
                                        <input class="form-check-input filterassetdetails" type="checkbox" displaytext="{{ $asset_lod->levelofdevelopmentsname }}" name="asset_lodid" id="examplelod{{ $key }}" value="{{ $asset_lod->id }}">
                                        <label class="form-check-label" for="examplelod{{ $key }}">{{ $asset_lod->levelofdevelopmentsname }}<span class="dispay_count_assetlist_lod" lodid="{{ $asset_lod->id }}" id="dispay_count_assetlist_lod{{ $asset_lod->id }}"> (0)</span></label>
                                        <br>
                                    @endforeach
                                @endif
                            </div>
                        </div>

                    </div>
                    <hr>
                    <!-- Fillter By Price -->
                    <div class="sidebar-widget price_range range mb-30">
                        <div class="widget-header position-relative  pb-10">
                            <h5 class="widget-title mb-10">Pricing</h5>
                            <div class="bt-1 border-color-1"></div>
                        </div>
                        <div class="price-filter">
                            <div class="price-filter-inner">
                                <div id="slider-range"></div>
                                <div class="price_slider_amount">
                                    <div class="label-input">
                                        <input type="hidden" id="asset_range_min_val" value="-1">
                                        @php
                                            $highestcost = \App\Models\PublishedAssetDetails::orderByDesc('offer_price')->first();
                                            $displaycost=0;
                                            if($highestcost)
                                            {
                                            $displaycost= $highestcost->offer_price;
                                            }
                                        @endphp
                                        <input type="hidden" id="asset_range_max_val" value="{{ $displaycost }}">
                                        <span>Range:</span><input type="text" class="filterassetdetails" id="amount" name="price" placeholder="Add Your Price" />
                                        <br>
                                        <br>
                                        <button type="button" class="button button-keywords filterassetdetails1">Filter</button>
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>
                    <hr>
                    <div class="widget-category mb-30">
                        <h5 class="section-title style-1 mb-30 wow fadeIn animated">Ratings</h5>

                        <div class="stars">
                            <i class="fa-solid fa-star filterassetdetails"></i>
                            <i class="fa-solid fa-star filterassetdetails"></i>
                            <i class="fa-solid fa-star filterassetdetails"></i>
                            <i class="fa-solid fa-star filterassetdetails"></i>
                            <i class="fa-solid fa-star filterassetdetails"></i>
                        </div>
                        <br>
                        {{--                        <button type="submit" class="btn btn-primary btn-lg btn-block clickremovestarrating">Filter</button>--}}

                    </div>
                    <hr>
                    <div class="widget-category">
                        <div class="row">
                            <div class="col-md-12">
                                <table class="mb-0">
                                    <tr class="clickfilteroption">
                                        <td><h5 class="section-title style-1 wow fadeIn animated">Keywords</h5></td>
                                        <td><h5 class="section-title style-1 wow fadeIn animated text-right displayplusminusicon"><i class="fa fa-minus" aria-hidden="true"></i></h5></td>
                                    </tr>
                                </table>

                            </div>

                            <div class="col-md-12 mt-15 showhidefilteroption">

                                <input class="form-control filterassetdetails" type="text" name="salestype" displaytext="Top Selling" id="exampleCheckbox2" placeholder="Keywords">


                            </div>
                        </div>

                    </div>

                    </form>

                    <!-- Product sidebar Widget -->
                </div>

            </div>

            <input type="hidden" id="assetlist_filter_load" value="0">
            <input type="hidden" id="assetlist_filtercount_load" value="0">
            <input type="hidden" id="assetlist_pagination_load" value="0">
            <input type="hidden" id="assetlist_filter_count_load" value="0">

        </div>
    </section>


    <style>
        label.form-check-label {
            font-size: 13px;
            font-weight: 400;
        }
        .pagination {
            padding-left: 0;
            list-style: none;
        }
        .designclearfilter {
            font-weight: 600 ! important;
            color: #2196f3;
            font-size: 14px ! important;
        }
        .button-keywords {
            font-size: 14px;
            font-weight: 700;
            padding: 0px 8px;
            border-radius: 4px;
            color: #000;
            border: 1px solid #adadad;
            background-color: #ffffff;
        }
        table td, table th {
            padding: 10px 0px;
        }
    </style>

    <style>
        /* styles.css */
        .loader {
            display: none; /* Hidden by default */
            position: absolute;
            top: 20%;
            left: 30%;
            transform: translate(-50%, -50%);
            font-size: 15px;
            color: #fff;
            background-color: rgba(0, 0, 0, 0.7);
            padding: 5px 15px;
            border-radius: 5px;
            z-index: 9999; /* Ensure it's above other elements */
        }


        .loader, .bar {
            width: 100px;
            height: 35px;
        }
        @media (min-width: 1200px) {
            .col-xl-3 {
                flex: 0 0 auto;
                width: 26%;
            }
        }
    </style>

@endsection

@section('script')
@include('frontend.include.asset-js')
@endsection