@extends('home.layouts.master')
@section('content')
    <!-- Main Container -->
    <main id="main-container">
        <!-- Hero Section -->
        @php
            if (isset($event->client_id)){
                $client = \App\Client\Client::find($event->client_id);
                $user = \App\User::find($client->user_id);
                $image_url = config('filesystems.asset').'/'.'clients'.'/'.$user->name.'/event';
            }else{
                $image_url = config('filesystems.asset').'/'.'event';
            }
        @endphp

        <div class="bg-image mt-8" style="background-image: url('{{url($image_url).'/'.$event->banner}}');">
            <div class="bg-gd-white-op-l">
                <div class="content content-boxed content-full py-5">
                    <div class="row">
                        <div class="col-md-8 d-flex align-items-center py-3">
                            <div class="w-100 text-center text-md-left">
                                <h1 class="h2 mb-2">{{$event->title}}</h1>
                                <h2 class="h4 font-size-sm text-uppercase font-w600 text-muted">Published - {{ $event->created_at->diffForHumans() }}</h2>
                                <a class="font-w600" href="javascript:void(0)">
                                    <i class="fab fa-fw fa-leanpub text-dark"></i> {{$event->event_type->name}}
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- END Hero Section -->

        <!-- Page Content -->
        <div class="content content-boxed">
            <div class="row">
                <div class="col-md-4 order-md-1">
                    <!-- Job Summary -->
                    <div class="block block-rounded">
                        <div class="block-header block-header-default">
                            <h3 class="block-title">Event Summary</h3>
                        </div>
                        <div class="block-content">
                            <ul class="fa-ul list-icons">
                                <li>
                                            <span class="fa-li text-primary">
                                                <i class="fa fa-map-marker-alt"></i>
                                            </span>
                                    <div class="font-w600">Location</div>
                                    <div class="text-muted">{{$event->city->name}} {{$event->city->resident->name}}, {{$event->city->district->name}}</div>
                                </li>
                                <li>
                                            <span class="fa-li text-primary">
                                                <i class="fa fa-briefcase"></i>
                                            </span>
                                    <div class="font-w600">Event Type</div>
                                    <div class="text-muted">{{$event->event_type->name}}</div>
                                </li>
                                <li>
                                            <span class="fa-li text-primary">
                                                <i class="fa fa-money-check-alt"></i>
                                            </span>
                                    {{--<div class="font-w600">Entry</div>--}}
                                    {{--<div class="text-muted">$50-60k</div>--}}
                                </li>
                                <li>
                                            <span class="fa-li text-primary">
                                                <i class="fa fa-clock"></i>
                                            </span>
                                    <div class="font-w600">Event Date</div>
                                    <div class="text-muted">{{(new Carbon\Carbon($event->start_at))->diffForHumans()}} | {{date('H:i A',strtotime($event->start_at))}}</div>
                                </li>
                            </ul>
                        </div>

                    </div>
                    <!-- END Job Summary -->
                    <!-- Job Summary -->
                    @if(count($ads_rightside_firsts)>0)
                    <div class="block block-rounded">
                        <div class="block-content">
                            <div class="js-slider slick-dotted-inner slick-dotted-white" data-dots="true" data-autoplay="true" data-autoplay-speed="5000">
                                @foreach($ads_rightside_firsts as $key=>$ad)
                                    <div>
                                        <a target="_blank" href="{{$ad->link}}" title="{{$ad->company_name}}">
                                            <img class="d-block w-100" src="{{url('public/uploads/adverts').'/'.$ad->image}}" alt="">
                                        </a>
                                    </div>
                                @endforeach
                            </div>
                        </div>

                    </div>
                    @endif
                    @if(count($ads_rightside_seconds)>0)
                    <div class="block block-rounded">
                        <div class="block-content">
                            <div class="js-slider slick-dotted-inner slick-dotted-white" data-dots="true" data-autoplay="true" data-autoplay-speed="5000">
                                @foreach($ads_rightside_seconds as $key=>$ad)
                                    <div>
                                        <a target="_blank" href="{{$ad->link}}" title="{{$ad->company_name}}">
                                            <img class="d-block w-100" src="{{url('public/uploads/adverts').'/'.$ad->image}}" alt="">
                                        </a>
                                    </div>
                                @endforeach
                            </div>
                        </div>

                    </div>
                    @endif
                    <!-- END Job Summary -->
                </div>
                <div class="col-md-8 order-md-0">
                    <!-- Job Description -->
                    <div class="block block-rounded">
                        <div class="block-header block-header-default">
                            <h3 class="block-title">Event Description</h3>
                        </div>
                        <div class="block-content">
                            {!! $event->details !!}
                        </div>
                    </div>
                    <!-- END Job Description -->

                    {{--<!-- Similar Jobs -->--}}
                    {{--<div class="block block-rounded">--}}
                        {{--<div class="block-header block-header-default">--}}
                            {{--<h3 class="block-title">Social</h3>--}}
                        {{--</div>--}}
                        {{--<div class="block-content">--}}
                            {{--<div class="row">--}}
                                {{--<div class="col-md-6">--}}
                                    {{--<a class="block block-rounded block-bordered block-link-shadow" href="javascript:void(0)">--}}
                                        {{--<div class="block-content block-content-full d-flex align-items-center justify-content-between">--}}
                                            {{--<div class="mr-3">--}}
                                                {{--<p class="font-size-lg font-w600 mb-0">--}}
                                                    {{--Dribbble--}}
                                                {{--</p>--}}
                                                {{--<p class="text-muted mb-0">--}}
                                                    {{--Designer--}}
                                                {{--</p>--}}
                                            {{--</div>--}}
                                            {{--<div class="item item-rounded bg-body-light">--}}
                                                {{--<i class="fab fa-dribbble fa-2x text-xsmooth text-primary"></i>--}}
                                            {{--</div>--}}
                                        {{--</div>--}}
                                    {{--</a>--}}
                                {{--</div>--}}
                                {{--<div class="col-md-6">--}}
                                    {{--<a class="block block-rounded block-bordered block-link-shadow" href="javascript:void(0)">--}}
                                        {{--<div class="block-content block-content-full d-flex align-items-center justify-content-between">--}}
                                            {{--<div class="mr-3">--}}
                                                {{--<p class="font-size-lg font-w600 mb-0">--}}
                                                    {{--Facebook--}}
                                                {{--</p>--}}
                                                {{--<p class="text-muted mb-0">--}}
                                                    {{--Developer--}}
                                                {{--</p>--}}
                                            {{--</div>--}}
                                            {{--<div class="item item-rounded bg-body-light">--}}
                                                {{--<i class="fab fa-facebook-f fa-2x text-xmodern text-primary"></i>--}}
                                            {{--</div>--}}
                                        {{--</div>--}}
                                    {{--</a>--}}
                                {{--</div>--}}
                            {{--</div>--}}
                        {{--</div>--}}
                    {{--</div>--}}
                    {{--<!-- END Similar Jobs -->--}}
                </div>

            </div>
            <div class="row">
                <div class="col-md-12">
                    <!-- Similar Jobs -->
                    <div class="block block-rounded">
                        <div class="block-header block-header-default">
                            <h3 class="block-title">Similar Events</h3>
                        </div>
                        <div class="block-content">
                            <div class="row row-deck">

                                <!-- Events -->
                                @foreach($similar_events as $event)
                                    <div class="col-md-6 col-xl-4">
                                        <div class="block block-rounded">
                                            @php
                                                if (isset($event->client_id)){
                                                    $client = \App\Client\Client::find($event->client_id);
                                                    $user = \App\User::find($client->user_id);
                                                    $image_url = config('filesystems.asset').'/'.'clients'.'/'.$user->name.'/event';
                                                }else{
                                                    $image_url = config('filesystems.asset').'/'.'event';
                                                }
                                                if (isset($event->image)){
                                                $image_link = $image_url.'/'.$event->image;
                                                }else{
                                                $image_link = url('public/theme/assets/media/photos/photo4.jpg');
                                                }
                                            @endphp
                                                <div class="block-content pb-8 text-right bg-image" style="background-image: url('{{$image_link}}');">

                                                            <a class="badge badge-light font-w700 p-2 text-uppercase" href="javascript:void(0)">
                                                                {{$event->event_type->name}}
                                                            </a>
                                                </div>
                                                <div class="block-content">
                                                    <a class="text-muted" href="{{url('events').'/event_id='.$event->id}}">
                                                        <h4 class="mb-1">{{$event->title}}</h4>
                                                    </a>
                                                    <p class="font-size-sm">
                                                        <span class="text-primary">{{$event->event_type->name}} </span>  <i class="far fa-calendar-alt"></i> {{date('M d, Y',strtotime($event->start_at))}} · <em class="text-muted">{{date('H:i A',strtotime($event->start_at))}}</em>
                                                    </p>
                                                    {{--<p>--}}
                                                    {{--Anam commodo turpis id lectus scelerisque vulputate. Integer sed dolor erat. Fusce erat ipsum, varius vel euismod sed, tristique et lectus.--}}
                                                    {{--</p>--}}
                                                </div>
                                                <div class="block-content block-content-full bg-body-light p-3">
                                                    <div class="row no-gutters font-size-sm text-center">
                                                        <div class="col-6">
                                                            <a href="{{url('events').'/event_id='.$event->id}}" class="btn btn-hero-sm btn-hero-danger" >Going On
                                                            </a>
                                                        </div>
                                                        <div class="col-6">
                                                            <a href="{{url('events').'/event_id='.$event->id}}" class="btn btn-hero-sm btn-hero-success">
                                                                Apply Now
                                                            </a>
                                                        </div>
                                                    </div>
                                                </div>
                                        </div>
                                    </div>
                                @endforeach
                            </div>
                    </div>
                    <!-- END Similar Jobs -->
                </div>
            </div>
        </div>
        <!-- END Page Content -->

    </main>
    <!-- END Main Container -->


@endsection