{% extends "/html/base.html" %}
<!--
This is used for live broadcasts (general stream, not necessarily event)
-->
{%block subtitle %}: Live{% endblock %}


{% block head %}
<link rel="stylesheet" href="/assets/videojs/video-js.css">
<script src="/assets/videojs/video.js"></script>
<script src="/assets/videojs/videojs-contrib-hls.js"></script>
{% endblock %}

{% block content %}


<div id="custom-page">
    <div id="page-header">
        <h2>{{page.title}}</h2>
    </div>
    {% if page.toc %}{{page.toc|safe}}{% endif %}

<video id="video-player" width="640" height="360" class="video-js vjs-default-skin" 
controls poster="{{page.video-thumbnail-url}}" data-setyp='{"controls": "true", "loop": "false", "autoplay": "false", "preload": "false"}'>
  <source src="{{page.video-url}}" type="application/x-mpegURL">
  </source>
  <p class="vjs-no-js">The browser doesn't seem to support our video player... new browsers should.</p>
</video>

<p>{{page.video-description}}</p>

<script>
var player = videojs('video-player');
//player.play();
</script>


    {{page.content|safe}}


</div>
{% endblock %}