@php

if(isset($event_id)){
    $event=getter('event')->setLang(app()->getLocale())->condition('id',$event_id)->get();
    
}

@endphp
@extends('layouts.main',[
    'compact'=>'compact'
])
@if(isset($event) && isset($event->id))
@section('title')
    <title>{{$event->label}} | {{env('APP_NAME')}}</title>
@endsection

@section('content')
    <div class="section">
        <div class="content">
            <div class="section-title">
                {{$event->label}}
            </div>

        </div>


        <div class="section-body no-p ">

            <div class="event-details ">
                <div class="content">
{{--                    <div class="event-date">--}}
{{--                       {{date_format(date_create($event->created_at),'d-M-Y')}}--}}
{{--                    </div>--}}

                    <img class="event-main-banner" src="{{$event->banner->image}}" alt="">

                    <div class="event-title">
                        {!! $event->description !!}
                    </div>
                </div>

                @if(count($event->artists)>0)
                <div class="artists-section content">
                    <div class="section-title medium">
                    {{__('texts.artists')}}
                    </div>



                    <div class="artists-section-container">
                        @foreach($event->artists as $artist)
                        <div class="artists-section-artist">
                            <div class="artists-section-artist-header">
                                <div>
                                    <div class="title">
                                        @if(isset($artist->name))
                                        {{$artist->name}}
                                        @endif
                                    </div>
                                    <div class="job">

                                        @if(isset($artist->job))
                                        {{$artist->job}}
                                        @endif
                                    </div>
                                </div>
                                <div class="plus">@include('includes.plus')</div>
                            </div>
                            <div class="artists-section-artist-body">
                                @if(isset($artist->description))
                              {{$artist->description}}
                                    @endif
                            </div>
                        </div>
                        @endforeach
                    </div>


                </div>
                @endif
             @if(count($event->gallery))
                <div class="gallery-section ">
                    <div class="content section-title medium">
                        {{__('texts.gallery')}}
                    </div>

                    <div class="gallery-section-container">


                        <div class="gallery-slider owl-carousel" @if(app()->getLocale()=='ar')data-carousel-rtl="true" @else data-carousel-rtl="false" @endif>

                            @foreach($event->gallery as $gal)
                            <div class="slider-item">
                                <a class="caro" href="{{$gal->image}}" data-fancybox="gallery1"><img src="{{$gal->image}}" alt=""></a>
                            </div>


@endforeach
                        </div>


                    </div>


                </div>
                @endif
                @if(count($event->partners)>0)
                <div class="partners-section content">
                    <div class="section-title medium">
                        {{__('texts.partners')}}
                    </div>

                    <div class="partners-section-container">
                        @foreach($event->partners as $partner)

                        <div class="partners-section-partner">
                           <div>
                               <img src="{{env('DATA_URL').'/'.$partner->partner}}" alt="">
                           </div>
                        </div>
                        @endforeach
                    </div>


                </div>

                @endif

                @php
                    // uploaded video has priority over the youtube link
                    $uploadedVideo = null;
                    $uploadedVideoType = null;
                    $allowedVideoExtensions = ['mp4' => 'video/mp4', 'webm' => 'video/webm', 'ogv' => 'video/ogg', 'ogg' => 'video/ogg', 'mov' => 'video/mp4', 'm4v' => 'video/mp4'];
                    $uploadedExtension = strtolower($event->extension_video_upload ?? '');

                    if (!empty($event->video_upload) && array_key_exists($uploadedExtension, $allowedVideoExtensions)) {
                        $uploadedVideo = $event->video_upload;
                        $uploadedVideoType = $allowedVideoExtensions[$uploadedExtension];
                    }

                    // youtube link is used only when there is no valid uploaded video
                    $youtubeVideo = (empty($uploadedVideo) && !empty($event->video)) ? $event->video : null;

                    $videoCover = null;
                    if (!empty($event->extension_video_cover) && isset($event->video_cover->image)) {
                        $videoCover = $event->video_cover->image;
                    }

                    // fall back on the youtube thumbnail only when we are actually showing a youtube video
                    if (empty($videoCover) && !empty($youtubeVideo)) {
                        $ytId = null;
                        $parsedVideo = parse_url($youtubeVideo);
                        if (!empty($parsedVideo['query'])) {
                            parse_str($parsedVideo['query'], $videoQuery);
                            $ytId = $videoQuery['v'] ?? null;
                        }
                        if (empty($ytId) && !empty($parsedVideo['path'])) {
                            $ytId = trim($parsedVideo['path'], '/');
                        }
                        if (!empty($ytId)) {
                            $videoCover = 'https://i.ytimg.com/vi/'.$ytId.'/mqdefault.jpg';
                        }
                    }
                @endphp

                @if(!empty($uploadedVideo) || !empty($youtubeVideo))
                    <div class="video-section content">
                        <div class="section-title medium">
                            {{__('texts.video')}}
                        </div>

                        <div class="video-section-container">

                            <div class="video-section-video">
                                @if(!empty($uploadedVideo))
                                    <a class="center fancybox-media a-block-rel" href="{{$uploadedVideo}}"
                                       data-type="video" data-width="1280" data-height="720">
                                        @if(!empty($videoCover))
                                            <img class="yt-video-channel" style="aspect-ratio: 7 / 4"
                                                 src="{{$videoCover}}"
                                                 alt="{{$event->alt_video_cover ?? ''}}">
                                        @else
                                            <video class="yt-video-channel" style="aspect-ratio: 7 / 4; width: 100%; object-fit: cover; pointer-events: none;"
                                                   muted playsinline preload="metadata">
                                                <source src="{{$uploadedVideo}}#t=0.1" type="{{$uploadedVideoType}}">
                                            </video>
                                        @endif
                                        <div class="play-size"> @include('includes.play')</div>
                                    </a>
                                @else
                                    <a class="center fancybox-media a-block-rel" href="{{$youtubeVideo}}">
                                        <img class="yt-video-channel" style="aspect-ratio: 7 / 4"
                                             src="{{$videoCover}}"
                                             alt="{{$event->alt_video_cover ?? ''}}">
                                        <div class="play-size"> @include('includes.play')</div>
                                    </a>
                                @endif
                            </div>
                            <div class="video-section-description">
                                {!! $event->video_description !!}
                            </div>


                        </div>


                    </div>
                @endif

            </div>


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