sigal 2.4__py3-none-any.whl → 2.5__py3-none-any.whl

sigal/themes/photoswipe/static/photoswipe-dynamic-caption-plugin.esm.js

@@ -0,0 +1,414 @@
+/**
+ * PhotoSwipe Dynamic Caption plugin v1.2.7
+ * https://github.com/dimsemenov/photoswipe-dynamic-caption-plugin
+ * 
+ * By https://dimsemenov.com
+ */
+
+const defaultOptions = {
+  captionContent: '.pswp-caption-content',
+  type: 'auto',
+  horizontalEdgeThreshold: 20,
+  mobileCaptionOverlapRatio: 0.3,
+  mobileLayoutBreakpoint: 600,
+  verticallyCenterImage: false
+};
+
+class PhotoSwipeDynamicCaption {
+  constructor(lightbox, options) {
+    this.options = {
+      ...defaultOptions,
+      ...options
+    };
+
+    this.lightbox = lightbox;
+
+    this.lightbox.on('init', () => {
+      this.pswp = this.lightbox.pswp;
+      this.initCaption();
+    });
+  }
+
+  initCaption() {
+    const { pswp } = this;
+
+    pswp.on('change', () => {
+      // make sure caption is displayed after slides are switched
+      this.showCaption(this.pswp.currSlide);
+    });
+
+    pswp.on('calcSlideSize', (e) => this.onCalcSlideSize(e));
+
+    pswp.on('slideDestroy', (e) => {
+      if (e.slide.dynamicCaption) {
+        if (e.slide.dynamicCaption.element) {
+          e.slide.dynamicCaption.element.remove();
+        }
+        delete e.slide.dynamicCaption;
+      }
+    });
+
+    // hide caption if zoomed
+    pswp.on('zoomPanUpdate', ({ slide }) => {
+      if (pswp.opener.isOpen && slide.dynamicCaption) {
+        if (slide.currZoomLevel > slide.zoomLevels.initial) {
+          this.hideCaption(slide);
+        } else {
+          this.showCaption(slide);
+        }
+  
+        // move caption on vertical drag
+        if (slide.dynamicCaption.element) {
+          let captionYOffset = 0;
+          if (slide.currZoomLevel <= slide.zoomLevels.initial) {
+            const shiftedAmount = slide.pan.y - slide.bounds.center.y;
+            if (Math.abs(shiftedAmount) > 1) {
+              captionYOffset = shiftedAmount;
+            }
+          }
+
+          this.setCaptionYOffset(slide.dynamicCaption.element, captionYOffset);
+        }
+
+        this.adjustPanArea(slide, slide.currZoomLevel);
+      }
+    });
+
+    pswp.on('beforeZoomTo', (e) => {
+      this.adjustPanArea(pswp.currSlide, e.destZoomLevel);
+    });
+
+    // Stop default action of tap when tapping on the caption
+    pswp.on('tapAction', (e) => {
+      if (e.originalEvent.target.closest('.pswp__dynamic-caption')) {
+        e.preventDefault();
+      }
+    });
+  }
+
+  adjustPanArea(slide, zoomLevel) {
+    if (slide.dynamicCaption && slide.dynamicCaption.adjustedPanAreaSize) {
+      if (zoomLevel > slide.zoomLevels.initial) {
+        slide.panAreaSize.x = slide.dynamicCaption.originalPanAreaSize.x;
+        slide.panAreaSize.y = slide.dynamicCaption.originalPanAreaSize.y;
+      } else {
+        // Restore panAreaSize after we zoom back to initial position
+        slide.panAreaSize.x = slide.dynamicCaption.adjustedPanAreaSize.x;
+        slide.panAreaSize.y = slide.dynamicCaption.adjustedPanAreaSize.y;
+      }
+    }
+  }
+
+  useMobileLayout() {
+    const { mobileLayoutBreakpoint } = this.options;
+
+    if (typeof mobileLayoutBreakpoint === 'function') {
+      return mobileLayoutBreakpoint.call(this);
+    } else if (typeof mobileLayoutBreakpoint === 'number') {
+      if (window.innerWidth < mobileLayoutBreakpoint) {
+        return true;
+      }
+    }
+    
+    return false;
+  }
+
+  hideCaption(slide) {
+    if (slide.dynamicCaption && !slide.dynamicCaption.hidden) {
+      const captionElement = slide.dynamicCaption.element;
+
+      if (!captionElement) {
+        return;
+      }
+
+      slide.dynamicCaption.hidden = true;
+      captionElement.classList.add('pswp__dynamic-caption--faded');
+
+      // Disable caption visibility with the delay, so it's not interactable 
+      if (slide.captionFadeTimeout) {
+        clearTimeout(slide.captionFadeTimeout);
+      }
+      slide.captionFadeTimeout = setTimeout(() => {
+        captionElement.style.visibility = 'hidden';
+        delete slide.captionFadeTimeout;
+      }, 400);
+    }
+  }
+
+  setCaptionYOffset(el, y) {
+    el.style.transform = `translateY(${y}px)`;
+  }
+
+  showCaption(slide) {
+    if (slide.dynamicCaption && slide.dynamicCaption.hidden) {
+      const captionElement = slide.dynamicCaption.element;
+
+      if (!captionElement) {
+        return;
+      }
+
+      slide.dynamicCaption.hidden = false;
+      captionElement.style.visibility = 'visible';
+      
+      clearTimeout(slide.captionFadeTimeout);
+      slide.captionFadeTimeout = setTimeout(() => {
+        captionElement.classList.remove('pswp__dynamic-caption--faded');
+        delete slide.captionFadeTimeout;;
+      }, 50);
+    }
+  }
+
+  setCaptionPosition(captionEl, x, y) {
+    const isOnHorizontalEdge = (x <= this.options.horizontalEdgeThreshold);
+    captionEl.classList[
+      isOnHorizontalEdge ? 'add' : 'remove'
+    ]('pswp__dynamic-caption--on-hor-edge');
+
+    captionEl.style.left = x + 'px';
+    captionEl.style.top = y + 'px';
+  }
+
+  setCaptionWidth(captionEl, width) {
+    if (!width) {
+      captionEl.style.removeProperty('width');
+    } else {
+      captionEl.style.width = width + 'px';
+    }
+  }
+
+  setCaptionType(captionEl, type) {
+    const prevType = captionEl.dataset.pswpCaptionType;
+    if (type !== prevType) {
+      captionEl.classList.add('pswp__dynamic-caption--' + type);
+      captionEl.classList.remove('pswp__dynamic-caption--' + prevType);
+      captionEl.dataset.pswpCaptionType = type;
+    }
+  }
+
+  updateCaptionPosition(slide) {
+    if (!slide.dynamicCaption || !slide.dynamicCaption.type || !slide.dynamicCaption.element) {
+      return;
+    }
+
+    if (slide.dynamicCaption.type === 'mobile') {
+      this.setCaptionType(
+        slide.dynamicCaption.element, 
+        slide.dynamicCaption.type
+      );
+      
+      slide.dynamicCaption.element.style.removeProperty('left');
+      slide.dynamicCaption.element.style.removeProperty('top');
+      this.setCaptionWidth(slide.dynamicCaption.element, false);
+      return;
+    }
+
+    const zoomLevel = slide.zoomLevels.initial;
+    const imageWidth = Math.ceil(slide.width * zoomLevel);
+    const imageHeight = Math.ceil(slide.height * zoomLevel);
+    
+    this.setCaptionType(slide.dynamicCaption.element, slide.dynamicCaption.type);
+    if (slide.dynamicCaption.type === 'aside') {
+      this.setCaptionPosition(
+        slide.dynamicCaption.element,
+        slide.bounds.center.x + imageWidth,
+        slide.bounds.center.y
+      );
+      this.setCaptionWidth(slide.dynamicCaption.element, false);
+    } else if (slide.dynamicCaption.type === 'below') {
+      this.setCaptionPosition(
+        slide.dynamicCaption.element,
+        slide.bounds.center.x,
+        slide.bounds.center.y + imageHeight
+      );
+      this.setCaptionWidth(slide.dynamicCaption.element, imageWidth);
+    }
+  }
+
+  onCalcSlideSize(e) {
+    const { slide } = e;
+    let captionSize;
+    let useMobileVersion;
+
+    if (!slide.dynamicCaption) {
+      slide.dynamicCaption = {
+        element: undefined,
+        type: false,
+        hidden: false
+      };
+
+      const captionHTML = this.getCaptionHTML(slide);
+
+      if (!captionHTML) {
+        return;
+      }
+
+      slide.dynamicCaption.element = document.createElement('div');
+      slide.dynamicCaption.element.className = 'pswp__dynamic-caption pswp__hide-on-close';
+      slide.dynamicCaption.element.innerHTML = captionHTML;
+
+      this.pswp.dispatch('dynamicCaptionUpdateHTML', { 
+        captionElement: slide.dynamicCaption.element,
+        slide
+      });
+
+      slide.holderElement.appendChild(slide.dynamicCaption.element);
+    }
+
+    if (!slide.dynamicCaption.element) {
+      return;
+    }
+
+    this.storeOriginalPanAreaSize(slide);
+
+    slide.bounds.update(slide.zoomLevels.initial);
+    
+    if (this.useMobileLayout()) {
+      slide.dynamicCaption.type = 'mobile';
+      useMobileVersion = true;
+    } else {
+      if (this.options.type === 'auto') {
+        if (slide.bounds.center.x > slide.bounds.center.y) {
+          slide.dynamicCaption.type = 'aside';
+        } else {
+          slide.dynamicCaption.type = 'below';
+        }
+      } else {
+        slide.dynamicCaption.type = this.options.type;
+      }
+    } 
+
+    const imageWidth = Math.ceil(slide.width * slide.zoomLevels.initial);
+    const imageHeight = Math.ceil(slide.height * slide.zoomLevels.initial);
+
+    this.setCaptionType(
+      slide.dynamicCaption.element, 
+      slide.dynamicCaption.type
+    );
+
+    if (slide.dynamicCaption.type === 'aside') {
+      this.setCaptionWidth(slide.dynamicCaption.element, false);
+      captionSize = this.measureCaptionSize(slide.dynamicCaption.element, e.slide);
+
+      const captionWidth = captionSize.x;      
+
+      const horizontalEnding = imageWidth + slide.bounds.center.x;
+      const horizontalLeftover = (slide.panAreaSize.x - horizontalEnding);
+
+      if (horizontalLeftover <= captionWidth) {
+        slide.panAreaSize.x -= captionWidth;
+        this.recalculateZoomLevelAndBounds(slide);
+      } else {
+        // do nothing, caption will fit aside without any adjustments
+      }
+    } else if (slide.dynamicCaption.type === 'below' || useMobileVersion) {
+      this.setCaptionWidth(
+        slide.dynamicCaption.element, 
+        useMobileVersion ? this.pswp.viewportSize.x : imageWidth
+      );
+
+      captionSize = this.measureCaptionSize(slide.dynamicCaption.element, e.slide);
+      const captionHeight = captionSize.y;
+
+      if (this.options.verticallyCenterImage) {
+        slide.panAreaSize.y -= captionHeight;
+        this.recalculateZoomLevelAndBounds(slide);
+      } else {
+        // Lift up the image only by caption height
+
+        // vertical ending of the image
+        const verticalEnding = imageHeight + slide.bounds.center.y;
+
+        // height between bottom of the screen and ending of the image
+        // (before any adjustments applied) 
+        const verticalLeftover = slide.panAreaSize.y - verticalEnding;
+        const initialPanAreaHeight = slide.panAreaSize.y;
+
+        if (verticalLeftover <= captionHeight) {
+          // lift up the image to give more space for caption
+          slide.panAreaSize.y -= Math.min((captionHeight - verticalLeftover) * 2, captionHeight);
+
+          // we reduce viewport size, thus we need to update zoom level and pan bounds
+          this.recalculateZoomLevelAndBounds(slide);
+
+          const maxPositionX = slide.panAreaSize.x * this.options.mobileCaptionOverlapRatio / 2;
+
+          // Do not reduce viewport height if too few space available
+          if (useMobileVersion 
+              && slide.bounds.center.x > maxPositionX) {
+            // Restore the default position
+            slide.panAreaSize.y = initialPanAreaHeight;
+            this.recalculateZoomLevelAndBounds(slide);
+          }
+        }
+      }
+    } else {
+      // mobile
+    }
+
+    this.storeAdjustedPanAreaSize(slide);
+    this.updateCaptionPosition(slide);
+  }
+
+  measureCaptionSize(captionEl, slide) {
+    const rect = captionEl.getBoundingClientRect();
+    const event = this.pswp.dispatch('dynamicCaptionMeasureSize', {
+      captionEl,
+      slide,
+      captionSize: {
+        x: rect.width,
+        y: rect.height
+      }
+    });
+    return event.captionSize;
+  }
+
+  recalculateZoomLevelAndBounds(slide) {
+    slide.zoomLevels.update(slide.width, slide.height, slide.panAreaSize);
+    slide.bounds.update(slide.zoomLevels.initial);
+  }
+
+  storeAdjustedPanAreaSize(slide) {
+    if (slide.dynamicCaption) {
+      if (!slide.dynamicCaption.adjustedPanAreaSize) {
+        slide.dynamicCaption.adjustedPanAreaSize = {};
+      }
+      slide.dynamicCaption.adjustedPanAreaSize.x = slide.panAreaSize.x;
+      slide.dynamicCaption.adjustedPanAreaSize.y = slide.panAreaSize.y;
+    }
+  }
+
+  storeOriginalPanAreaSize(slide) {
+    if (slide.dynamicCaption) {
+      if (!slide.dynamicCaption.originalPanAreaSize) {
+        slide.dynamicCaption.originalPanAreaSize = {};
+      }
+      slide.dynamicCaption.originalPanAreaSize.x = slide.panAreaSize.x;
+      slide.dynamicCaption.originalPanAreaSize.y = slide.panAreaSize.y;
+    }
+  }
+
+  getCaptionHTML(slide) {
+    if (typeof this.options.captionContent === 'function') {
+      return this.options.captionContent.call(this, slide);
+    }
+
+    const currSlideElement = slide.data.element;
+    let captionHTML = '';
+    if (currSlideElement) {
+      const hiddenCaption = currSlideElement.querySelector(this.options.captionContent);
+      if (hiddenCaption) {
+        // get caption from element with class pswp-caption-content
+        captionHTML = hiddenCaption.innerHTML;
+      } else {
+        const img = currSlideElement.querySelector('img');
+        if (img) {
+          // get caption from alt attribute
+          captionHTML = img.getAttribute('alt');
+        }
+      }
+    }
+    return captionHTML;
+  }
+}
+
+export default PhotoSwipeDynamicCaption;

sigal/themes/photoswipe/static/photoswipe-dynamic-caption-plugin.esm.min.js

@@ -0,0 +1,5 @@
+/*!
+  * PhotoSwipe Dynamic Caption plugin 1.2.7 - https://photoswipe.com
+  * (c) 2022 Dmytro Semenov
+  */
+const t={captionContent:".pswp-caption-content",type:"auto",horizontalEdgeThreshold:20,mobileCaptionOverlapRatio:.3,mobileLayoutBreakpoint:600,verticallyCenterImage:!1};class i{constructor(i,e){this.options={...t,...e},this.lightbox=i,this.lightbox.on("init",(()=>{this.pswp=this.lightbox.pswp,this.initCaption()}))}initCaption(){const{pswp:t}=this;t.on("change",(()=>{this.showCaption(this.pswp.currSlide)})),t.on("calcSlideSize",(t=>this.onCalcSlideSize(t))),t.on("slideDestroy",(t=>{t.slide.dynamicCaption&&(t.slide.dynamicCaption.element&&t.slide.dynamicCaption.element.remove(),delete t.slide.dynamicCaption)})),t.on("zoomPanUpdate",(({slide:i})=>{if(t.opener.isOpen&&i.dynamicCaption){if(i.currZoomLevel>i.zoomLevels.initial?this.hideCaption(i):this.showCaption(i),i.dynamicCaption.element){let t=0;if(i.currZoomLevel<=i.zoomLevels.initial){const e=i.pan.y-i.bounds.center.y;Math.abs(e)>1&&(t=e)}this.setCaptionYOffset(i.dynamicCaption.element,t)}this.adjustPanArea(i,i.currZoomLevel)}})),t.on("beforeZoomTo",(i=>{this.adjustPanArea(t.currSlide,i.destZoomLevel)})),t.on("tapAction",(t=>{t.originalEvent.target.closest(".pswp__dynamic-caption")&&t.preventDefault()}))}adjustPanArea(t,i){t.dynamicCaption&&t.dynamicCaption.adjustedPanAreaSize&&(i>t.zoomLevels.initial?(t.panAreaSize.x=t.dynamicCaption.originalPanAreaSize.x,t.panAreaSize.y=t.dynamicCaption.originalPanAreaSize.y):(t.panAreaSize.x=t.dynamicCaption.adjustedPanAreaSize.x,t.panAreaSize.y=t.dynamicCaption.adjustedPanAreaSize.y))}useMobileLayout(){const{mobileLayoutBreakpoint:t}=this.options;return"function"==typeof t?t.call(this):"number"==typeof t&&window.innerWidth<t}hideCaption(t){if(t.dynamicCaption&&!t.dynamicCaption.hidden){const i=t.dynamicCaption.element;if(!i)return;t.dynamicCaption.hidden=!0,i.classList.add("pswp__dynamic-caption--faded"),t.captionFadeTimeout&&clearTimeout(t.captionFadeTimeout),t.captionFadeTimeout=setTimeout((()=>{i.style.visibility="hidden",delete t.captionFadeTimeout}),400)}}setCaptionYOffset(t,i){t.style.transform=`translateY(${i}px)`}showCaption(t){if(t.dynamicCaption&&t.dynamicCaption.hidden){const i=t.dynamicCaption.element;if(!i)return;t.dynamicCaption.hidden=!1,i.style.visibility="visible",clearTimeout(t.captionFadeTimeout),t.captionFadeTimeout=setTimeout((()=>{i.classList.remove("pswp__dynamic-caption--faded"),delete t.captionFadeTimeout}),50)}}setCaptionPosition(t,i,e){const s=i<=this.options.horizontalEdgeThreshold;t.classList[s?"add":"remove"]("pswp__dynamic-caption--on-hor-edge"),t.style.left=i+"px",t.style.top=e+"px"}setCaptionWidth(t,i){i?t.style.width=i+"px":t.style.removeProperty("width")}setCaptionType(t,i){const e=t.dataset.pswpCaptionType;i!==e&&(t.classList.add("pswp__dynamic-caption--"+i),t.classList.remove("pswp__dynamic-caption--"+e),t.dataset.pswpCaptionType=i)}updateCaptionPosition(t){if(!t.dynamicCaption||!t.dynamicCaption.type||!t.dynamicCaption.element)return;if("mobile"===t.dynamicCaption.type)return this.setCaptionType(t.dynamicCaption.element,t.dynamicCaption.type),t.dynamicCaption.element.style.removeProperty("left"),t.dynamicCaption.element.style.removeProperty("top"),void this.setCaptionWidth(t.dynamicCaption.element,!1);const i=t.zoomLevels.initial,e=Math.ceil(t.width*i),s=Math.ceil(t.height*i);this.setCaptionType(t.dynamicCaption.element,t.dynamicCaption.type),"aside"===t.dynamicCaption.type?(this.setCaptionPosition(t.dynamicCaption.element,t.bounds.center.x+e,t.bounds.center.y),this.setCaptionWidth(t.dynamicCaption.element,!1)):"below"===t.dynamicCaption.type&&(this.setCaptionPosition(t.dynamicCaption.element,t.bounds.center.x,t.bounds.center.y+s),this.setCaptionWidth(t.dynamicCaption.element,e))}onCalcSlideSize(t){const{slide:i}=t;let e,s;if(!i.dynamicCaption){i.dynamicCaption={element:void 0,type:!1,hidden:!1};const t=this.getCaptionHTML(i);if(!t)return;i.dynamicCaption.element=document.createElement("div"),i.dynamicCaption.element.className="pswp__dynamic-caption pswp__hide-on-close",i.dynamicCaption.element.innerHTML=t,this.pswp.dispatch("dynamicCaptionUpdateHTML",{captionElement:i.dynamicCaption.element,slide:i}),i.holderElement.appendChild(i.dynamicCaption.element)}if(!i.dynamicCaption.element)return;this.storeOriginalPanAreaSize(i),i.bounds.update(i.zoomLevels.initial),this.useMobileLayout()?(i.dynamicCaption.type="mobile",s=!0):"auto"===this.options.type?i.bounds.center.x>i.bounds.center.y?i.dynamicCaption.type="aside":i.dynamicCaption.type="below":i.dynamicCaption.type=this.options.type;const o=Math.ceil(i.width*i.zoomLevels.initial),n=Math.ceil(i.height*i.zoomLevels.initial);if(this.setCaptionType(i.dynamicCaption.element,i.dynamicCaption.type),"aside"===i.dynamicCaption.type){this.setCaptionWidth(i.dynamicCaption.element,!1),e=this.measureCaptionSize(i.dynamicCaption.element,t.slide);const s=e.x,n=o+i.bounds.center.x;i.panAreaSize.x-n<=s&&(i.panAreaSize.x-=s,this.recalculateZoomLevelAndBounds(i))}else if("below"===i.dynamicCaption.type||s){this.setCaptionWidth(i.dynamicCaption.element,s?this.pswp.viewportSize.x:o),e=this.measureCaptionSize(i.dynamicCaption.element,t.slide);const a=e.y;if(this.options.verticallyCenterImage)i.panAreaSize.y-=a,this.recalculateZoomLevelAndBounds(i);else{const t=n+i.bounds.center.y,e=i.panAreaSize.y-t,o=i.panAreaSize.y;if(e<=a){i.panAreaSize.y-=Math.min(2*(a-e),a),this.recalculateZoomLevelAndBounds(i);const t=i.panAreaSize.x*this.options.mobileCaptionOverlapRatio/2;s&&i.bounds.center.x>t&&(i.panAreaSize.y=o,this.recalculateZoomLevelAndBounds(i))}}}this.storeAdjustedPanAreaSize(i),this.updateCaptionPosition(i)}measureCaptionSize(t,i){const e=t.getBoundingClientRect();return this.pswp.dispatch("dynamicCaptionMeasureSize",{captionEl:t,slide:i,captionSize:{x:e.width,y:e.height}}).captionSize}recalculateZoomLevelAndBounds(t){t.zoomLevels.update(t.width,t.height,t.panAreaSize),t.bounds.update(t.zoomLevels.initial)}storeAdjustedPanAreaSize(t){t.dynamicCaption&&(t.dynamicCaption.adjustedPanAreaSize||(t.dynamicCaption.adjustedPanAreaSize={}),t.dynamicCaption.adjustedPanAreaSize.x=t.panAreaSize.x,t.dynamicCaption.adjustedPanAreaSize.y=t.panAreaSize.y)}storeOriginalPanAreaSize(t){t.dynamicCaption&&(t.dynamicCaption.originalPanAreaSize||(t.dynamicCaption.originalPanAreaSize={}),t.dynamicCaption.originalPanAreaSize.x=t.panAreaSize.x,t.dynamicCaption.originalPanAreaSize.y=t.panAreaSize.y)}getCaptionHTML(t){if("function"==typeof this.options.captionContent)return this.options.captionContent.call(this,t);const i=t.data.element;let e="";if(i){const t=i.querySelector(this.options.captionContent);if(t)e=t.innerHTML;else{const t=i.querySelector("img");t&&(e=t.getAttribute("alt"))}}return e}}export{i as default};

sigal/themes/photoswipe/static/photoswipe-fullscreen.esm.js

@@ -0,0 +1,129 @@
+/**
+ * PhotoSwipe fullscreen plugin v1.0.5
+ *
+ * Inspired by https://github.com/dimsemenov/PhotoSwipe/issues/1759
+ *
+ * By https://arnowelzel.de
+ */
+
+const defaultOptions = {
+    fullscreenTitle: 'Toggle fullscreen'
+};
+
+class PhotoSwipeFullscreen {
+    constructor(lightbox, options) {
+        this.options = {
+            ...defaultOptions,
+            ...options
+        };
+        this.lightbox = lightbox;
+        this.lightbox.on('init', () => {
+            this.initPlugin(this.lightbox.pswp);
+        });
+    }
+
+    initPlugin(pswp) {
+        this.fullscreenAPI = this.getFullscreenAPI();
+        const fullscreenSVG = '<svg aria-hidden="true" class="pswp__icn" viewBox="0 0 32 32" width="32" height="32">' +
+            '<use class="pswp__icn-shadow" xlink:href="#pswp__icn-fullscreen-exit"/>' +
+            '<use class="pswp__icn-shadow" xlink:href="#pswp__icn-fullscreen-request"/>' +
+            '<path id="pswp__icn-fullscreen-request" transform="translate(4,4)" d="M20 3h2v6h-2V5h-4V3h4zM4 3h4v2H4v4H2V3h2zm16 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z" /></g>' +
+            '<path id="pswp__icn-fullscreen-exit" style="display:none" transform="translate(4,4)" d="M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z"/>' +
+            '</svg>';
+
+        if (this.fullscreenAPI) {
+            pswp.on('uiRegister', () => {
+                pswp.ui.registerElement({
+                    name: 'fullscreen-button',
+                    title: this.options.fullscreenTitle,
+                    order: 9,
+                    isButton: true,
+                    html: fullscreenSVG,
+                    onClick: (event, el) => {
+                        this.toggleFullscreen();
+                    }
+                });
+
+                pswp.events.add(document, 'keydown', (e) => {
+                    if (e.keyCode == 70) { // 'f'
+                        this.toggleFullscreen();
+                        e.preventDefault();
+                    }
+                });
+            });
+        }
+
+        this.lightbox.on('close', () => {
+            if (this.fullscreenAPI && this.fullscreenAPI.isFullscreen()) {
+                this.fullscreenAPI.exit();
+            }
+        });
+    }
+
+    toggleFullscreen() {
+        if (this.fullscreenAPI) {
+            if (this.fullscreenAPI.isFullscreen()) {
+                // Exit full-screen mode
+                this.fullscreenAPI.exit();
+                // Toggle "Exit" and "Enter" full-screen SVG icon display
+                setTimeout(function() {
+                    document.getElementById('pswp__icn-fullscreen-exit').style.display = 'none';
+                    document.getElementById('pswp__icn-fullscreen-request').style.display = 'inline';
+                }, 300);
+            } else {
+                // Enter full-screen mode
+                this.fullscreenAPI.request(document.querySelector(`.pswp`));
+                // Toggle "Exit" and "Enter" full-screen SVG icon display
+                setTimeout(function() {
+                    document.getElementById('pswp__icn-fullscreen-exit').style.display = 'inline';
+                    document.getElementById('pswp__icn-fullscreen-request').style.display = 'none';
+                }, 300);
+            }
+        }
+    }
+
+    getFullscreenAPI() {
+        let api;
+        let enterFS;
+        let exitFS;
+        let elementFS;
+        let changeEvent;
+        let errorEvent;
+
+        if (document.fullscreenEnabled) {
+            enterFS = 'requestFullscreen';
+            exitFS = 'exitFullscreen';
+            elementFS = 'fullscreenElement';
+            changeEvent = 'fullscreenchange';
+            errorEvent = 'fullscreenerror';
+        } else if (document.webkitFullscreenEnabled) {
+            enterFS = 'webkitRequestFullscreen';
+            exitFS = 'webkitExitFullscreen';
+            elementFS = 'webkitFullscreenElement';
+            changeEvent = 'webkitfullscreenchange';
+            errorEvent = 'webkitfullscreenerror';
+        }
+        if (enterFS) {
+            api = {
+                request: function (el) {
+                    if (enterFS === 'webkitRequestFullscreen') {
+                        el[enterFS](Element.ALLOW_KEYBOARD_INPUT);
+                    } else {
+                        el[enterFS]();
+                    }
+                },
+                exit: function () {
+                    return document[exitFS]();
+                },
+                isFullscreen: function () {
+                    return document[elementFS];
+                },
+                change: changeEvent,
+                error: errorEvent
+            };
+        }
+        return api;
+    }
+}
+
+export default PhotoSwipeFullscreen;

sigal/themes/photoswipe/static/photoswipe-fullscreen.esm.min.js

@@ -0,0 +1,8 @@
+const defaultOptions={fullscreenTitle:'Toggle fullscreen'};class PhotoSwipeFullscreen{constructor(lightbox,options){this.options={...defaultOptions,...options};this.lightbox=lightbox;this.lightbox.on('init',()=>{this.initPlugin(this.lightbox.pswp)})}
+initPlugin(pswp){this.fullscreenAPI=this.getFullscreenAPI();const fullscreenSVG='<svg aria-hidden="true" class="pswp__icn" viewBox="0 0 32 32" width="32" height="32">'+'<use class="pswp__icn-shadow" xlink:href="#pswp__icn-fullscreen-exit"/>'+'<use class="pswp__icn-shadow" xlink:href="#pswp__icn-fullscreen-request"/>'+'<path id="pswp__icn-fullscreen-request" transform="translate(4,4)" d="M20 3h2v6h-2V5h-4V3h4zM4 3h4v2H4v4H2V3h2zm16 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z" /></g>'+'<path id="pswp__icn-fullscreen-exit" style="display:none" transform="translate(4,4)" d="M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z"/>'+'</svg>';if(this.fullscreenAPI){pswp.on('uiRegister',()=>{pswp.ui.registerElement({name:'fullscreen-button',title:this.options.fullscreenTitle,order:9,isButton:!0,html:fullscreenSVG,onClick:(event,el)=>{this.toggleFullscreen()}});pswp.events.add(document,'keydown',(e)=>{if(e.keyCode==70){this.toggleFullscreen();e.preventDefault()}})})}
+this.lightbox.on('close',()=>{if(this.fullscreenAPI&&this.fullscreenAPI.isFullscreen()){this.fullscreenAPI.exit()}})}
+toggleFullscreen(){if(this.fullscreenAPI){if(this.fullscreenAPI.isFullscreen()){this.fullscreenAPI.exit();setTimeout(function(){document.getElementById('pswp__icn-fullscreen-exit').style.display='none';document.getElementById('pswp__icn-fullscreen-request').style.display='inline'},300)}else{this.fullscreenAPI.request(document.querySelector(`.pswp`));setTimeout(function(){document.getElementById('pswp__icn-fullscreen-exit').style.display='inline';document.getElementById('pswp__icn-fullscreen-request').style.display='none'},300)}}}
+getFullscreenAPI(){let api;let enterFS;let exitFS;let elementFS;let changeEvent;let errorEvent;if(document.fullscreenEnabled){enterFS='requestFullscreen';exitFS='exitFullscreen';elementFS='fullscreenElement';changeEvent='fullscreenchange';errorEvent='fullscreenerror'}else if(document.webkitFullscreenEnabled){enterFS='webkitRequestFullscreen';exitFS='webkitExitFullscreen';elementFS='webkitFullscreenElement';changeEvent='webkitfullscreenchange';errorEvent='webkitfullscreenerror'}
+if(enterFS){api={request:function(el){if(enterFS==='webkitRequestFullscreen'){el[enterFS](Element.ALLOW_KEYBOARD_INPUT)}else{el[enterFS]()}},exit:function(){return document[exitFS]()},isFullscreen:function(){return document[elementFS]},change:changeEvent,error:errorEvent}}
+return api}}
+export default PhotoSwipeFullscreen