@extends('layouts/guest/masters.master')

@section('opengraph')
<!-- Search Engine Optimization by Rank Math - http://s.rankmath.com/home -->
@endsection

@section('tittle','VOICES AND BEATS [ EVENTS MANAGEMENT ] | THE CANCER RUN - 2022')

@section('content') 
<div>
  <div class="bg-cover bg-liveband-stage">
    <div class="h-64 flex items-center justify-center bg-black bg-opacity-50 p-5">
      <h1 class="text-lg md:text-2xl font-opensans-bold text-white text-center">
        HOME&nbsp;&nbsp;>&nbsp;&nbsp;EVENT&nbsp;&nbsp;>&nbsp;&nbsp;<span class="text-lime-500">{{$event->tittle}}</span>
      </h1>
    </div>
  </div>

 <div class="px-3 py-5 md:px-20 md:py-10 flex flex-col md:flex-row space-y-3 md:space-y-0 md:space-x-10">
  <div class="w-full md:w-2/3 space-y-3 md:space-y-5">
   <div class="text-black space-y-3 md:space-y-5">
      <div class="h-[20rem]">
        <img class="h-full w-full rounded-md" src="{{ asset('assets/images/'.$event->image) }}">
      </div>

      <div class="ticket-price overflow-x-auto rounded-md bg-gray-100">
         <table class="w-full border-collapse">
            <thead>
              <tr class="font-opensans-bold text-white bg-lime-500 divide-x divide-white text-sm md:text-base">
                <th class="w-10"></th>
                <th class="w-20">KIDS</th>
                <th class="w-20">ORD</th>
                <th class="w-20">VIP</th>
                <th class="w-20">TABLE</th>
                <th class="w-20">TEN 4 EIGHT</th>
             </tr>  
            </thead>
            <tbody class="text-sm">  
              <tr class="divide-x divide-gray-500">
                <td class="text-sm font-opensans-bold text-left">EARLY</td>
                <td class="@if(Carbon\Carbon::now()->addDays(6) >= $event->date) line-through @endif">
                  {{ number_format($event->ticket_category()->findorFail(App\Models\Ticket_Category::where('name','=','kids')->pluck('id')->first(),['early_price'])->pivot->early_price) ?? null ?: 'N/A' }}
                </td>
                <td class="@if(Carbon\Carbon::now()->addDays(6) >= $event->date) line-through @endif">
                  {{ number_format($event->ticket_category()->findorFail(App\Models\Ticket_Category::where('name','=','ordinary')->pluck('id')->first(),['early_price'])->pivot->early_price) ?? null ?: 'N/A' }}
                </td>
                <td class="@if(Carbon\Carbon::now()->addDays(6) >= $event->date) line-through @endif">
                  {{ number_format($event->ticket_category()->findorFail(App\Models\Ticket_Category::where('name','=','vip')->pluck('id')->first(),['early_price'])->pivot->early_price) ?? null ?: 'N/A' }}
                </td>
                <td class="@if(Carbon\Carbon::now()->addDays(6) >= $event->date) line-through @endif">
                  {{ number_format($event->ticket_category()->findorFail(App\Models\Ticket_Category::where('name','=','table')->pluck('id')->first(),['early_price'])->pivot->early_price) ?? null ?: 'N/A' }}
                </td>
                <td class="@if(Carbon\Carbon::now()->addDays(6) >= $event->date) line-through @endif">
                  {{ number_format($event->ticket_category()->findorFail(App\Models\Ticket_Category::where('name','=','ten for eight')->pluck('id')->first(),['early_price'])->pivot->early_price) ?? null ?: 'N/A' }}
                </td>
               </tr>
               <tr class="divide-x divide-gray-500">
                <td class="text-sm font-opensans-bold text-left">GATE</td>
                <td>
                  {{ number_format($event->ticket_category()->findorFail(App\Models\Ticket_Category::where('name','=','kids')->pluck('id')->first(),['gate_price'])->pivot->gate_price) ?? null ?: 'N/A' }}
                </td>
                <td>
                  {{ number_format($event->ticket_category()->findorFail(App\Models\Ticket_Category::where('name','=','ordinary')->pluck('id')->first(),['gate_price'])->pivot->gate_price) ?? null ?: 'N/A' }}
                </td>
                <td>
                  {{ number_format($event->ticket_category()->findorFail(App\Models\Ticket_Category::where('name','=','vip')->pluck('id')->first(),['gate_price'])->pivot->gate_price) ?? null ?: 'N/A' }}
                </td>
                <td>
                  {{ number_format($event->ticket_category()->findorFail(App\Models\Ticket_Category::where('name','=','table')->pluck('id')->first(),['gate_price'])->pivot->gate_price) ?? null ?: 'N/A' }}
                </td>
                <td>
                   {{ number_format($event->ticket_category()->findorFail(App\Models\Ticket_Category::where('name','=','ten for eight')->pluck('id')->first(),['gate_price'])->pivot->gate_price) ?? null ?: 'N/A' }}
                </td>
               </tr>
             </tbody>   
          </table>  
        </div>

       <div class="flex flex-col md:flex-row md:items-center space-y-3 sm:space-y-0 sm:space-x-5 sm:justify-between">
        <div class="flex space-x-2">
          <div>
           <div class="text-white text-center rounded-md bg-lime-500 divide-y-2 divide-white">
            <div class="px-2 py-1">
             {{ $event->date->format('d') }}
            </div>

            <div class="text-sm px-2 py-1">
             {{ $event->date->format('M') }}
            </div>
           </div>
          </div>

          <div class="flex-grow space-y-2">
           <div class="text-sm md:text-lg font-opensans-bold">
             <h1>{{$event->tittle}}</h1>
           </div>

           <div class="text-gray-500 text-xs md:text-sm">
            <span><i class="fa fa-clock"></i></span>  Time: {{$event->time_from}} - {{$event->time_to}}
           </div>
          </div>
        </div>

         <div class="text-sm font-opensans-bold">
           @if($event->status != "open" || $event->date <= Carbon\Carbon::now() )
            <span class="py-1 md:py-2 px-5 flex items-center justify-center bg-gray-300  text-gray-600 rounded-sm cursor-not-allowed text-center">
             BUY TICKET
            </span>
           @else
            <a href="/Events/Buy-Ticket/{{ $event->id }}/{{ $event->tittle }}" class="py-1 md:py-2 px-5 block hover:bg-black bg-lime-500 text-white rounded-sm text-center">
              BUY TICKET
            </a>
           @endif 
         </div>
          
        </div>

        <div class="text-sm text-gray-900">
         {!! $event->body !!} 
       </div>

       <div class="border border-lime-500 rounded-md">
        <div class="bg-lime-500 text-white p-2 text-center font-opensans-bold">
         <h1 class="">Event Info</h1>
        </div>

        <div class="p-5 flex justify-center">
         <div class="w-2/3 text-center space-y-2">
           <div class="font-opensans-bold text-gray-700">
            <h1>Venue</h1>
           </div>

           <div class="text-xs text-gray-500">
            <h1>{{$event->venue}}</h1>
           </div>
         </div>  
        </div>
       </div>

       <div class="border border-lime-500 rounded-md">
        <div class="bg-lime-500 font-opensans-bold text-white p-2 text-center">
         <h1 class="">Event Details</h1>
        </div>

        <div class="p-5 flex justify-center">
         <div class="w-2/3 text-center space-y-2">
          <div class="space-y-2">
           <div class="font-opensans-bold text-gray-700">
            <h1>Date</h1>
           </div>

           <div class="text-xs text-gray-500">
            <h1>{{ $event->date->format('M d, Y') }}</h1>
           </div>
          </div>  

          <div class="space-y-2">
           <div class="font-opensans-bold text-gray-700">
            <h1>Time</h1>
           </div>

           <div class="text-xs text-gray-500">
            <h1>{{$event->time_from}} - {{$event->time_to}}</h1>
           </div>
          </div>  
         </div>  
        </div>
       </div>

       <div class="border border-lime-500 rounded-md">
        <div class="bg-lime-500 font-opensans-bold text-white p-2 text-center">
         <h1 class="">Event PR Co-odinator</h1>
        </div>

        <div class="p-5 flex justify-center">
         <div class="w-2/3 text-center space-y-2">
           <div class="font-opensans-bold  text-gray-700">
            <h1>{{ $event->user->lastname }} &nbsp;&nbsp; {{ $event->user->firstname }}</h1>
           </div>

           <div class="text-xs text-gray-500">
            {{ $event->user->phone }}
           </div>

           <div class="text-xs text-gray-500">
            {{ $event->user->email }}
           </div>
         </div>  
        </div>
       </div>

       <div class="space-y-2" style="">
         <div class="font-opensans-bold space-y-1">
           <h1>EVENT LOCATION - MAP</h1>
           <hr class="w-20 h-2 bg-lime-500">
         </div>

         <div class="map">
           {!! html_entity_decode($event->map_link) !!}
         </div>
       </div>

       <div class="space-y-2">
        <div class="font-opensans-bold space-y-1">
         <h1>FEAUTURING</h1>
         <hr class="w-20 h-2 bg-lime-500">
        </div>

        <div class="grid grid-cols-2 md:grid-cols-3 gap-4">
         @foreach($event->feature()->get() as $event_feature) 
          <div class="space-y-2">
           <div class="h-32">
            <img class="h-full w-full" src="{{ asset('assets/images/'.$event_feature->image) }}">
           </div>
           
           <div class="space-y-1">
            <div>
              <h1>{{ $event_feature->name }}</h1>
             </div>

             <div class="text-xs text-gray-500">
              {{ $event_feature->feature_category->name }}
             </div>
           </div>
          </div> 
         @endforeach
 
        </div>
       </div> 

       <div class="space-y-2">
        <div class="font-opensans-bold space-y-1">
         <h1>SPORNSORS | PARTNERS</h1>
         <hr class="w-20 h-2 bg-lime-500">
        </div>

        <div class="grid grid-cols-2 md:grid-cols-3 gap-5">
          @foreach($event->partner()->get() as  $event_partner) 
            <div class="h-32">
              <img class="h-full w-full" src="{{ asset('assets/images/'.$event_partner->image) }}">
            </div>
          @endforeach  
       </div>
       </div> 
    </div>
  </div> 


  <div class="w-full md:w-1/3 space-y-3 md:space-y-5">
   <div class="space-y-2">
     <div class="font-opensans-bold space-y-1">
       <h1>UPCOMING EVENTS</h1>
         <hr class="w-20 h-2 bg-lime-500">
     </div>

     <div class="py-2 pl-3 space-y-3">
        @foreach($upcoming_events as  $upcoming_event) 
          <div class="flex">
              <div class="w-1/3 h-20">
                 <img class="h-full w-full rounded-md" src="{{ asset('assets/images/'.$upcoming_event->image) }}">
              </div>
              <div class="w-2/3 space-y-2 bg-light-green p-2">
                 <div class="capitalize text-sm text-blue-700 hover:underline">
                  <h1 class="font-opensans-bold uppercase">
                  <a href="/Events/{{ $upcoming_event->id }}/{{ $upcoming_event->tittle }}">
                    {{ $upcoming_event->tittle }}
                  </a>
                  </h1>
                  </div>
                  <div class="text-sm capitalize text-gray-500">
                  <i class="fas fa-calendar fa-sm"></i>
                  <label class="pl-2">{{ $event->date->format('M d, Y') }}</label> 
                 </div>
              </div> 
           </div>
        @endforeach     
    </div>
   </div>  

   <div class="space-y-2">
     <div class="font-opensans-bold space-y-1">
       <h1>SHARE</h1>
         <hr class="w-20 h-2 bg-lime-500">
     </div>

     <div class="py-2 pl-3 space-y-3">

     </div>

   </div>

   <div class="space-y-2">
     <div class="font-opensans-bold space-y-1">
       <h1>FOLLOW US ON TWITTER</h1>
         <hr class="w-20 h-2 bg-lime-500">
     </div>

     <div class="py-2 pl-3 space-y-3">

     </div>

   </div>

  </div> 
 </div> 
</div> 
</div> 
@endsection