@extends('layouts.public')

@section('content')
    <main>
        <!-- Static Banner Area Start -->
        <section id="slider">
            <div class="static-banner relative">
                <div class="overlay blue-overlay-5"></div>
                <div class="page-head">
                    <h2 class="page-title">Questions and Answers</h2>
                    <ul class="page-title-btn">
                        <li><a href="{{url("/")}}" target="_blank">Home <i class="fa fa-caret-right"
                                                                           aria-hidden="true"></i></a></li>
                        <li><a class="active">Questions And Answers</a></li>
                    </ul>
                </div>
            </div>
        </section>
        <!-- Static Banner Area End -->
        <div class="advance-search-area ">
            <div class="container ">
                <div class="row">
                    <div class="col-sm-12">
                        <form action="{{route("resources")}}" method="get">

                            <div class="event-filter flex">
                                <div class="single-filter ft-300">
                                    <input placeholder="Enter subject or year or topic here" name="search"
                                           value="{{$search ?? ""}}"
                                           onfocus="this.placeholder = ''"
                                           onblur="this.placeholder = 'Enter subject or year or topic here'"
                                           type="text">
                                </div>
                                <div class="single-filter ft-225">
                                    <div class="select-ct">
                                        <select name="level">
                                            <option value="">Any level</option>
                                            @foreach(\App\Level::all() as $level)
                                                <option
                                                    value="{{$level->id}}" {{(isset($search_level) && $search_level == $level->id)? " selected='selected'":"" }}>{{$level->name}}</option>
                                            @endforeach

                                        </select>
                                    </div>
                                </div>
                                <div class="single-filter ft-330">
                                    <div class="select-ct">
                                        <select name="category">
                                            <option value="">Any Subject</option>
                                            @foreach(\App\Category::all() as $category)
                                                <option
                                                    value="{{$category->id}}" {{(isset($search_category) && $search_category == $category->id)? " selected='selected'":"" }}>{{$category->name}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>

                                <div class="single-filter ft-165 mr-n">
                                    <button class="btn" type="submit">Search</button>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
        <section class="section-full blog-home blog-left-widget " style="padding-top: 5px !important;">
            <div class="container">
                <div class="row">
                    <div class="col-md-9 col-sm-8 course-grid1">
                        <div class="total-blog mt-10">
                            @forelse($lessons as $lesson)
                                                                <div class="single-list-course row no-gutter">
                                    <div class="col-xs-12">
                                        <div class="list-course-content">
                                            <h3><a href="{{route("lessons.show",$lesson->id)}}"
                                                >{!! $lesson->name !!}</a></h3>
                                            <h6>Level: {{$lesson->level->name ?? ""}}</h6>
                                            <h6>Subject: {{$lesson->category->name ?? ""}}</h6>
                                            @if($lesson->type != "Text")
                                                <p>{!! $lesson->description !!}</p>
                                            @endif
                                            <div class="course-bottom-list flex space-between">
                                                {{--<div class="single-bottom icon">
                                                    <i class="fa fa-star"></i>
                                                    <i class="fa fa-star"></i>
                                                    <i class="fa fa-star"></i>
                                                    <i class="fa fa-star"></i>
                                                    <i class="fa fa-star"></i>
                                                </div>--}}
                                                <div class="single-bottom review">
                                                    <span>{{$lesson->readings->count()}} Readers</span>
                                                </div>
                                                @if($lesson->instructor_id)
                                                    <div class="single-bottom trainer">
                                                        <a class="btn"
                                                           href="{{route("users.show",$lesson->instructor_id)}}"><span
                                                                class="et-line icon-profile-male "></span><span>{{$lesson->instructor->name}}</span></a>
                                                    </div>
                                                @endif
                                                {{--<div class="single-bottom seats">
                                                    <span>Total 15 Seats</span>
                                                </div>--}}
                                                <div class="single-bottom seats">
                                                    @if($lesson->price>0 && !$lesson->isMyResource())
                                                        <a class="btn primary-color"
                                                           href="{{route("purchase.confirm",$lesson)}}"><span>Buy({{$lesson->price}}F)</span></a>
                                                    @else
                                                        @if($lesson->type == "File")
                                                            <a class="btn" href="{{route("lessons.show",$lesson)}}">Download</a>
                                                        @elseif($lesson->type == "Video")
                                                            <a class="btn"
                                                               href="{{route("lessons.show",$lesson)}}"><span>Watch</span></a>
                                                        @else
                                                            <a class="btn"
                                                               href="{{route("lessons.show",$lesson)}}"><span>Read</span></a>
                                                        @endif

                                                    @endif
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            @empty
                                <h1>No Courses found for "<span class="primary-color">{{$search ?? ""}}</span>"</h1>
                            @endforelse
                            @include("pagination.default",["paginator"=>$lessons])
                        </div>
                    </div>
                    <div class="col-md-3 col-sm-4">

                        <div class="single-widget">
                            <h2 class="main-head-event">Levels</h2>
                            <div class="common-shadow post-cat">
                                <ul>
                                    @foreach(\App\Level::all() as $l)
                                        <li class="flex space-between"><a
                                                href="{{route("resources",["level"=>$l])}}">{{$l->name}}</a>
                                            <a href="#">
                                                @if($l->lessons->count() <10)
                                                    0{{$l->lessons->count()}}
                                                @else
                                                    {{$l->lessons->count()}}
                                                @endif
                                            </a></li>
                                    @endforeach
                                </ul>
                            </div>
                        </div>
                        <div class="single-widget">
                            <h2 class="main-head-event">Categories</h2>
                            <div class="common-shadow post-cat">
                                <ul>
                                    @foreach(\App\Category::all() as $category)
                                        <li class="flex space-between"><a
                                                href="{{route("resources",["category"=>$category])}}">{{$category->name}}</a>
                                            <a href="#">
                                                @if($category->lessons->count() <10)
                                                    0{{$category->lessons->count()}}
                                                @else
                                                    {{$category->lessons->count()}}
                                                @endif
                                            </a></li>
                                    @endforeach
                                </ul>
                            </div>
                        </div>

                    </div>

                </div>
            </div>
        </section>
        <!-- Regular Course Area Start -->

        <!-- / #Regular Course End -->
        <!-- Col To Action Start -->
    {{--<section class="cta-1 cta2 ct3">
        <div class="cta-bg2 relative">
            <div class="overlay cta-overlay-bg-blue"></div>
            <div class="container">
                <div class="row">
                    <div class="col-sm-12">
                        <div class="cta-content">
                            <h2>Thousands of students are graduated. Why not you?</h2>
                            <form action="#" class="cta-register">
                                <div class="row">
                                    <h3 class="text-center mb-40 primary-color fz-24">Register Now</h3>
                                    <div class="col-md-offset-1 col-md-5 col-sm-6 col-xs-12">
                                        <p><input type="text" onfocus="this.placeholder = ''"
                                                  onblur="this.placeholder = 'Your Name'"
                                                  placeholder="Enter your Full Name"></p>
                                        <p><input type="email" onfocus="this.placeholder = ''"
                                                  onblur="this.placeholder = 'Your Email Address'"
                                                  placeholder="Enter your Full Name"></p>
                                    </div>
                                    <div class="col-md-5 col-sm-6 col-xs-12">
                                        <p><input type="text" onfocus="this.placeholder = ''"
                                                  onblur="this.placeholder = 'Your Phone Number'"
                                                  placeholder="Enter your Full Name"></p>
                                        <div class="select-ct">
                                            <select style="display: none;">
                                                <option>Choose course</option>

                                                @foreach($courses as $c)
                                                    <option value="{{}}">Saab</option>
                                                @endforeach
                                            </select>
                                            <div class="nice-select" tabindex="0"><span class="current">Choose course</span>
                                                <ul class="list">
                                                    <li data-value="1" class="option selected">Choose course</li>
                                                    <li data-value="2" class="option">Saab</li>
                                                    <li data-value="3" class="option">Opel</li>
                                                    <li data-value="4" class="option">Audi</li>
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <p class="text-center">
                                        <button class="submit-btn">Submit</button>
                                    </p>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>--}}
    <!-- Col To Action End -->
        <!-- Core Features Area Start -->
    {{--<section class="section-full">
        <div class="container">
            <div class="core-feature">
                <div class="row">
                    <div class="col-md-offset-2 col-md-8 col-sm-12">
                        <div class="section-head text-center pb-100">
                            <h2 class="first-title">Our Core Features</h2>
                            <p>Lorem ipsum dolor sit amet, consectetur adippisicing
                                elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud</p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="core-feature-body">
                    <div class="col-sm-6">
                        <div class="row">
                            <div class="single-feature">
                                <div class="col-md-2 col-sm-3">
                                    <div class="single-icon">
                                        <a href="#">
                                            <span class="et-line icon-heart text-black"></span>
                                        </a>
                                    </div>
                                </div>
                                <div class="col-md-10 col-sm-9">
                                    <div class="feture-content">
                                        <h4 class="media-heading"><a href="#">Quality Certification</a></h4>
                                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
                                            ad minim veniam.</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="single-feature">
                                <div class="col-md-2 col-sm-3">
                                    <div class="single-icon">
                                        <a href="#">
                                            <span class="et-line icon-hotairballoon text-black mt-10"></span>
                                        </a>
                                    </div>
                                </div>
                                <div class="col-md-10 col-sm-9">
                                    <div class="feture-content">
                                        <h4 class="media-heading"><a href="#">Learning best practice</a></h4>
                                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
                                            ad minim veniam.</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="single-feature">
                                <div class="col-md-2 col-sm-3">
                                    <div class="single-icon">
                                        <a href="#">
                                            <span class="et-line icon-telescope text-black mt-10"></span>
                                        </a>
                                    </div>
                                </div>
                                <div class="col-md-10 col-sm-9">
                                    <div class="feture-content">
                                        <h4 class="media-heading"><a href="#">Online Resources</a></h4>
                                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
                                            ad minim veniam.</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-6">
                        <div class="row">
                            <div class="single-feature">
                                <div class="col-md-2 col-sm-3">
                                    <div class="single-icon">
                                        <a href="#">
                                            <span class="et-line icon-search text-black mt-10"></span>
                                        </a>
                                    </div>
                                </div>
                                <div class="col-md-10 col-sm-9">
                                    <div class="feture-content">
                                        <h4 class="media-heading"><a href="#">Study plan tutors</a></h4>
                                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
                                            ad minim veniam.</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="single-feature">
                                <div class="col-md-2 col-sm-3">
                                    <div class="single-icon">
                                        <a href="#">
                                            <span class="et-line icon-magnifying-glass text-black mt-10"></span>
                                        </a>
                                    </div>
                                </div>
                                <div class="col-md-10 col-sm-9">
                                    <div class="feture-content">
                                        <h4 class="media-heading"><a href="#">Advanced Practice</a></h4>
                                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
                                            ad minim veniam.</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="single-feature">
                                <div class="col-sm-3 col-md-2">
                                    <div class="single-icon">
                                        <a href="#">
                                            <span class="et-line icon-puzzle text-black mt-10"></span>
                                        </a>
                                    </div>
                                </div>
                                <div class="col-sm-9 col-md-10">
                                    <div class="feture-content">
                                        <h4 class="media-heading"><a href="#">Research</a></h4>
                                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
                                            ad minim veniam.</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>--}}
    <!-- / #Core Features End -->
    </main>
@endsection