647f42dfc2cdbebc9f46c738f4952910ad748ac7
[wolnelektury.git] / src / catalogue / templates / catalogue / snippets / jplayer.html
1 {% load i18n catalogue_tags %}
2 {% if audiobooks %}{% if book|status:request.user != 'closed' %}
3   <div class="jp-type-playlist" data-book-id="{{ book.pk }}" data-book-slug="{{ book.slug }}">
4     <div id="jplayer" class="jp-jplayer" data-player="jp_container_{{ book.pk }}"
5          data-supplied="oga,mp3"></div>
6     <div id="jp_container_{{ book.pk }}" class="jp-audio">
7       <div class="jp-type-single">
8         <span class="title"></span>
9         <div class="jp-gui jp-interface">
10           <ul class="jp-controls">
11             <li><a href="javascript:;" class="jp-play" tabindex="1">play</a></li>
12             <li><a href="javascript:;" class="jp-pause" tabindex="1">pause</a></li>
13             <li><a href="javascript:;" class="jp-mute" tabindex="1" title="mute">mute</a></li>
14             <li><a href="javascript:;" class="jp-unmute" tabindex="1" title="unmute">unmute</a></li>
15           </ul>
16           <div class="jp-progress">
17             <div class="jp-seek-bar">
18               <div class="jp-play-bar"></div>
19             </div>
20           </div>
21           <div class="jp-volume-bar">
22             <div class="jp-volume-bar-value"></div>
23           </div>
24           <div class="jp-time-holder">
25             <div class="jp-current-time"></div>
26             <div class="jp-duration"></div>
27           </div>
28         </div>
29         <div class="jp-playlist">
30           <ul>
31             {% for i in audiobooks %}
32               <li data-mp3='{{ i.mp3.file.url }}' data-ogg='{{ i.ogg.file.url }}' data-media-id="{{ i.mp3.id }}">
33                 <div class='play'>{{ i.mp3.name }}
34                   <div class='extra-info'>
35                   {% with extra_info=i.mp3.get_extra_info_json %}
36                     {% trans "Artist:" %}&nbsp;<span class='artist'>{{ extra_info.artist_name }}</span>,
37                     {% trans "director:" %}&nbsp;<span class='director'>{{ extra_info.director_name }}</span>
38                     {% if extra_info.license %}{% license_icon extra_info.license %}{% endif %}
39                     {% if i.mp3.project_icon %}<img class="project-icon" src="{{ i.mp3.project_icon }}">{% endif %}
40                     <p>
41                      {% if i.mp3.project_description %}{{ i.mp3.project_description }}{% else %}
42                       {% with fb=extra_info.funded_by %}
43                         {% if fb %}Dofinansowano ze środków: {{ fb }}.{% endif %}
44                       {% endwith %}
45                      {% endif %}
46                     </p>
47                   {% endwith %}
48                   </div>
49                 </div>
50               </li>
51             {% endfor %}
52           </ul>
53         </div>
54
55         <div class="jp-no-solution">
56           <span>Update Required</span>
57           To play the media you will need to either update your browser to a recent version or update your
58           <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
59         </div>
60       </div>
61     </div>
62     <div>
63       {% if audiobooks|length > 1 %}
64         <a class="play-prev">« {% trans "previous" %}</a>
65         {% trans "Part" %} <span class="number">1</span> / {{ audiobooks|length }}
66         <a class="play-next">{% trans "next" %} »</a>
67       {% endif %}
68     </div>
69   </div>
70 {% endif %}{% endif %}