@extends($_viewFrame)

@section('pageTitleMain'){{$category['name']}}@endsection
@section('pageKeywords'){{$category['name']}}@endsection
@section('pageDescription'){{$category['name']}}@endsection

{!! \ModStart\ModStart::css('vendor/Photo/style/video.css') !!}
@section('bodyAppend')
    @parent
    <script>

    </script>
@endsection

@section('bodyContent')

    <div class="ub-container">

        <div class="ub-breadcrumb">
            <a href="{{modstart_web_url('photo')}}">
                <i class="iconfont icon-category"></i> 相册
            </a>
            <a class="active" href="javascript:;">
                <i class="iconfont icon-play"></i>
                {{$category['name']}}
            </a>
        </div>

        <div class="ub-video">
            <div class="player">
                <video id="player"
                       class="video-js"
                       controls
                       preload="auto"
                       poster="{{\ModStart\Core\Assets\AssetsUtil::fix($category['cover'])}}"
                       data-setup='{}'>
                    <source src="{{\ModStart\Core\Assets\AssetsUtil::fix($category['videoUrl'])}}" type="video/mp4" />
                    <p class="vjs-no-js">
                        当前浏览器不支持JavaScript
                    </p>
                </video>
                <script>
                    $(function () {
                        var options = {};
                        var player = window.api.videojs('player', options, function onPlayerReady() {
                            this.play();
                            this.on('ended', function() {});
                        });
                    });
                </script>
            </div>
        </div>

        <div class="margin-top">
            <div class="ub-video-info">
                <h1>{{$category['name']}}</h1>
            </div>
        </div>

    </div>

@endsection





