@extends('layouts.app', [
    'name' => 'projects-video',
    'icon' => 'keyboard_arrow_left',
    'action' => url()->previous(),
    'actionTitle' => __('carousel.back')
])

@section('content')
<section id="projects-video-section" class="video-section">

    <video controls autoplay>
        <source src="{{ $project->video->url }}" type="video/mp4">
    </video>

</section>
@endsection

@push('scripts')
<script>
$(document).ready(function () {
    $('section').css('height', $(window).height() - $('nav').height());

    if ($('video').height() > $('section').height()) {
        $('section').removeClass('valign-wrapper');
        $('video').removeClass('video-fullwidth');
        $('video').addClass('video-fullheight');
        return;
    }

    $('section').addClass('valign-wrapper');
    $('video').removeClass('video-fullheight');
    $('video').addClass('video-fullwidth');
});
</script>
@endpush