@extends('front.layouts.main')

@section('title',  request()->translations['static']['video_meta_title'] . ' | ' . getSiteName())
@section('meta-description', request()->translations['static']['video_meta_description'])
@section('meta-keywords', request()->translations['static']['video_meta_keywords'])
@section('og-type', 'page')
@section('og-url', url()->current())
@section('og-title', request()->translations['static']['video_meta_title'] . ' | ' . getSiteName())
@section('og-description', request()->translations['static']['video_meta_description'])
@section('og-image', asset('assets/images/app/og-image-new.png'))

@section('header-scripts')
    <link rel="stylesheet" href="{{ asset('assets/css/app/app.css') }}" />
    <link rel="stylesheet" href="{{ asset('assets/css/app/cf3d.min.css') }}" />
    <link rel="stylesheet" href="{{ asset('assets/css/app/site-fullwidth.css') }}" />
    <link rel="stylesheet" href="{{ asset('assets/css/app/video-js.css') }}" />

    <script src="{{ asset('assets/js/app/video.min.js') }}"></script>
    <script src="{{ asset('assets/js/app/three.min.js') }}"></script>
    <script src="{{ asset('assets/js/app/anime.min.js') }}"></script>
    <script src="{{ asset('assets/js/app/cf3d.min.js') }}"></script>
@endsection

@section('content')
    <div class="container rs-container-wrapper">
        <h1 class="title title--live-video">{{ request()->translations['static']['video_title'] }}</h1>
		<div class="rs-container">
			<div class="rs-cf3d">
				<ul data-name="video">
					@foreach($posts as $post)
						<li>
							<a
								href="{{ resizeImage('news/' . $post->id . '/', $post->image, 300, 300) }}"
								title="{{ date('F d, Y', strtotime($post->date_publish)) }}"
								@if($post->video_type)
								data-extended="{{ asset('storage/uploads/news/' . $post->id . '/' . $post->video_upload) }}"
								@else
								data-extended="<iframe src='https://www.youtube.com/embed/{{ getYoutubeCode($post->video) }}' title='YouTube video player' frameborder='0' allow='accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; web-share' allowfullscreen />"
								@endif
								data-poster="{{ resizeImage('news/' . $post->id . '/', $post->image, 1116, 628) }}"
								@if($post->video_type)
								data-type="video"
								@else
								data-type="embed"
								@endif
							> </a
							>
							<p>{{ \Illuminate\Support\Str::limit($translate[$post->id]['title'], 40, '...') }}</p>
						</li>
					@endforeach
				</ul>
			</div>
		</div>
	</div>
@endsection