<div ng-controller="videoPlayerCtrl">


    <!-- TODO: css -->
    <videogular
            vg-player-ready="onPlayerReady($API)"
            vg-theme="'/.nekumo/static/src/libs/videogular-themes-default/videogular.css'">
        <vg-media vg-src="srcData">
        </vg-media>

        <vg-controls>
            <vg-play-pause-button></vg-play-pause-button>
            <vg-time-display>{{ currentTime | date:'mm:ss' }}</vg-time-display>
            <vg-scrub-bar>
                <vg-scrub-bar-current-time></vg-scrub-bar-current-time>
            </vg-scrub-bar>
            <vg-time-display>{{ timeLeft | date:'mm:ss' }}</vg-time-display>
            <vg-volume>
                <vg-mute-button></vg-mute-button>
                <vg-volume-bar></vg-volume-bar>
            </vg-volume>
            <div id="castbutton">
                <button is="google-cast-button"></button>
            </div>
            <vg-fullscreen-button></vg-fullscreen-button>
        </vg-controls>
        <vg-buffering></vg-buffering>
        <vg-overlay-play></vg-overlay-play>
    </videogular>
</div>
