@include('site.controllers.upper-header')
@include('site.controllers.header')


<div class="container px-0 ">
    <div class="row">
        <div class="col-sm-12">
            <section class="comment-area my-10 py-10">
                <ul class="nav nav-tabs auction-tabs" style="margin-top: -2px;">
                    <li class="active" onclick="auction_tab(0)">
                        <button class="btn btn-default" id="nextAuction" data-toggle="tab"
                                href="#next-auctions">
                            <strong>{{trans('site.nextAuctions')}}</strong></button>
                    </li>
                    <li onclick="auction_tab(1)">
                        <button class="btn btn-default" id="currentAuction" data-toggle="tab"
                                href="#current-auctions">
                            <strong>{{trans('site.currentAuctions')}}
                            </strong></button>
                    </li>
                    <li onclick="auction_tab(1)">
                        <button class="btn btn-default" id="previousAuctions" data-toggle="tab"
                                href="#previous-auctions">
                            <strong>{{trans('site.previousAuctions')}}</strong></button>
                    </li>
                </ul>

                <div id="owl-div" class="owl-carousel owl-theme owl-t">
                    <div class="item" style="cursor: pointer" onclick="next_auction('9:00')"><h4>9:00 AM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('9:30')"><h4>9:30 AM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('10:00')"><h4>10:00 AM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('10:30')"><h4>10:30 AM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('11:00')"><h4>11:00 AM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('11:30')"><h4>11:30 AM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('12:00')"><h4>12:00 PM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('12:30')"><h4>12:30 PM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('13:00')"><h4>1:00 PM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('13:30')"><h4>1:30 PM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('14:00')"><h4>2:00 PM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('14:30')"><h4>2:30 PM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('15:00')"><h4>3:00 PM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('15:30')"><h4>3:30 PM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('16:00')"><h4>4:00 PM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('16:30')"><h4>4:30 PM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('17:00')"><h4>5:00 PM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('17:30')"><h4>5:30 PM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('18:00')"><h4>6:00 PM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('18:30')"><h4>6:30 PM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('19:00')"><h4>7:00 PM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('19:30')"><h4>7:30 PM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('20:00')"><h4>8:00 PM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('20:30')"><h4>8:30 PM</h4></div>
                    <div class="item" style="cursor: pointer" onclick="next_auction('21:00')"><h4>9:00 PM</h4></div>


                </div>
            </section>
        </div>
    </div>


    <div class="profilepage">
        <div class="row">
            <form style="border: none !important; height: auto !important;display: table; width: 100%;" method="GET"
                  action="{{route('search_auction')}}">
                <div class="col-md-3 col-xs-6 mb-4">
                    <div class="select">
                        <select name="category_id" class="form-control select-style primary-select">
                            <option disabled selected class="option form-control"><i
                                    class="icon-menu px-10"></i>
                                @lang('site.allCategories')
                            </option>
                            @foreach($auction_categories as $auction_category)
                                <option value="{{$auction_category->id}}"
                                        class="option form-control">{{$auction_category->name[Lang::getLocale()]}}</option>
                            @endforeach
                        </select>
                    </div>
                </div>
                <div class="col-md-3 col-xs-6 mb-4">

                    <div class="">
                        <select name="type" class="form-control selectpicker show-menu-arrow">
                            <option selected disabled class="option form-control">{{trans('site.auctionType')}}</option>
                            <option value="direct" class="option form-control">{{trans('site.directAuction')}}</option>
                            <option value="normal" class="option form-control">{{trans('site.normalAuction')}}</option>
                        </select>
                    </div>
                </div>
                <div class="col-md-3 col-xs-6 mb-4">

                    <div class="select">
                        <select name="city_id" class="form-control select-style">
                            <option selected disabled class="option form-control">{{trans('site.choseCity')}}</option>
                            @foreach($cities as $city)
                                <option value="{{$city->id}}"
                                        class="option form-control">{{$city->name[Lang::getLocale()]}}</option>
                            @endforeach
                        </select>
                    </div>

                </div>

                {{--                <div class="col-md-2 col-xs-6 mb-4">--}}

                {{--                    <select name="time" required class="form-control text-right">--}}
                {{--                        <option disabled selected>@lang('site.selectTime')</option>--}}

                {{--                        <option style="direction: ltr" value="09:00">9:00 AM</option>--}}
                {{--                        <option style="direction: ltr" value="09:30">9:30 AM</option>--}}
                {{--                        <option style="direction: ltr" value="10:00">10:00 AM</option>--}}
                {{--                        <option style="direction: ltr" value="10:30">10:30 AM</option>--}}
                {{--                        <option style="direction: ltr" value="11:00">11:00 AM</option>--}}
                {{--                        <option style="direction: ltr" value="11:30">11:30 AM</option>--}}
                {{--                        <option style="direction: ltr" value="12:00">12:00 PM</option>--}}
                {{--                        <option style="direction: ltr" value="12:30">12:30 PM</option>--}}
                {{--                        <option style="direction: ltr" value="13:00">1:00 PM</option>--}}
                {{--                        <option style="direction: ltr" value="13:30">1:30 PM</option>--}}
                {{--                        <option style="direction: ltr" value="14:00">2:00 PM</option>--}}
                {{--                        <option style="direction: ltr" value="14:30">2:30 PM</option>--}}
                {{--                        <option style="direction: ltr" value="15:00">3:00 PM</option>--}}
                {{--                        <option style="direction: ltr" value="15:30">3:30 PM</option>--}}
                {{--                        <option style="direction: ltr" value="16:00">4:00 PM</option>--}}
                {{--                        <option style="direction: ltr" value="16:30">4:30 PM</option>--}}
                {{--                        <option style="direction: ltr" value="17:00">5:00 PM</option>--}}
                {{--                        <option style="direction: ltr" value="17:30">5:30 PM</option>--}}
                {{--                        <option style="direction: ltr" value="18:00">6:00 PM</option>--}}
                {{--                        <option style="direction: ltr" value="18:30">6:30 PM</option>--}}
                {{--                        <option style="direction: ltr" value="19:00">7:00 PM</option>--}}
                {{--                        <option style="direction: ltr" value="19:30">7:30 PM</option>--}}
                {{--                        <option style="direction: ltr" value="20:00">8:00 PM</option>--}}
                {{--                        <option style="direction: ltr" value="20:30">8:30 PM</option>--}}
                {{--                        <option style="direction: ltr" value="21:00">9:00 PM</option>--}}
                {{--                    </select>--}}

                {{--                    @if ($errors->has('time'))--}}
                {{--                        <small class="text-danger">{{ $errors->first('time') }}</small>--}}
                {{--                    @endif--}}
                {{--                </div>--}}
                <div class="col-md-1 col-xs-6 mb-4 text-center">
                    <button type="submit" class="btn btn-primary">{{trans('site.search')}}</button>
                </div>
                <div class="col-sm-12">
                    <hr class="mt-10">
                </div>
            </form>
        </div>
        <div class="tab-content">
            <!-- next-auctions -->

            <div id="next-auctions" class="nav-link tab-pane fade in active">
                <!-- form -->
                <div class="row">
                    <div id="next">
                        @include('site.controllers.next_auction')
                    </div>
                    <div class="ajax-load text-center" style="display:none">
                        <p><img style="width: 75px;" src="{{asset('loading_image.gif')}}"></p>
                    </div>
                </div>
            </div>

            <!-- current-auctions -->
            <div id="current-auctions" class="nav-link tab-pane fade">
                <div class="row">
                    @foreach($now_auctions as $row)
                        <div class="col-sm-6">
                            @include('site.controllers.auction')
                        </div>
                    @endforeach

                    @if(count($now_auctions) > 0)
                        <div class="col-sm-12 text-center">
                            <a href="{{route('auctions', 'now')}}" class="btn btn-primary mt-30">@lang('site.more')</a>
                        </div>
                    @endif
                </div>
            </div>
            <!-- previous auctions -->
            <div id="previous-auctions" class="nav-link tab-pane fade">
                <div class="row">
                    @foreach($last_auctions as $row)
                        <div class="col-sm-6">
                            @include('site.controllers.auction')
                        </div>
                    @endforeach

                    @if(count($last_auctions) > 0)
                        <div class="col-sm-12 text-center">
                            <a href="{{route('auctions', 'last')}}" class="btn btn-primary mt-30">@lang('site.more')</a>
                        </div>
                    @endif
                </div>
            </div>
        </div>
    </div>
</div>

<section class="comment-area mt-30">
    <h4 class="text-center mt-30 related-ads-title"><strong>@lang('site.harajSection') </strong></h4>

    <div class="container">
        <div class="row">
            <div class="col-sm-12 mb-20">
                <div class="row">
                    <div class="col-sm-6">
                        <form method="GET" action="{{route('search_haraj')}}" enctype="multipart/form-data">
                            <div class="input-group">
                                <input type="text" name="title" class="form-control" aria-label="..."
                                       placeholder="{{trans('site.search_here')}} ">
                                <div class="input-group-btn">
                                    <div class="select w-120">
                                        <select name="city_id" class="form-control select-style">
                                            <option value="" selected disabled
                                                    class="option form-control">@lang('site.city')
                                            </option>
                                            @foreach($cities as $city)
                                                <option value="{{$city->id}}"
                                                        class="option form-control">{{$city->name[App::getLocale()]}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                                <button class="btn btn-primary search-btn" type="submit"><i class="icon-search"></i>
                                </button>
                            </div>
                        </form>
                    </div>


                    <div class="col-sm-6 text-reverse">
                        {{--                        <button class="btn btn-default pa-9" type="button"><i class="icon-menu"></i></button>--}}
                        {{--                        <button class="btn btn-default pa-9" type="button"><i class="icon-map"></i></button>--}}
                    </div>
                </div>
            </div>
            <div class="col-sm-12">

                <ul class="nav nav-tabs">

                    <li class="active" onclick="haraj(0)">
                        <button class="pa-9" data-toggle="tab" href="#haraj_all">


                            <i class="fa fa-folder-open"></i>
                            <br><small><strong>

                                    @lang('site.all')
                                </strong></small></button>
                    </li>

                    @foreach($haraj_categories as $haraj_category)

                        <li>
                            <button class="pa-9" data-toggle="tab" onclick="haraj({{$haraj_category->id}})"
                                    href="#haraj_{{$haraj_category->id}}">


                                <img src="{{$haraj_category->image}}" style="height: 14px">

                                <br><small><strong>

                                        {{$haraj_category->name[App::getLocale()]}}

                                    </strong></small></button>
                        </li>
                    @endforeach

                </ul>
            </div>

            <div class="tab-content">
                <div id="haraj_all"
                     class="tab-pane fade in active">


                    <div class="col-sm-12 mb-60 mt-20">

                        <ul class="nav nav-tabs">


                        </ul>
                        {{--                                <div class="btn-group" role="group" aria-label="...">--}}
                        {{--                                    <button type="button" class="btn btn-default mx-5 px-5">--}}
                        {{--                                        <small>{{$item->name[Lang::getLocale()]}}</small></button>--}}

                        {{--                                </div>--}}
                    </div>


                </div>
                <style>
                    .haraj_out .active button {
                        background-color: #aaaaaa;
                    }
                </style>
                @foreach($haraj_categories as $haraj_category)

                    <div id="haraj_{{$haraj_category->id}}"
                         class="haraj_out tab-pane fade ">


                        <div class="col-sm-12 mb-60 mt-20">

                            <ul class="nav nav-tabs">
                                <li class="active">
                                    <button class="btn btn-default mx-5 px-5" onclick="haraj({{$haraj_category->id}})"
                                            data-toggle="tab"><small>@lang('site.all')</small>
                                    </button>
                                </li>
                                @foreach(\App\Models\HarajCategory::where('parent_id', $haraj_category->id)->get() as $item)
                                    <li onclick="haraj_in({{$item->id}})">
                                        <button class="btn btn-default mx-5 px-5" data-toggle="tab">
                                            <small>{{$item->name[Lang::getLocale()]}}</small></button>
                                    </li>
                                @endforeach

                            </ul>
                            {{--                                <div class="btn-group" role="group" aria-label="...">--}}
                            {{--                                    <button type="button" class="btn btn-default mx-5 px-5">--}}
                            {{--                                        <small>{{$item->name[Lang::getLocale()]}}</small></button>--}}

                            {{--                                </div>--}}
                        </div>


                    </div>
                @endforeach

                <div class="ajax-load text-center" style="display:none">
                    <p><img style="width: 75px;" src="{{asset('loading_image.gif')}}"></p>
                </div>
                <div id="post-haraj">
                    @include('site.controllers.product')
                </div>


            </div>
        </div>
    </div>


</section>


<!-- Add Advert modal -->
<div class="modal" id="signupModal"
     role="dialog" aria-labelledby="myModalLabel"
     aria-hidden="true">

    <div class="modal-dialog signmodel">
        <div class="modal-content">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <section>
                <img src="{{asset('site/images/green/choose.png')}}" class="mb-4 mx-auto" width="60px" alt="">
            </section>
            <h4 class="mb-20"><strong>@lang('site.chose_ad_type')</strong></h4>

            <ul class="d-flex space-around">

                <li><a href="{{route('auction_term')}}" class="color-black">
                        <article>
                            <img src="{{asset('site/images/auction.png')}}" class="mb-4 mx-auto gray" width="100%"
                                 alt="">

                            <h5><strong>@lang('site.auctionAd')</strong></h5>
                        </article>
                    </a></li>
                <li>


                    <a href="{{route('pledge')}}" class="color-black">
                        <article>
                            <img src="{{asset('site/images/adds.png')}}" class="mb-4 mx-auto primary" width="100%"
                                 alt="">

                            <h5><strong>@lang('site.harajAd')</strong></h5>
                        </article>
                    </a>


                </li>
            </ul>
        </div>
    </div>
</div>

<div class="modal  fade text-center" id="video-show"
     role="dialog" aria-labelledby="myModalLabel"
     aria-hidden="true">

    <div class="modal-dialog signmodel">
        <div class="modal-content">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <iframe class="mt-30" width="100%" height="315" src="{{$setting->video}}"
                    frameborder="0"
                    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
                    allowfullscreen></iframe>
        </div>
    </div>
</div>

@include('site.controllers.footer')