| 1 | {# |
| 2 | # GNU MediaGoblin -- federated, autonomous media hosting |
| 3 | # Copyright (C) 2011, 2012 MediaGoblin contributors. See AUTHORS. |
| 4 | # |
| 5 | # This program is free software: you can redistribute it and/or modify |
| 6 | # it under the terms of the GNU Affero General Public License as published by |
| 7 | # the Free Software Foundation, either version 3 of the License, or |
| 8 | # (at your option) any later version. |
| 9 | # |
| 10 | # This program is distributed in the hope that it will be useful, |
| 11 | # but WITHOUT ANY WARRANTY; without even the implied warranty of |
| 12 | # MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
| 13 | # GNU Affero General Public License for more details. |
| 14 | # |
| 15 | # You should have received a copy of the GNU Affero General Public License |
| 16 | # along with this program. If not, see <http://www.gnu.org/licenses/>. |
| 17 | #} |
| 18 | |
| 19 | {% extends 'mediagoblin/user_pages/media.html' %} |
| 20 | |
| 21 | {% block mediagoblin_head %} |
| 22 | {{ super() }} |
| 23 | <link rel="stylesheet" type="text/css" href="{{ request.staticdirect('/css/audio.css') }}" /> |
| 24 | <script type="text/javascript" src="{{ request.staticdirect( |
| 25 | '/js/audio.js') }}"></script> |
| 26 | {% endblock %} |
| 27 | |
| 28 | {% block mediagoblin_media %} |
| 29 | <div class="media_other_container"> |
| 30 | <div class="audio-media"> |
| 31 | {% if 'spectrogram' in media.media_files %} |
| 32 | <div class="audio-spectrogram"> |
| 33 | <div class="playhead"></div> |
| 34 | <div class="buffered-indicators"></div> |
| 35 | <div class="seekbar"></div> |
| 36 | <button class="audio-control-play-pause paused" aria-label="Play">▶</button> |
| 37 | <div class="audio-currentTime" aria-label="current time">00:00</div> |
| 38 | <input type="range" class="audio-volume" value="1" min="0" max="1" step="0.001" aria-label="volume" /> |
| 39 | <img src="{{ request.app.public_store.file_url( |
| 40 | media.media_files.spectrogram) }}" |
| 41 | alt="Spectrogram" /> |
| 42 | </div> |
| 43 | {% endif %} |
| 44 | <audio class="audio-player" controls="controls" |
| 45 | preload="metadata"> |
| 46 | <source src="{{ request.app.public_store.file_url( |
| 47 | media.media_files.webm_audio) }}" type="audio/webm; codecs=vorbis" /> |
| 48 | <div class="no_html5"> |
| 49 | {%- trans -%}Sorry, this audio will not work because |
| 50 | your web browser does not support HTML5 |
| 51 | audio.{%- endtrans -%}<br/> |
| 52 | {%- trans -%}You can get a modern web browser that |
| 53 | can play the audio at <a href="http://getfirefox.com"> |
| 54 | http://getfirefox.com</a>!{%- endtrans -%} |
| 55 | </div> |
| 56 | </audio> |
| 57 | </div> |
| 58 | </div> |
| 59 | {% endblock %} |
| 60 | |
| 61 | {% block mediagoblin_sidebar %} |
| 62 | <h3>{% trans %}Download{% endtrans %}</h3> |
| 63 | <ul> |
| 64 | {% if 'original' in media.media_files %} |
| 65 | <li><a href="{{ request.app.public_store.file_url( |
| 66 | media.media_files.original) }}">{% trans %}Original file{% endtrans %}</a> |
| 67 | {% endif %} |
| 68 | <li><a href="{{ request.app.public_store.file_url( |
| 69 | media.media_files.webm_audio) }}">{% trans %}WebM file (Vorbis codec){% endtrans %}</a> |
| 70 | </ul> |
| 71 | {% endblock %} |