{% load static %}
{# The banner: a fixed-aspect box (see #video-header in video-header.css) that the banner script
   fills with a <video> playing an HLS master (self-hosted hls.js, or native HLS) or a direct
   video file. #}
<div id="video-header"
     data-video-url="{{ video_url }}"
     data-hls-stream-url="{{ hls_stream_url }}"
     data-aspect-ratio="{{ aspect_ratio }}"
     data-autoplay="{{ autoplay|lower }}"
     data-loop="{{ loop|lower }}"
     data-muted="{{ muted|lower }}"
     data-controls="{{ controls|lower }}"></div>
<link rel="stylesheet" href="{% static 'pretix_video/css/video-header.css' %}">
{% if hls_stream_url %}
<script src="{% static 'pretix_video/js/hls.min.js' %}"></script>
{% endif %}
<script src="{% static 'pretix_video/js/video-header.js' %}"></script>