Almost ready.

[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 9201e72..2f7caf6 100644 (file)
--- a/src/catalogue/templates/catalogue/snippets/2022_jplayer.html
+++ b/src/catalogue/templates/catalogue/snippets/2022_jplayer.html
@@ -1,70 +1,75 @@
 {% load i18n catalogue_tags %}
 
-<div class="c-media__player" id="jp_container_{{ book.pk }}">
-  <div class="jp-jplayer" data-player="jp_container_{{ book.pk }}"
-       data-supplied="oga,mp3"></div>
+{% with audiobooks=book.get_audiobooks %}
+  <div class="c-media__player" id="jp_container_{{ book.pk }}">
+    <div class="jp-jplayer" data-player="jp_container_{{ book.pk }}"
+         data-supplied="oga,mp3"></div>
 
-  <div class="c-player">
-    <button class="c-player__btn jp-play">
-      <i class="icon icon-play"></i>
-    </button>
-    <button class="c-player__btn jp-pause">
-      <i class="icon icon-play"></i>
-    </button>
-    <div class="c-player__timeline">
-      <div class="c-player__title">
-      </div>
-      <div class="c-player__info"></div>
-      <span>
-        <span class="jp-seek-bar">
-          <span class="jp-play-bar"></span>
-        </span>
-      </span>
-      <time class="c-player__length">
-        <span class="jp-current-time"></span>
+    <div class="c-player">
+      <button class="c-player__btn jp-play">
+        <i class="icon icon-play"></i>
+      </button>
+      <button class="c-player__btn jp-pause">
+        <i class="icon icon-pause"></i>
+      </button>
+      <div class="c-player__timeline">
+        <div class="c-player__title">
+        </div>
+        <div class="c-player__info"></div>
         <span>
-          <span class="jp-duration"></span>
+          <span class="jp-seek-bar">
+            <span class="jp-play-bar"></span>
+          </span>
         </span>
-      </time>
+        <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>
+        </time>
+      </div>
+    </div>
+    <div class="c-media__caption">
+      <div class="license"></div>
+      <div class="project-logo"></div>
+      <div class="content"></div>
     </div>
-  </div>
-  <div class="c-media__caption">
-    <div class="license"></div>
-    <div class="project-logo"></div>
-    <div class="content"></div>
-  </div>
 
-  <ul class="jp-playlist" style="display: none;">
-    {% for i in book.get_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>
+    <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>
+  </div>
+{% endwith %}