Mercurial > public > sg101

annotate gpp/templates/podcast/detail.html @ 495:2bfb2755f70b

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Configure jPlayer to show hours in the duration.
author Brian Neal <bgneal@gmail.com>
date Sat, 05 Nov 2011 18:10:30 +0000
parents f0f3966ea44f
children
rev   line source
gremmie@1 1 {% extends 'podcast/base.html' %}
bgneal@310 2 {% load url from future %}
bgneal@487 3 {% load script_tags %}
bgneal@487 4 {% load core_tags %}
gremmie@1 5 {% block title %}Podcast: {{ podcast.title }}{% endblock %}
bgneal@487 6 {% block custom_meta %}
bgneal@487 7 {% open_graph_meta_tags podcast %}
bgneal@487 8 {% endblock %}
bgneal@402 9 {% block custom_css %}
bgneal@402 10 <link type="text/css" href="{{ STATIC_URL }}js/jplayer/skins/blue.monday/jplayer.blue.monday.css" rel="stylesheet" />
bgneal@402 11 {% endblock %}
bgneal@402 12 {% block custom_js %}
bgneal@402 13 <script type="text/javascript" src="{{ STATIC_URL }}js/jplayer/jquery.jplayer.min.js"></script>
bgneal@402 14
bgneal@402 15 <script type="text/javascript">
bgneal@402 16 //<![CDATA[
bgneal@402 17 var jplayer_media = {{ jplayer_media|safe }};
bgneal@402 18 $(document).ready(function(){
bgneal@402 19 $("#jquery_jplayer_1").jPlayer({
bgneal@402 20 ready: function () {
bgneal@495 21 $.jPlayer.timeFormat.showHour = true;
bgneal@402 22 $(this).jPlayer("setMedia", jplayer_media);
bgneal@402 23 },
bgneal@402 24 swfPath: "{{ STATIC_URL }}js/jplayer",
bgneal@402 25 supplied: "{{ jplayer_supplied }}"
bgneal@402 26 });
bgneal@402 27 });
bgneal@402 28 //]]>
bgneal@402 29 </script>
bgneal@402 30 {% endblock %}
bgneal@490 31 {% block begin_body %}{% include 'core/social_sharing_begin.html' %}{% endblock %}
gremmie@1 32 {% block podcast-content %}
bgneal@225 33 <div class="breadcrumbs">
bgneal@310 34 <a href="{% url 'podcast.views.index' %}">Podcast Index</a> &gt;&gt; {{ podcast.title }}
gremmie@1 35 </div>
gremmie@1 36 <h3>{{ podcast.pubdate|date:"F d, Y" }} &bull; {{ podcast.title }}</h3>
gremmie@1 37 <h4>{{ podcast.subtitle }}</h4>
gremmie@1 38 {{ podcast.summary|linebreaks }}
bgneal@402 39
bgneal@402 40 <p>Listen:</p>
bgneal@402 41 <div id="jquery_jplayer_1" class="jp-jplayer"></div>
bgneal@488 42 <div id="jp_container_1" class="jp-audio">
bgneal@402 43 <div class="jp-type-single">
bgneal@488 44 <div class="jp-gui jp-interface">
bgneal@402 45 <ul class="jp-controls">
bgneal@488 46 <li><a href="javascript:;" class="jp-play" tabindex="1">play</a></li>
bgneal@488 47 <li><a href="javascript:;" class="jp-pause" tabindex="1">pause</a></li>
bgneal@488 48 <li><a href="javascript:;" class="jp-stop" tabindex="1">stop</a></li>
bgneal@488 49 <li><a href="javascript:;" class="jp-mute" tabindex="1" title="mute">mute</a></li>
bgneal@488 50 <li><a href="javascript:;" class="jp-unmute" tabindex="1" title="unmute">unmute</a></li>
bgneal@488 51 <li><a href="javascript:;" class="jp-volume-max" tabindex="1" title="max volume">max volume</a></li>
bgneal@402 52 </ul>
bgneal@402 53 <div class="jp-progress">
bgneal@402 54 <div class="jp-seek-bar">
bgneal@402 55 <div class="jp-play-bar"></div>
bgneal@402 56 </div>
bgneal@402 57 </div>
bgneal@402 58 <div class="jp-volume-bar">
bgneal@402 59 <div class="jp-volume-bar-value"></div>
bgneal@402 60 </div>
bgneal@488 61 <div class="jp-time-holder">
bgneal@488 62 <div class="jp-current-time"></div>
bgneal@488 63 <div class="jp-duration"></div>
bgneal@488 64 <ul class="jp-toggles">
bgneal@488 65 <li><a href="javascript:;" class="jp-repeat" tabindex="1" title="repeat">repeat</a></li>
bgneal@488 66 <li><a href="javascript:;" class="jp-repeat-off" tabindex="1" title="repeat off">repeat off</a></li>
bgneal@488 67 </ul>
bgneal@488 68 </div>
bgneal@402 69 </div>
bgneal@488 70 <div class="jp-title">
bgneal@402 71 <ul>
bgneal@488 72 <li>{{ podcast.title }} - {{ podcast.subtitle }}</li>
bgneal@402 73 </ul>
bgneal@402 74 </div>
bgneal@488 75 <div class="jp-no-solution">
bgneal@488 76 <span>Update Required</span>
bgneal@488 77 To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
bgneal@488 78 </div>
bgneal@402 79 </div>
bgneal@402 80 </div>
bgneal@402 81
bgneal@402 82 <br />
bgneal@402 83 <p> Or download:</p>
bgneal@143 84 <ul>
bgneal@143 85 <li>
bgneal@143 86 <a href="{{ podcast.enclosure_url }}">Download Now ({{ ext }})</a> &bull;
bgneal@143 87 {{ podcast.enclosure_length|filesizeformat }} &bull; {{ podcast.duration }}
bgneal@143 88 </li>
bgneal@143 89 {% if alt_ext %}
bgneal@143 90 <li>
bgneal@143 91 <a href="{{ podcast.alt_enclosure_url }}">Download Now ({{ alt_ext }})</a>
bgneal@143 92 </li>
bgneal@143 93 {% endif %}
bgneal@143 94 </ul>
bgneal@487 95 {% social_sharing podcast.search_title podcast.get_absolute_url %}
gremmie@1 96 {% endblock %}
bgneal@490 97 {% block end_body %}{% include 'core/social_sharing_end.html' %}{% endblock %}