{% extends "live/main.html" %}
{% load static %}

{% block head %}
<script type="text/javascript" src="{% static "site_live/video.js" %}" charset="utf-8"></script>
<link rel="stylesheet" href="{% static "site_live/video-js.css" %}" type="text/css" media="screen" title="Video JS" charset="utf-8" />

<script type="text/javascript" charset="utf-8">
	VideoJS.setupAllWhenReady();
</script>


{% endblock %}

{% block content %}
<h1>{{ evenement.nom }}</h1>
<a href="{% url 'live:accueil' %}">« Accueil</a><br>
<br>

<div class="video-js-box">
    <video class="video-js" width="1024" height="576" poster="{{ MEDIA_URL }}{{ evenement.url_affiche_mini }}" controls="controls" preload="auto" autoplay="autoplay">
		<source src="{{ MEDIA_URL }}{{ evenement.url_video_m4v }}" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
		<source src="{{ MEDIA_URL }}{{ evenement.url_video_webm }}" type='video/webm; codecs="vp8, vorbis"' />
		<source src="{{ MEDIA_URL }}{{ evenement.url_video_ogg }}" type='video/ogg; codecs="theora, vorbis"' />
    </video>
</div>
{% endblock %}