@extends('frontend.'.$temaadi.'.app')
@push("head")
    <title>{{ $videoDetay->baslik }} videosu</title>
    <meta name="description" content="{{ strip_tags($videoDetay->metadesc) }}" />
    <link rel="image_src" type="image/jpeg" href="{{ url('images/videolar/'.$videoDetay->resim) }}" />
    <meta name="DC.date.issued" content="{{ date('c',strtotime($videoDetay->created_at)) }}" />
    <meta property="og:type" content="video.other" />
    <meta property="og:site_name" content="{{ config('ayarlar.baslik') }}" />
    <meta property="og:url" content="{{ URL::current() }}" />
    <meta property="og:title" content="{{ $videoDetay->baslik }}" />
    <meta property="og:description" content="{{ strip_tags($videoDetay->metadesc) }}" />
    <meta property="og:image" content="{{ url('images/videolar/'.$videoDetay->resim) }}" />
    <meta property="og:image:width" content="480" />
    <meta property="og:image:height" content="360" />
    <meta name="twitter:card" content="summary_large_image">
    <meta property="twitter:image" content="{{ url('images/videolar/'.$videoDetay->resim) }}" />
    <meta name="twitter:site" content="{{ '@'.config('ayarlar.twkullanici') }}">
    <meta name="twitter:url" content="{{ URL::current() }}">
    <meta name="twitter:title" content="{{ $videoDetay->baslik }}" />
    <meta name="twitter:description" content="{{ strip_tags($videoDetay->metadesc) }}" />
    <meta itemprop="author" content="Haber Sitesi" />
    <meta itemprop="url" content="{{ URL::current() }}" />
    <meta itemprop="thumbnailUrl" content="{{ url('images/videolar/'.$videoDetay->resim) }}" />
    <meta itemprop="dateCreated" content="{{ date('c',strtotime($videoDetay->created_at)) }}" />
    <meta itemprop="uploadDate" content="{{ date('c',strtotime($videoDetay->created_at)) }}" />
    <meta itemprop="dateModified" content="{{ date('c',strtotime($videoDetay->updated_at)) }}" />
    <meta itemprop="mainEntityOfPage" content="{{ URL::current() }}" />
@endpush
@section("content")
    <section>
        <div class="archive-header text-center mb-30">
            <h1><span class="font-weight-ultra">{{ $videoDetay->baslik }}</span></h1>
            <div class="breadcrumb">
                <a href="{{ url('/') }}">Ana Sayfa</a>
                <span></span>
                <a href="{{ url('webtv') }}">Video Galeri</a>
                <span></span>
                <a href="{{ url('video/kategoriler/'.\Illuminate\Support\Str::slug($videoDetay->kategoriler->baslik).'-'.$videoDetay->kategoriler->id) }}">{{ $videoDetay->kategoriler->baslik }}</a>
                <span></span>
                {{ $videoDetay->baslik }}
            </div>
        </div>
    </section>
    @if(!empty($medyaDetayUst))
        <section class="block-wrapper text-center reklam mt-0 pb-0 mb-3">
            @if($medyaDetayUst->tip == 1)
                <a target="_blank" href="{{ $medyaDetayUst->link }}">
                    <img src="{{url('images/reklamlar/'.$medyaDetayUst->resim)}}" alt="{{ $medyaDetayUst->baslik }}">
                </a>
            @else
                {!! $medyaDetayUst->metin !!}
            @endif
        </section>
    @endif
    <section class="pt-30 pb-30 bg-black box-shadow mb-30">
        <div class="container">
            @if(!empty($medyaIcerikUst))
                <section class="block-wrapper text-center reklam mt-0 pb-0 pt-0 mb-3">
                    @if($medyaIcerikUst->tip == 1)
                        <a target="_blank" href="{{ $medyaIcerikUst->link }}">
                            <img src="{{url('images/reklamlar/'.$medyaIcerikUst->resim)}}" alt="{{ $medyaIcerikUst->baslik }}">
                        </a>
                    @else
                        {!! $medyaIcerikUst->metin !!}
                    @endif
                </section>
            @endif
            <div class="position-relative">
                @if(!empty($medyaOnu))
                    <div class="video_onu">
                        <div class="bar">
                            <div class="kapat">Reklamı Geç</div>
                            <div class="saniye"></div>
                        </div>
                        @if($medyaOnu->tip == 1)
                            <div class="content">
                                <div class="reklam text-center mt-2">
                                    <a target="_blank" href="{{ $medyaOnu->link }}">
                                        <img src="{{url('images/reklamlar/'.$medyaOnu->resim)}}" alt="{{ $medyaOnu->baslik }}">
                                    </a>
                                </div>
                            </div>
                        @else
                            <div class="content">
                                <div class="reklam text-center mt-2">
                                    {!! $medyaOnu->metin !!}
                                </div>
                            </div>
                        @endif
                    </div>
                @endif
                @if($videoDetay->videotur == 1)
                    <div class="post-video contentvideo">
                        {!! $videoDetay->embed !!}
                    </div>
                @else
                    <video width="100%" height="100%" controls>
                        <source src="{{ url('images/videolar/'.$videoDetay->mp4) }}" type="video/mp4">
                    </video>
                @endif
            </div>
                @if(!empty($medyaIcerikAlt))
                    <section class="block-wrapper text-center reklam mt-0 pb-0 pt-0 mb-3">
                        @if($medyaIcerikAlt->tip == 1)
                            <a target="_blank" href="{{ $medyaIcerikAlt->link }}">
                                <img src="{{url('images/reklamlar/'.$medyaIcerikAlt->resim)}}" alt="{{ $medyaIcerikAlt->baslik }}">
                            </a>
                        @else
                            {!! $medyaIcerikAlt->metin !!}
                        @endif
                    </section>
                @endif
            <div class="mt-20 text-light">
                {!! $videoDetay->metadesc !!}
            </div>
                <div id="share"></div>
        </div>
    </section>

    @if(!empty($medyaSonEklenenler))
        <section class="block-wrapper text-center reklam mt-0 pb-0 pt-0 mb-3">
            @if($medyaSonEklenenler->tip == 1)
                <a target="_blank" href="{{ $medyaSonEklenenler->link }}">
                    <img src="{{url('images/reklamlar/'.$medyaSonEklenenler->resim)}}" alt="{{ $medyaSonEklenenler->baslik }}">
                </a>
            @else
                {!! $medyaSonEklenenler->metin !!}
            @endif
        </section>
    @endif
    <section class="block-wrapper pt-20 pb-10">
        <div class="row">
            <div class="col-md-12">
                <div class="sidebar-widget loop-grid">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="widget-header position-relative mb-30">
                                <h5 class="widget-title mb-30 text-uppercase color1 font-weight-ultra">Son Eklenen</h5>
                                <div class="letter-background">Videolar</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12 col-sm-12">
                <div class="loop-metro post-module-1 row">
                    @if(count($videolar) != 0)
                        @foreach($videolar as $video)
                            <article class="col-lg-4 col-md-6 col-sm-12 mb-30">
                                <div class="post-thumb position-relative">
                                    <div class="thumb-overlay img-hover-slide border-radius-5 position-relative" style="background-image: url({{ url('images/videolar/'.$video->resim) }})">
                                        <a class="img-link yenisekme" href="{{ url('video/'.Illuminate\Support\Str::slug($video->baslik).'-'. $video->id) }}"></a>
                                        <div class="post-content-overlay">
                                            <h6 class="post-title">
                                                <a class="color-white yenisekme" href="{{ url('video/'.Illuminate\Support\Str::slug($video->baslik).'-'. $video->id) }}">{{ $video->baslik }}</a>
                                            </h6>
                                        </div>
                                    </div>
                                </div>
                            </article>
                        @endforeach
                    @else
                        <div class="col-lg-12">
                            <div class="alert alert-danger" role="alert">
                                Video bulunamadı!
                            </div>
                        </div>
                    @endif
                </div>
            </div>
        </div>
    </section>

    @if(!empty($medyaDetayAlt))
        <section class="block-wrapper text-center reklam mt-0 pb-0 mb-3">
            @if($medyaDetayAlt->tip == 1)
                <a target="_blank" href="{{ $medyaDetayAlt->link }}">
                    <img src="{{url('images/reklamlar/'.$medyaDetayAlt->resim)}}" alt="{{ $medyaDetayAlt->baslik }}">
                </a>
            @else
                {!! $medyaDetayAlt->metin !!}
            @endif
        </section>
    @endif
@endsection

@push("customJs")
    <script src="{{asset('assets/frontend/'.$temaadi.'/js/jssocials.min.js')}}"></script>
    <script>
        $("#share").jsSocials({
            shareIn: "popup",
            showCount: false,
            showLabel: false,
            text: "{{ str_replace(array("'", "\""),array('’','”'),$videoDetay->baslik) }}",
            shares: ["facebook", "twitter", "whatsapp", "pinterest", "linkedin"]
        });
    </script>
    <script>
        $(document).ready(function (e) {
            function setCookie(key, value) {
                let expires = new Date();
                expires.setTime(expires.getTime() + ({{ config('ayarlar.popup_reklam_cache') }}  * 60 * 1000));
                document.cookie = key + '=' + value + ';expires=' + expires.toUTCString();
            }
            function getCookie(key) {
                let keyValue = document.cookie.match('(^|;) ?' + key + '=([^;]*)(;|$)');
                return keyValue ? keyValue[2] : null;
            }
            if (getCookie("video_onu") == '{{ config('ayarlar.siteadresi') }}'){
                $(".video_onu").css("display","none");
            }else {
                $('.video_onu').fadeIn();
                let genislik1 = $('.video_onu').width();
                let genislik2 = $('.video_onu .content').width();
                let sonuc = genislik1 - genislik2;
                let left = sonuc / 2;
                $('.video_onu .content').css({left: left});
                let saniye = 8;

                function saybakalim() {
                    if (saniye > 0) {
                        saniye = saniye - 1;
                        $('.video_onu .saniye').html(saniye + ' saniye kaldı..');
                    } else if (saniye == 0) {
                        $('.video_onu').fadeOut();
                        setCookie("video_onu", '{{ config('ayarlar.siteadresi') }}')
                    }
                }

                setInterval(saybakalim, 1000);
            }
            $(".video_onu .kapat").click(function (e) {
                $(".video_onu").fadeOut();
                setCookie("video_onu", '{{ config('ayarlar.siteadresi') }}')
            });
        });
    </script>
@endpush

@push("customCss")
    <link rel="stylesheet" href="{{asset('assets/frontend/tema9/css/jssocials.css')}}">
    <link rel="stylesheet" href="{{asset('assets/frontend/tema9/css/jssocials-theme-flat.css')}}">
    <style>
        .video_onu {
            position: absolute;
            min-height: 400px;
            width: 100%;
            background: #f6f6f6;
            z-index: 5;
            display: none;
        }
        .video_onu .bar {
            text-align: right;
            font-weight: 500;
            padding: 10px;
            height: 30px;
            font-size: 14px;
            color: #EC2913;
        }
        .video_onu .bar div {
            margin-right: 10px;
            cursor: pointer
        }
        .video_onu .saniye {
            float: left
        }
        .video_onu .kapat {
            float: right
        }
    </style>
@endpush
