@extends($data['layout'])

@section('title', $data['videos']->title)

@php
    $url = URL::current();
    use App\Helpers\General\AMP;
    use Illuminate\Pagination\Paginator;

@endphp
@push('head-area')
    <link rel="canonical" href="{{ $url }}" />
    <style>
        .video-container {
            position: relative;
            /* width: calc(82.778vh); */
            height: calc(28vw);
            overflow: hidden;
        }

        .responsive-iframe {
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
            width: 100%;
            height: 100%;
            border: none;
            padding-left: 37px;            /* max-width: calc(177.778vh); height: calc(56.25vw); */
        }
        .pagination{
            margin-left: 5%;
        }
        .page-item {
                border: none;
                padding: 0px;
                margin-right: 0px;
            }
    </style>
@endpush
@if(trim($data['videos']->meta_description) != null && $data['videos']->meta_description != 'NULL')
    @section('meta_description', $data['videos']->meta_description)
    {{-- @section('meta_keywords', $data['product']->meta_keywords) --}}
@endif

@section('meta_url', URL::Current())
@section('page_title', $data['videos']->title)
@section('product_description',$data['videos']->meta_description)
@php
    if(app()->environment() == 'dev')
        $site = 'dev';
    else
        $site = 'www';
@endphp
@section('image','https://'.$site.'.germedusa.com/static/assets/images/og_imag_logo.png')
@section('image:width', "1200")
@section('image:height', "630")
@section('content')
    @if ($data['layout'] == 'frontend.layouts.app')
        @include('includes.partials.bread-crumbs')
    @endif
    <div class=" mb-3">
        <div class="row">
            <div class="col-md-6 my-3">
                <h1 class="h1-tag "
                    style=" @if ($data['layout'] == 'frontend.layouts.mobile') margin-left: 8%; margin-top: 5%; @else margin-left: 10%; @endif ">
                    Videos</h1>
            </div>
        </div>
        <div class="row " style="@if(!AMP::check()) margin: 0 3%; padding-right: 17px; @else margin-right: 20px;  @endif"
            @if ($data['layout'] !== 'frontend.layouts.app') style="margin: 7px;margin-top: -80px; margin-bottom: 6rem;" @endif>
            @if ($data['videos'])
                @foreach ($data['videos'] as $video)
                    @php
                        $videoData = @get_headers('https://player.vimeo.com/video/' . $video->video_id);
                    @endphp

                    @if ($video->source == 'Youtube')
                        <div class="video-container col-sm-6" style="margin-bottom: 27px; @if(AMP::check()) height: calc(50vw); @endif"
                            @if ($data['layout'] !== 'frontend.layouts.app') style="height: 175px; margin-bottom: 40px;" @endif>
                            <iframe frameborder="0"  loading="lazy" src="{{ 'https://www.youtube.com/embed/' . $video->video_id }}"
                                allow="fullscreen; picture-in-picture" allowfullscreen  class="responsive-iframe"
                                 ></iframe>
                        </div>
                    @elseif ($video->source == 'Vimeo')
                        {{-- @if (strpos($videoData[0], '200') > 0) --}}
                            <div class="video-container col-sm-6" style="margin-bottom: 27px; @if(AMP::check()) height: calc(50vw); @endif"
                                @if ($data['layout'] !== 'frontend.layouts.app') style="height: 175px; margin-bottom: 40px;" @endif>
                                <iframe frameborder="0"  loading="lazy" src="{{ 'https://player.vimeo.com/video/' . $video->video_id }}"
                                    allow="fullscreen; picture-in-picture" allowfullscreen class="responsive-iframe"
                                    ></iframe>
                            </div>
                        {{-- @endif --}}
                    @endif
                @endforeach
            @else
                <p><strong>Sorry!</strong>, no videos found.</p>
            @endif
        </div>
        {{-- @if ($data['videos'] && $data['videos'] instanceof Illuminate\Pagination\Paginator) --}}
            {!! $data['videos']->appends(request()->except('page'))->links() !!}
        {{-- @endif --}}
    
    </div>
@endsection