{% block mediagoblin_head -%}
{{ super() }}
<script type="text/javascript" src="{{
- request.staticdirect('/extlib/video-js/video.min.js') }}"></script>
- <link href="{{ request.staticdirect('/css/vjs-mg-skin.css')
- }}" rel="stylesheet">
+ request.staticdirect('/extlib/video-js/video.js') }}"></script>
+ <script type="text/javascript" src="{{
+ request.staticdirect('/extlib/videojs-resolution-switcher/videojs-resolution-switcher.js') }}">
+ </script>
+ <script type="text/javascript"
+ src="{{ request.staticdirect('/js/change-video-resolution.js') }}"></script>
+ {# Sadly commented out till we can get the mediagoblin skin ported over
+ # to the newest video.js release ;\ #}
+ <link href="{{
+ request.staticdirect('/extlib/video-js/video-js.css') }}"
+ rel="stylesheet">
+ <link href="{{
+ request.staticdirect('/extlib/videojs-resolution-switcher/videojs-resolution-switcher.css') }}"
+ rel="stylesheet">
+
+ <style type="text/css">
+ .vjs-default-skin .vjs-big-play-button
+ {
+ top: 50%;
+ left: 50%;
+ margin: -1.5em auto auto -2em;
+ }
+ .vjs-play-progress, .vjs-volume-level {
+ background-color: #86D4B1 !important;
+ }
+ </style>
+
{%- endblock %}
{% block mediagoblin_media %}
- {% set display_type, display_path = media.get_display_media() %}
+<div class="media_other_container">
+ {% set all_media_path = media.get_all_media() %}
<video controls
- {% if global_config['media_type:mediagoblin.media_types.video']['auto_play'] %}autoplay{% endif %}
- preload="auto" class="video-js vjs-mg-skin"
- data-setup='{"height": {{ media.media_data.height }},
- "width": {{ media.media_data.width }} }'>
- <source src="{{ request.app.public_store.file_url(display_path) }}"
- type="video/webm; codecs="vp8, vorbis"" />
+ {% if global_config['plugins']['mediagoblin.media_types.video']['auto_play'] %}autoplay{% endif %}
+ preload="auto" class="video-js vjs-default-skin" id="video_1">
+ {% for each_media_path in all_media_path %}
+ <source src="{{ request.app.public_store.file_url(each_media_path[2]) }}"
+ {% if media.media_data %}
+ type="{{ media.media_data.source_type() }}"
+ {% else %}
+ type="{{ media.media_manager['default_webm_type'] }}"
+ {% endif %}
+ label="{{ each_media_path[0] }}" res="{{ each_media_path[1][1] }}" />
+ {% endfor %}
+ {%- for subtitle in media.subtitle_files %}
+ <track src="{{ request.app.public_store.file_url(subtitle.filepath) }}"
+ label="{{ subtitle.name }}" kind="subtitles">
+ {%- endfor %}
<div class="no_html5">
{%- trans -%}Sorry, this video will not work because
your web browser does not support HTML5
video.{%- endtrans -%}<br/>
- {%- trans -%}You can get a modern web browser that
- can play this video at <a href="http://getfirefox.com">
- http://getfirefox.com</a>!{%- endtrans -%}
+ {%- trans -%}
+ We recommend you install a <a href="https://libreplanet.org/wiki/Libre_Browsers_Libre_Formats">freedom-respecting browser which supports free formats</a>!
+ {%- endtrans -%}
</div>
</video>
+</div>
{% endblock %}
{% block mediagoblin_sidebar %}
<h3>{% trans %}Download{% endtrans %}</h3>
<ul>
{% if 'original' in media.media_files %}
- <li><a href="{{ request.app.public_store.file_url(
- media.media_files.original) }}">{% trans %}Original file{% endtrans %}</a>
+ <li>
+ <a href="{{ request.app.public_store.file_url(
+ media.media_files.original) }}">
+ {%- trans %}Original file{% endtrans -%}
+ </a>
+ </li>
{% endif %}
- {% if 'webm_640' in media.media_files %}
- <li><a href="{{ request.app.public_store.file_url(
- media.media_files.webm_640) }}">{% trans %}WebM file (640p; VP8/Vorbis){% endtrans %}</a>
+ {% if 'webm_video' in media.media_files %}
+ <li>
+ <a href="{{ request.app.public_store.file_url(
+ media.media_files.webm_video) }}">
+ {%- trans %}WebM file (VP8/Vorbis){% endtrans -%}
+ </a>
+ </li>
{% endif %}
</ul>
{% endblock %}