parvus - npm Package Compare versions

Comparing version 2.0.4 to 2.1.0

dist/js/parvus.esm.js

@@ -5,3 +5,3 @@ /**
  * @author Benjamin de Oostfrees
- * @version 2.0.4
+ * @version 2.1.0
  * @url https://github.com/deoostfrees/parvus
@@ -81,2 +81,3 @@ *
       swipeClose: true,
+      simulateTouch: true,
       threshold: 50,
@@ -858,3 +859,3 @@ backFocus: true,
   const updateConfig = function updateConfig() {
-    if (config.swipeClose && !GROUPS[activeGroup].slider.classList.contains('parvus__slider--is-draggable') || GROUPS[activeGroup].gallery.length > 1 && !GROUPS[activeGroup].slider.classList.contains('parvus__slider--is-draggable')) {
+    if ((config.simulateTouch || isTouchDevice()) && config.swipeClose && !GROUPS[activeGroup].slider.classList.contains('parvus__slider--is-draggable') || (config.simulateTouch || isTouchDevice()) && GROUPS[activeGroup].gallery.length > 1 && !GROUPS[activeGroup].slider.classList.contains('parvus__slider--is-draggable')) {
       GROUPS[activeGroup].slider.classList.add('parvus__slider--is-draggable');
@@ -1194,5 +1195,7 @@ } // Hide buttons if necessary
 
-    lightbox.addEventListener('mousedown', mousedownHandler);
-    lightbox.addEventListener('mouseup', mouseupHandler);
-    lightbox.addEventListener('mousemove', mousemoveHandler);
+    if (config.simulateTouch) {
+      lightbox.addEventListener('mousedown', mousedownHandler);
+      lightbox.addEventListener('mouseup', mouseupHandler);
+      lightbox.addEventListener('mousemove', mousemoveHandler);
+    }
   };
@@ -1226,5 +1229,7 @@ /**
 
-    lightbox.removeEventListener('mousedown', mousedownHandler);
-    lightbox.removeEventListener('mouseup', mouseupHandler);
-    lightbox.removeEventListener('mousemove', mousemoveHandler);
+    if (config.simulateTouch) {
+      lightbox.removeEventListener('mousedown', mousedownHandler);
+      lightbox.removeEventListener('mouseup', mouseupHandler);
+      lightbox.removeEventListener('mousemove', mousemoveHandler);
+    }
   };
@@ -1231,0 +1236,0 @@ /**

dist/js/parvus.esm.min.js

@@ -5,3 +5,3 @@ /**
  * @author Benjamin de Oostfrees
- * @version 2.0.4
+ * @version 2.1.0
  * @url https://github.com/deoostfrees/parvus
@@ -12,2 +12,2 @@ *
 
-var e={lightboxLabel:"This is a dialog window which overlays the main content of the page. The modal shows the enlarged image. Pressing the Escape key will close the modal and bring you back to where you were on the page.",lightboxLoadingIndicatorLabel:"Image loading",previousButtonLabel:"Previous image",nextButtonLabel:"Next image",closeButtonLabel:"Close dialog window"};function t(n){const i=window,s=["button:not([disabled]):not([inert])",'[tabindex]:not([tabindex^="-"]):not([inert])'],a={gallery:[],slider:null,sliderElements:[],images:[]},r={};let l=null,o=null,d=0,u={},c=null,p=null,g=1,h=null,m=null,v=null,f=null,b=null,y=null,w=null,E=0,A=0,L=0,_=0,C={},x=!1,$=!1,S=!1,B=null,T=null,M=null,q=!1,F=null,I=!0;const N=window.matchMedia("(prefers-reduced-motion)"),X=function(){N.matches?(I=!0,F=u.reducedTransitionDuration):(I=!1,F=u.transitionDuration)};N.addEventListener("change",X);const Y=function(t){u=function(t){return{selector:".lightbox",gallerySelector:null,captions:!0,captionsSelector:"self",captionsAttribute:"data-caption",docClose:!0,scrollClose:!1,swipeClose:!0,threshold:50,backFocus:!0,transitionDuration:300,reducedTransitionDuration:.1,transitionTimingFunction:"cubic-bezier(0.4, 0, 0.22, 1)",lightboxIndicatorIcon:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M8 3H5a2 2 0 00-2 2v3m18 0V5a2 2 0 00-2-2h-3m0 18h3a2 2 0 002-2v-3M3 16v3a2 2 0 002 2h3"/></svg>',previousButtonIcon:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path stroke="none" d="M0 0h24v24H0z"/><polyline points="15 6 9 12 15 18" /></svg>',nextButtonIcon:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path stroke="none" d="M0 0h24v24H0z"/><polyline points="9 6 15 12 9 18" /></svg>',closeButtonIcon:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M18 6L6 18M6 6l12 12"/></svg>',l10n:e,fileTypes:/\.(png|jpe?g|webp|avif|svg)(\?.*)?$/i,...t}}(t);if(document.querySelectorAll(u.selector).length)if(X(),c||H(),null!==u.gallerySelector){document.querySelectorAll(u.gallerySelector).forEach(((e,t)=>{const n=t;e.querySelectorAll(u.selector).forEach((e=>{e.setAttribute("data-group",`parvus-gallery-${n}`),D(e)}))}));document.querySelectorAll(`${u.selector}:not(.parvus-trigger)`).forEach((e=>{D(e)}))}else{document.querySelectorAll(u.selector).forEach((e=>{D(e)}))}},k=function(e){const t=Math.floor(1e4*Math.random());return e.hasAttribute("data-group")&&""!==e.getAttribute("data-group")||e.setAttribute("data-group",`default-${t}`),e.getAttribute("data-group")},D=function(e){if(!("A"===e.tagName&&e.hasAttribute("href")&&e.href.match(u.fileTypes)||"BUTTON"===e.tagName&&e.hasAttribute("data-target")&&e.getAttribute("data-target").match(u.fileTypes)))throw new Error(e,`Use a link with the 'href' attribute or a button with the 'data-target' attribute. Both attributes must have a path to the image file. Supported image file types: ${u.fileTypes}.`);var t;if(l=k(e),Object.prototype.hasOwnProperty.call(r,l)||(r[l]=(t=a,JSON.parse(JSON.stringify(t)))),r[l].gallery.includes(e))throw new Error("Ups, element already added.");if(r[l].gallery.push(e),null!==e.querySelector("img")){const t=document.createElement("div");e.classList.add("parvus-zoom"),t.className="parvus-zoom__indicator",t.innerHTML=u.lightboxIndicatorIcon,e.appendChild(t)}e.classList.add("parvus-trigger"),e.addEventListener("click",le),Ae()&&l===o&&(z(r[l].gallery.indexOf(e)),W(e,r[l].gallery.indexOf(e),(function(){J(r[l].gallery.indexOf(e))})),se(),ee(),te())},O=function(e){if(Ae()||!c||!e||!e.hasAttribute("data-group"))return;const t=k(e);if(!r[t].gallery.includes(e))throw new Error("Ups, I can't find the element.");if(r[t].gallery.splice(r[t].gallery.indexOf(e),1),e.classList.contains("parvus-zoom")){const t=e.querySelector(".parvus-zoom__indicator");e.classList.remove("parvus-zoom"),e.removeChild(t)}e.removeEventListener("click",le),e.classList.remove("parvus-trigger")},H=function(){c=document.createElement("div"),c.setAttribute("role","dialog"),c.setAttribute("aria-modal","true"),c.setAttribute("aria-hidden","true"),c.setAttribute("tabindex","-1"),c.setAttribute("aria-label",u.l10n.lightboxLabel),c.classList.add("parvus"),p=document.createElement("div"),p.classList.add("parvus__overlay"),p.style.opacity=0,c.appendChild(p),h=document.createElement("div"),h.className="parvus__toolbar",m=document.createElement("div"),v=document.createElement("div"),y=document.createElement("button"),y.className="parvus__btn parvus__btn--close",y.setAttribute("type","button"),y.setAttribute("aria-label",u.l10n.closeButtonLabel),y.innerHTML=u.closeButtonIcon,v.appendChild(y),f=document.createElement("button"),f.className="parvus__btn parvus__btn--previous",f.setAttribute("type","button"),f.setAttribute("aria-label",u.l10n.previousButtonLabel),f.innerHTML=u.previousButtonIcon,c.appendChild(f),b=document.createElement("button"),b.className="parvus__btn parvus__btn--next",b.setAttribute("type","button"),b.setAttribute("aria-label",u.l10n.nextButtonLabel),b.innerHTML=u.nextButtonIcon,c.appendChild(b),w=document.createElement("div"),w.className="parvus__counter",m.appendChild(w),h.appendChild(m),h.appendChild(v),c.appendChild(h),document.body.appendChild(c)},z=function(e){if(void 0!==r[o].sliderElements[e]);else{const t=document.createElement("div"),n=document.createElement("div");t.className="parvus__slide",t.style.position="absolute",t.style.left=100*e+"%",t.setAttribute("aria-hidden","true"),t.appendChild(n),r[o].sliderElements[e]=t,e===d&&r[o].slider.appendChild(t),e>d?r[o].sliderElements[d].after(t):r[o].sliderElements[d].before(t)}},R=function(e){if(!c||!e||!e.classList.contains("parvus-trigger")||Ae())return;if(o=k(e),!r[o].gallery.includes(e))throw new Error("Ups, I can't find the element.");d=r[o].gallery.indexOf(e),B=document.activeElement;const t=window.location.href;history.pushState({parvus:"close"},"Image",t),we();document.querySelectorAll('body > *:not([aria-hidden="true"])').forEach((e=>{e.setAttribute("aria-hidden","true"),e.classList.add("parvus-hidden")})),c.classList.add("parvus--is-opening"),c.setAttribute("aria-hidden","false"),r[o].slider=document.createElement("div"),r[o].slider.className="parvus__slider",r[o].slider.setAttribute("aria-hidden","true"),c.appendChild(r[o].slider),z(d),r[o].slider.setAttribute("aria-hidden","false"),Z(),se(),te(),ue(),j(d),W(e,d,(function(){J(d),requestAnimationFrame((()=>{c.classList.remove("parvus--is-opening"),p.style.opacity=1,p.style.transition=`opacity ${F}ms ${u.transitionTimingFunction}`,p.style.willChange="opacity"})),p.addEventListener("transitionend",(()=>{P(d+1),P(d-1)})),r[o].slider.classList.add("parvus__slider--animate")}));const n=new CustomEvent("open",{detail:{source:e}});c.dispatchEvent(n)},U=function(){if(!Ae())throw new Error("Ups, I'm already closed.");const e=r[o].images[d],t=e.getBoundingClientRect(),n=(u.backFocus?r[o].gallery[d]:B).getBoundingClientRect();Ee(),ne(),null!==history.state&&"close"===history.state.parvus&&history.back();document.querySelectorAll(".parvus-hidden").forEach((e=>{e.removeAttribute("aria-hidden"),e.classList.remove("parvus-hidden")})),c.classList.add("parvus--is-closing"),requestAnimationFrame((()=>{E=n.width/t.width,A=n.height/t.height,L=n.left-t.left,_=n.top-t.top,e.style.transform=`translate(${L}px, ${_}px) scale(${E}, ${A})`,e.style.opacity=0,e.style.transition=`transform ${F}ms ${u.transitionTimingFunction}, opacity ${F}ms ${u.transitionTimingFunction} ${F/2}ms`,p.style.opacity=0,p.style.transition=`opacity ${F}ms ${u.transitionTimingFunction}`,p.style.willChange="auto"})),p.addEventListener("transitionend",(()=>{Q(d),B=u.backFocus?r[o].gallery[d]:B,B.focus({preventScroll:!0}),c.setAttribute("aria-hidden","true"),c.classList.remove("parvus--is-closing"),c.classList.remove("parvus--is-vertical-closing"),e.style.transform="",r[o].slider.remove(),r[o].slider=null,r[o].sliderElements=[],r[o].images=[]}),{once:!0});const i=new CustomEvent("close",{detail:{source:r[o].gallery[d]}});c.dispatchEvent(i)},P=function(e){void 0!==r[o].gallery[e]&&(z(e),W(r[o].gallery[e],e,(function(){J(e)})))},j=function(e){r[o].sliderElements[e].classList.add("parvus__slide--is-active"),r[o].sliderElements[e].setAttribute("aria-hidden","false")},W=function(e,t,n){if(void 0!==r[o].images[t]);else{const i=r[o].sliderElements[t].querySelector("div"),s=document.createElement("img"),a=document.createElement("div"),l=document.createElement("div"),d=e.querySelector("img"),c=document.createElement("div");if(a.className="parvus__content",l.className="parvus__caption",c.className="parvus__loader",c.setAttribute("role","progressbar"),c.setAttribute("aria-label",u.l10n.lightboxLoadingIndicatorLabel),i.appendChild(c),s.onload=()=>{i.removeChild(c),s.setAttribute("width",s.naturalWidth),s.setAttribute("height",s.naturalHeight),re(r[o].sliderElements[t],s),n&&"function"==typeof n&&n()},"A"===e.tagName?(s.setAttribute("src",e.href),s.alt=d?d.alt||"":e.getAttribute("data-alt")||""):(s.alt=e.getAttribute("data-alt")||"",s.setAttribute("src",e.getAttribute("data-target"))),e.hasAttribute("data-srcset")&&""!==e.getAttribute("data-srcset")&&s.setAttribute("srcset",e.getAttribute("data-srcset")),s.style.opacity=0,a.appendChild(s),r[o].images[t]=s,i.appendChild(a),u.captions){let n=null;if("self"===u.captionsSelector)e.hasAttribute(u.captionsAttribute)&&""!==e.getAttribute(u.captionsAttribute)&&(n=e.getAttribute(u.captionsAttribute));else if(null!==e.querySelector(u.captionsSelector)){const t=e.querySelector(u.captionsSelector);n=t.hasAttribute(u.captionsAttribute)&&""!==t.getAttribute(u.captionsAttribute)?t.getAttribute(u.captionsAttribute):t.innerHTML}null!==n&&(r[o].sliderElements[t].setAttribute("aria-labelledby",`parvus__caption-${t}`),l.id=`parvus__caption-${t}`,l.innerHTML=`<p>${n}</p>`,i.appendChild(l))}}},J=function(e){const t=r[o].images[e],n=t.getBoundingClientRect(),i=r[o].gallery[e].getBoundingClientRect();c.classList.contains("parvus--is-opening")?(E=i.width/n.width,A=i.height/n.height,L=i.left-n.left,_=i.top-n.top,requestAnimationFrame((()=>{t.style.transform=`translate(${L}px, ${_}px) scale(${E}, ${A})`,t.style.transition="transform 0s, opacity 0s",requestAnimationFrame((()=>{t.style.transform="",t.style.opacity=1,t.style.transition=`transform ${F}ms ${u.transitionTimingFunction}, opacity ${F/2}ms ${u.transitionTimingFunction}`}))}))):t.style.opacity=1},K=function(e){const t=d;if(!Ae())throw new Error("Ups, I'm closed.");if(!e&&0!==e)throw new Error("Ups, no slide specified.");if(e===d)throw new Error(`Ups, slide ${e} is already selected.`);if(-1===e||e>=r[o].gallery.length)throw new Error(`Ups, I can't find slide ${e}.`);Q(t),j(e),J(e),e<t&&(d--,Z(),se(),ee("left"),P(e-1)),e>t&&(d++,Z(),se(),ee("right"),P(e+1)),te();const n=new CustomEvent("select",{detail:{source:r[o].gallery[d]}});c.dispatchEvent(n)},V=function(){d>0&&K(d-1)},G=function(){d<r[o].gallery.length-1&&K(d+1)},Q=function(e){r[o].sliderElements[e].classList.remove("parvus__slide--is-active"),r[o].sliderElements[e].setAttribute("aria-hidden","true")},Z=function(){o=null!==o?o:l,T=d*c.offsetWidth*-1,r[o].slider.style.transform=`translate3d(${T}px, 0, 0)`,M=T},ee=function(e){1===r[o].gallery.length?y.focus():0===d?b.focus():d===r[o].gallery.length-1||"left"===e?f.focus():b.focus()},te=function(){w.textContent=`${d+1}/${r[o].gallery.length}`},ne=function(){C={startX:0,endX:0,startY:0,endY:0}},ie=function(){const e=C.endX-C.startX,t=C.endY-C.startY,n=Math.abs(e),i=Math.abs(t);x&&e>0&&n>=u.threshold&&d>0?V():x&&e<0&&n>=u.threshold&&d!==r[o].gallery.length-1?G():$&&i>0?i>=u.threshold&&u.swipeClose?U():(p.style.opacity=1,c.classList.remove("parvus--is-vertical-closing"),Z()):Z()},se=function(){(u.swipeClose&&!r[o].slider.classList.contains("parvus__slider--is-draggable")||r[o].gallery.length>1&&!r[o].slider.classList.contains("parvus__slider--is-draggable"))&&r[o].slider.classList.add("parvus__slider--is-draggable"),1===r[o].gallery.length?(f.setAttribute("aria-hidden","true"),f.disabled=!0,b.setAttribute("aria-hidden","true"),b.disabled=!0):0===d?(f.setAttribute("aria-hidden","true"),f.disabled=!0,b.setAttribute("aria-hidden","false"),b.disabled=!1):d===r[o].gallery.length-1?(f.setAttribute("aria-hidden","false"),f.disabled=!1,b.setAttribute("aria-hidden","true"),b.disabled=!0):(f.setAttribute("aria-hidden","false"),f.disabled=!1,b.setAttribute("aria-hidden","false"),b.disabled=!1),1===r[o].gallery.length?w.setAttribute("aria-hidden","true"):w.setAttribute("aria-hidden","false")},ae=function(){q||(q=!0,i.requestAnimationFrame((()=>{r[o].sliderElements.forEach(((e,t)=>{re(e,r[o].images[t])})),Z(),q=!1})))},re=function(e,t){const n=getComputedStyle(e),i=null!==e.querySelector(".parvus__caption")?e.querySelector(".parvus__caption").getBoundingClientRect().height:0,s=t.getAttribute("height"),a=t.getAttribute("width");let r=e.getBoundingClientRect().height,l=e.getBoundingClientRect().width;r-=parseFloat(n.paddingTop)+parseFloat(n.paddingBottom)+parseFloat(i),l-=parseFloat(n.paddingLeft)+parseFloat(n.paddingRight);const o=Math.min(l/a||0,r/s),d=a*o||0,u=s*o||0;s>u&&s<r&&a>d&&a<l||s<u&&s<r&&a<d&&a<l?(t.style.width="",t.style.height=""):(t.style.width=`${d}px`,t.style.height=`${u}px`)},le=function(e){e.preventDefault(),R(this)},oe=function(e){e.target===f?V():e.target===b?G():(e.target===y||!$&&!x&&e.target.classList.contains("parvus__slide")&&u.docClose)&&U(),e.stopPropagation()},de=function(){return Array.prototype.slice.call(c.querySelectorAll(`${s.join(", ")}`)).filter((e=>!!(e.offsetWidth||e.offsetHeight||e.getClientRects().length)))},ue=function(){de()[0].focus()},ce=function(e){const t=de(),n=t.indexOf(document.activeElement);"Tab"===e.code?e.shiftKey&&0===n?(t[t.length-1].focus(),e.preventDefault()):e.shiftKey||n!==t.length-1||(t[0].focus(),e.preventDefault()):"Escape"===e.code?(e.preventDefault(),U()):"ArrowLeft"===e.code?(e.preventDefault(),V()):"ArrowRight"===e.code&&(e.preventDefault(),G())},pe=function(){U()},ge=function(e){e.preventDefault(),e.stopPropagation(),x=!1,$=!1,S=!0,C.startX=e.pageX,C.startY=e.pageY,r[o].slider.classList.add("parvus__slider--is-dragging"),r[o].slider.style.willChange="transform"},he=function(e){e.preventDefault(),S&&(C.endX=e.pageX,C.endY=e.pageY,ye())},me=function(e){e.stopPropagation(),S=!1,r[o].slider.classList.remove("parvus__slider--is-dragging"),r[o].slider.style.willChange="auto",(C.endX||C.endY)&&ie(),ne()},ve=function(e){e.stopPropagation(),x=!1,$=!1,S=!0,C.startX=e.touches[0].pageX,C.startY=e.touches[0].pageY,r[o].slider.classList.add("parvus__slider--is-dragging"),r[o].slider.style.willChange="transform"},fe=function(e){e.stopPropagation(),S&&(e.preventDefault(),C.endX=e.touches[0].pageX,C.endY=e.touches[0].pageY,ye())},be=function(e){e.stopPropagation(),S=!1,r[o].slider.classList.remove("parvus__slider--is-dragging"),r[o].slider.style.willChange="auto",(C.endX||C.endY)&&ie(),ne()},ye=function(){const e=C.startX-C.endX,t=C.endY-C.startY,n=Math.abs(t);Math.abs(e)>0&&!$&&r[o].gallery.length>1?(r[o].slider.style.transform=`translate3d(${M-Math.round(e)}px, 0, 0)`,x=!0,$=!1):Math.abs(t)>0&&!x&&u.swipeClose&&(n<=96&&!I&&(g=1-n/100),c.classList.add("parvus--is-vertical-closing"),p.style.opacity=g,r[o].slider.style.transform=`translate3d(${M}px, ${Math.round(t)}px, 0)`,x=!1,$=!0)},we=function(){i.addEventListener("keydown",ce),i.addEventListener("resize",ae),u.scrollClose&&i.addEventListener("wheel",pe),i.addEventListener("popstate",U),c.addEventListener("click",oe),Le()&&(c.addEventListener("touchstart",ve),c.addEventListener("touchmove",fe),c.addEventListener("touchend",be)),c.addEventListener("mousedown",ge),c.addEventListener("mouseup",me),c.addEventListener("mousemove",he)},Ee=function(){i.removeEventListener("keydown",ce),i.removeEventListener("resize",ae),u.scrollClose&&i.removeEventListener("wheel",pe),i.removeEventListener("popstate",U),c.removeEventListener("click",oe),Le()&&(c.removeEventListener("touchstart",ve),c.removeEventListener("touchmove",fe),c.removeEventListener("touchend",be)),c.removeEventListener("mousedown",ge),c.removeEventListener("mouseup",me),c.removeEventListener("mousemove",he)},Ae=function(){return"false"===c.getAttribute("aria-hidden")},Le=function(){return"ontouchstart"in window};return Y(n),t.init=Y,t.open=R,t.close=U,t.select=K,t.previous=V,t.next=G,t.currentIndex=function(){return d},t.add=D,t.remove=O,t.destroy=function(){if(!c)return;Ae()&&U(),c.remove();document.querySelectorAll(".parvus-trigger").forEach((e=>{O(e)}));const e=new CustomEvent("destroy");c.dispatchEvent(e)},t.isOpen=Ae,t.on=function(e,t){c&&c.addEventListener(e,t)},t.off=function(e,t){c&&c.removeEventListener(e,t)},t}export{t as default};
+var e={lightboxLabel:"This is a dialog window which overlays the main content of the page. The modal shows the enlarged image. Pressing the Escape key will close the modal and bring you back to where you were on the page.",lightboxLoadingIndicatorLabel:"Image loading",previousButtonLabel:"Previous image",nextButtonLabel:"Next image",closeButtonLabel:"Close dialog window"};function t(i){const n=window,s=["button:not([disabled]):not([inert])",'[tabindex]:not([tabindex^="-"]):not([inert])'],a={gallery:[],slider:null,sliderElements:[],images:[]},r={};let l=null,o=null,d=0,u={},c=null,p=null,g=1,h=null,m=null,v=null,f=null,b=null,y=null,w=null,E=0,A=0,L=0,_=0,C={},x=!1,$=!1,S=!1,T=null,B=null,M=null,q=!1,F=null,I=!0;const N=window.matchMedia("(prefers-reduced-motion)"),X=function(){N.matches?(I=!0,F=u.reducedTransitionDuration):(I=!1,F=u.transitionDuration)};N.addEventListener("change",X);const Y=function(t){u=function(t){return{selector:".lightbox",gallerySelector:null,captions:!0,captionsSelector:"self",captionsAttribute:"data-caption",docClose:!0,scrollClose:!1,swipeClose:!0,simulateTouch:!0,threshold:50,backFocus:!0,transitionDuration:300,reducedTransitionDuration:.1,transitionTimingFunction:"cubic-bezier(0.4, 0, 0.22, 1)",lightboxIndicatorIcon:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M8 3H5a2 2 0 00-2 2v3m18 0V5a2 2 0 00-2-2h-3m0 18h3a2 2 0 002-2v-3M3 16v3a2 2 0 002 2h3"/></svg>',previousButtonIcon:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path stroke="none" d="M0 0h24v24H0z"/><polyline points="15 6 9 12 15 18" /></svg>',nextButtonIcon:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path stroke="none" d="M0 0h24v24H0z"/><polyline points="9 6 15 12 9 18" /></svg>',closeButtonIcon:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M18 6L6 18M6 6l12 12"/></svg>',l10n:e,fileTypes:/\.(png|jpe?g|webp|avif|svg)(\?.*)?$/i,...t}}(t);if(document.querySelectorAll(u.selector).length)if(X(),c||H(),null!==u.gallerySelector){document.querySelectorAll(u.gallerySelector).forEach(((e,t)=>{const i=t;e.querySelectorAll(u.selector).forEach((e=>{e.setAttribute("data-group",`parvus-gallery-${i}`),D(e)}))}));document.querySelectorAll(`${u.selector}:not(.parvus-trigger)`).forEach((e=>{D(e)}))}else{document.querySelectorAll(u.selector).forEach((e=>{D(e)}))}},k=function(e){const t=Math.floor(1e4*Math.random());return e.hasAttribute("data-group")&&""!==e.getAttribute("data-group")||e.setAttribute("data-group",`default-${t}`),e.getAttribute("data-group")},D=function(e){if(!("A"===e.tagName&&e.hasAttribute("href")&&e.href.match(u.fileTypes)||"BUTTON"===e.tagName&&e.hasAttribute("data-target")&&e.getAttribute("data-target").match(u.fileTypes)))throw new Error(e,`Use a link with the 'href' attribute or a button with the 'data-target' attribute. Both attributes must have a path to the image file. Supported image file types: ${u.fileTypes}.`);var t;if(l=k(e),Object.prototype.hasOwnProperty.call(r,l)||(r[l]=(t=a,JSON.parse(JSON.stringify(t)))),r[l].gallery.includes(e))throw new Error("Ups, element already added.");if(r[l].gallery.push(e),null!==e.querySelector("img")){const t=document.createElement("div");e.classList.add("parvus-zoom"),t.className="parvus-zoom__indicator",t.innerHTML=u.lightboxIndicatorIcon,e.appendChild(t)}e.classList.add("parvus-trigger"),e.addEventListener("click",le),Ae()&&l===o&&(z(r[l].gallery.indexOf(e)),W(e,r[l].gallery.indexOf(e),(function(){J(r[l].gallery.indexOf(e))})),se(),ee(),te())},O=function(e){if(Ae()||!c||!e||!e.hasAttribute("data-group"))return;const t=k(e);if(!r[t].gallery.includes(e))throw new Error("Ups, I can't find the element.");if(r[t].gallery.splice(r[t].gallery.indexOf(e),1),e.classList.contains("parvus-zoom")){const t=e.querySelector(".parvus-zoom__indicator");e.classList.remove("parvus-zoom"),e.removeChild(t)}e.removeEventListener("click",le),e.classList.remove("parvus-trigger")},H=function(){c=document.createElement("div"),c.setAttribute("role","dialog"),c.setAttribute("aria-modal","true"),c.setAttribute("aria-hidden","true"),c.setAttribute("tabindex","-1"),c.setAttribute("aria-label",u.l10n.lightboxLabel),c.classList.add("parvus"),p=document.createElement("div"),p.classList.add("parvus__overlay"),p.style.opacity=0,c.appendChild(p),h=document.createElement("div"),h.className="parvus__toolbar",m=document.createElement("div"),v=document.createElement("div"),y=document.createElement("button"),y.className="parvus__btn parvus__btn--close",y.setAttribute("type","button"),y.setAttribute("aria-label",u.l10n.closeButtonLabel),y.innerHTML=u.closeButtonIcon,v.appendChild(y),f=document.createElement("button"),f.className="parvus__btn parvus__btn--previous",f.setAttribute("type","button"),f.setAttribute("aria-label",u.l10n.previousButtonLabel),f.innerHTML=u.previousButtonIcon,c.appendChild(f),b=document.createElement("button"),b.className="parvus__btn parvus__btn--next",b.setAttribute("type","button"),b.setAttribute("aria-label",u.l10n.nextButtonLabel),b.innerHTML=u.nextButtonIcon,c.appendChild(b),w=document.createElement("div"),w.className="parvus__counter",m.appendChild(w),h.appendChild(m),h.appendChild(v),c.appendChild(h),document.body.appendChild(c)},z=function(e){if(void 0!==r[o].sliderElements[e]);else{const t=document.createElement("div"),i=document.createElement("div");t.className="parvus__slide",t.style.position="absolute",t.style.left=100*e+"%",t.setAttribute("aria-hidden","true"),t.appendChild(i),r[o].sliderElements[e]=t,e===d&&r[o].slider.appendChild(t),e>d?r[o].sliderElements[d].after(t):r[o].sliderElements[d].before(t)}},R=function(e){if(!c||!e||!e.classList.contains("parvus-trigger")||Ae())return;if(o=k(e),!r[o].gallery.includes(e))throw new Error("Ups, I can't find the element.");d=r[o].gallery.indexOf(e),T=document.activeElement;const t=window.location.href;history.pushState({parvus:"close"},"Image",t),we();document.querySelectorAll('body > *:not([aria-hidden="true"])').forEach((e=>{e.setAttribute("aria-hidden","true"),e.classList.add("parvus-hidden")})),c.classList.add("parvus--is-opening"),c.setAttribute("aria-hidden","false"),r[o].slider=document.createElement("div"),r[o].slider.className="parvus__slider",r[o].slider.setAttribute("aria-hidden","true"),c.appendChild(r[o].slider),z(d),r[o].slider.setAttribute("aria-hidden","false"),Z(),se(),te(),ue(),j(d),W(e,d,(function(){J(d),requestAnimationFrame((()=>{c.classList.remove("parvus--is-opening"),p.style.opacity=1,p.style.transition=`opacity ${F}ms ${u.transitionTimingFunction}`,p.style.willChange="opacity"})),p.addEventListener("transitionend",(()=>{P(d+1),P(d-1)})),r[o].slider.classList.add("parvus__slider--animate")}));const i=new CustomEvent("open",{detail:{source:e}});c.dispatchEvent(i)},U=function(){if(!Ae())throw new Error("Ups, I'm already closed.");const e=r[o].images[d],t=e.getBoundingClientRect(),i=(u.backFocus?r[o].gallery[d]:T).getBoundingClientRect();Ee(),ie(),null!==history.state&&"close"===history.state.parvus&&history.back();document.querySelectorAll(".parvus-hidden").forEach((e=>{e.removeAttribute("aria-hidden"),e.classList.remove("parvus-hidden")})),c.classList.add("parvus--is-closing"),requestAnimationFrame((()=>{E=i.width/t.width,A=i.height/t.height,L=i.left-t.left,_=i.top-t.top,e.style.transform=`translate(${L}px, ${_}px) scale(${E}, ${A})`,e.style.opacity=0,e.style.transition=`transform ${F}ms ${u.transitionTimingFunction}, opacity ${F}ms ${u.transitionTimingFunction} ${F/2}ms`,p.style.opacity=0,p.style.transition=`opacity ${F}ms ${u.transitionTimingFunction}`,p.style.willChange="auto"})),p.addEventListener("transitionend",(()=>{Q(d),T=u.backFocus?r[o].gallery[d]:T,T.focus({preventScroll:!0}),c.setAttribute("aria-hidden","true"),c.classList.remove("parvus--is-closing"),c.classList.remove("parvus--is-vertical-closing"),e.style.transform="",r[o].slider.remove(),r[o].slider=null,r[o].sliderElements=[],r[o].images=[]}),{once:!0});const n=new CustomEvent("close",{detail:{source:r[o].gallery[d]}});c.dispatchEvent(n)},P=function(e){void 0!==r[o].gallery[e]&&(z(e),W(r[o].gallery[e],e,(function(){J(e)})))},j=function(e){r[o].sliderElements[e].classList.add("parvus__slide--is-active"),r[o].sliderElements[e].setAttribute("aria-hidden","false")},W=function(e,t,i){if(void 0!==r[o].images[t]);else{const n=r[o].sliderElements[t].querySelector("div"),s=document.createElement("img"),a=document.createElement("div"),l=document.createElement("div"),d=e.querySelector("img"),c=document.createElement("div");if(a.className="parvus__content",l.className="parvus__caption",c.className="parvus__loader",c.setAttribute("role","progressbar"),c.setAttribute("aria-label",u.l10n.lightboxLoadingIndicatorLabel),n.appendChild(c),s.onload=()=>{n.removeChild(c),s.setAttribute("width",s.naturalWidth),s.setAttribute("height",s.naturalHeight),re(r[o].sliderElements[t],s),i&&"function"==typeof i&&i()},"A"===e.tagName?(s.setAttribute("src",e.href),s.alt=d?d.alt||"":e.getAttribute("data-alt")||""):(s.alt=e.getAttribute("data-alt")||"",s.setAttribute("src",e.getAttribute("data-target"))),e.hasAttribute("data-srcset")&&""!==e.getAttribute("data-srcset")&&s.setAttribute("srcset",e.getAttribute("data-srcset")),s.style.opacity=0,a.appendChild(s),r[o].images[t]=s,n.appendChild(a),u.captions){let i=null;if("self"===u.captionsSelector)e.hasAttribute(u.captionsAttribute)&&""!==e.getAttribute(u.captionsAttribute)&&(i=e.getAttribute(u.captionsAttribute));else if(null!==e.querySelector(u.captionsSelector)){const t=e.querySelector(u.captionsSelector);i=t.hasAttribute(u.captionsAttribute)&&""!==t.getAttribute(u.captionsAttribute)?t.getAttribute(u.captionsAttribute):t.innerHTML}null!==i&&(r[o].sliderElements[t].setAttribute("aria-labelledby",`parvus__caption-${t}`),l.id=`parvus__caption-${t}`,l.innerHTML=`<p>${i}</p>`,n.appendChild(l))}}},J=function(e){const t=r[o].images[e],i=t.getBoundingClientRect(),n=r[o].gallery[e].getBoundingClientRect();c.classList.contains("parvus--is-opening")?(E=n.width/i.width,A=n.height/i.height,L=n.left-i.left,_=n.top-i.top,requestAnimationFrame((()=>{t.style.transform=`translate(${L}px, ${_}px) scale(${E}, ${A})`,t.style.transition="transform 0s, opacity 0s",requestAnimationFrame((()=>{t.style.transform="",t.style.opacity=1,t.style.transition=`transform ${F}ms ${u.transitionTimingFunction}, opacity ${F/2}ms ${u.transitionTimingFunction}`}))}))):t.style.opacity=1},K=function(e){const t=d;if(!Ae())throw new Error("Ups, I'm closed.");if(!e&&0!==e)throw new Error("Ups, no slide specified.");if(e===d)throw new Error(`Ups, slide ${e} is already selected.`);if(-1===e||e>=r[o].gallery.length)throw new Error(`Ups, I can't find slide ${e}.`);Q(t),j(e),J(e),e<t&&(d--,Z(),se(),ee("left"),P(e-1)),e>t&&(d++,Z(),se(),ee("right"),P(e+1)),te();const i=new CustomEvent("select",{detail:{source:r[o].gallery[d]}});c.dispatchEvent(i)},V=function(){d>0&&K(d-1)},G=function(){d<r[o].gallery.length-1&&K(d+1)},Q=function(e){r[o].sliderElements[e].classList.remove("parvus__slide--is-active"),r[o].sliderElements[e].setAttribute("aria-hidden","true")},Z=function(){o=null!==o?o:l,B=d*c.offsetWidth*-1,r[o].slider.style.transform=`translate3d(${B}px, 0, 0)`,M=B},ee=function(e){1===r[o].gallery.length?y.focus():0===d?b.focus():d===r[o].gallery.length-1||"left"===e?f.focus():b.focus()},te=function(){w.textContent=`${d+1}/${r[o].gallery.length}`},ie=function(){C={startX:0,endX:0,startY:0,endY:0}},ne=function(){const e=C.endX-C.startX,t=C.endY-C.startY,i=Math.abs(e),n=Math.abs(t);x&&e>0&&i>=u.threshold&&d>0?V():x&&e<0&&i>=u.threshold&&d!==r[o].gallery.length-1?G():$&&n>0?n>=u.threshold&&u.swipeClose?U():(p.style.opacity=1,c.classList.remove("parvus--is-vertical-closing"),Z()):Z()},se=function(){((u.simulateTouch||Le())&&u.swipeClose&&!r[o].slider.classList.contains("parvus__slider--is-draggable")||(u.simulateTouch||Le())&&r[o].gallery.length>1&&!r[o].slider.classList.contains("parvus__slider--is-draggable"))&&r[o].slider.classList.add("parvus__slider--is-draggable"),1===r[o].gallery.length?(f.setAttribute("aria-hidden","true"),f.disabled=!0,b.setAttribute("aria-hidden","true"),b.disabled=!0):0===d?(f.setAttribute("aria-hidden","true"),f.disabled=!0,b.setAttribute("aria-hidden","false"),b.disabled=!1):d===r[o].gallery.length-1?(f.setAttribute("aria-hidden","false"),f.disabled=!1,b.setAttribute("aria-hidden","true"),b.disabled=!0):(f.setAttribute("aria-hidden","false"),f.disabled=!1,b.setAttribute("aria-hidden","false"),b.disabled=!1),1===r[o].gallery.length?w.setAttribute("aria-hidden","true"):w.setAttribute("aria-hidden","false")},ae=function(){q||(q=!0,n.requestAnimationFrame((()=>{r[o].sliderElements.forEach(((e,t)=>{re(e,r[o].images[t])})),Z(),q=!1})))},re=function(e,t){const i=getComputedStyle(e),n=null!==e.querySelector(".parvus__caption")?e.querySelector(".parvus__caption").getBoundingClientRect().height:0,s=t.getAttribute("height"),a=t.getAttribute("width");let r=e.getBoundingClientRect().height,l=e.getBoundingClientRect().width;r-=parseFloat(i.paddingTop)+parseFloat(i.paddingBottom)+parseFloat(n),l-=parseFloat(i.paddingLeft)+parseFloat(i.paddingRight);const o=Math.min(l/a||0,r/s),d=a*o||0,u=s*o||0;s>u&&s<r&&a>d&&a<l||s<u&&s<r&&a<d&&a<l?(t.style.width="",t.style.height=""):(t.style.width=`${d}px`,t.style.height=`${u}px`)},le=function(e){e.preventDefault(),R(this)},oe=function(e){e.target===f?V():e.target===b?G():(e.target===y||!$&&!x&&e.target.classList.contains("parvus__slide")&&u.docClose)&&U(),e.stopPropagation()},de=function(){return Array.prototype.slice.call(c.querySelectorAll(`${s.join(", ")}`)).filter((e=>!!(e.offsetWidth||e.offsetHeight||e.getClientRects().length)))},ue=function(){de()[0].focus()},ce=function(e){const t=de(),i=t.indexOf(document.activeElement);"Tab"===e.code?e.shiftKey&&0===i?(t[t.length-1].focus(),e.preventDefault()):e.shiftKey||i!==t.length-1||(t[0].focus(),e.preventDefault()):"Escape"===e.code?(e.preventDefault(),U()):"ArrowLeft"===e.code?(e.preventDefault(),V()):"ArrowRight"===e.code&&(e.preventDefault(),G())},pe=function(){U()},ge=function(e){e.preventDefault(),e.stopPropagation(),x=!1,$=!1,S=!0,C.startX=e.pageX,C.startY=e.pageY,r[o].slider.classList.add("parvus__slider--is-dragging"),r[o].slider.style.willChange="transform"},he=function(e){e.preventDefault(),S&&(C.endX=e.pageX,C.endY=e.pageY,ye())},me=function(e){e.stopPropagation(),S=!1,r[o].slider.classList.remove("parvus__slider--is-dragging"),r[o].slider.style.willChange="auto",(C.endX||C.endY)&&ne(),ie()},ve=function(e){e.stopPropagation(),x=!1,$=!1,S=!0,C.startX=e.touches[0].pageX,C.startY=e.touches[0].pageY,r[o].slider.classList.add("parvus__slider--is-dragging"),r[o].slider.style.willChange="transform"},fe=function(e){e.stopPropagation(),S&&(e.preventDefault(),C.endX=e.touches[0].pageX,C.endY=e.touches[0].pageY,ye())},be=function(e){e.stopPropagation(),S=!1,r[o].slider.classList.remove("parvus__slider--is-dragging"),r[o].slider.style.willChange="auto",(C.endX||C.endY)&&ne(),ie()},ye=function(){const e=C.startX-C.endX,t=C.endY-C.startY,i=Math.abs(t);Math.abs(e)>0&&!$&&r[o].gallery.length>1?(r[o].slider.style.transform=`translate3d(${M-Math.round(e)}px, 0, 0)`,x=!0,$=!1):Math.abs(t)>0&&!x&&u.swipeClose&&(i<=96&&!I&&(g=1-i/100),c.classList.add("parvus--is-vertical-closing"),p.style.opacity=g,r[o].slider.style.transform=`translate3d(${M}px, ${Math.round(t)}px, 0)`,x=!1,$=!0)},we=function(){n.addEventListener("keydown",ce),n.addEventListener("resize",ae),u.scrollClose&&n.addEventListener("wheel",pe),n.addEventListener("popstate",U),c.addEventListener("click",oe),Le()&&(c.addEventListener("touchstart",ve),c.addEventListener("touchmove",fe),c.addEventListener("touchend",be)),u.simulateTouch&&(c.addEventListener("mousedown",ge),c.addEventListener("mouseup",me),c.addEventListener("mousemove",he))},Ee=function(){n.removeEventListener("keydown",ce),n.removeEventListener("resize",ae),u.scrollClose&&n.removeEventListener("wheel",pe),n.removeEventListener("popstate",U),c.removeEventListener("click",oe),Le()&&(c.removeEventListener("touchstart",ve),c.removeEventListener("touchmove",fe),c.removeEventListener("touchend",be)),u.simulateTouch&&(c.removeEventListener("mousedown",ge),c.removeEventListener("mouseup",me),c.removeEventListener("mousemove",he))},Ae=function(){return"false"===c.getAttribute("aria-hidden")},Le=function(){return"ontouchstart"in window};return Y(i),t.init=Y,t.open=R,t.close=U,t.select=K,t.previous=V,t.next=G,t.currentIndex=function(){return d},t.add=D,t.remove=O,t.destroy=function(){if(!c)return;Ae()&&U(),c.remove();document.querySelectorAll(".parvus-trigger").forEach((e=>{O(e)}));const e=new CustomEvent("destroy");c.dispatchEvent(e)},t.isOpen=Ae,t.on=function(e,t){c&&c.addEventListener(e,t)},t.off=function(e,t){c&&c.removeEventListener(e,t)},t}export{t as default};

dist/js/parvus.js

@@ -5,3 +5,3 @@ /**
  * @author Benjamin de Oostfrees
- * @version 2.0.4
+ * @version 2.1.0
  * @url https://github.com/deoostfrees/parvus
@@ -87,2 +87,3 @@ *
         swipeClose: true,
+        simulateTouch: true,
         threshold: 50,
@@ -864,3 +865,3 @@ backFocus: true,
     const updateConfig = function updateConfig() {
-      if (config.swipeClose && !GROUPS[activeGroup].slider.classList.contains('parvus__slider--is-draggable') || GROUPS[activeGroup].gallery.length > 1 && !GROUPS[activeGroup].slider.classList.contains('parvus__slider--is-draggable')) {
+      if ((config.simulateTouch || isTouchDevice()) && config.swipeClose && !GROUPS[activeGroup].slider.classList.contains('parvus__slider--is-draggable') || (config.simulateTouch || isTouchDevice()) && GROUPS[activeGroup].gallery.length > 1 && !GROUPS[activeGroup].slider.classList.contains('parvus__slider--is-draggable')) {
         GROUPS[activeGroup].slider.classList.add('parvus__slider--is-draggable');
@@ -1200,5 +1201,7 @@ } // Hide buttons if necessary
 
-      lightbox.addEventListener('mousedown', mousedownHandler);
-      lightbox.addEventListener('mouseup', mouseupHandler);
-      lightbox.addEventListener('mousemove', mousemoveHandler);
+      if (config.simulateTouch) {
+        lightbox.addEventListener('mousedown', mousedownHandler);
+        lightbox.addEventListener('mouseup', mouseupHandler);
+        lightbox.addEventListener('mousemove', mousemoveHandler);
+      }
     };
@@ -1232,5 +1235,7 @@ /**
 
-      lightbox.removeEventListener('mousedown', mousedownHandler);
-      lightbox.removeEventListener('mouseup', mouseupHandler);
-      lightbox.removeEventListener('mousemove', mousemoveHandler);
+      if (config.simulateTouch) {
+        lightbox.removeEventListener('mousedown', mousedownHandler);
+        lightbox.removeEventListener('mouseup', mouseupHandler);
+        lightbox.removeEventListener('mousemove', mousemoveHandler);
+      }
     };
@@ -1237,0 +1242,0 @@ /**

dist/js/parvus.min.js

@@ -5,3 +5,3 @@ /**
  * @author Benjamin de Oostfrees
- * @version 2.0.4
+ * @version 2.1.0
  * @url https://github.com/deoostfrees/parvus
@@ -12,2 +12,2 @@ *
 
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self).Parvus=t()}(this,(function(){"use strict";var e={lightboxLabel:"This is a dialog window which overlays the main content of the page. The modal shows the enlarged image. Pressing the Escape key will close the modal and bring you back to where you were on the page.",lightboxLoadingIndicatorLabel:"Image loading",previousButtonLabel:"Previous image",nextButtonLabel:"Next image",closeButtonLabel:"Close dialog window"};return function t(n){const i=window,s=["button:not([disabled]):not([inert])",'[tabindex]:not([tabindex^="-"]):not([inert])'],a={gallery:[],slider:null,sliderElements:[],images:[]},r={};let l=null,o=null,d=0,u={},c=null,p=null,g=1,h=null,m=null,v=null,f=null,b=null,y=null,w=null,E=0,A=0,L=0,_=0,C={},x=!1,$=!1,S=!1,T=null,B=null,M=null,q=!1,F=null,I=!0;const N=window.matchMedia("(prefers-reduced-motion)"),X=function(){N.matches?(I=!0,F=u.reducedTransitionDuration):(I=!1,F=u.transitionDuration)};N.addEventListener("change",X);const Y=function(t){u=function(t){return{selector:".lightbox",gallerySelector:null,captions:!0,captionsSelector:"self",captionsAttribute:"data-caption",docClose:!0,scrollClose:!1,swipeClose:!0,threshold:50,backFocus:!0,transitionDuration:300,reducedTransitionDuration:.1,transitionTimingFunction:"cubic-bezier(0.4, 0, 0.22, 1)",lightboxIndicatorIcon:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M8 3H5a2 2 0 00-2 2v3m18 0V5a2 2 0 00-2-2h-3m0 18h3a2 2 0 002-2v-3M3 16v3a2 2 0 002 2h3"/></svg>',previousButtonIcon:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path stroke="none" d="M0 0h24v24H0z"/><polyline points="15 6 9 12 15 18" /></svg>',nextButtonIcon:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path stroke="none" d="M0 0h24v24H0z"/><polyline points="9 6 15 12 9 18" /></svg>',closeButtonIcon:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M18 6L6 18M6 6l12 12"/></svg>',l10n:e,fileTypes:/\.(png|jpe?g|webp|avif|svg)(\?.*)?$/i,...t}}(t);if(document.querySelectorAll(u.selector).length)if(X(),c||H(),null!==u.gallerySelector){document.querySelectorAll(u.gallerySelector).forEach(((e,t)=>{const n=t;e.querySelectorAll(u.selector).forEach((e=>{e.setAttribute("data-group",`parvus-gallery-${n}`),D(e)}))}));document.querySelectorAll(`${u.selector}:not(.parvus-trigger)`).forEach((e=>{D(e)}))}else{document.querySelectorAll(u.selector).forEach((e=>{D(e)}))}},k=function(e){const t=Math.floor(1e4*Math.random());return e.hasAttribute("data-group")&&""!==e.getAttribute("data-group")||e.setAttribute("data-group",`default-${t}`),e.getAttribute("data-group")},D=function(e){if(!("A"===e.tagName&&e.hasAttribute("href")&&e.href.match(u.fileTypes)||"BUTTON"===e.tagName&&e.hasAttribute("data-target")&&e.getAttribute("data-target").match(u.fileTypes)))throw new Error(e,`Use a link with the 'href' attribute or a button with the 'data-target' attribute. Both attributes must have a path to the image file. Supported image file types: ${u.fileTypes}.`);var t;if(l=k(e),Object.prototype.hasOwnProperty.call(r,l)||(r[l]=(t=a,JSON.parse(JSON.stringify(t)))),r[l].gallery.includes(e))throw new Error("Ups, element already added.");if(r[l].gallery.push(e),null!==e.querySelector("img")){const t=document.createElement("div");e.classList.add("parvus-zoom"),t.className="parvus-zoom__indicator",t.innerHTML=u.lightboxIndicatorIcon,e.appendChild(t)}e.classList.add("parvus-trigger"),e.addEventListener("click",le),Ae()&&l===o&&(z(r[l].gallery.indexOf(e)),W(e,r[l].gallery.indexOf(e),(function(){J(r[l].gallery.indexOf(e))})),se(),ee(),te())},O=function(e){if(Ae()||!c||!e||!e.hasAttribute("data-group"))return;const t=k(e);if(!r[t].gallery.includes(e))throw new Error("Ups, I can't find the element.");if(r[t].gallery.splice(r[t].gallery.indexOf(e),1),e.classList.contains("parvus-zoom")){const t=e.querySelector(".parvus-zoom__indicator");e.classList.remove("parvus-zoom"),e.removeChild(t)}e.removeEventListener("click",le),e.classList.remove("parvus-trigger")},H=function(){c=document.createElement("div"),c.setAttribute("role","dialog"),c.setAttribute("aria-modal","true"),c.setAttribute("aria-hidden","true"),c.setAttribute("tabindex","-1"),c.setAttribute("aria-label",u.l10n.lightboxLabel),c.classList.add("parvus"),p=document.createElement("div"),p.classList.add("parvus__overlay"),p.style.opacity=0,c.appendChild(p),h=document.createElement("div"),h.className="parvus__toolbar",m=document.createElement("div"),v=document.createElement("div"),y=document.createElement("button"),y.className="parvus__btn parvus__btn--close",y.setAttribute("type","button"),y.setAttribute("aria-label",u.l10n.closeButtonLabel),y.innerHTML=u.closeButtonIcon,v.appendChild(y),f=document.createElement("button"),f.className="parvus__btn parvus__btn--previous",f.setAttribute("type","button"),f.setAttribute("aria-label",u.l10n.previousButtonLabel),f.innerHTML=u.previousButtonIcon,c.appendChild(f),b=document.createElement("button"),b.className="parvus__btn parvus__btn--next",b.setAttribute("type","button"),b.setAttribute("aria-label",u.l10n.nextButtonLabel),b.innerHTML=u.nextButtonIcon,c.appendChild(b),w=document.createElement("div"),w.className="parvus__counter",m.appendChild(w),h.appendChild(m),h.appendChild(v),c.appendChild(h),document.body.appendChild(c)},z=function(e){if(void 0!==r[o].sliderElements[e]);else{const t=document.createElement("div"),n=document.createElement("div");t.className="parvus__slide",t.style.position="absolute",t.style.left=100*e+"%",t.setAttribute("aria-hidden","true"),t.appendChild(n),r[o].sliderElements[e]=t,e===d&&r[o].slider.appendChild(t),e>d?r[o].sliderElements[d].after(t):r[o].sliderElements[d].before(t)}},P=function(e){if(!c||!e||!e.classList.contains("parvus-trigger")||Ae())return;if(o=k(e),!r[o].gallery.includes(e))throw new Error("Ups, I can't find the element.");d=r[o].gallery.indexOf(e),T=document.activeElement;const t=window.location.href;history.pushState({parvus:"close"},"Image",t),we();document.querySelectorAll('body > *:not([aria-hidden="true"])').forEach((e=>{e.setAttribute("aria-hidden","true"),e.classList.add("parvus-hidden")})),c.classList.add("parvus--is-opening"),c.setAttribute("aria-hidden","false"),r[o].slider=document.createElement("div"),r[o].slider.className="parvus__slider",r[o].slider.setAttribute("aria-hidden","true"),c.appendChild(r[o].slider),z(d),r[o].slider.setAttribute("aria-hidden","false"),Z(),se(),te(),ue(),j(d),W(e,d,(function(){J(d),requestAnimationFrame((()=>{c.classList.remove("parvus--is-opening"),p.style.opacity=1,p.style.transition=`opacity ${F}ms ${u.transitionTimingFunction}`,p.style.willChange="opacity"})),p.addEventListener("transitionend",(()=>{U(d+1),U(d-1)})),r[o].slider.classList.add("parvus__slider--animate")}));const n=new CustomEvent("open",{detail:{source:e}});c.dispatchEvent(n)},R=function(){if(!Ae())throw new Error("Ups, I'm already closed.");const e=r[o].images[d],t=e.getBoundingClientRect(),n=(u.backFocus?r[o].gallery[d]:T).getBoundingClientRect();Ee(),ne(),null!==history.state&&"close"===history.state.parvus&&history.back();document.querySelectorAll(".parvus-hidden").forEach((e=>{e.removeAttribute("aria-hidden"),e.classList.remove("parvus-hidden")})),c.classList.add("parvus--is-closing"),requestAnimationFrame((()=>{E=n.width/t.width,A=n.height/t.height,L=n.left-t.left,_=n.top-t.top,e.style.transform=`translate(${L}px, ${_}px) scale(${E}, ${A})`,e.style.opacity=0,e.style.transition=`transform ${F}ms ${u.transitionTimingFunction}, opacity ${F}ms ${u.transitionTimingFunction} ${F/2}ms`,p.style.opacity=0,p.style.transition=`opacity ${F}ms ${u.transitionTimingFunction}`,p.style.willChange="auto"})),p.addEventListener("transitionend",(()=>{Q(d),T=u.backFocus?r[o].gallery[d]:T,T.focus({preventScroll:!0}),c.setAttribute("aria-hidden","true"),c.classList.remove("parvus--is-closing"),c.classList.remove("parvus--is-vertical-closing"),e.style.transform="",r[o].slider.remove(),r[o].slider=null,r[o].sliderElements=[],r[o].images=[]}),{once:!0});const i=new CustomEvent("close",{detail:{source:r[o].gallery[d]}});c.dispatchEvent(i)},U=function(e){void 0!==r[o].gallery[e]&&(z(e),W(r[o].gallery[e],e,(function(){J(e)})))},j=function(e){r[o].sliderElements[e].classList.add("parvus__slide--is-active"),r[o].sliderElements[e].setAttribute("aria-hidden","false")},W=function(e,t,n){if(void 0!==r[o].images[t]);else{const i=r[o].sliderElements[t].querySelector("div"),s=document.createElement("img"),a=document.createElement("div"),l=document.createElement("div"),d=e.querySelector("img"),c=document.createElement("div");if(a.className="parvus__content",l.className="parvus__caption",c.className="parvus__loader",c.setAttribute("role","progressbar"),c.setAttribute("aria-label",u.l10n.lightboxLoadingIndicatorLabel),i.appendChild(c),s.onload=()=>{i.removeChild(c),s.setAttribute("width",s.naturalWidth),s.setAttribute("height",s.naturalHeight),re(r[o].sliderElements[t],s),n&&"function"==typeof n&&n()},"A"===e.tagName?(s.setAttribute("src",e.href),s.alt=d?d.alt||"":e.getAttribute("data-alt")||""):(s.alt=e.getAttribute("data-alt")||"",s.setAttribute("src",e.getAttribute("data-target"))),e.hasAttribute("data-srcset")&&""!==e.getAttribute("data-srcset")&&s.setAttribute("srcset",e.getAttribute("data-srcset")),s.style.opacity=0,a.appendChild(s),r[o].images[t]=s,i.appendChild(a),u.captions){let n=null;if("self"===u.captionsSelector)e.hasAttribute(u.captionsAttribute)&&""!==e.getAttribute(u.captionsAttribute)&&(n=e.getAttribute(u.captionsAttribute));else if(null!==e.querySelector(u.captionsSelector)){const t=e.querySelector(u.captionsSelector);n=t.hasAttribute(u.captionsAttribute)&&""!==t.getAttribute(u.captionsAttribute)?t.getAttribute(u.captionsAttribute):t.innerHTML}null!==n&&(r[o].sliderElements[t].setAttribute("aria-labelledby",`parvus__caption-${t}`),l.id=`parvus__caption-${t}`,l.innerHTML=`<p>${n}</p>`,i.appendChild(l))}}},J=function(e){const t=r[o].images[e],n=t.getBoundingClientRect(),i=r[o].gallery[e].getBoundingClientRect();c.classList.contains("parvus--is-opening")?(E=i.width/n.width,A=i.height/n.height,L=i.left-n.left,_=i.top-n.top,requestAnimationFrame((()=>{t.style.transform=`translate(${L}px, ${_}px) scale(${E}, ${A})`,t.style.transition="transform 0s, opacity 0s",requestAnimationFrame((()=>{t.style.transform="",t.style.opacity=1,t.style.transition=`transform ${F}ms ${u.transitionTimingFunction}, opacity ${F/2}ms ${u.transitionTimingFunction}`}))}))):t.style.opacity=1},K=function(e){const t=d;if(!Ae())throw new Error("Ups, I'm closed.");if(!e&&0!==e)throw new Error("Ups, no slide specified.");if(e===d)throw new Error(`Ups, slide ${e} is already selected.`);if(-1===e||e>=r[o].gallery.length)throw new Error(`Ups, I can't find slide ${e}.`);Q(t),j(e),J(e),e<t&&(d--,Z(),se(),ee("left"),U(e-1)),e>t&&(d++,Z(),se(),ee("right"),U(e+1)),te();const n=new CustomEvent("select",{detail:{source:r[o].gallery[d]}});c.dispatchEvent(n)},V=function(){d>0&&K(d-1)},G=function(){d<r[o].gallery.length-1&&K(d+1)},Q=function(e){r[o].sliderElements[e].classList.remove("parvus__slide--is-active"),r[o].sliderElements[e].setAttribute("aria-hidden","true")},Z=function(){o=null!==o?o:l,B=d*c.offsetWidth*-1,r[o].slider.style.transform=`translate3d(${B}px, 0, 0)`,M=B},ee=function(e){1===r[o].gallery.length?y.focus():0===d?b.focus():d===r[o].gallery.length-1||"left"===e?f.focus():b.focus()},te=function(){w.textContent=`${d+1}/${r[o].gallery.length}`},ne=function(){C={startX:0,endX:0,startY:0,endY:0}},ie=function(){const e=C.endX-C.startX,t=C.endY-C.startY,n=Math.abs(e),i=Math.abs(t);x&&e>0&&n>=u.threshold&&d>0?V():x&&e<0&&n>=u.threshold&&d!==r[o].gallery.length-1?G():$&&i>0?i>=u.threshold&&u.swipeClose?R():(p.style.opacity=1,c.classList.remove("parvus--is-vertical-closing"),Z()):Z()},se=function(){(u.swipeClose&&!r[o].slider.classList.contains("parvus__slider--is-draggable")||r[o].gallery.length>1&&!r[o].slider.classList.contains("parvus__slider--is-draggable"))&&r[o].slider.classList.add("parvus__slider--is-draggable"),1===r[o].gallery.length?(f.setAttribute("aria-hidden","true"),f.disabled=!0,b.setAttribute("aria-hidden","true"),b.disabled=!0):0===d?(f.setAttribute("aria-hidden","true"),f.disabled=!0,b.setAttribute("aria-hidden","false"),b.disabled=!1):d===r[o].gallery.length-1?(f.setAttribute("aria-hidden","false"),f.disabled=!1,b.setAttribute("aria-hidden","true"),b.disabled=!0):(f.setAttribute("aria-hidden","false"),f.disabled=!1,b.setAttribute("aria-hidden","false"),b.disabled=!1),1===r[o].gallery.length?w.setAttribute("aria-hidden","true"):w.setAttribute("aria-hidden","false")},ae=function(){q||(q=!0,i.requestAnimationFrame((()=>{r[o].sliderElements.forEach(((e,t)=>{re(e,r[o].images[t])})),Z(),q=!1})))},re=function(e,t){const n=getComputedStyle(e),i=null!==e.querySelector(".parvus__caption")?e.querySelector(".parvus__caption").getBoundingClientRect().height:0,s=t.getAttribute("height"),a=t.getAttribute("width");let r=e.getBoundingClientRect().height,l=e.getBoundingClientRect().width;r-=parseFloat(n.paddingTop)+parseFloat(n.paddingBottom)+parseFloat(i),l-=parseFloat(n.paddingLeft)+parseFloat(n.paddingRight);const o=Math.min(l/a||0,r/s),d=a*o||0,u=s*o||0;s>u&&s<r&&a>d&&a<l||s<u&&s<r&&a<d&&a<l?(t.style.width="",t.style.height=""):(t.style.width=`${d}px`,t.style.height=`${u}px`)},le=function(e){e.preventDefault(),P(this)},oe=function(e){e.target===f?V():e.target===b?G():(e.target===y||!$&&!x&&e.target.classList.contains("parvus__slide")&&u.docClose)&&R(),e.stopPropagation()},de=function(){return Array.prototype.slice.call(c.querySelectorAll(`${s.join(", ")}`)).filter((e=>!!(e.offsetWidth||e.offsetHeight||e.getClientRects().length)))},ue=function(){de()[0].focus()},ce=function(e){const t=de(),n=t.indexOf(document.activeElement);"Tab"===e.code?e.shiftKey&&0===n?(t[t.length-1].focus(),e.preventDefault()):e.shiftKey||n!==t.length-1||(t[0].focus(),e.preventDefault()):"Escape"===e.code?(e.preventDefault(),R()):"ArrowLeft"===e.code?(e.preventDefault(),V()):"ArrowRight"===e.code&&(e.preventDefault(),G())},pe=function(){R()},ge=function(e){e.preventDefault(),e.stopPropagation(),x=!1,$=!1,S=!0,C.startX=e.pageX,C.startY=e.pageY,r[o].slider.classList.add("parvus__slider--is-dragging"),r[o].slider.style.willChange="transform"},he=function(e){e.preventDefault(),S&&(C.endX=e.pageX,C.endY=e.pageY,ye())},me=function(e){e.stopPropagation(),S=!1,r[o].slider.classList.remove("parvus__slider--is-dragging"),r[o].slider.style.willChange="auto",(C.endX||C.endY)&&ie(),ne()},ve=function(e){e.stopPropagation(),x=!1,$=!1,S=!0,C.startX=e.touches[0].pageX,C.startY=e.touches[0].pageY,r[o].slider.classList.add("parvus__slider--is-dragging"),r[o].slider.style.willChange="transform"},fe=function(e){e.stopPropagation(),S&&(e.preventDefault(),C.endX=e.touches[0].pageX,C.endY=e.touches[0].pageY,ye())},be=function(e){e.stopPropagation(),S=!1,r[o].slider.classList.remove("parvus__slider--is-dragging"),r[o].slider.style.willChange="auto",(C.endX||C.endY)&&ie(),ne()},ye=function(){const e=C.startX-C.endX,t=C.endY-C.startY,n=Math.abs(t);Math.abs(e)>0&&!$&&r[o].gallery.length>1?(r[o].slider.style.transform=`translate3d(${M-Math.round(e)}px, 0, 0)`,x=!0,$=!1):Math.abs(t)>0&&!x&&u.swipeClose&&(n<=96&&!I&&(g=1-n/100),c.classList.add("parvus--is-vertical-closing"),p.style.opacity=g,r[o].slider.style.transform=`translate3d(${M}px, ${Math.round(t)}px, 0)`,x=!1,$=!0)},we=function(){i.addEventListener("keydown",ce),i.addEventListener("resize",ae),u.scrollClose&&i.addEventListener("wheel",pe),i.addEventListener("popstate",R),c.addEventListener("click",oe),Le()&&(c.addEventListener("touchstart",ve),c.addEventListener("touchmove",fe),c.addEventListener("touchend",be)),c.addEventListener("mousedown",ge),c.addEventListener("mouseup",me),c.addEventListener("mousemove",he)},Ee=function(){i.removeEventListener("keydown",ce),i.removeEventListener("resize",ae),u.scrollClose&&i.removeEventListener("wheel",pe),i.removeEventListener("popstate",R),c.removeEventListener("click",oe),Le()&&(c.removeEventListener("touchstart",ve),c.removeEventListener("touchmove",fe),c.removeEventListener("touchend",be)),c.removeEventListener("mousedown",ge),c.removeEventListener("mouseup",me),c.removeEventListener("mousemove",he)},Ae=function(){return"false"===c.getAttribute("aria-hidden")},Le=function(){return"ontouchstart"in window};return Y(n),t.init=Y,t.open=P,t.close=R,t.select=K,t.previous=V,t.next=G,t.currentIndex=function(){return d},t.add=D,t.remove=O,t.destroy=function(){if(!c)return;Ae()&&R(),c.remove();document.querySelectorAll(".parvus-trigger").forEach((e=>{O(e)}));const e=new CustomEvent("destroy");c.dispatchEvent(e)},t.isOpen=Ae,t.on=function(e,t){c&&c.addEventListener(e,t)},t.off=function(e,t){c&&c.removeEventListener(e,t)},t}}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self).Parvus=t()}(this,(function(){"use strict";var e={lightboxLabel:"This is a dialog window which overlays the main content of the page. The modal shows the enlarged image. Pressing the Escape key will close the modal and bring you back to where you were on the page.",lightboxLoadingIndicatorLabel:"Image loading",previousButtonLabel:"Previous image",nextButtonLabel:"Next image",closeButtonLabel:"Close dialog window"};return function t(n){const i=window,s=["button:not([disabled]):not([inert])",'[tabindex]:not([tabindex^="-"]):not([inert])'],a={gallery:[],slider:null,sliderElements:[],images:[]},r={};let l=null,o=null,d=0,u={},c=null,p=null,g=1,h=null,m=null,v=null,f=null,b=null,y=null,w=null,E=0,A=0,L=0,_=0,C={},x=!1,$=!1,T=!1,S=null,B=null,M=null,q=!1,F=null,I=!0;const N=window.matchMedia("(prefers-reduced-motion)"),X=function(){N.matches?(I=!0,F=u.reducedTransitionDuration):(I=!1,F=u.transitionDuration)};N.addEventListener("change",X);const Y=function(t){u=function(t){return{selector:".lightbox",gallerySelector:null,captions:!0,captionsSelector:"self",captionsAttribute:"data-caption",docClose:!0,scrollClose:!1,swipeClose:!0,simulateTouch:!0,threshold:50,backFocus:!0,transitionDuration:300,reducedTransitionDuration:.1,transitionTimingFunction:"cubic-bezier(0.4, 0, 0.22, 1)",lightboxIndicatorIcon:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M8 3H5a2 2 0 00-2 2v3m18 0V5a2 2 0 00-2-2h-3m0 18h3a2 2 0 002-2v-3M3 16v3a2 2 0 002 2h3"/></svg>',previousButtonIcon:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path stroke="none" d="M0 0h24v24H0z"/><polyline points="15 6 9 12 15 18" /></svg>',nextButtonIcon:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path stroke="none" d="M0 0h24v24H0z"/><polyline points="9 6 15 12 9 18" /></svg>',closeButtonIcon:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M18 6L6 18M6 6l12 12"/></svg>',l10n:e,fileTypes:/\.(png|jpe?g|webp|avif|svg)(\?.*)?$/i,...t}}(t);if(document.querySelectorAll(u.selector).length)if(X(),c||H(),null!==u.gallerySelector){document.querySelectorAll(u.gallerySelector).forEach(((e,t)=>{const n=t;e.querySelectorAll(u.selector).forEach((e=>{e.setAttribute("data-group",`parvus-gallery-${n}`),D(e)}))}));document.querySelectorAll(`${u.selector}:not(.parvus-trigger)`).forEach((e=>{D(e)}))}else{document.querySelectorAll(u.selector).forEach((e=>{D(e)}))}},k=function(e){const t=Math.floor(1e4*Math.random());return e.hasAttribute("data-group")&&""!==e.getAttribute("data-group")||e.setAttribute("data-group",`default-${t}`),e.getAttribute("data-group")},D=function(e){if(!("A"===e.tagName&&e.hasAttribute("href")&&e.href.match(u.fileTypes)||"BUTTON"===e.tagName&&e.hasAttribute("data-target")&&e.getAttribute("data-target").match(u.fileTypes)))throw new Error(e,`Use a link with the 'href' attribute or a button with the 'data-target' attribute. Both attributes must have a path to the image file. Supported image file types: ${u.fileTypes}.`);var t;if(l=k(e),Object.prototype.hasOwnProperty.call(r,l)||(r[l]=(t=a,JSON.parse(JSON.stringify(t)))),r[l].gallery.includes(e))throw new Error("Ups, element already added.");if(r[l].gallery.push(e),null!==e.querySelector("img")){const t=document.createElement("div");e.classList.add("parvus-zoom"),t.className="parvus-zoom__indicator",t.innerHTML=u.lightboxIndicatorIcon,e.appendChild(t)}e.classList.add("parvus-trigger"),e.addEventListener("click",le),Ae()&&l===o&&(z(r[l].gallery.indexOf(e)),W(e,r[l].gallery.indexOf(e),(function(){J(r[l].gallery.indexOf(e))})),se(),ee(),te())},O=function(e){if(Ae()||!c||!e||!e.hasAttribute("data-group"))return;const t=k(e);if(!r[t].gallery.includes(e))throw new Error("Ups, I can't find the element.");if(r[t].gallery.splice(r[t].gallery.indexOf(e),1),e.classList.contains("parvus-zoom")){const t=e.querySelector(".parvus-zoom__indicator");e.classList.remove("parvus-zoom"),e.removeChild(t)}e.removeEventListener("click",le),e.classList.remove("parvus-trigger")},H=function(){c=document.createElement("div"),c.setAttribute("role","dialog"),c.setAttribute("aria-modal","true"),c.setAttribute("aria-hidden","true"),c.setAttribute("tabindex","-1"),c.setAttribute("aria-label",u.l10n.lightboxLabel),c.classList.add("parvus"),p=document.createElement("div"),p.classList.add("parvus__overlay"),p.style.opacity=0,c.appendChild(p),h=document.createElement("div"),h.className="parvus__toolbar",m=document.createElement("div"),v=document.createElement("div"),y=document.createElement("button"),y.className="parvus__btn parvus__btn--close",y.setAttribute("type","button"),y.setAttribute("aria-label",u.l10n.closeButtonLabel),y.innerHTML=u.closeButtonIcon,v.appendChild(y),f=document.createElement("button"),f.className="parvus__btn parvus__btn--previous",f.setAttribute("type","button"),f.setAttribute("aria-label",u.l10n.previousButtonLabel),f.innerHTML=u.previousButtonIcon,c.appendChild(f),b=document.createElement("button"),b.className="parvus__btn parvus__btn--next",b.setAttribute("type","button"),b.setAttribute("aria-label",u.l10n.nextButtonLabel),b.innerHTML=u.nextButtonIcon,c.appendChild(b),w=document.createElement("div"),w.className="parvus__counter",m.appendChild(w),h.appendChild(m),h.appendChild(v),c.appendChild(h),document.body.appendChild(c)},z=function(e){if(void 0!==r[o].sliderElements[e]);else{const t=document.createElement("div"),n=document.createElement("div");t.className="parvus__slide",t.style.position="absolute",t.style.left=100*e+"%",t.setAttribute("aria-hidden","true"),t.appendChild(n),r[o].sliderElements[e]=t,e===d&&r[o].slider.appendChild(t),e>d?r[o].sliderElements[d].after(t):r[o].sliderElements[d].before(t)}},P=function(e){if(!c||!e||!e.classList.contains("parvus-trigger")||Ae())return;if(o=k(e),!r[o].gallery.includes(e))throw new Error("Ups, I can't find the element.");d=r[o].gallery.indexOf(e),S=document.activeElement;const t=window.location.href;history.pushState({parvus:"close"},"Image",t),we();document.querySelectorAll('body > *:not([aria-hidden="true"])').forEach((e=>{e.setAttribute("aria-hidden","true"),e.classList.add("parvus-hidden")})),c.classList.add("parvus--is-opening"),c.setAttribute("aria-hidden","false"),r[o].slider=document.createElement("div"),r[o].slider.className="parvus__slider",r[o].slider.setAttribute("aria-hidden","true"),c.appendChild(r[o].slider),z(d),r[o].slider.setAttribute("aria-hidden","false"),Z(),se(),te(),ue(),j(d),W(e,d,(function(){J(d),requestAnimationFrame((()=>{c.classList.remove("parvus--is-opening"),p.style.opacity=1,p.style.transition=`opacity ${F}ms ${u.transitionTimingFunction}`,p.style.willChange="opacity"})),p.addEventListener("transitionend",(()=>{U(d+1),U(d-1)})),r[o].slider.classList.add("parvus__slider--animate")}));const n=new CustomEvent("open",{detail:{source:e}});c.dispatchEvent(n)},R=function(){if(!Ae())throw new Error("Ups, I'm already closed.");const e=r[o].images[d],t=e.getBoundingClientRect(),n=(u.backFocus?r[o].gallery[d]:S).getBoundingClientRect();Ee(),ne(),null!==history.state&&"close"===history.state.parvus&&history.back();document.querySelectorAll(".parvus-hidden").forEach((e=>{e.removeAttribute("aria-hidden"),e.classList.remove("parvus-hidden")})),c.classList.add("parvus--is-closing"),requestAnimationFrame((()=>{E=n.width/t.width,A=n.height/t.height,L=n.left-t.left,_=n.top-t.top,e.style.transform=`translate(${L}px, ${_}px) scale(${E}, ${A})`,e.style.opacity=0,e.style.transition=`transform ${F}ms ${u.transitionTimingFunction}, opacity ${F}ms ${u.transitionTimingFunction} ${F/2}ms`,p.style.opacity=0,p.style.transition=`opacity ${F}ms ${u.transitionTimingFunction}`,p.style.willChange="auto"})),p.addEventListener("transitionend",(()=>{Q(d),S=u.backFocus?r[o].gallery[d]:S,S.focus({preventScroll:!0}),c.setAttribute("aria-hidden","true"),c.classList.remove("parvus--is-closing"),c.classList.remove("parvus--is-vertical-closing"),e.style.transform="",r[o].slider.remove(),r[o].slider=null,r[o].sliderElements=[],r[o].images=[]}),{once:!0});const i=new CustomEvent("close",{detail:{source:r[o].gallery[d]}});c.dispatchEvent(i)},U=function(e){void 0!==r[o].gallery[e]&&(z(e),W(r[o].gallery[e],e,(function(){J(e)})))},j=function(e){r[o].sliderElements[e].classList.add("parvus__slide--is-active"),r[o].sliderElements[e].setAttribute("aria-hidden","false")},W=function(e,t,n){if(void 0!==r[o].images[t]);else{const i=r[o].sliderElements[t].querySelector("div"),s=document.createElement("img"),a=document.createElement("div"),l=document.createElement("div"),d=e.querySelector("img"),c=document.createElement("div");if(a.className="parvus__content",l.className="parvus__caption",c.className="parvus__loader",c.setAttribute("role","progressbar"),c.setAttribute("aria-label",u.l10n.lightboxLoadingIndicatorLabel),i.appendChild(c),s.onload=()=>{i.removeChild(c),s.setAttribute("width",s.naturalWidth),s.setAttribute("height",s.naturalHeight),re(r[o].sliderElements[t],s),n&&"function"==typeof n&&n()},"A"===e.tagName?(s.setAttribute("src",e.href),s.alt=d?d.alt||"":e.getAttribute("data-alt")||""):(s.alt=e.getAttribute("data-alt")||"",s.setAttribute("src",e.getAttribute("data-target"))),e.hasAttribute("data-srcset")&&""!==e.getAttribute("data-srcset")&&s.setAttribute("srcset",e.getAttribute("data-srcset")),s.style.opacity=0,a.appendChild(s),r[o].images[t]=s,i.appendChild(a),u.captions){let n=null;if("self"===u.captionsSelector)e.hasAttribute(u.captionsAttribute)&&""!==e.getAttribute(u.captionsAttribute)&&(n=e.getAttribute(u.captionsAttribute));else if(null!==e.querySelector(u.captionsSelector)){const t=e.querySelector(u.captionsSelector);n=t.hasAttribute(u.captionsAttribute)&&""!==t.getAttribute(u.captionsAttribute)?t.getAttribute(u.captionsAttribute):t.innerHTML}null!==n&&(r[o].sliderElements[t].setAttribute("aria-labelledby",`parvus__caption-${t}`),l.id=`parvus__caption-${t}`,l.innerHTML=`<p>${n}</p>`,i.appendChild(l))}}},J=function(e){const t=r[o].images[e],n=t.getBoundingClientRect(),i=r[o].gallery[e].getBoundingClientRect();c.classList.contains("parvus--is-opening")?(E=i.width/n.width,A=i.height/n.height,L=i.left-n.left,_=i.top-n.top,requestAnimationFrame((()=>{t.style.transform=`translate(${L}px, ${_}px) scale(${E}, ${A})`,t.style.transition="transform 0s, opacity 0s",requestAnimationFrame((()=>{t.style.transform="",t.style.opacity=1,t.style.transition=`transform ${F}ms ${u.transitionTimingFunction}, opacity ${F/2}ms ${u.transitionTimingFunction}`}))}))):t.style.opacity=1},K=function(e){const t=d;if(!Ae())throw new Error("Ups, I'm closed.");if(!e&&0!==e)throw new Error("Ups, no slide specified.");if(e===d)throw new Error(`Ups, slide ${e} is already selected.`);if(-1===e||e>=r[o].gallery.length)throw new Error(`Ups, I can't find slide ${e}.`);Q(t),j(e),J(e),e<t&&(d--,Z(),se(),ee("left"),U(e-1)),e>t&&(d++,Z(),se(),ee("right"),U(e+1)),te();const n=new CustomEvent("select",{detail:{source:r[o].gallery[d]}});c.dispatchEvent(n)},V=function(){d>0&&K(d-1)},G=function(){d<r[o].gallery.length-1&&K(d+1)},Q=function(e){r[o].sliderElements[e].classList.remove("parvus__slide--is-active"),r[o].sliderElements[e].setAttribute("aria-hidden","true")},Z=function(){o=null!==o?o:l,B=d*c.offsetWidth*-1,r[o].slider.style.transform=`translate3d(${B}px, 0, 0)`,M=B},ee=function(e){1===r[o].gallery.length?y.focus():0===d?b.focus():d===r[o].gallery.length-1||"left"===e?f.focus():b.focus()},te=function(){w.textContent=`${d+1}/${r[o].gallery.length}`},ne=function(){C={startX:0,endX:0,startY:0,endY:0}},ie=function(){const e=C.endX-C.startX,t=C.endY-C.startY,n=Math.abs(e),i=Math.abs(t);x&&e>0&&n>=u.threshold&&d>0?V():x&&e<0&&n>=u.threshold&&d!==r[o].gallery.length-1?G():$&&i>0?i>=u.threshold&&u.swipeClose?R():(p.style.opacity=1,c.classList.remove("parvus--is-vertical-closing"),Z()):Z()},se=function(){((u.simulateTouch||Le())&&u.swipeClose&&!r[o].slider.classList.contains("parvus__slider--is-draggable")||(u.simulateTouch||Le())&&r[o].gallery.length>1&&!r[o].slider.classList.contains("parvus__slider--is-draggable"))&&r[o].slider.classList.add("parvus__slider--is-draggable"),1===r[o].gallery.length?(f.setAttribute("aria-hidden","true"),f.disabled=!0,b.setAttribute("aria-hidden","true"),b.disabled=!0):0===d?(f.setAttribute("aria-hidden","true"),f.disabled=!0,b.setAttribute("aria-hidden","false"),b.disabled=!1):d===r[o].gallery.length-1?(f.setAttribute("aria-hidden","false"),f.disabled=!1,b.setAttribute("aria-hidden","true"),b.disabled=!0):(f.setAttribute("aria-hidden","false"),f.disabled=!1,b.setAttribute("aria-hidden","false"),b.disabled=!1),1===r[o].gallery.length?w.setAttribute("aria-hidden","true"):w.setAttribute("aria-hidden","false")},ae=function(){q||(q=!0,i.requestAnimationFrame((()=>{r[o].sliderElements.forEach(((e,t)=>{re(e,r[o].images[t])})),Z(),q=!1})))},re=function(e,t){const n=getComputedStyle(e),i=null!==e.querySelector(".parvus__caption")?e.querySelector(".parvus__caption").getBoundingClientRect().height:0,s=t.getAttribute("height"),a=t.getAttribute("width");let r=e.getBoundingClientRect().height,l=e.getBoundingClientRect().width;r-=parseFloat(n.paddingTop)+parseFloat(n.paddingBottom)+parseFloat(i),l-=parseFloat(n.paddingLeft)+parseFloat(n.paddingRight);const o=Math.min(l/a||0,r/s),d=a*o||0,u=s*o||0;s>u&&s<r&&a>d&&a<l||s<u&&s<r&&a<d&&a<l?(t.style.width="",t.style.height=""):(t.style.width=`${d}px`,t.style.height=`${u}px`)},le=function(e){e.preventDefault(),P(this)},oe=function(e){e.target===f?V():e.target===b?G():(e.target===y||!$&&!x&&e.target.classList.contains("parvus__slide")&&u.docClose)&&R(),e.stopPropagation()},de=function(){return Array.prototype.slice.call(c.querySelectorAll(`${s.join(", ")}`)).filter((e=>!!(e.offsetWidth||e.offsetHeight||e.getClientRects().length)))},ue=function(){de()[0].focus()},ce=function(e){const t=de(),n=t.indexOf(document.activeElement);"Tab"===e.code?e.shiftKey&&0===n?(t[t.length-1].focus(),e.preventDefault()):e.shiftKey||n!==t.length-1||(t[0].focus(),e.preventDefault()):"Escape"===e.code?(e.preventDefault(),R()):"ArrowLeft"===e.code?(e.preventDefault(),V()):"ArrowRight"===e.code&&(e.preventDefault(),G())},pe=function(){R()},ge=function(e){e.preventDefault(),e.stopPropagation(),x=!1,$=!1,T=!0,C.startX=e.pageX,C.startY=e.pageY,r[o].slider.classList.add("parvus__slider--is-dragging"),r[o].slider.style.willChange="transform"},he=function(e){e.preventDefault(),T&&(C.endX=e.pageX,C.endY=e.pageY,ye())},me=function(e){e.stopPropagation(),T=!1,r[o].slider.classList.remove("parvus__slider--is-dragging"),r[o].slider.style.willChange="auto",(C.endX||C.endY)&&ie(),ne()},ve=function(e){e.stopPropagation(),x=!1,$=!1,T=!0,C.startX=e.touches[0].pageX,C.startY=e.touches[0].pageY,r[o].slider.classList.add("parvus__slider--is-dragging"),r[o].slider.style.willChange="transform"},fe=function(e){e.stopPropagation(),T&&(e.preventDefault(),C.endX=e.touches[0].pageX,C.endY=e.touches[0].pageY,ye())},be=function(e){e.stopPropagation(),T=!1,r[o].slider.classList.remove("parvus__slider--is-dragging"),r[o].slider.style.willChange="auto",(C.endX||C.endY)&&ie(),ne()},ye=function(){const e=C.startX-C.endX,t=C.endY-C.startY,n=Math.abs(t);Math.abs(e)>0&&!$&&r[o].gallery.length>1?(r[o].slider.style.transform=`translate3d(${M-Math.round(e)}px, 0, 0)`,x=!0,$=!1):Math.abs(t)>0&&!x&&u.swipeClose&&(n<=96&&!I&&(g=1-n/100),c.classList.add("parvus--is-vertical-closing"),p.style.opacity=g,r[o].slider.style.transform=`translate3d(${M}px, ${Math.round(t)}px, 0)`,x=!1,$=!0)},we=function(){i.addEventListener("keydown",ce),i.addEventListener("resize",ae),u.scrollClose&&i.addEventListener("wheel",pe),i.addEventListener("popstate",R),c.addEventListener("click",oe),Le()&&(c.addEventListener("touchstart",ve),c.addEventListener("touchmove",fe),c.addEventListener("touchend",be)),u.simulateTouch&&(c.addEventListener("mousedown",ge),c.addEventListener("mouseup",me),c.addEventListener("mousemove",he))},Ee=function(){i.removeEventListener("keydown",ce),i.removeEventListener("resize",ae),u.scrollClose&&i.removeEventListener("wheel",pe),i.removeEventListener("popstate",R),c.removeEventListener("click",oe),Le()&&(c.removeEventListener("touchstart",ve),c.removeEventListener("touchmove",fe),c.removeEventListener("touchend",be)),u.simulateTouch&&(c.removeEventListener("mousedown",ge),c.removeEventListener("mouseup",me),c.removeEventListener("mousemove",he))},Ae=function(){return"false"===c.getAttribute("aria-hidden")},Le=function(){return"ontouchstart"in window};return Y(n),t.init=Y,t.open=P,t.close=R,t.select=K,t.previous=V,t.next=G,t.currentIndex=function(){return d},t.add=D,t.remove=O,t.destroy=function(){if(!c)return;Ae()&&R(),c.remove();document.querySelectorAll(".parvus-trigger").forEach((e=>{O(e)}));const e=new CustomEvent("destroy");c.dispatchEvent(e)},t.isOpen=Ae,t.on=function(e,t){c&&c.addEventListener(e,t)},t.off=function(e,t){c&&c.removeEventListener(e,t)},t}}));

package.json

 {
   "name": "parvus",
-  "version": "2.0.4",
+  "version": "2.1.0",
   "description": "An accessible, open-source image lightbox with no dependencies.",
@@ -8,22 +8,23 @@ "main": "dist/js/parvus.js",
   "devDependencies": {
-    "@babel/core": "^7.16.10",
-    "@babel/preset-env": "^7.16.10",
-    "@rollup/plugin-babel": "^5.3.0",
-    "@rollup/plugin-commonjs": "^21.0.1",
-    "@rollup/plugin-node-resolve": "^13.1.3",
-    "core-js": "^3.20.3",
-    "postcss": "^8.4.5",
-    "rollup": "^2.64.0",
-    "rollup-plugin-license": "^2.6.1",
+    "@babel/core": "^7.17.10",
+    "@babel/preset-env": "^7.17.10",
+    "@rollup/plugin-babel": "^5.3.1",
+    "@rollup/plugin-commonjs": "^22.0.0",
+    "@rollup/plugin-node-resolve": "^13.3.0",
+    "core-js": "^3.22.5",
+    "postcss": "^8.4.13",
+    "rollup": "^2.72.1",
+    "rollup-plugin-license": "^2.7.0",
     "rollup-plugin-postcss": "^4.0.2",
     "rollup-plugin-terser": "^7.0.2",
-    "standard": "^16.0.4",
-    "sass": "^1.49.0",
-    "stylelint": "^14.2.0"
+    "standard": "^17.0.0",
+    "sass": "^1.51.0",
+    "stylelint": "^14.8.2"
   },
   "browserslist": [
     "last 2 versions",
-    "not <= 1%",
-    "not IE 10",
-    "not IE 11"
+    "> 1%",
+    "not ie 11",
+    "not ie_mob 11",
+    "not dead"
   ],
@@ -30,0 +31,0 @@ "standard": {

README.md

@@ -224,2 +224,5 @@ # Parvus
 
+  // Accept mouse events like touch events (click and drag to change slides)
+  simulateTouch: true,
+
   // Touch dragging threshold (in px)
@@ -226,0 +229,0 @@ threshold: 100,

rollup.config.js

@@ -67,3 +67,3 @@ import resolve from '@rollup/plugin-node-resolve'
             corejs: 3.15,
-            useBuiltIns: 'usage'
+            useBuiltIns: 'entry'
           }]
@@ -70,0 +70,0 @@ ]

src/js/parvus.js

@@ -67,2 +67,3 @@ // Default language
       swipeClose: true,
+      simulateTouch: true,
       threshold: 50,
@@ -930,3 +931,3 @@ backFocus: true,
   const updateConfig = function updateConfig () {
-    if ((config.swipeClose && !GROUPS[activeGroup].slider.classList.contains('parvus__slider--is-draggable')) || (GROUPS[activeGroup].gallery.length > 1 && !GROUPS[activeGroup].slider.classList.contains('parvus__slider--is-draggable'))) {
+    if (((config.simulateTouch || isTouchDevice()) && config.swipeClose && !GROUPS[activeGroup].slider.classList.contains('parvus__slider--is-draggable')) || ((config.simulateTouch || isTouchDevice()) && GROUPS[activeGroup].gallery.length > 1 && !GROUPS[activeGroup].slider.classList.contains('parvus__slider--is-draggable'))) {
       GROUPS[activeGroup].slider.classList.add('parvus__slider--is-draggable')
@@ -1293,5 +1294,7 @@ }
     // Mouse events
-    lightbox.addEventListener('mousedown', mousedownHandler)
-    lightbox.addEventListener('mouseup', mouseupHandler)
-    lightbox.addEventListener('mousemove', mousemoveHandler)
+    if (config.simulateTouch) {
+      lightbox.addEventListener('mousedown', mousedownHandler)
+      lightbox.addEventListener('mouseup', mouseupHandler)
+      lightbox.addEventListener('mousemove', mousemoveHandler)
+    }
   }
@@ -1325,5 +1328,7 @@
     // Mouse events
-    lightbox.removeEventListener('mousedown', mousedownHandler)
-    lightbox.removeEventListener('mouseup', mouseupHandler)
-    lightbox.removeEventListener('mousemove', mousemoveHandler)
+    if (config.simulateTouch) {
+      lightbox.removeEventListener('mousedown', mousedownHandler)
+      lightbox.removeEventListener('mouseup', mouseupHandler)
+      lightbox.removeEventListener('mousemove', mousemoveHandler)
+    }
   }
@@ -1330,0 +1335,0 @@

No alert changes

Improved metrics

Total package byte prevSize

193638

increased by0.49%

Lines of code

3937

increased by0.48%

Number of lines in readme file

309

increased by0.98%

No dependency changes