Mercurial > public > sg101

comparison gpp/templates/podcast/detail.html @ 402:9175392da056

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Fixing #198; add a media player to the podcast pages.
author Brian Neal <bgneal@gmail.com>
date Sun, 27 Mar 2011 01:51:18 +0000
parents daa2916f5b34
children 77d878acea5e
comparison
equal deleted inserted replaced
401:463649d7698b 402:9175392da056
1 {% extends 'podcast/base.html' %} 1 {% extends 'podcast/base.html' %}
2 {% load url from future %} 2 {% load url from future %}
3 {% block title %}Podcast: {{ podcast.title }}{% endblock %} 3 {% block title %}Podcast: {{ podcast.title }}{% endblock %}
4 {% block custom_css %}
5 <link type="text/css" href="{{ STATIC_URL }}js/jplayer/skins/blue.monday/jplayer.blue.monday.css" rel="stylesheet" />
6 {% endblock %}
7 {% block custom_js %}
8 <script type="text/javascript" src="{{ STATIC_URL }}js/jplayer/jquery.jplayer.min.js"></script>
9
10 <script type="text/javascript">
11 //<![CDATA[
12 var jplayer_media = {{ jplayer_media|safe }};
13 $(document).ready(function(){
14 $("#jquery_jplayer_1").jPlayer({
15 ready: function () {
16 $(this).jPlayer("setMedia", jplayer_media);
17 },
18 swfPath: "{{ STATIC_URL }}js/jplayer",
19 supplied: "{{ jplayer_supplied }}"
20 });
21 });
22 //]]>
23 </script>
24 {% endblock %}
4 {% block podcast-content %} 25 {% block podcast-content %}
5 <div class="breadcrumbs"> 26 <div class="breadcrumbs">
6 <a href="{% url 'podcast.views.index' %}">Podcast Index</a> &gt;&gt; {{ podcast.title }} 27 <a href="{% url 'podcast.views.index' %}">Podcast Index</a> &gt;&gt; {{ podcast.title }}
7 </div> 28 </div>
8 <h3>{{ podcast.pubdate|date:"F d, Y" }} &bull; {{ podcast.title }}</h3> 29 <h3>{{ podcast.pubdate|date:"F d, Y" }} &bull; {{ podcast.title }}</h3>
9 <h4>{{ podcast.subtitle }}</h4> 30 <h4>{{ podcast.subtitle }}</h4>
10 {{ podcast.summary|linebreaks }} 31 {{ podcast.summary|linebreaks }}
32
33 <p>Listen:</p>
34 <div id="jquery_jplayer_1" class="jp-jplayer"></div>
35 <div class="jp-audio">
36 <div class="jp-type-single">
37 <div id="jp_interface_1" class="jp-interface">
38 <ul class="jp-controls">
39 <li><a href="#" class="jp-play" tabindex="1">play</a></li>
40 <li><a href="#" class="jp-pause" tabindex="1">pause</a></li>
41 <li><a href="#" class="jp-stop" tabindex="1">stop</a></li>
42 <li><a href="#" class="jp-mute" tabindex="1">mute</a></li>
43 <li><a href="#" class="jp-unmute" tabindex="1">unmute</a></li>
44 </ul>
45 <div class="jp-progress">
46 <div class="jp-seek-bar">
47 <div class="jp-play-bar"></div>
48 </div>
49 </div>
50 <div class="jp-volume-bar">
51 <div class="jp-volume-bar-value"></div>
52 </div>
53 <div class="jp-current-time"></div>
54 <div class="jp-duration"></div>
55 </div>
56 <div id="jp_playlist_1" class="jp-playlist">
57 <ul>
58 <li>{{ podcast.title }} - {{ podcast.subtitle }}</li>
59 </ul>
60 </div>
61 </div>
62 </div>
63
64 <br />
65 <p> Or download:</p>
11 <ul> 66 <ul>
12 <li> 67 <li>
13 <a href="{{ podcast.enclosure_url }}">Download Now ({{ ext }})</a> &bull; 68 <a href="{{ podcast.enclosure_url }}">Download Now ({{ ext }})</a> &bull;
14 {{ podcast.enclosure_length|filesizeformat }} &bull; {{ podcast.duration }} 69 {{ podcast.enclosure_length|filesizeformat }} &bull; {{ podcast.duration }}
15 </li> 70 </li>