fixes

[wolnelektury.git] / src / catalogue / templates / catalogue / snippets / 2022_jplayer.html

diff --git a/src/catalogue/templates/catalogue/snippets/2022_jplayer.html b/src/catalogue/templates/catalogue/snippets/2022_jplayer.html
index d7c19a8..6c941d7 100644 (file)
--- a/src/catalogue/templates/catalogue/snippets/2022_jplayer.html
+++ b/src/catalogue/templates/catalogue/snippets/2022_jplayer.html
@@ -1,43 +1,48 @@
-{% load i18n catalogue_tags %}
+{% load i18n l10n catalogue_tags %}
 
 {% with audiobooks=book.get_audiobooks %}
-  <div class="c-media__player" id="jp_container_{{ book.pk }}">
+  <div class="c-media__player" id="jp_container_{{ book.pk }}" data-book-slug="{{ book.slug }}">
     <div class="jp-jplayer" data-player="jp_container_{{ book.pk }}"
          data-supplied="oga,mp3"></div>
 
     <div class="c-player__head">
-      <span></span>
+      <span>&nbsp;</span>
     </div>
 
     <div class="c-player">
       <div class="c-player__btns">
-        <button class="play-prev"><i class="icon icon-prev"></i></button>
-        <button class="c-player__btn--md jp-play"><i class="icon icon-play"></i></button>
-        <button class="play-next"><i class="icon icon-next"></i></button>
-        <div class="c-select speed">
+        <button class="play-prev" data-s-ord="2"><i class="icon icon-prev"></i></button>
+        <button class="c-player__btn--md jp-play" data-s-ord="3"><i class="icon icon-play"></i></button>
+        <button class="play-next" data-s-ord="4"><i class="icon icon-next"></i></button>
+        <div class="c-select speed" data-s-ord="1">
           <ul>
-            <li>2×</li>
-            <li>1.75×</li>
-            <li>1.5×</li>
-            <li>1.25×</li>
-            <li class="is-active">1×</li>
-            <li>0.75×</li>
-            <li>0.5×</li>
-            <li>0.25×</li>
+            <li data-speed="2">2×</li>
+            <li data-speed="1.75">1.75×</li>
+            <li data-speed="1.5">1.5×</li>
+            <li data-speed="1.25">1.25×</li>
+            <li data-speed="1" class="is-active">1×</li>
+            <li data-speed="0.75">0.75×</li>
+            <li data-speed="0.5">0.5×</li>
           </ul>
         </div>
       </div>
 
       <div class="c-player__timeline">
-        <div class="c-player__info"></div>
         <div class="c-player__chapters">
-          <span>Rozdziały</span>
+          {% if audiobooks.0|length > 1 %}
+            <span>
+              <span class="only-l">Rozdziały</span>
+              <span class="only-s">Roz.</span>
+            </span>
+          {% endif %}
           <ul class="jp-playlist">
+            {% localize off %}
             {% for i in audiobooks.0 %}
               <li
                   data-mp3='{{ i.mp3.file.url }}'
                   data-ogg='{{ i.ogg.file.url }}'
                   data-media-id="{{ i.mp3.id }}"
+                  data-duration="{{ i.mp3.duration }}"
               >
                 {% with extra_info=i.mp3.get_extra_info_json %}
                   <span class="title">
@@ -63,8 +68,10 @@
                {% endwith %}
               </li>
             {% endfor %}
+            {% endlocalize %}
           </ul>
         </div>
+        <div class="c-player__info"></div>
         <span>
           <span class="jp-seek-bar">
             <span class="jp-play-bar"></span>
@@ -73,12 +80,9 @@
 
         <time class="c-player__length">
           <span class="jp-current-time"></span>
-          <span>
-            <span class="jp-duration"></span>
-            {% if audiobooks.0|length > 1 %}
-              / {{ audiobooks.2 }}
-            {% endif %}
+          <span class="time-left">
           </span>
+          <span class="total-time-left">?</span>
         </time>
       </div>
 
@@ -97,39 +101,5 @@
       <div class="project-logo"></div>
       <div class="content"></div>
     </div>
-
-    <ul class="jp-playlist" style="display: none;">
-      {% for i in audiobooks.0 %}
-        <li
-            data-mp3='{{ i.mp3.file.url }}'
-            data-ogg='{{ i.ogg.file.url }}'
-            data-media-id="{{ i.mp3.id }}"
-        >
-          {% with extra_info=i.mp3.get_extra_info_json %}
-            <span class="title">
-              {{ i.mp3.part_name }}
-            </span>
-            <span class="attribution">
-              {% trans "Artist:" %}&nbsp;<span class='artist'>{{ extra_info.artist_name }}</span>,
-              {% trans "director:" %}&nbsp;<span class='director'>{{ extra_info.director_name }}</span>
-            </span>
-            <span class="license">
-              {% if extra_info.license %}{% license_icon extra_info.license %}{% endif %}
-            </span>
-            <span class="project-icon">
-              {% if i.mp3.project_icon %}<img class="project-icon" src="{{ i.mp3.project_icon }}">{% endif %}
-            </span>
-            <span class="project-description">
-              {% if i.mp3.project_description %}{{ i.mp3.project_description }}{% else %}
-                {% with fb=extra_info.funded_by %}
-                  {% if fb %}Dofinansowano ze środków: {{ fb }}.{% endif %}
-                {% endwith %}
-             {% endif %}
-            </span>
-         {% endwith %}
-        </li>
-      {% endfor %}
-    </ul>
-
   </div>
 {% endwith %}