@extends('user.layout.master')
@section('content')
<div class="clearfix"></div>
<div class="home-three-banner" style="background-image:url(user/assets/img/ukhomebg.jpg);"  data-overlay="6">
    <div class="container">
        <div class="simple-banner-caption">
            <div class="col-md-8 col-sm-10 banner-text">
                <h1>Find The  <span> Perfect DJ </span></h1>
                <form class="bt-form" method="get" action="{{route('searchDj')}}">
                   
                    <div class="col-md-6 col-sm-6">
                        <input class="form-control" type="date" placeholder="Event Date" name="event_date" required>
                    </div>
                    <div class="col-md-6 col-sm-6">
                        <select class="form-control" name="start_time" required>
                            <option selected disabled>Event Start Time</option>
                            <option value="00:00">00:00</option>
                            <option value="00:30">00:30</option>
                            <option value="01:00">01:00</option>
                            <option value="01:30">01:30</option>
                            <option value="02:00">02:00</option>
                            <option value="02:30">02:30</option>
                            <option value="03:00">03:00</option>
                            <option value="03:30">03:30</option>
                            <option value="04:00">04:30</option>
                            <option value="05:00">05:00</option>
                            <option value="05:30">05:30</option>
                            <option value="06:00">06:00</option>
                            <option value="06:30">06:30</option>
                            <option value="07:00">07:00</option>
                            <option value="07:30">07:30</option>
                            <option value="08:00">08:00</option>
                            <option value="08:30">08:30</option>
                            <option value="09:00">09:00</option>
                            <option value="09:30">09:30</option>
                            <option value="10:00">10:00</option>
                            <option value="10:30">10:30</option>
                            <option value="11:00">11:00</option>
                            <option value="11:30">11:30</option>
                            <option value="12:00">12:00</option>
                            <option value="12:30">12:30</option>
                            <option value="13:00">13:00</option>
                            <option value="13:30">13:30</option>
                            <option value="14:00">14:00</option>
                            <option value="14:30">14:30</option>
                            <option value="15:00">15:00</option>
                            <option value="15:30">15:30</option>
                            <option value="16:00">16:00</option>
                            <option value="16:30">16:30</option>
                            <option value="17:00">17:00</option>
                            <option value="17:30">17:30</option>
                            <option value="18:00">18:00</option>
                            <option value="18:30">18:30</option>
                            <option value="19:00">19:00</option>
                            <option value="19:30">19:30</option>
                            <option value="20:00">20:00</option>
                            <option value="20:30">20:30</option>
                            <option value="21:00">21:00</option>
                            <option value="21:30">21:30</option>
                            <option value="22:00">22:00</option>
                            <option value="22:30">22:30</option>
                            <option value="23:00">23:00</option>
                            <option value="23:30">23:30</option>
                            {{-- <option value="23:59">23:59</option> --}}
                        </select>
                        {{-- <input class="form-control" type="time" placeholder="Event Start Time" name="event_start" required> --}}
                    </div>
                     <div class="col-md-6 col-sm-6">
                        <input class="form-control" type="number" placeholder="Post Code" name="post_code" required>
                    </div>
                    <div class="col-md-6 col-sm-6">
                        <input class="form-control" type="number" placeholder="Number of Hours" name="total_hours" required>
                        {{-- <select class="form-control" id="Venue" name="venue_id" required>
                            <option value="">Choose Venue</option>
                            @foreach($venues as $venues_val)
                                <option value="{{$venues_val->id}}" >{{$venues_val->name}}</option>
                            @endforeach
                        </select> --}}
                    </div>
                    <div class="col-md-6 col-sm-6">
                        <select class="form-control" id="event_type" name="event_type" required>
                            <option value="">Choose Event Type</option>
                            @foreach($event as $event_val)
                                <option value="{{$event_val->id}}" >{{$event_val->name}}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-6 col-sm-6">
                        <input class="form-control" type="number" placeholder="Budget" name="Budget"  required>
                    </div>
                    <div class="col-md-6 col-sm-6">
                        <select class="form-control" id="Music" name="music_id" required>
                            <option value="">Choose Musics Genres</option>
                            @foreach($music as $music_val)
                                <option value="{{$music_val->id}}" >{{$music_val->name}}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-4 col-sm-5">
                        <button type="submit" class="btn btn-primary">Search DJs</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
{{-- <div class="banner trans" style="background-image:url(user/assets/img/slider-1.jpg);"  data-overlay="6">
    <div class="container">
        <div class="banner-caption">
            <div class="col-md-12 col-sm-12 banner-text">
                <h1>7,000+ Browse Event</h1>
                {{-- <div class="full-search-2 eclip-search italian-search hero-search-radius">
                    <div class="hero-search-content">
                        
                        <div class="row">
                        
                            <div class="col-lg-4 col-md-4 col-sm-12 small-padd b-r">
                                <div class="form-group">
                                    <div class="input-with-icon">
                                        <input type="text" class="form-control" placeholder="Job Title or Keywords">
                                        <i class="ti-search"></i>
                                    </div>
                                </div>
                            </div>
                            
                            <div class="col-lg-3 col-md-3 col-sm-12 small-padd b-r">
                                <div class="form-group">
                                    <div class="input-with-icon">
                                        <select id="choose-city" class="form-control">
                                            <option>Choose City</option>
                                            <option>Chandigarh</option>
                                            <option>London</option>
                                            <option>England</option>
                                            <option>Pratapcity</option>
                                            <option>Ukrain</option>
                                            <option>Wilangana</option>
                                        </select>
                                        <i class="ti-location-pin"></i>
                                    </div>
                                </div>
                            </div>

                            <div class="col-lg-3 col-md-3 col-sm-12 small-padd">
                                <div class="form-group">
                                <div class="input-with-icon">
                                    <select id="choose-category" class="form-control">
                                        <option>Job Category</option>
                                        <option>Education & Trainee</option>
                                        <option>Sales & Marketing</option>
                                        <option>Automotive Events</option>
                                        <option>Health & Medical</option>
                                        <option>Design & Development</option>
                                        <option>Book Services</option>
                                    </select>
                                    <i class="ti-layers"></i>
                                </div>
                            </div>
                            </div>
                            
                            <div class="col-lg-2 col-md-2 col-sm-12 small-padd">
                                <div class="form-group">
                                    <div class="form-group">
                                        <a href="#" class="btn btn-primary search-btn">Search</a>
                                    </div>
                                </div>
                            </div>
                            
                        </div>
                        
                    </div>
                </div> --}}
            </div>
        </div>
    </div>
    
</div> 
<div class="clearfix"></div>
<!-- Company Brand Start -->
<div class="company-brand">
    <div class="container">
        <div id="company-brands" class="owl-carousel">
            @foreach($promotion as $key => $promotion_val)
                <div class="brand-img">
                    <img src="{{asset('/uploads/admin/promotions/'.$promotion_val->image)}}" style="height: 100px;width: 100px;" class="img-responsive" alt="" />
                </div>
            @endforeach

            {{-- <div class="brand-img">
                <img src="user/assets/img/img-home-dark.png" class="img-responsive" alt="" />
            </div>
            <div class="brand-img">
                <img src="user/assets/img/mothercare-hom-darke.png" class="img-responsive" alt="" />
            </div>
            <div class="brand-img">
                <img src="user/assets/img/paypal-home-dark.png" class="img-responsive" alt="" />
            </div>
            <div class="brand-img">
                <img src="user/assets/img/serv-home-dark.png" class="img-responsive" alt="" />
            </div>
            <div class="brand-img">
                <img src="user/assets/img/xerox-home-dark.png" class="img-responsive" alt="" />
            </div>
            <div class="brand-img">
                <img src="user/assets/img/yahoo-home-dark.png" class="img-responsive" alt="" />
            </div>
            <div class="brand-img">
                <img src="user/assets/img/mothercare-hom-darke.png" class="img-responsive" alt="" />
            </div> --}}
        </div>
    </div>
</div>
<!-- Company Brand End -->
<section>
    <div class="container">
        <div class="row">
            <div class="main-heading">
                {{-- <p>200 New Event</p> --}}
                <h2>Event Type<span></span></h2></div>
        </div>
        <div class="row extra-mrg">
            
            <!-- Single New Job -->
        @foreach($event as $events)
            <div class="col-md-3 col-sm-6">
                <div class="job-instructor-layout">
                    {{-- <span class="tg-themetag tg-featuretag">Premium</span> --}}
                    <div class="job-instructor-thumb">
                        <a href="{{route('searchDj',['id'=>$events->id])}}"><img src="{{asset('/uploads/admin/events/'.$events->image)}}" class="img-fluid" alt="" /></a>
                    </div>
                    <div class="job-instructor-content">
                        <h4 class="instructor-title"><a>{{$events->name}}</a></h4>
                    </div>
                    {{-- <div class="job-instructor-footer">
                        <div class="instructor-students">
                            <h5 class="instructor-scount">$3.2K - $5K</h5>
                        </div>
                        <div class="instructor-corses">
                            <span class="c-counting">7 Open</span>
                        </div>
                    </div> --}}
                </div>
            </div>
        @endforeach
            <!-- Single New Job -->
        </div>
    </div>
</section>

<div class="clearfix"></div>
<section>
    <div class="container" >
        <div class="row">
            <div class="main-heading">
                <p>Best For Your Projects</p>
                <h2>Watch Our <span>video</span></h2></div>
        </div>
        {{-- <div class="video-part"><a href="#" data-toggle="modal" data-target="#my-video" class="video-btn"><i class="fa fa-play"></i></a></div> --}}
    </div>
    <iframe width="100%" height="500" src="{{$homeSetting->video}}" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>   
</section>

<div class="clearfix"></div>
<section class="testimonial" id="testimonial">
    <div class="container">
        <div class="row">
            <div class="main-heading">
                {{-- <p>What Say Our Client</p> --}}
                <h2>Gig<span>Posts</span></h2></div>
        </div>
        <div class="row">
            <div id="client-testimonial-slider" class="owl-carousel">
            @foreach($post as $posts)
                <div class="client-testimonial">
                    <div class="pic"><a href="{{route('post.details',['id'=>$posts->id])}}"><img src="user/assets/img/client-1.jpg" alt=""></a></div>
                    <a href="{{route('post.details',['id'=>$posts->id])}}">
                        <p class="client-description">{{$posts->venue_name}}</p>
                        <h3 class="client-testimonial-title">{{$posts->venue_address}}</h3>
                    </a>
                    

                    {{-- <ul class="client-testimonial-rating">
                        <li class="fa fa-star-o"></li>
                        <li class="fa fa-star-o"></li>
                        <li class="fa fa-star"></li>
                    </ul> --}}
                </div>
            @endforeach
            </div>
        </div>
    </div>
</section>
<div class="clearfix"></div>
<section class="call-to-act">
    <div class="container-fluid">
        <div class="col-md-6 col-sm-6 no-padd bl-dark">
            <div class="call-to-act-caption">
                <h2>For Event Manager</h2>
                <h3>{{$homeSetting->event_note}}</h3>
                {{-- @if(!Auth::guard('eventManagement')->check())
                    <a href="#" class="btn bat-call-to-act"  href="javascript:void(0)" data-toggle="modal" data-target="#signupevent" >
                        Sign Up
                    </a>
                @endif --}}
            </div>
        </div>
        <div class="col-md-6 col-sm-6 no-padd gr-dark">
            <div class="call-to-act-caption">
                <h2>For DJs</h2>
                <h3>{{$homeSetting->dj_note}}</h3>
                {{-- <a href="#" class="btn bat-call-to-act"  href="javascript:void(0)" data-toggle="modal" data-target="#signupdj" >
                    Sign Up
                </a> --}}
            </div>
        </div>
    </div>
</section>
<!-- pricing Section Start -->
    <section class="pricing">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <div class="main-heading">
                        {{-- <p>Best DJ of The Year</p> --}}
                        <h2> Browse <span>DJ</span></h2>
                    </div>
                </div>
            </div>
            <!--/row-->
            
            @livewire('home.show-dj')
            
            <!-- Single Freelancer -->
            {{-- <div class="row">
                <div class="col-md-12 col-sm-12">
                    <div class="text-center">
                        <a class="btn btn-primary load-more">Show More</a>
                        
                    </div>
                </div>
            </div> --}}
            
        </div>
    </section>
    <!-- End Candidate Section -->
    
    <!-- ============================ Call To Action ================================== -->
    {{-- <section class="theme-bg call-to-act-wrap">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    
                    <div class="call-to-act">
                        <div class="call-to-act-head">
                            <h3>Want to Become a Success Employers?</h3>
                            <span>We'll help you to grow your career and growth.</span>
                        </div>
                        <a href="#" class="btn btn-call-to-act">SignUp Today</a>
                    </div>
                    
                </div>
            </div>
        </div>
    </section> --}}
    <!-- ============================ Call To Action End ================================== -->
    
    <!-- ============================ Before Footer ================================== -->
    {{-- <div class="before-footer">
        <div class="container">
            <div class="row">
                
                <div class="col-md-6 col-sm-6">
                    <div class="jb4-form-fields">
                        <div class="input-group">
                          <input type="email" class="form-control" placeholder="Enter your email address">
                          <span class="input-group-btn">
                            <button class="btn theme-bg" type="submit"><span class="fa fa-paper-plane-o"></span></button>
                          </span>
                        </div>
                    </div>
                </div>
                
                <div class="col-md-6 col-sm-6 hill">
                    <ul class="job stock-facts">
                        <li><span>2744</span><br />Events Posted</li>
                        <li><span>2365</span><br />Events Posted</li>
                        <li><span>2021</span><br />Freelancer</li>
                        <li><span>7542</span><br />Companies</li>
                    </ul>
                </div>
                
            </div>
        </div>
    </div> --}}
    <!-- ============================ Before Footer ================================== -->
    
    
     
@endsection

@section('scripts')
  <script>
     
  </script>
@endsection