@extends('front.master')
@section('seo')
{!! json_field($seo,'home_page_scripts') !!}
@endsection

@section('content')
    <section class="slider__home">

        <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
            <ol class="carousel-indicators">
                @foreach($sliders as $key=>$slider)
                    @if($key==0)
                <li data-target="#carouselExampleIndicators" data-slide-to="{{$key}}" class="active"></li>
                    @else
                <li data-target="#carouselExampleIndicators" data-slide-to="{{$key}}"></li>
                    @endif
                @endforeach
            </ol>
            <div class="carousel-inner">
                @foreach($sliders as $key=>$slider)
                <div class="carousel-item {{$loop->index < 1?'active':''}}">
                    <img class="d-block w-100" src="{{getImage(SLIDER_PATH.$slider->img)}}" alt="First slide">
                </div>
                @endforeach
            </div>
        </div>


        <div class="search-home">
            <form method="get" action="{{route('front.get.search.tours')}}">
                <div class="container">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="des_slider d-none d-md-block">
                                <span>{{json_field($site_content,'slider_title_label')}}</span>
                                <h5>{{json_field($site_content,'slider_title')}}</h5>
                                <p>{{json_field($site_content,'slider_description')}}</p>
                            </div>
                        </div>
                        <div class="col-12 col-md-2 pr-0">
                            <div class="form-group right-icon">
                                <select class="form-control fild_search"  name="category" id="parent-select" data-route="{{route('front.ajax.get.category.childs')}}">
                                    @foreach($categories as $category)
                                        <option value="{{$category->id}}">{{$category->name}}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div><!-- end columns -->

                        <div class="col-12 col-md-2 pr-0">
                            <div class="form-group right-icon">
                                <select class="form-control fild_search" name="sub_category" id="sub-select" >
                                    <option></option>
                                </select>
                            </div>
                        </div><!-- end columns -->

                        <div class="col-12 col-md-2 pr-0">
                            <div class="form-group right-icon">
                                <select class="form-control fild_search" name="range">
                                    <option value="0"> {{json_field($site_content,'select_price_range')}} </option>
                                    <option value="1"> Below $ 500 </option>
                                    <option value="2"> $ 500 - $ 1000 </option>
                                    <option value="3"> $ 1000 - $ 1500 </option>
                                    <option value="4"> {{json_field($site_content,'above_x')}} $ 1500 </option>
                                </select>
                            </div>
                        </div><!-- end columns -->
                        <div class="col-12 col-md-2 col-lg-12 col-xl-2 search-btn">
                            <button class="btn btn-search" type="submit"><i class="fa fa-search"></i></button>
                        </div><!-- end columns -->
                    </div><!-- end row -->
                </div>
            </form>
        </div>


    </section>

    <section id="cruise-offers" class="section-padding">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <div class="page-heading">
                        <h2>{{json_field($site_content,'section_three_title')}}</h2>
                        <p>{{json_field($site_content,'section_three_desc')}}</p>
                    </div><!-- end page-heading -->

                    <div class="owl-carousel owl-theme owl-custom-arrow" id="owl-cruise-offers">
                        @foreach($popular_tours as $tour)
                            @if(($loop->index + 1) % 2 != 0)
                        <div>
                            @endif
                                   @include('front.partials.top_tours_grid')
                            @if(($loop->index + 1) % 2 == 0)
                        </div>
                            @endif
                        @endforeach
                    </div><!-- end owl-cruise-offers -->

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

    <section class="innerpage-wrapper">

        <div id="process-flow" class="section-padding">
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
                        <div class="page-heading">
                            <h2>{{json_field($site_content,'features_section_title')}}</h2>
                            <p>{{json_field($site_content,'features_section_description')}}</p>

                        </div>

                        <div class="row">
                            @for($i = 1; $i <= 6; $i++)
                            <div class="col-12 col-md-6 col-lg-4">
                                <div class="service-block-1">
                                    <div class="service-icon-1">
                                        <span><i class="fa {{json_field($site_content,'feature_icon_'.$i)}}"></i></span>
                                    </div><!-- end service-icon-1 -->

                                    <div class="service-text-1">
                                        <h3>{{json_field($site_content,'feature_title_'.$i)}}</h3>
                                        <p>{{json_field($site_content,'feature_desc_'.$i)}}</p>
                                    </div><!-- end service-text-1 -->
                                </div><!-- end service-block-1 -->
                            </div><!-- end columns -->
                            @endfor

                        </div><!-- end row -->
                    </div><!-- end columns -->
                </div><!-- end row -->
            </div><!-- end container -->
        </div><!-- end services-section -->
    </section>
    <section class="section-padding">
        <div class="container">

            <div class="row">
                <div class="col-md-12">
                    <div class="page-heading">
                        <h2>{{json_field($site_content,'section_trend_title')}}</h2>
                        <p>{{json_field($site_content,'section_trend_desc')}}</p>
                    </div><!-- end page-heading -->
                </div>
            </div>
            <div class="row">
               @foreach($trend_tours as $tour)
                    @php

                        $durationText = $tour->duration.' Day ';
                            if($tour->duration_type == 'Day'){
                            if($tour->duration <= 1){
                               $durationText = $tour->duration.' Day ';
                            }else{
                                $durationText = ($tour->duration - 1).' Nights / '.$tour->duration.' Days';
                            }
                            }else{
                                $durationText = ($tour->duration - 1).' Hours ';
                              }
                    @endphp
                <div class="col-md-6 col-lg-4 col-xl-3">
                    <div class="grid-block main-block crs-grid-block">
                        <div class="main-img crs-grid-img">
                            <a href="{{route('front.get.tour.index',[
                                    $tour->subCategory->category->slug,
                                    $tour->subCategory->slug,
                                    $tour->slug,
                                    ])}}">
                                <img src="{{getImage(TOUR_PATH.$tour->img)}}" class="img-fluid" title="{{$tour->img_title}}" alt="{{$tour->img_alt}}" style="max-height: 250px;">
                            </a>
                            <div class="main-mask">
                                <ul class="list-unstyled list-inline offer-price-1">
                                    <li class="price">
                                        @if($tour->price_start_from > 0)
                                            <span class="cruise-price">@if($tour->discount)<strike>{{getPrice($tour->price_start_from)}}</strike> {{getPrice($tour->price_after_discount)}} @else {{getPrice($tour->price_start_from)}}@endif  <span>{{getCurrency()}}</span>
                                                @endif </span><span class="divider">|</span><span class="pkg">From Offer </span></li>
                                </ul>
                            </div><!-- end main-mask -->
                        </div><!-- end crs-grid-img -->

                        <div class="block-info crs-grid-info">
                            <h3 class="block-title"><a href="{{route('front.get.tour.index',[
                                    $tour->subCategory->category->slug,
                                    $tour->subCategory->slug,
                                    $tour->slug,
                                    ])}}">{{$tour->name}}</a></h3>
                            <p>{{Str::limit($tour->small_desc, 140)}}</p>
                            <a href="{{route('front.get.tour.index',[
                                    $tour->subCategory->category->slug,
                                    $tour->subCategory->slug,
                                    $tour->slug,
                                    ])}}" class="view_more_trendy">View More</a>
                        </div>
                    </div>
                </div>
             @endforeach

            </div>
        </div>
    </section>
    @include('front.partials.take_video_tour')
    <section id="hot-tour" class="section-padding">
        <div class="container">
            <div class="row">
                <div class="col-md-12 col-lg-12 col-xl-7 hot-tour-carousel">
                    <div id="hot-tour-carousel" class="carousel slide" data-ride="carousel">

                        <div class="carousel-inner">
                            @foreach($categories->where('featured', 'yes') as $category)
                            <div class="carousel-item @if($loop->first) active @endif">
                                <a href="{{route('front.get.category.index',$category->slug)}}"><img src="{{getImage(CATEGORY_PATH.$category->img)}}" title="{{$category->img_title}}"
                                                 alt="{{$category->img_alt}}" style="width:800px;"></a>
                                <div class="carousel-caption d-none d-md-block">
                                    <h5>{{ $category->name }}</h5>
                                    <p>{{Str::limit($category->small_desc, 140)}}</p>
                                </div>
                            </div>
                            @endforeach
                        </div><!-- end carousel-inner -->


                        <a class="left arrow-icons carousel-control-prev" href="#hot-tour-carousel" data-slide="prev">
                            <span class="glyphicon carousel-control-prev-icon fa fa-arrow-left" aria-hidden="true"></span>
                            <span class="sr-only">Previous</span>
                        </a>
                        <a class="right arrow-icons carousel-control-next" href="#hot-tour-carousel" data-slide="next">
                            <span class="glyphicon carousel-control-next-icon fa fa-arrow-right" aria-hidden="true"></span>
                            <span class="sr-only">Next</span>
                        </a>
                    </div><!-- end hot-tour-carousel -->
                </div><!-- end columns -->

                <div class="col-md-12 col-lg-12 col-xl-5 hot-tour-text">
                    <h3>{{json_field($site_content,'section_destination_title')}}</h3>
                    <span class="des_top_des">{{json_field($site_content,'section_destination_desc')}}</span>
                    <p>{{json_field($site_content,'section_destination_hint_price')}}</p>
                    <a href="{{route('front.get.destinations.index')}}" class="btn btn-orange">{{json_field($site_content,'see_details')}}</a>
                </div><!-- end columns -->

            </div><!-- end row -->
        </div><!-- end container -->
    </section><!-- end hot-tour -->
    <section>
        <div class="container">

            <div class="row">
                <div class="col-md-12">
                    <div class="page-heading">
                        <h2>{{json_field($site_content,'special_offers_title')}}</h2>
                        <p>{{json_field($site_content,'special_offers_desc')}}</p>
                    </div><!-- end page-heading -->
                </div>
            </div>
            <div class="row">

                <div class="owl-carousel owl-theme owl-custom-arrow" id="owl-hotel-offers">
                @foreach($offers as $tour)
                        @php

                            $durationText = $tour->duration.' Day ';
                                if($tour->duration_type == 'Day'){
                                if($tour->duration <= 1){
                                   $durationText = $tour->duration.' Day ';
                                }else{
                                    $durationText = ($tour->duration - 1).' Nights / '.$tour->duration.' Days';
                                }
                                }else{
                                    $durationText = ($tour->duration - 1).' Hours ';
                                  }
                        @endphp
                    <div class="item">
                        <div class="col-md-12 col-lg-12 col-xl-12 p-0">
                            <div class="grid-block main-block crs-grid-block">
                                <div class="main-img crs-grid-img">
                                    <a href="{{route('front.get.tour.index',[
                                    $tour->subCategory->category->slug,
                                    $tour->subCategory->slug,
                                    $tour->slug,
                                    ])}}">
                                        <img src="{{getImage(TOUR_PATH.$tour->img)}}" class="img-fluid"
                                             title="{{$tour->img_title}}" alt="{{$tour->img_alt}}">
                                    </a>
                                    <div class="main-mask">
                                        <ul class="list-unstyled list-inline offer-price-1">
                                            <li class="price list-inline-item">$568.00</li>
                                            <li class="rating list-inline-item">

                                                @php
                                                 $full_stars = (int)$tour->num_of_stars;
                                                 $empty_stars = 5 - (int)$full_stars;
                                                @endphp

                                                @for($i=0;$i<$full_stars; $i++)
                                                    <span><i class="fa fa-star orange"></i></span>
                                                @endfor

                                                @for($i=0;$i<$empty_stars; $i++)
                                                    <span><i class="fa fa-star lightgrey"></i></span>
                                                @endfor
                                            </li>
                                        </ul>
                                    </div><!-- end main-mask -->
                                </div><!-- end crs-grid-img -->

                                <div class="block-info crs-grid-info">
                                    <h3 class="block-title"><a href="{{route('front.get.tour.index',[
                                    $tour->subCategory->category->slug,
                                    $tour->subCategory->slug,
                                    $tour->slug,
                                    ])}}">{{$tour->name}}</a></h3>
                                    <label class="block-minor"> {{$durationText}} </label>
                                </div>
                            </div>
                        </div>
                    </div>
                @endforeach

                </div>
            </div>
        </div>
    </section>
    @include('front.partials.testimonials')
    @include('front.partials.newsletter')
@endsection