move header stuff to the base template

src/sigal/themes/photoswipe/templates/album.html

@@ -1,8 +1,6 @@
 {% from 'description.html' import img_description %}
 {% extends "base.html" %}
 
-{% include "ps_head.html" %}
-
 {% block content %}
   {% include "album_items.html" %}
 {% endblock %}

src/sigal/themes/photoswipe/templates/album_items.html

@@ -9,7 +9,7 @@
           <a href="{{ media.url }}"
              data-pswp-width="{{media.size.width}}"
              data-pswp-height="{{media.size.height}}"
-             {%- if media.big -%}
+             {% if media.big %}
              data-big="{{ media.big_url }}"
              {%- endif -%}
              >

src/sigal/themes/photoswipe/templates/album_list.html

@@ -1,9 +1,5 @@
 {% extends "base.html" %}
 
-{% if album.medias %}
-  {% include "ps_head.html" %}
-{% endif %}
-
 {% block content %}
   <div class="album-list">
   {% for alb in album.albums %}
@@ -16,5 +12,7 @@
   {% endfor %}
   </div>
 
-  {% include "album_items.html" %}
+  {% if album.medias %}
+    {% include "album_items.html" %}
+  {% endif %}
 {% endblock %}

src/sigal/themes/photoswipe/templates/base.html

@@ -9,6 +9,55 @@
     <meta name="author" content="{{ album.author }}">
     <meta name="viewport" content="width=device-width">
     {% include 'default_head.html' %}
+
+{% if album.medias %}
+    <link rel="stylesheet" href="{{ theme.url }}/photoswipe.css">
+    <script type="module">
+    import PhotoSwipeLightbox from '{{ theme.url }}/photoswipe-lightbox.esm.min.js';
+    import PhotoSwipe from '{{ theme.url }}/photoswipe.esm.min.js';
+    import PhotoSwipeDynamicCaption from '{{ theme.url }}/photoswipe-dynamic-caption-plugin.esm.min.js';
+    import PhotoSwipeFullscreen from '{{ theme.url }}/photoswipe-fullscreen.esm.min.js';
+    import PhotoSwipeVideoPlugin from '{{ theme.url }}/photoswipe-video-plugin.esm.min.js';
+
+    const lightbox = new PhotoSwipeLightbox({
+      gallery: '.gallery',
+      children: '.thumbnail',
+      pswpModule: PhotoSwipe
+    });
+    const captionPlugin = new PhotoSwipeDynamicCaption(lightbox, {type: 'auto'});
+    const fullscreenPlugin = new PhotoSwipeFullscreen(lightbox);
+    const videoPlugin = new PhotoSwipeVideoPlugin(lightbox, {autoplay: true});
+
+    lightbox.on('uiRegister', function() {
+      lightbox.pswp.ui.registerElement({
+        name: 'download-button',
+        order: 8,
+        isButton: true,
+        tagName: 'a',
+        html: {
+          isCustomSVG: true,
+          inner: '<path d="M20.5 14.3 17.1 18V10h-2.2v7.9l-3.4-3.6L10 16l6 6.1 6-6.1ZM23 23H9v2h14Z" id="pswp__icn-download"/>',
+          outlineID: 'pswp__icn-download'
+        },
+        onInit: (el, pswp) => {
+          el.setAttribute('download', '');
+          el.setAttribute('target', '_blank');
+          el.setAttribute('rel', 'noopener');
+          pswp.on('change', () => {
+            if (pswp.currSlide.data.element.children[0].dataset.big) {
+              el.href = pswp.currSlide.data.element.children[0].dataset.big;
+            } else {
+              el.href = pswp.currSlide.data.src;
+            }
+          });
+        }
+      });
+    });
+
+    lightbox.init();
+    </script>
+{% endif %}
+
     {% block extra_head %}{% endblock extra_head %}
     <link rel="stylesheet" href="{{ theme.url }}/styles.css">
     {% if user_css %}

src/sigal/themes/photoswipe/templates/ps_head.html

@@ -1,51 +0,0 @@
-{% block extra_head %}
-  <!--
-    FIXME: When this is imported into "album_list.html",
-    {{ theme.url }} is empty
-  -->
-  <link rel="stylesheet" href="{{ theme.url }}/photoswipe.css">
-  <script type="module">
-  import PhotoSwipeLightbox from '{{ theme.url }}/photoswipe-lightbox.esm.min.js';
-  import PhotoSwipe from '{{ theme.url }}/photoswipe.esm.min.js';
-  import PhotoSwipeDynamicCaption from '{{ theme.url }}/photoswipe-dynamic-caption-plugin.esm.min.js';
-  import PhotoSwipeFullscreen from '{{ theme.url }}/photoswipe-fullscreen.esm.min.js';
-  import PhotoSwipeVideoPlugin from '{{ theme.url }}/photoswipe-video-plugin.esm.min.js';
-
-  const lightbox = new PhotoSwipeLightbox({
-    gallery: '.gallery',
-    children: '.thumbnail',
-    pswpModule: PhotoSwipe
-  });
-  const captionPlugin = new PhotoSwipeDynamicCaption(lightbox, {type: 'auto'});
-  const fullscreenPlugin = new PhotoSwipeFullscreen(lightbox);
-  const videoPlugin = new PhotoSwipeVideoPlugin(lightbox, {autoplay: true});
-
-  lightbox.on('uiRegister', function() {
-    lightbox.pswp.ui.registerElement({
-      name: 'download-button',
-      order: 8,
-      isButton: true,
-      tagName: 'a',
-      html: {
-        isCustomSVG: true,
-        inner: '<path d="M20.5 14.3 17.1 18V10h-2.2v7.9l-3.4-3.6L10 16l6 6.1 6-6.1ZM23 23H9v2h14Z" id="pswp__icn-download"/>',
-        outlineID: 'pswp__icn-download'
-      },
-      onInit: (el, pswp) => {
-        el.setAttribute('download', '');
-        el.setAttribute('target', '_blank');
-        el.setAttribute('rel', 'noopener');
-        pswp.on('change', () => {
-          if (pswp.currSlide.data.element.children[0].dataset.big) {
-            el.href = pswp.currSlide.data.element.children[0].dataset.big;
-          } else {
-            el.href = pswp.currSlide.data.src;
-          }
-        });
-      }
-    });
-  });
-
-  lightbox.init();
-  </script>
-{% endblock extra_head %}