vistaview 0.3.11 → 0.3.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -56,8 +56,8 @@ export declare class VistaView {
56
56
  private onZoomedPointerUp;
57
57
  private transitionAbortControllers;
58
58
  constructor(elements: NodeListOf<HTMLElement> | VistaViewImage[], options?: VistaViewOptions);
59
- private loadImageTimeout;
60
59
  private setFullSizeImageDim;
60
+ private loadImageTimeout;
61
61
  private swap;
62
62
  private setZoomed;
63
63
  zoomIn(): void;
@@ -1 +1 @@
1
- {"version":3,"file":"vista-view.d.ts","sourceRoot":"","sources":["../../src/lib/vista-view.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAIV,sBAAsB,EACtB,cAAc,EACd,qBAAqB,EACrB,gBAAgB,EAEjB,MAAM,SAAS,CAAC;AAIjB,qBAAa,+BAAgC,SAAQ,KAAK;gBAC5C,OAAO,EAAE,MAAM;CAI5B;AAED,eAAO,MAAM,cAAc;;;;;;;;;cAepB,gBAAgB,CAAC,UAAU,CAAC;CAClC,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE;IAAE,eAAe,EAAE,SAAS,GAAG,IAAI,CAAA;CAEjE,CAAC;AAEF,qBAAa,SAAS;IACpB,OAAO,EAAE,gBAAgB,CAAC;IAC1B,QAAQ,EAAE,UAAU,CAAC,WAAW,CAAC,GAAG,cAAc,EAAE,CAAC;IACrD,eAAe,EAAE,OAAO,CAAC;IACzB,YAAY;gBACM,MAAM,GAAG,IAAI;oBACT,SAAS,GAAG,IAAI;;;;;qBAUvB,MAAM,GAAG,IAAI;qBARb,MAAM;aAcR;YAAE,IAAI,EAAE,OAAO,CAAC;YAAC,IAAI,EAAE,OAAO,CAAA;SAAE;MAG3C;IAEF,OAAO,EAAE,WAAW,GAAG,IAAI,CAAQ;IACnC,iBAAiB,EAAE,WAAW,GAAG,IAAI,CAAQ;IAC7C,cAAc,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,sBAAsB,CAAA;KAAE,CAAM;IAC/D,aAAa,EAAE,qBAAqB,EAAE,GAAG,IAAI,CAAQ;IACrD,YAAY,EAAE,cAAc,EAAE,GAAG,IAAI,CAAQ;IAC7C,SAAS,UAAQ;IACjB,QAAQ,EAAE,gBAAgB,GAAG,KAAK,CAAS;IAE3C,OAAO,CAAC,eAAe,CAIrB;IACF,OAAO,CAAC,qBAAqB,CAAwD;IAErF,OAAO,CAAC,eAAe,CAA6B;IACpD,OAAO,CAAC,SAAS,CAA6C;IAE9D,OAAO,CAAC,SAAS,CAAwC;IACzD,OAAO,CAAC,cAAc,CAAkD;IACxE,OAAO,CAAC,SAAS,CAAwC;IACzD,OAAO,CAAC,QAAQ,CAAsC;IAEtD,OAAO,CAAC,mBAAmB,CAA4C;IACvE,OAAO,CAAC,mBAAmB,CAA4C;IACvE,OAAO,CAAC,iBAAiB,CAA4C;IAErE,OAAO,CAAC,0BAA0B,CAA0C;gBAEhE,QAAQ,EAAE,UAAU,CAAC,WAAW,CAAC,GAAG,cAAc,EAAE,EAAE,OAAO,CAAC,EAAE,gBAAgB;IA2C5F,OAAO,CAAC,gBAAgB,CAA8C;IAEtE,OAAO,CAAC,mBAAmB;YA4Bb,IAAI;IAsHlB,OAAO,CAAC,SAAS;IAiGjB,MAAM,IAAI,IAAI;IAsCd,OAAO,IAAI,IAAI;IA2Df,OAAO,CAAC,SAAS;IAIjB,OAAO,CAAC,SAAS;IAwBjB,OAAO,CAAC,gBAAgB;IA8BxB,OAAO,CAAC,2BAA2B;IAqCnC,OAAO,CAAC,UAAU;IA2ElB,OAAO,CAAC,eAAe;IAMvB,OAAO,CAAC,qBAAqB;IAK7B,OAAO,CAAC,iBAAiB;IA2BzB,OAAO,CAAC,oBAAoB;IA6B5B,OAAO,CAAC,kBAAkB;IAqB1B,IAAI,CAAC,UAAU,GAAE,MAAU,GAAG,IAAI;IA6J5B,KAAK,CAAC,IAAI,UAAO,GAAG,OAAO,CAAC,IAAI,CAAC;IAqEvC,OAAO,IAAI,IAAI;IAWf,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE;QAAE,IAAI,EAAE,OAAO,CAAC;QAAC,IAAI,EAAE,OAAO,CAAA;KAAE,GAAG,IAAI;IAYnE,IAAI,IAAI,IAAI;IAKZ,IAAI,IAAI,IAAI;IAKZ,eAAe,IAAI,MAAM;CAG1B"}
1
+ {"version":3,"file":"vista-view.d.ts","sourceRoot":"","sources":["../../src/lib/vista-view.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAIV,sBAAsB,EACtB,cAAc,EACd,qBAAqB,EACrB,gBAAgB,EAEjB,MAAM,SAAS,CAAC;AAIjB,qBAAa,+BAAgC,SAAQ,KAAK;gBAC5C,OAAO,EAAE,MAAM;CAI5B;AAED,eAAO,MAAM,cAAc;;;;;;;;;cAepB,gBAAgB,CAAC,UAAU,CAAC;CAClC,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE;IAAE,eAAe,EAAE,SAAS,GAAG,IAAI,CAAA;CAEjE,CAAC;AAEF,qBAAa,SAAS;IACpB,OAAO,EAAE,gBAAgB,CAAC;IAC1B,QAAQ,EAAE,UAAU,CAAC,WAAW,CAAC,GAAG,cAAc,EAAE,CAAC;IACrD,eAAe,EAAE,OAAO,CAAC;IACzB,YAAY;gBACM,MAAM,GAAG,IAAI;oBACT,SAAS,GAAG,IAAI;;;;;qBAUvB,MAAM,GAAG,IAAI;qBARb,MAAM;aAcR;YAAE,IAAI,EAAE,OAAO,CAAC;YAAC,IAAI,EAAE,OAAO,CAAA;SAAE;MAG3C;IAEF,OAAO,EAAE,WAAW,GAAG,IAAI,CAAQ;IACnC,iBAAiB,EAAE,WAAW,GAAG,IAAI,CAAQ;IAC7C,cAAc,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,sBAAsB,CAAA;KAAE,CAAM;IAC/D,aAAa,EAAE,qBAAqB,EAAE,GAAG,IAAI,CAAQ;IACrD,YAAY,EAAE,cAAc,EAAE,GAAG,IAAI,CAAQ;IAC7C,SAAS,UAAQ;IACjB,QAAQ,EAAE,gBAAgB,GAAG,KAAK,CAAS;IAE3C,OAAO,CAAC,eAAe,CAIrB;IACF,OAAO,CAAC,qBAAqB,CAAwD;IAErF,OAAO,CAAC,eAAe,CAA6B;IACpD,OAAO,CAAC,SAAS,CAA6C;IAE9D,OAAO,CAAC,SAAS,CAAwC;IACzD,OAAO,CAAC,cAAc,CAAkD;IACxE,OAAO,CAAC,SAAS,CAAwC;IACzD,OAAO,CAAC,QAAQ,CAAsC;IAEtD,OAAO,CAAC,mBAAmB,CAA4C;IACvE,OAAO,CAAC,mBAAmB,CAA4C;IACvE,OAAO,CAAC,iBAAiB,CAA4C;IAErE,OAAO,CAAC,0BAA0B,CAA0C;gBAEhE,QAAQ,EAAE,UAAU,CAAC,WAAW,CAAC,GAAG,cAAc,EAAE,EAAE,OAAO,CAAC,EAAE,gBAAgB;IA2C5F,OAAO,CAAC,mBAAmB;IAsD3B,OAAO,CAAC,gBAAgB,CAA8C;YACxD,IAAI;IA2IlB,OAAO,CAAC,SAAS;IAiGjB,MAAM,IAAI,IAAI;IAsCd,OAAO,IAAI,IAAI;IA2Df,OAAO,CAAC,SAAS;IAIjB,OAAO,CAAC,SAAS;IAwBjB,OAAO,CAAC,gBAAgB;IA8BxB,OAAO,CAAC,2BAA2B;IAqCnC,OAAO,CAAC,UAAU;IA2ElB,OAAO,CAAC,eAAe;IAMvB,OAAO,CAAC,qBAAqB;IAK7B,OAAO,CAAC,iBAAiB;IA2BzB,OAAO,CAAC,oBAAoB;IA6B5B,OAAO,CAAC,kBAAkB;IAqB1B,IAAI,CAAC,UAAU,GAAE,MAAU,GAAG,IAAI;IA6J5B,KAAK,CAAC,IAAI,UAAO,GAAG,OAAO,CAAC,IAAI,CAAC;IAqEvC,OAAO,IAAI,IAAI;IAWf,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE;QAAE,IAAI,EAAE,OAAO,CAAC;QAAC,IAAI,EAAE,OAAO,CAAA;KAAE,GAAG,IAAI;IAYnE,IAAI,IAAI,IAAI;IAKZ,IAAI,IAAI,IAAI;IAKZ,eAAe,IAAI,MAAM;CAG1B"}
@@ -1,4 +1,4 @@
1
- "use strict";var N=Object.defineProperty;var U=(s,t,i)=>t in s?N(s,t,{enumerable:!0,configurable:!0,writable:!0,value:i}):s[t]=i;var g=(s,t,i)=>U(s,typeof t!="symbol"?t+"":t,i);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function R(s){const t=getComputedStyle(s),i=s.getBoundingClientRect();return{objectFit:t.objectFit,borderRadius:t.borderRadius,objectPosition:t.objectPosition,overflow:t.overflow,top:i.top,left:i.left,width:i.width,height:i.height,naturalWidth:s.naturalWidth,naturalHeight:s.naturalHeight}}let P=null;function K(){return P||(window.trustedTypes||(window.trustedTypes={createPolicy:(s,t)=>t}),P=window.trustedTypes.createPolicy("vistaView-policy",{createHTML:s=>s,createScript:()=>{throw new Error("Not implemented")},createScriptURL:()=>{throw new Error("Not implemented")}}),P)}function O(s){const i=K().createHTML(s),n=document.createElement("template");n.innerHTML=i;const e=n.content;return n.remove(),e}function H(s){return s&&!/^0(px|%|r?em|vw|vh|vmin|vmax|cm|mm|in|pt|pc|ex|ch)?$/i.test(s.trim())&&s}function j(s){const i=window.getComputedStyle(s).objectFit||"",{width:n,height:e}=s.getBoundingClientRect(),r=s.naturalWidth,d=s.naturalHeight;if(!i)return{width:n,height:e};if(!r||!d)return{width:n,height:e};const o=r/d,a=n/e;switch(i){case"fill":return{width:n,height:e};case"none":return{width:r,height:d};case"contain":return o>a?{width:n,height:n/o}:{width:e*o,height:e};case"cover":return o<a?{width:n,height:n/o}:{width:e*o,height:e};case"scale-down":{const c={width:r,height:d},l=o>a?{width:n,height:n/o}:{width:e*o,height:e};return l.width<=c.width&&l.height<=c.height?l:c}}return{width:n,height:e}}function q(s){const t=window.innerWidth,i=window.innerHeight,n=s.naturalWidth,e=s.naturalHeight;if(!n||!e)throw console.error("Error",s),new Error("Image natural dimensions are zero");if(n<t&&e<i)return{width:n,height:e};const r=n/e,d=t/i;let o,a;return r>d?(o=t,a=t/r):(a=i,o=i*r),{width:o,height:a}}function k(s,t){const i=window.innerHeight,n=window.innerWidth,e=s,r=t,d=Math.max(0,(e-n)/2)+n/2,o=Math.max(0,(r-i)/2)+i/2,a=-d,c=-o;return{maxDiffX:d,minDiffY:c,maxDiffY:o,minDiffX:a}}const G='<svg viewBox="0 0 24 24"><path d="m15 18-6-6 6-6"/></svg>',J='<svg viewBox="0 0 24 24"><path d="m9 18 6-6-6-6"/></svg>',Q='<svg viewBox="0 0 24 24"><circle cx="11" cy="11" r="8"/><line x1="21" x2="16.65" y1="21" y2="16.65"/><line x1="11" x2="11" y1="8" y2="14"/><line x1="8" x2="14" y1="11" y2="11"/></svg>',tt='<svg viewBox="0 0 24 24"><circle cx="11" cy="11" r="8"/><line x1="21" x2="16.65" y1="21" y2="16.65"/><line x1="8" x2="14" y1="11" y2="11"/></svg>',et='<svg viewBox="0 0 24 24"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>',it='<svg viewBox="0 0 24 24"><path d="M12 15V3"/><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><path d="m7 10 5 5 5-5"/></svg>';function V(){return{name:"download",icon:it,onClick:async s=>{var r;const t=await fetch(s.src),i=await t.blob(),n=t.url,e=document.createElement("a");e.href=URL.createObjectURL(i),e.download=((r=n.split("/").pop())==null?void 0:r.split("?")[0].split("#")[0])||"download",document.body.appendChild(e),e.click(),document.body.removeChild(e)}}}function nt(s){if(typeof s=="string")switch(s){case"zoomIn":return`<button class="vistaview-zoom-in-btn">${Q}</button>`;case"zoomOut":return`<button disabled class="vistaview-zoom-out-btn">${tt}</button>`;case"close":return`<button class="vistaview-close-btn">${et}</button>`;case"indexDisplay":return'<div class="vistaview-index-display"></div>';case"description":return'<div class="vistaview-description"></div>';default:return""}return`<button data-vistaview-custom-control="${s.name}">${s.icon}</button>`}function W(s,t){var l,h;const i=s.imageElm?getComputedStyle(s.imageElm):null,n=(i==null?void 0:i.objectFit)||"",e=((l=s.imageElm)==null?void 0:l.naturalWidth)||"",r=((h=s.imageElm)==null?void 0:h.naturalHeight)||"",d=(i==null?void 0:i.width)||"",o=(i==null?void 0:i.height)||"",a=document.createElement("div");a.className="vistaview-item",a.dataset.vistaviewPos=`${t!==void 0?t:""}`,a.dataset.vistaviewIndex=s.index.toString();const c=O(`<img class="vistaview-image-lowres"
1
+ "use strict";var N=Object.defineProperty;var U=(s,t,i)=>t in s?N(s,t,{enumerable:!0,configurable:!0,writable:!0,value:i}):s[t]=i;var w=(s,t,i)=>U(s,typeof t!="symbol"?t+"":t,i);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function R(s){const t=getComputedStyle(s),i=s.getBoundingClientRect();return{objectFit:t.objectFit,borderRadius:t.borderRadius,objectPosition:t.objectPosition,overflow:t.overflow,top:i.top,left:i.left,width:i.width,height:i.height,naturalWidth:s.naturalWidth,naturalHeight:s.naturalHeight}}let P=null;function K(){return P||(window.trustedTypes||(window.trustedTypes={createPolicy:(s,t)=>t}),P=window.trustedTypes.createPolicy("vistaView-policy",{createHTML:s=>s,createScript:()=>{throw new Error("Not implemented")},createScriptURL:()=>{throw new Error("Not implemented")}}),P)}function O(s){const i=K().createHTML(s),n=document.createElement("template");n.innerHTML=i;const e=n.content;return n.remove(),e}function H(s){return s&&!/^0(px|%|r?em|vw|vh|vmin|vmax|cm|mm|in|pt|pc|ex|ch)?$/i.test(s.trim())&&s}function j(s){const i=window.getComputedStyle(s).objectFit||"",{width:n,height:e}=s.getBoundingClientRect(),r=s.naturalWidth,d=s.naturalHeight;if(!i)return{width:n,height:e};if(!r||!d)return{width:n,height:e};const o=r/d,a=n/e;switch(i){case"fill":return{width:n,height:e};case"none":return{width:r,height:d};case"contain":return o>a?{width:n,height:n/o}:{width:e*o,height:e};case"cover":return o<a?{width:n,height:n/o}:{width:e*o,height:e};case"scale-down":{const c={width:r,height:d},l=o>a?{width:n,height:n/o}:{width:e*o,height:e};return l.width<=c.width&&l.height<=c.height?l:c}}return{width:n,height:e}}function q(s){const t=window.innerWidth,i=window.innerHeight,n=s.naturalWidth,e=s.naturalHeight;if(!n||!e)throw console.error("Error",s),new Error("Image natural dimensions are zero");if(n<t&&e<i)return{width:n,height:e};const r=n/e,d=t/i;let o,a;return r>d?(o=t,a=t/r):(a=i,o=i*r),{width:o,height:a}}function k(s,t){const i=window.innerHeight,n=window.innerWidth,e=s,r=t,d=Math.max(0,(e-n)/2)+n/2,o=Math.max(0,(r-i)/2)+i/2,a=-d,c=-o;return{maxDiffX:d,minDiffY:c,maxDiffY:o,minDiffX:a}}const G='<svg viewBox="0 0 24 24"><path d="m15 18-6-6 6-6"/></svg>',J='<svg viewBox="0 0 24 24"><path d="m9 18 6-6-6-6"/></svg>',Q='<svg viewBox="0 0 24 24"><circle cx="11" cy="11" r="8"/><line x1="21" x2="16.65" y1="21" y2="16.65"/><line x1="11" x2="11" y1="8" y2="14"/><line x1="8" x2="14" y1="11" y2="11"/></svg>',tt='<svg viewBox="0 0 24 24"><circle cx="11" cy="11" r="8"/><line x1="21" x2="16.65" y1="21" y2="16.65"/><line x1="8" x2="14" y1="11" y2="11"/></svg>',et='<svg viewBox="0 0 24 24"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>',it='<svg viewBox="0 0 24 24"><path d="M12 15V3"/><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><path d="m7 10 5 5 5-5"/></svg>';function V(){return{name:"download",icon:it,onClick:async s=>{var r;const t=await fetch(s.src),i=await t.blob(),n=t.url,e=document.createElement("a");e.href=URL.createObjectURL(i),e.download=((r=n.split("/").pop())==null?void 0:r.split("?")[0].split("#")[0])||"download",document.body.appendChild(e),e.click(),document.body.removeChild(e)}}}function nt(s){if(typeof s=="string")switch(s){case"zoomIn":return`<button class="vistaview-zoom-in-btn">${Q}</button>`;case"zoomOut":return`<button disabled class="vistaview-zoom-out-btn">${tt}</button>`;case"close":return`<button class="vistaview-close-btn">${et}</button>`;case"indexDisplay":return'<div class="vistaview-index-display"></div>';case"description":return'<div class="vistaview-description"></div>';default:return""}return`<button data-vistaview-custom-control="${s.name}">${s.icon}</button>`}function W(s,t){var l,h;const i=s.imageElm?getComputedStyle(s.imageElm):null,n=(i==null?void 0:i.objectFit)||"",e=((l=s.imageElm)==null?void 0:l.naturalWidth)||"",r=((h=s.imageElm)==null?void 0:h.naturalHeight)||"",d=(i==null?void 0:i.width)||"",o=(i==null?void 0:i.height)||"",a=document.createElement("div");a.className="vistaview-item",a.dataset.vistaviewPos=`${t!==void 0?t:""}`,a.dataset.vistaviewIndex=s.index.toString();const c=O(`<img class="vistaview-image-lowres"
2
2
  style="${n?`object-fit:${n};`:""}${d?`width:${d};`:""}${o?`height:${o};`:""}"
3
3
  src="${s.thumb||s.src}"
4
4
  alt="${s.alt||""}"
@@ -13,4 +13,4 @@
13
13
  <div class="vistaview-prev-btn vistaview-ui"><button>${G}</button></div>
14
14
  <div class="vistaview-next-btn vistaview-ui"><button>${J}</button></div>
15
15
  </div>
16
- </div>`)}let A=null,M=null,$=null,Z=null;function X(s){T(s);const t=s.imageContainerElm,i=s.elements.length;if(!t)return;let n=0,e=0,r=0,d=0,o=null,a=0,c=!1;A=l=>{l.preventDefault(),l.stopPropagation(),s.isZoomed===!1&&(c=!0,n=l.pageX,e=l.pageY,r=l.pageX,d=l.pageY,a=Date.now(),o=null,t.setPointerCapture(l.pointerId))},M=l=>{if(l.preventDefault(),l.stopPropagation(),s.isZoomed!==!1||!c)return;const h=l.pageX-n,m=l.pageY-e;r=l.pageX,d=l.pageY,Math.abs(h)>=Math.abs(m)&&(o===null||o===!0)?(t.style.setProperty("--vistaview-pointer-diff-x",`${h}px`),o=!0):Math.abs(m)>Math.abs(h)&&(o===null||o===!1)&&(t.style.setProperty("--vistaview-pointer-diff-y",`${m}px`),o=!1)},Z=l=>{if(l.preventDefault(),l.stopPropagation(),t.releasePointerCapture(l.pointerId),s.isZoomed!==!1||!c)return;c=!1,o=null;const h=Array.from(t.querySelectorAll(".vistaview-item"));t.style.removeProperty("--vistaview-pointer-diff-x"),t.style.removeProperty("--vistaview-pointer-diff-y"),h.forEach(m=>{m.style.transition="",m.style.translate=""})},$=l=>{if(l.preventDefault(),l.stopPropagation(),t.releasePointerCapture(l.pointerId),s.isZoomed!==!1||!c)return;c=!1;const h=Array.from(t.querySelectorAll(".vistaview-item")),m=r-n,v=d-e,w=Date.now()-a,u=m/w,p=v/w,f=s.options.touchSpeedThreshold||.5,b=h.find(E=>E.dataset.vistaviewPos==="0"),I=Number(b.dataset.vistaviewIndex);function y(){h[0].removeEventListener("transitionend",y),t.style.removeProperty("--vistaview-pointer-diff-x"),t.style.removeProperty("--vistaview-pointer-diff-y"),h.forEach(E=>{E.style.transition="",E.style.translate=""})}function x(E="0%",L="0%"){h.forEach(D=>{D.style.transition=`translate ${s.options.animationDurationBase*.5}ms ease-out`,D.style.translate=`${E} ${L}`})}if(u<-f||u>f){let E=function(){h[0].removeEventListener("transitionend",E),setTimeout(()=>{const L=s.isReducedMotion;s.isReducedMotion=!0,y(),s.view(u<-f?(I+1)%i:(I-1+i)%i,{next:u<-f,prev:u>f}),s.isReducedMotion=L},100)};x(u<-f?"-100%":"100%"),h[0].addEventListener("transitionend",E)}else p<-f||p>f?(s.close(),x("0%","0%")):(h[0].addEventListener("transitionend",y),x("0%"),u===0&&p===0&&s.zoomIn())},t.addEventListener("pointermove",M),t.addEventListener("pointerup",$),t.addEventListener("pointerdown",A),t.addEventListener("pointercancel",Z)}function T(s){const t=s.imageContainerElm;t&&(M&&t.removeEventListener("pointermove",M),$&&t.removeEventListener("pointerup",$),A&&t.removeEventListener("pointerdown",A),Z&&t.removeEventListener("pointercancel",Z))}const Y=s=>{X(s)},B=({htmlElements:{to:s},index:{to:t},elements:i})=>{i instanceof NodeList&&t!==null&&(i.forEach(n=>n.style.opacity="1"),i[t].style.opacity="0"),s&&s.forEach(n=>{const e=Number(n.dataset.vistaviewPos);e!==0?(n.style.zIndex="1",n.style.left=100*e+"%"):n.style.zIndex="2"})},F=async({htmlElements:{from:s,to:t},images:{to:i},via:{next:n,prev:e},options:r,isReducedMotion:d},o)=>{if(!i)throw new Error("VistaView: images is null in defaultTransition()");if(d)return;const a=s.filter(c=>c.dataset.vistaviewPos==="0"||(n?c.dataset.vistaviewPos==="1":c.dataset.vistaviewPos==="-1"));await new Promise((c,l)=>{let h=0;if(o.aborted){l(new S("Transition aborted"));return}const m=v=>{if(o.aborted)return l(new S("Transition aborted"));if(v.currentTarget.removeEventListener("transitionend",m),h++,h<a.length)return;const w=t==null?void 0:t.find(y=>y.dataset.vistaviewPos==="0"),u=w?Number(w.dataset.vistaviewIndex):0,p=a.find(y=>Number(y.dataset.vistaviewIndex)===u),f=p==null?void 0:p.querySelector(".vistaview-image-highres");if(!f)return l(new Error("current image element not found"));if(!f.classList.contains("vistaview-image-loaded")||f.classList.contains("vistaview-image-settled"))return c(0);let b=0;const I=setInterval(()=>{if(o.aborted)return clearInterval(I),l(new S("Transition aborted"));if(b++,b>r.animationDurationBase/20*1.5)return clearInterval(I),c(0);if(f.classList.contains("vistaview-image-settled"))return w==null||w.classList.add("vistaview-image-settled"),clearInterval(I),c(0)},20)};a.forEach(v=>{v.style.transition=`translate ${r.animationDurationBase*.5}ms ease-out`,v.style.translate=n?"-100%":e?"100%":"0%",v.addEventListener("transitionend",m)})})},_=s=>{s.elements instanceof NodeList&&s.elements.forEach(t=>t.style.opacity="1"),T(s)};class S extends Error{constructor(t){super(t),this.name="VistaViewTransitionAbortedError"}}const z={detectReducedMotion:!0,animationDurationBase:333,zoomStep:500,maxZoomLevel:2,touchSpeedThreshold:.5,preloads:1,keyboardListeners:!0,arrowOnSmallScreens:!1,controls:{topLeft:["indexDisplay"],topRight:["zoomIn","zoomOut",V(),"close"],bottomCenter:["description"]}},C={somethingOpened:null};class ot{constructor(t,i){g(this,"options");g(this,"elements");g(this,"isReducedMotion");g(this,"currentIndex",{_value:null,_vistaView:null,_via:{next:!1,prev:!1},set value(t){var n,e,r;const i=this._value;this._value=t;for(const d in(n=this._vistaView)==null?void 0:n.transitionAbortControllers)(e=this._vistaView)==null||e.transitionAbortControllers[d].abort();(r=this._vistaView)==null||r.swap(i,this._value)},get value(){return this._value},get via(){return this._via},set via(t){this._via=t}});g(this,"rootElm",null);g(this,"imageContainerElm",null);g(this,"customControls",{});g(this,"currentImages",null);g(this,"currentItems",null);g(this,"navActive",!0);g(this,"isZoomed",!1);g(this,"onClickElements",t=>{t.preventDefault();const i=t.currentTarget;i.dataset.vistaviewIndex&&this.open(parseInt(i.dataset.vistaviewIndex))});g(this,"defaultOnClickHandler",t=>t.preventDefault());g(this,"onResizeHandler",null);g(this,"onKeyDown",null);g(this,"userSetup",B);g(this,"userTransition",F);g(this,"userClose",_);g(this,"userInit",Y);g(this,"onZoomedPointerDown",null);g(this,"onZoomedPointerMove",null);g(this,"onZoomedPointerUp",null);g(this,"transitionAbortControllers",{});g(this,"loadImageTimeout",null);this.elements=t,this.currentIndex._vistaView=this,this.options={...z,...i||{},controls:{...z.controls,...(i==null?void 0:i.controls)||{}}},this.options.initFunction&&(this.userInit=this.options.initFunction),this.options.transitionFunction&&(this.userTransition=this.options.transitionFunction),this.options.closeFunction&&(this.userClose=this.options.closeFunction),this.options.initFunction&&(this.userInit=this.options.initFunction),this.isReducedMotion=window.matchMedia("(prefers-reduced-motion: reduce)").matches,this.elements instanceof NodeList&&this.elements.forEach((n,e)=>{n.dataset.vistaviewIndex=e.toString(),n.addEventListener("click",this.defaultOnClickHandler),n.addEventListener("pointerup",this.onClickElements)})}setFullSizeImageDim(t){var r,d;const i=t.getBoundingClientRect(),{width:n,height:e}=q(t);if(n===i.width&&e===i.height)(d=(r=t.parentElement)==null?void 0:r.querySelector(".vistaview-image-lowres"))==null||d.classList.add("vistaview-image--hidden"),t.classList.add("vistaview-image-settled");else{let o=0;const a=()=>{var c,l;o++,!(o<3)&&(t.removeEventListener("transitionend",a),(l=(c=t.parentElement)==null?void 0:c.querySelector(".vistaview-image-lowres"))==null||l.classList.add("vistaview-image--hidden"),t.classList.add("vistaview-image-settled"))};requestAnimationFrame(()=>{t.addEventListener("transitionend",a),t.style.width=`${n}px`,t.style.height=`${e}px`})}}async swap(t,i){var l,h,m;if(!C.somethingOpened||t===i||t===null)return;if(!this.imageContainerElm)throw new Error("VistaView: imageContainerElm is null in swap()");this.setIndexDisplay(),this.clearZoom();const{images:n,positions:e}=this.getCurrentIndexes(i),r=this.getImages(n),d=r.map((v,w)=>W(v,e[w])),o={htmlElements:{from:this.currentItems,to:d},images:{from:this.currentImages,to:r},index:{from:t,to:i},via:this.currentIndex.via,container:this.imageContainerElm,elements:this.elements,isReducedMotion:this.isReducedMotion,navActive:this.navActive,isZoomed:this.isZoomed,options:this.options};this.userSetup(o),(l=this.currentItems)==null||l.forEach(v=>{v.classList.add("vistaview-image--ending")});const a=Math.random().toString(36).substring(2,15)+Math.random().toString(36).substring(2,15);this.transitionAbortControllers[a]=new AbortController;try{await this.userTransition(o,this.transitionAbortControllers[a].signal)}catch(v){v instanceof S||console.warn(v)}delete this.transitionAbortControllers[a];const c=d.find(v=>v.dataset.vistaviewPos==="0");if(c){const v=c.dataset.vistaviewIndex,w=this.currentItems.find(p=>p.dataset.vistaviewIndex===v),u=w==null?void 0:w.querySelector(".vistaview-image-highres");if(u){const p=c.querySelector(".vistaview-image-highres");if(p.setAttribute("class",u.getAttribute("class")||""),p.setAttribute("style",u.getAttribute("style")||""),p.classList.remove("vistaview-image--zooming"),u.classList.contains("vistaview-image-loaded")&&!u.classList.contains("vistaview-image-settled")){const f=u.getBoundingClientRect();p.dataset.vistaviewCurrentWidth=f.width.toString(),p.dataset.vistaviewCurrentHeight=f.height.toString(),p.style.width=`${f.width}px`,p.style.height=`${f.height}px`}}}this.imageContainerElm.innerHTML="",d.forEach(v=>{var f;const w=v.querySelector(".vistaview-image-highres"),u=!!w.classList.contains("vistaview-image-loaded"),p=!!w.classList.contains("vistaview-image-settled");this.imageContainerElm.appendChild(v),u&&!p?this.setFullSizeImageDim(w):u&&p&&((f=v==null?void 0:v.querySelector(".vistaview-image-lowres"))==null||f.classList.add("vistaview-image--hidden"))}),this.setInitialDimPos(),this.currentImages=r,this.currentItems=d,this.setCurrentDescription(),this.updateZoomButtonsVisibility(),(m=(h=this.options).onImageView)==null||m.call(h,o),this.loadImageTimeout&&clearTimeout(this.loadImageTimeout),this.loadImageTimeout=setTimeout(()=>{this.loadImages()},333)}setZoomed(t){var i,n,e,r,d,o;if(this.isZoomed!==t){if(this.isZoomed){let a=this.isZoomed;if(a.classList.remove("vistaview-image--zooming"),this.onZoomedPointerDown&&((i=a.parentElement)==null||i.removeEventListener("pointerdown",this.onZoomedPointerDown),this.onZoomedPointerDown=null),this.onZoomedPointerMove&&((n=a.parentElement)==null||n.removeEventListener("pointermove",this.onZoomedPointerMove),this.onZoomedPointerMove=null),this.onZoomedPointerUp&&((e=a.parentElement)==null||e.removeEventListener("pointerup",this.onZoomedPointerUp),this.onZoomedPointerUp=null),a==null||a.style.removeProperty("--pointer-diff-x"),a==null||a.style.removeProperty("--pointer-diff-y"),setTimeout(()=>{a==null||a.classList.remove("vistaview-image--zooming")},500),this.isZoomed=!1,!t)return}if(t){this.isZoomed=t,t.classList.add("vistaview-image--zooming"),t==null||t.style.setProperty("--pointer-diff-x","0px"),t==null||t.style.setProperty("--pointer-diff-y","0px");let a=!1,c=0,l=0,h=0,m=0,v=0,w=0;this.onZoomedPointerDown=u=>{u.preventDefault(),u.stopPropagation(),a=!0,c=u.pageX,l=u.pageY,t.setPointerCapture(u.pointerId)},this.onZoomedPointerMove=u=>{if(!a)return;u.preventDefault(),v=u.pageX-c,w=u.pageY-l;const p=parseInt((t==null?void 0:t.dataset.vistaviewCurrentWidth)||"0"),f=parseInt((t==null?void 0:t.dataset.vistaviewCurrentHeight)||"0"),{maxDiffX:b,minDiffY:I,maxDiffY:y,minDiffX:x}=k(p,f),E=Math.min(b,Math.max(x,h+v)),L=Math.min(y,Math.max(I,m+w));v=E-h,w=L-m,t==null||t.style.setProperty("--pointer-diff-x",`${E}px`),t==null||t.style.setProperty("--pointer-diff-y",`${L}px`)},this.onZoomedPointerUp=u=>{a=!1,t.releasePointerCapture(u.pointerId),h+=v,m+=w,v=0,w=0},(r=t==null?void 0:t.parentElement)==null||r.addEventListener("pointerdown",this.onZoomedPointerDown),(d=t==null?void 0:t.parentElement)==null||d.addEventListener("pointermove",this.onZoomedPointerMove),(o=t==null?void 0:t.parentElement)==null||o.addEventListener("pointerup",this.onZoomedPointerUp);return}}}zoomIn(){var r,d,o,a,c;const t=(r=this.rootElm)==null?void 0:r.querySelector('[data-vistaview-pos="0"] .vistaview-image-highres'),i=t.width,n=t.height;t.dataset.vistaviewInitialWidth||(t.dataset.vistaviewInitialWidth=i.toString()),t.dataset.vistaviewInitialHeight||(t.dataset.vistaviewInitialHeight=n.toString()),this.setZoomed(t);const e=(t.naturalWidth||0)*this.options.maxZoomLevel;if(i&&e&&i<e){const l=Math.min(i+this.options.zoomStep,e);t.style.width=`${l}px`;const h=l/i*n;t.style.height=`${h}px`,(o=(d=this.rootElm)==null?void 0:d.querySelector("button.vistaview-zoom-out-btn"))==null||o.removeAttribute("disabled"),t.dataset.vistaviewCurrentWidth=l.toString(),t.dataset.vistaviewCurrentHeight=h.toString(),l===e&&((c=(a=this.rootElm)==null?void 0:a.querySelector("button.vistaview-zoom-in-btn"))==null||c.setAttribute("disabled","true"))}}zoomOut(){var d,o,a,c,l;const t=(d=this.rootElm)==null?void 0:d.querySelector('[data-vistaview-pos="0"] .vistaview-image-highres'),i=t.width,n=t.height,e=t.dataset.vistaviewInitialWidth?parseInt(t.dataset.vistaviewInitialWidth):0,r=h=>{h.target===t&&(t.classList.remove("vistaview-image--zooming-out"),t.removeEventListener("transitionend",r))};if(t.addEventListener("transitionend",r),t.classList.add("vistaview-image--zooming-out"),i&&e&&i>e){const h=Math.max(i-this.options.zoomStep,e);t.style.width=`${h}px`;const m=h/i*n;t.style.height=`${m}px`,(a=(o=this.rootElm)==null?void 0:o.querySelector("button.vistaview-zoom-in-btn"))==null||a.removeAttribute("disabled"),t.dataset.vistaviewCurrentWidth=h.toString(),t.dataset.vistaviewCurrentHeight=m.toString();const{maxDiffX:v,minDiffY:w,maxDiffY:u,minDiffX:p}=k(h,m);let f=parseInt((t==null?void 0:t.style.getPropertyValue("--pointer-diff-x").replace("px",""))||"0"),b=parseInt((t==null?void 0:t.style.getPropertyValue("--pointer-diff-y").replace("px",""))||"0");f=Math.min(v,Math.max(p,f)),b=Math.min(u,Math.max(w,b)),t==null||t.style.setProperty("--pointer-diff-x",`${f}px`),t==null||t.style.setProperty("--pointer-diff-y",`${b}px`),h===e&&((l=(c=this.rootElm)==null?void 0:c.querySelector("button.vistaview-zoom-out-btn"))==null||l.setAttribute("disabled","true"),t.removeAttribute("data-vistaview-current-width"),t.removeAttribute("data-vistaview-current-height"),t.removeAttribute("data-vistaview-initial-width"),t.removeAttribute("data-vistaview-initial-height"),this.setZoomed(!1))}}clearZoom(){}getImages(t){return t.map((i,n)=>{const e=this.elements[i];if(e instanceof HTMLElement){const r=e.querySelector("img"),d=e.getAttribute("href")||"",o=e.getAttribute("src")||"",a=e.dataset.vistaviewSrc||d||o||(r==null?void 0:r.src)||"",c=e.dataset.vistaviewAlt||e.getAttribute("alt")||(r==null?void 0:r.alt)||"",l=e.dataset.vistaviewThumb||(r==null?void 0:r.src)||d||o||"";return{index:t[n],src:a,alt:c,thumb:l,imageElm:e instanceof HTMLImageElement?e:r,anchorElm:e instanceof HTMLAnchorElement?e:void 0}}else return{index:t[n],...e}})}setInitialDimPos(){var c,l;if(!this.rootElm)return;const t=(c=this.rootElm.querySelector('[data-vistaview-pos="0"]'))==null?void 0:c.dataset.vistaviewIndex,i=((l=this.currentImages)==null?void 0:l.find(h=>h.index===Number(t)))||null;if(!i)return;const n=i.imageElm?R(i.imageElm):void 0,e=i.anchorElm?R(i.anchorElm):void 0,r=(e==null?void 0:e.width)||(n==null?void 0:n.width)||0,d=(e==null?void 0:e.height)||(n==null?void 0:n.height)||0,o=((e==null?void 0:e.left)||(n==null?void 0:n.left)||0)+r/2,a=((e==null?void 0:e.top)||(n==null?void 0:n.top)||0)+d/2;this.rootElm.style.setProperty("--vistaview-container-initial-width",r+"px"),this.rootElm.style.setProperty("--vistaview-container-initial-height",d+"px"),this.rootElm.style.setProperty("--vistaview-container-initial-top",a+"px"),this.rootElm.style.setProperty("--vistaview-container-initial-left",o+"px"),this.rootElm.style.setProperty("--vistaview-image-border-radius",H(e==null?void 0:e.borderRadius)||H(n==null?void 0:n.borderRadius)||"0px")}updateZoomButtonsVisibility(){var e;const t=(e=this.rootElm)==null?void 0:e.querySelector('[data-vistaview-pos="0"] img.vistaview-image-highres');if(!t)return;const i=this;function n(){var l,h;const r=(l=i.rootElm)==null?void 0:l.querySelector("button.vistaview-zoom-in-btn"),d=(h=i.rootElm)==null?void 0:h.querySelector("button.vistaview-zoom-out-btn"),o=parseInt(t.style.width)||t.width,a=t.naturalWidth*i.options.maxZoomLevel,c=o<a&&a>0;r&&(r.style.display=c?"":"none"),d&&(d.style.display=c?"":"none")}t.complete&&t.naturalWidth>0?n():t.addEventListener("load",n)}loadImages(){if(!this.rootElm)return;this.rootElm.querySelectorAll(".vistaview-image-highres:not(.vistaview-image-loaded)").forEach((i,n)=>{const e=i,d=this.currentImages[n].imageElm,o={w:0,h:0};if(d){const{width:c,height:l}=j(d);o.w=Math.min(d.width,c),o.h=Math.min(d.height,l)}const a=()=>{var l,h;if((l=e.parentElement)!=null&&l.classList.contains("vistaview-image--ending"))return;const c=()=>{var m;o.w&&o.h&&(e.style.width=`${o.w}px`,e.style.height=`${o.h}px`,e.style.setProperty("--vistaview-fitted-width",`${o.w}px`),e.style.setProperty("--vistaview-fitted-height",`${o.h}px`)),e.classList.add("vistaview-image-loaded"),e.width=e.naturalWidth,e.height=e.naturalHeight,setTimeout(()=>{var v;(v=e.parentElement)!=null&&v.classList.contains("vistaview-image--ending")||this.setFullSizeImageDim(e)},100),(m=i.parentElement)!=null&&m.matches('[data-vistaview-pos="0"]')&&this.updateZoomButtonsVisibility()};if((h=this.rootElm)!=null&&h.classList.contains("vistaview--opened"))c();else{const m=setInterval(()=>{var v;(v=this.rootElm)!=null&&v.classList.contains("vistaview--opened")&&(clearInterval(m),c())},50)}};e.complete&&e.naturalWidth>0?a():e.onload=a})}setIndexDisplay(){this.elements.length!==1&&(this.rootElm.querySelector(".vistaview-index-display").textContent=`${this.currentIndex.value+1} / ${this.elements.length}`)}setCurrentDescription(){this.rootElm.querySelector(".vistaview-description").textContent=(this.currentImages[1]||this.currentImages[0]).alt||""}getCurrentIndexes(t){const i=this.options.preloads,n=this.elements.length,e=n<1||!i?[t]:[...new Set([...Array.from({length:i},(d,o)=>((t-i+o)%n+n)%n),t,...Array.from({length:i},(d,o)=>(t+1+o)%n)])],r=n<1||!i?[0]:e.map((d,o)=>o-Math.floor(e.length/2));return{images:e,positions:r}}setKeyboardListeners(){this.onKeyDown=t=>{switch(t.key){case"ArrowLeft":t.preventDefault(),this.prev();break;case"ArrowRight":t.preventDefault(),this.next();break;case"ArrowUp":t.preventDefault(),this.zoomIn();break;case"ArrowDown":t.preventDefault(),this.zoomOut();break;case"Escape":t.preventDefault(),this.close();break}},window.addEventListener("keydown",this.onKeyDown)}setResizeListeners(){this.onResizeHandler=()=>{var i;this.setInitialDimPos();const t=(i=this.rootElm)==null?void 0:i.querySelectorAll(".vistaview-image-highres.vistaview-image-loaded");t==null||t.forEach(n=>{const e=n,{width:r,height:d}=q(e);e.classList.contains("vistaview-image--zooming")?(e.dataset.vistaviewInitialWidth=r.toString(),e.dataset.vistaviewInitialHeight=d.toString()):(e.style.width=`${r}px`,e.style.height=`${d}px`)})},window.addEventListener("resize",this.onResizeHandler)}open(t=0){var o,a,c,l,h,m,v,w,u,p,f,b,I;if(C.somethingOpened){console.error("VistaView: another instance is already opened. Returning.");return}if(C.somethingOpened=this,this.currentIndex._value=t,document.body.prepend(st({controls:this.options.controls,isReducedMotion:this.isReducedMotion})),this.rootElm=document.querySelector("#vistaview-root"),this.imageContainerElm=((o=this.rootElm)==null?void 0:o.querySelector(".vistaview-image-container"))||null,!this.rootElm||!this.imageContainerElm)throw C.somethingOpened=null,new Error("Failed to create VistaView element");this.options.arrowOnSmallScreens||this.rootElm.classList.add("vistaview-no-arrows-sm");const{images:i,positions:n}=this.getCurrentIndexes(t);this.currentImages=this.getImages(i);const e=this.currentImages.map((y,x)=>W(y,n[x]));this.currentItems=e;const r={htmlElements:{from:null,to:this.currentItems},images:{from:null,to:this.currentImages},index:{from:null,to:t},via:this.currentIndex.via,container:this.imageContainerElm,elements:this.elements,isReducedMotion:this.isReducedMotion,navActive:this.navActive,isZoomed:this.isZoomed,options:this.options};this.userSetup(r),this.imageContainerElm.innerHTML="",this.currentItems.forEach(y=>{this.imageContainerElm.appendChild(y)});let d=0;this.rootElm.addEventListener("animationend",y=>{var x;y.currentTarget===this.rootElm&&(d++,d>=2&&((x=this.rootElm)==null||x.classList.add("vistaview--opened")))}),(a=this.rootElm.querySelector(".vistaview-close-btn"))==null||a.addEventListener("click",()=>this.close()),(c=this.rootElm.querySelector(".vistaview-zoom-in-btn"))==null||c.addEventListener("click",()=>this.zoomIn()),(l=this.rootElm.querySelector(".vistaview-zoom-out-btn"))==null||l.addEventListener("click",()=>this.zoomOut()),(h=this.rootElm.querySelector(".vistaview-prev-btn>button"))==null||h.addEventListener("click",()=>this.prev()),(m=this.rootElm.querySelector(".vistaview-next-btn>button"))==null||m.addEventListener("click",()=>this.next()),[...this.options.controls.topLeft||[],...this.options.controls.topRight||[],...this.options.controls.topCenter||[],...this.options.controls.bottomCenter||[],...this.options.controls.bottomLeft||[],...this.options.controls.bottomRight||[]].forEach(y=>{typeof y!="string"&&(this.customControls[y.name]=y)}),this.rootElm.querySelectorAll("button[data-vistaview-custom-control]").forEach(y=>{y.addEventListener("click",x=>{const E=this.customControls[x.currentTarget.dataset.vistaviewCustomControl],L=this.currentImages.find(D=>D.index===this.currentIndex.value);E&&L&&(E.onClick.constructor.name==="AsyncFunction"?(y.classList.add("vistaview-button--loading"),E.onClick(L).finally(()=>{y.classList.remove("vistaview-button--loading")})):E.onClick(L))})}),this.options.animationDurationBase&&this.rootElm.style.setProperty("--vistaview-animation-duration",`${this.options.animationDurationBase}`),this.options.initialZIndex!==void 0&&this.rootElm.style.setProperty("--vistaview-initial-z-index",`${this.options.initialZIndex}`),this.setInitialDimPos(),this.setResizeListeners(),this.options.keyboardListeners&&this.setKeyboardListeners(),this.elements.length===1&&((v=this.rootElm.querySelector(".vistaview-prev-btn"))==null||v.classList.add("vistaview-ui--none"),(w=this.rootElm.querySelector(".vistaview-next-btn"))==null||w.classList.add("vistaview-ui--none"),(u=this.rootElm.querySelector(".vistaview-index-display"))==null||u.classList.add("vistaview-ui--none")),this.rootElm&&this.rootElm.classList.add("vistaview--initialized"),this.loadImages(),this.setCurrentDescription(),this.setIndexDisplay(),this.userInit(this),(f=(p=this.options).onOpen)==null||f.call(p,r),(I=(b=this.options).onImageView)==null||I.call(b,r)}async close(t=!0){var n,e,r;if(C.somethingOpened!==this)return;t&&((n=this.rootElm)==null||n.classList.add("vistaview--closing"),await new Promise(d=>{var a;let o;(a=this.rootElm)==null||a.addEventListener("transitionend",c=>{c.currentTarget===this.rootElm&&(o&&clearTimeout(o),o=setTimeout(()=>{d()},333))})}));const i={htmlElements:{from:this.currentItems,to:null},images:{from:this.currentImages,to:null},index:{from:this.currentIndex.value,to:null},container:this.imageContainerElm,elements:this.elements,via:{prev:!1,next:!1},isReducedMotion:this.isReducedMotion,navActive:this.navActive,isZoomed:this.isZoomed,options:this.options};this.userClose(this),(r=(e=this.options).onClose)==null||r.call(e,i),document.body.removeChild(this.rootElm),this.currentIndex._value=null,this.currentIndex._via={next:!1,prev:!1},this.rootElm=null,this.imageContainerElm=null,this.currentImages=null,this.currentItems=null,this.navActive=!0,this.onResizeHandler&&(window.removeEventListener("resize",this.onResizeHandler),this.onResizeHandler=null),this.onKeyDown&&(window.removeEventListener("keydown",this.onKeyDown),this.onKeyDown=null),(this.onZoomedPointerDown||this.onZoomedPointerMove||this.onZoomedPointerUp)&&(this.setZoomed(!1),this.onZoomedPointerDown=null,this.onZoomedPointerMove=null,this.onZoomedPointerUp=null);for(const d in this.transitionAbortControllers)this.transitionAbortControllers[d].abort();this.transitionAbortControllers={},C.somethingOpened=null}destroy(){this.close(!1),this.elements instanceof NodeList&&this.elements.forEach(t=>{t.dataset.vistaviewIndex&&delete t.dataset.vistaviewIndex,t.removeEventListener("click",this.defaultOnClickHandler),t.removeEventListener("pointerup",this.onClickElements)})}view(t,i){C.somethingOpened===this&&this.navActive&&(t<0&&(t=this.elements.length-1),t>=this.elements.length&&(t=0),this.currentIndex.via=i||{next:!1,prev:!1},this.currentIndex.value=t)}next(){C.somethingOpened===this&&this.view(this.currentIndex.value+1,{next:!0,prev:!1})}prev(){C.somethingOpened===this&&this.view(this.currentIndex.value-1,{next:!1,prev:!0})}getCurrentIndex(){return C.somethingOpened===this?this.currentIndex.value:-1}}function rt(s){let t=null;if(typeof s=="string"?t=document.querySelectorAll(s):s instanceof NodeList&&(t=s),t)for(let i=0;i<t.length;i++){const n=t[i];if(!(n.dataset.vistaviewSrc||n.getAttribute("href")||n.getAttribute("src")||""))return`Element at index ${i} is missing 'src' / 'data-vistaview-src' / 'href' attribute.`}else{const i=s;for(let n=0;n<i.length;n++)if(!i[n].src)return`Element at index ${n} is missing 'src' attribute.`}return t||s}function at({elements:s,...t}){if(!s)throw new Error("No elements");let i=rt(s);if(typeof i=="string")return console.error(i),console.warn("VistaView: silently returning."),null;const n=new ot(i,t);return{open:(e=0)=>n.open(e),close:()=>n.close(),next:()=>n.next(),prev:()=>n.prev(),destroy:()=>n.destroy(),getCurrentIndex:()=>n.getCurrentIndex(),view:e=>{n.view(e)}}}exports.DefaultOptions=z;exports.VistaViewTransitionAbortedError=S;exports.defaultClose=_;exports.defaultInit=Y;exports.defaultSetup=B;exports.defaultTransition=F;exports.removeTouchActions=T;exports.setTouchActions=X;exports.vistaView=at;exports.vistaViewDownload=V;
16
+ </div>`)}let A=null,M=null,$=null,Z=null;function X(s){T(s);const t=s.imageContainerElm,i=s.elements.length;if(!t)return;let n=0,e=0,r=0,d=0,o=null,a=0,c=!1;A=l=>{l.preventDefault(),l.stopPropagation(),s.isZoomed===!1&&(c=!0,n=l.pageX,e=l.pageY,r=l.pageX,d=l.pageY,a=Date.now(),o=null,t.setPointerCapture(l.pointerId))},M=l=>{if(l.preventDefault(),l.stopPropagation(),s.isZoomed!==!1||!c)return;const h=l.pageX-n,v=l.pageY-e;r=l.pageX,d=l.pageY,Math.abs(h)>=Math.abs(v)&&(o===null||o===!0)?(t.style.setProperty("--vistaview-pointer-diff-x",`${h}px`),o=!0):Math.abs(v)>Math.abs(h)&&(o===null||o===!1)&&(t.style.setProperty("--vistaview-pointer-diff-y",`${v}px`),o=!1)},Z=l=>{if(l.preventDefault(),l.stopPropagation(),t.releasePointerCapture(l.pointerId),s.isZoomed!==!1||!c)return;c=!1,o=null;const h=Array.from(t.querySelectorAll(".vistaview-item"));t.style.removeProperty("--vistaview-pointer-diff-x"),t.style.removeProperty("--vistaview-pointer-diff-y"),h.forEach(v=>{v.style.transition="",v.style.translate=""})},$=l=>{if(l.preventDefault(),l.stopPropagation(),t.releasePointerCapture(l.pointerId),s.isZoomed!==!1||!c)return;c=!1;const h=Array.from(t.querySelectorAll(".vistaview-item")),v=r-n,f=d-e,m=Date.now()-a,u=v/m,y=f/m,g=s.options.touchSpeedThreshold||.5,b=h.find(E=>E.dataset.vistaviewPos==="0"),I=Number(b.dataset.vistaviewIndex);function p(){h[0].removeEventListener("transitionend",p),t.style.removeProperty("--vistaview-pointer-diff-x"),t.style.removeProperty("--vistaview-pointer-diff-y"),h.forEach(E=>{E.style.transition="",E.style.translate=""})}function x(E="0%",L="0%"){h.forEach(S=>{S.style.transition=`translate ${s.options.animationDurationBase*.5}ms ease-out`,S.style.translate=`${E} ${L}`})}if(u<-g||u>g){let E=function(){h[0].removeEventListener("transitionend",E),setTimeout(()=>{const L=s.isReducedMotion;s.isReducedMotion=!0,p(),s.view(u<-g?(I+1)%i:(I-1+i)%i,{next:u<-g,prev:u>g}),s.isReducedMotion=L},100)};x(u<-g?"-100%":"100%"),h[0].addEventListener("transitionend",E)}else y<-g||y>g?(s.close(),x("0%","0%")):(h[0].addEventListener("transitionend",p),x("0%"),u===0&&y===0&&s.zoomIn())},t.addEventListener("pointermove",M),t.addEventListener("pointerup",$),t.addEventListener("pointerdown",A),t.addEventListener("pointercancel",Z)}function T(s){const t=s.imageContainerElm;t&&(M&&t.removeEventListener("pointermove",M),$&&t.removeEventListener("pointerup",$),A&&t.removeEventListener("pointerdown",A),Z&&t.removeEventListener("pointercancel",Z))}const Y=s=>{X(s)},B=({htmlElements:{to:s},index:{to:t},elements:i})=>{i instanceof NodeList&&t!==null&&(i.forEach(n=>n.style.opacity="1"),i[t].style.opacity="0"),s&&s.forEach(n=>{const e=Number(n.dataset.vistaviewPos);e!==0?(n.style.zIndex="1",n.style.left=100*e+"%"):n.style.zIndex="2"})},F=async({htmlElements:{from:s,to:t},images:{to:i},via:{next:n,prev:e},options:r,isReducedMotion:d},o)=>{if(!i)throw new Error("VistaView: images is null in defaultTransition()");if(d)return;const a=s.filter(c=>c.dataset.vistaviewPos==="0"||(n?c.dataset.vistaviewPos==="1":c.dataset.vistaviewPos==="-1"));await new Promise((c,l)=>{let h=0;if(o.aborted){l(new D("Transition aborted"));return}const v=f=>{if(o.aborted)return l(new D("Transition aborted"));if(f.currentTarget.removeEventListener("transitionend",v),h++,h<a.length)return;const m=t==null?void 0:t.find(p=>p.dataset.vistaviewPos==="0"),u=m?Number(m.dataset.vistaviewIndex):0,y=a.find(p=>Number(p.dataset.vistaviewIndex)===u),g=y==null?void 0:y.querySelector(".vistaview-image-highres");if(!g)return l(new Error("current image element not found"));if(!g.classList.contains("vistaview-image-loaded")||g.classList.contains("vistaview-image-settled"))return c(0);let b=0;const I=setInterval(()=>{if(o.aborted)return clearInterval(I),l(new D("Transition aborted"));if(b++,b>r.animationDurationBase/20*1.5)return clearInterval(I),c(0);if(g.classList.contains("vistaview-image-settled"))return m==null||m.classList.add("vistaview-image-settled"),clearInterval(I),c(0)},20)};a.forEach(f=>{f.style.transition=`translate ${r.animationDurationBase*.5}ms ease-out`,f.style.translate=n?"-100%":e?"100%":"0%",f.addEventListener("transitionend",v)})})},_=s=>{s.elements instanceof NodeList&&s.elements.forEach(t=>t.style.opacity="1"),T(s)};class D extends Error{constructor(t){super(t),this.name="VistaViewTransitionAbortedError"}}const z={detectReducedMotion:!0,animationDurationBase:333,zoomStep:500,maxZoomLevel:2,touchSpeedThreshold:.5,preloads:1,keyboardListeners:!0,arrowOnSmallScreens:!1,controls:{topLeft:["indexDisplay"],topRight:["zoomIn","zoomOut",V(),"close"],bottomCenter:["description"]}},C={somethingOpened:null};class ot{constructor(t,i){w(this,"options");w(this,"elements");w(this,"isReducedMotion");w(this,"currentIndex",{_value:null,_vistaView:null,_via:{next:!1,prev:!1},set value(t){var n,e,r;const i=this._value;this._value=t;for(const d in(n=this._vistaView)==null?void 0:n.transitionAbortControllers)(e=this._vistaView)==null||e.transitionAbortControllers[d].abort();(r=this._vistaView)==null||r.swap(i,this._value)},get value(){return this._value},get via(){return this._via},set via(t){this._via=t}});w(this,"rootElm",null);w(this,"imageContainerElm",null);w(this,"customControls",{});w(this,"currentImages",null);w(this,"currentItems",null);w(this,"navActive",!0);w(this,"isZoomed",!1);w(this,"onClickElements",t=>{t.preventDefault();const i=t.currentTarget;i.dataset.vistaviewIndex&&this.open(parseInt(i.dataset.vistaviewIndex))});w(this,"defaultOnClickHandler",t=>t.preventDefault());w(this,"onResizeHandler",null);w(this,"onKeyDown",null);w(this,"userSetup",B);w(this,"userTransition",F);w(this,"userClose",_);w(this,"userInit",Y);w(this,"onZoomedPointerDown",null);w(this,"onZoomedPointerMove",null);w(this,"onZoomedPointerUp",null);w(this,"transitionAbortControllers",{});w(this,"loadImageTimeout",null);this.elements=t,this.currentIndex._vistaView=this,this.options={...z,...i||{},controls:{...z.controls,...(i==null?void 0:i.controls)||{}}},this.options.initFunction&&(this.userInit=this.options.initFunction),this.options.transitionFunction&&(this.userTransition=this.options.transitionFunction),this.options.closeFunction&&(this.userClose=this.options.closeFunction),this.options.initFunction&&(this.userInit=this.options.initFunction),this.isReducedMotion=window.matchMedia("(prefers-reduced-motion: reduce)").matches,this.elements instanceof NodeList&&this.elements.forEach((n,e)=>{n.dataset.vistaviewIndex=e.toString(),n.addEventListener("click",this.defaultOnClickHandler),n.addEventListener("pointerup",this.onClickElements)})}setFullSizeImageDim(t){var r,d;const i=t.getBoundingClientRect(),{width:n,height:e}=q(t);if(n===i.width&&e===i.height)(d=(r=t.parentElement)==null?void 0:r.querySelector(".vistaview-image-lowres"))==null||d.classList.add("vistaview-image--hidden"),t.classList.add("vistaview-image-settled");else{let o=0;const a=()=>{var c,l;o++,!(o<3)&&(t.removeEventListener("transitionend",a),(l=(c=t.parentElement)==null?void 0:c.querySelector(".vistaview-image-lowres"))==null||l.classList.add("vistaview-image--hidden"),t.classList.add("vistaview-image-settled"))};requestAnimationFrame(()=>{t.addEventListener("transitionend",a),t.style.width=`${n}px`,t.style.height=`${e}px`})}}async swap(t,i){var l,h;if(!C.somethingOpened||t===i||t===null)return;if(!this.imageContainerElm)throw new Error("VistaView: imageContainerElm is null in swap()");this.setIndexDisplay(),this.clearZoom();const{images:n,positions:e}=this.getCurrentIndexes(i),r=this.getImages(n),d=r.map((v,f)=>W(v,e[f])),o={htmlElements:{from:this.currentItems,to:d},images:{from:this.currentImages,to:r},index:{from:t,to:i},via:this.currentIndex.via,container:this.imageContainerElm,elements:this.elements,isReducedMotion:this.isReducedMotion,navActive:this.navActive,isZoomed:this.isZoomed,options:this.options};this.userSetup(o);const a=Math.random().toString(36).substring(2,15)+Math.random().toString(36).substring(2,15);this.transitionAbortControllers[a]=new AbortController;try{await this.userTransition(o,this.transitionAbortControllers[a].signal)}catch(v){v instanceof D||console.warn(v)}const c=d.find(v=>v.dataset.vistaviewPos==="0");if(c){const v=c.dataset.vistaviewIndex,f=this.currentItems.find(u=>u.dataset.vistaviewIndex===v),m=f==null?void 0:f.querySelector(".vistaview-image-highres");if(m){const u=c.querySelector(".vistaview-image-highres");if(u.setAttribute("class",m.getAttribute("class")||""),u.setAttribute("style",m.getAttribute("style")||""),u.classList.remove("vistaview-image--zooming"),m.classList.contains("vistaview-image-loaded")&&!m.classList.contains("vistaview-image-settled")){const y=m.getBoundingClientRect();u.style.width=`${y.width}px`,u.style.height=`${y.height}px`}}}delete this.transitionAbortControllers[a],this.imageContainerElm.innerHTML="",d.forEach(v=>{var y;const f=v.querySelector(".vistaview-image-highres"),m=!!f.classList.contains("vistaview-image-loaded"),u=!!f.classList.contains("vistaview-image-settled");this.imageContainerElm.appendChild(v),m&&!u?this.setFullSizeImageDim(f):m&&u&&((y=v==null?void 0:v.querySelector(".vistaview-image-lowres"))==null||y.classList.add("vistaview-image--hidden"))}),this.setInitialDimPos(),this.currentImages=r,this.currentItems=d,this.setCurrentDescription(),this.updateZoomButtonsVisibility(),(h=(l=this.options).onImageView)==null||h.call(l,o),this.loadImageTimeout&&clearTimeout(this.loadImageTimeout),this.loadImageTimeout=setTimeout(()=>{this.loadImages()},333)}setZoomed(t){var i,n,e,r,d,o;if(this.isZoomed!==t){if(this.isZoomed){let a=this.isZoomed;if(a.classList.remove("vistaview-image--zooming"),this.onZoomedPointerDown&&((i=a.parentElement)==null||i.removeEventListener("pointerdown",this.onZoomedPointerDown),this.onZoomedPointerDown=null),this.onZoomedPointerMove&&((n=a.parentElement)==null||n.removeEventListener("pointermove",this.onZoomedPointerMove),this.onZoomedPointerMove=null),this.onZoomedPointerUp&&((e=a.parentElement)==null||e.removeEventListener("pointerup",this.onZoomedPointerUp),this.onZoomedPointerUp=null),a==null||a.style.removeProperty("--pointer-diff-x"),a==null||a.style.removeProperty("--pointer-diff-y"),setTimeout(()=>{a==null||a.classList.remove("vistaview-image--zooming")},500),this.isZoomed=!1,!t)return}if(t){this.isZoomed=t,t.classList.add("vistaview-image--zooming"),t==null||t.style.setProperty("--pointer-diff-x","0px"),t==null||t.style.setProperty("--pointer-diff-y","0px");let a=!1,c=0,l=0,h=0,v=0,f=0,m=0;this.onZoomedPointerDown=u=>{u.preventDefault(),u.stopPropagation(),a=!0,c=u.pageX,l=u.pageY,t.setPointerCapture(u.pointerId)},this.onZoomedPointerMove=u=>{if(!a)return;u.preventDefault(),f=u.pageX-c,m=u.pageY-l;const y=parseInt((t==null?void 0:t.dataset.vistaviewCurrentWidth)||"0"),g=parseInt((t==null?void 0:t.dataset.vistaviewCurrentHeight)||"0"),{maxDiffX:b,minDiffY:I,maxDiffY:p,minDiffX:x}=k(y,g),E=Math.min(b,Math.max(x,h+f)),L=Math.min(p,Math.max(I,v+m));f=E-h,m=L-v,t==null||t.style.setProperty("--pointer-diff-x",`${E}px`),t==null||t.style.setProperty("--pointer-diff-y",`${L}px`)},this.onZoomedPointerUp=u=>{a=!1,t.releasePointerCapture(u.pointerId),h+=f,v+=m,f=0,m=0},(r=t==null?void 0:t.parentElement)==null||r.addEventListener("pointerdown",this.onZoomedPointerDown),(d=t==null?void 0:t.parentElement)==null||d.addEventListener("pointermove",this.onZoomedPointerMove),(o=t==null?void 0:t.parentElement)==null||o.addEventListener("pointerup",this.onZoomedPointerUp);return}}}zoomIn(){var r,d,o,a,c;const t=(r=this.rootElm)==null?void 0:r.querySelector('[data-vistaview-pos="0"] .vistaview-image-highres'),i=t.width,n=t.height;t.dataset.vistaviewInitialWidth||(t.dataset.vistaviewInitialWidth=i.toString()),t.dataset.vistaviewInitialHeight||(t.dataset.vistaviewInitialHeight=n.toString()),this.setZoomed(t);const e=(t.naturalWidth||0)*this.options.maxZoomLevel;if(i&&e&&i<e){const l=Math.min(i+this.options.zoomStep,e);t.style.width=`${l}px`;const h=l/i*n;t.style.height=`${h}px`,(o=(d=this.rootElm)==null?void 0:d.querySelector("button.vistaview-zoom-out-btn"))==null||o.removeAttribute("disabled"),t.dataset.vistaviewCurrentWidth=l.toString(),t.dataset.vistaviewCurrentHeight=h.toString(),l===e&&((c=(a=this.rootElm)==null?void 0:a.querySelector("button.vistaview-zoom-in-btn"))==null||c.setAttribute("disabled","true"))}}zoomOut(){var d,o,a,c,l;const t=(d=this.rootElm)==null?void 0:d.querySelector('[data-vistaview-pos="0"] .vistaview-image-highres'),i=t.width,n=t.height,e=t.dataset.vistaviewInitialWidth?parseInt(t.dataset.vistaviewInitialWidth):0,r=h=>{h.target===t&&(t.classList.remove("vistaview-image--zooming-out"),t.removeEventListener("transitionend",r))};if(t.addEventListener("transitionend",r),t.classList.add("vistaview-image--zooming-out"),i&&e&&i>e){const h=Math.max(i-this.options.zoomStep,e);t.style.width=`${h}px`;const v=h/i*n;t.style.height=`${v}px`,(a=(o=this.rootElm)==null?void 0:o.querySelector("button.vistaview-zoom-in-btn"))==null||a.removeAttribute("disabled"),t.dataset.vistaviewCurrentWidth=h.toString(),t.dataset.vistaviewCurrentHeight=v.toString();const{maxDiffX:f,minDiffY:m,maxDiffY:u,minDiffX:y}=k(h,v);let g=parseInt((t==null?void 0:t.style.getPropertyValue("--pointer-diff-x").replace("px",""))||"0"),b=parseInt((t==null?void 0:t.style.getPropertyValue("--pointer-diff-y").replace("px",""))||"0");g=Math.min(f,Math.max(y,g)),b=Math.min(u,Math.max(m,b)),t==null||t.style.setProperty("--pointer-diff-x",`${g}px`),t==null||t.style.setProperty("--pointer-diff-y",`${b}px`),h===e&&((l=(c=this.rootElm)==null?void 0:c.querySelector("button.vistaview-zoom-out-btn"))==null||l.setAttribute("disabled","true"),t.removeAttribute("data-vistaview-current-width"),t.removeAttribute("data-vistaview-current-height"),t.removeAttribute("data-vistaview-initial-width"),t.removeAttribute("data-vistaview-initial-height"),this.setZoomed(!1))}}clearZoom(){}getImages(t){return t.map((i,n)=>{const e=this.elements[i];if(e instanceof HTMLElement){const r=e.querySelector("img"),d=e.getAttribute("href")||"",o=e.getAttribute("src")||"",a=e.dataset.vistaviewSrc||d||o||(r==null?void 0:r.src)||"",c=e.dataset.vistaviewAlt||e.getAttribute("alt")||(r==null?void 0:r.alt)||"",l=e.dataset.vistaviewThumb||(r==null?void 0:r.src)||d||o||"";return{index:t[n],src:a,alt:c,thumb:l,imageElm:e instanceof HTMLImageElement?e:r,anchorElm:e instanceof HTMLAnchorElement?e:void 0}}else return{index:t[n],...e}})}setInitialDimPos(){var c,l;if(!this.rootElm)return;const t=(c=this.rootElm.querySelector('[data-vistaview-pos="0"]'))==null?void 0:c.dataset.vistaviewIndex,i=((l=this.currentImages)==null?void 0:l.find(h=>h.index===Number(t)))||null;if(!i)return;const n=i.imageElm?R(i.imageElm):void 0,e=i.anchorElm?R(i.anchorElm):void 0,r=(e==null?void 0:e.width)||(n==null?void 0:n.width)||0,d=(e==null?void 0:e.height)||(n==null?void 0:n.height)||0,o=((e==null?void 0:e.left)||(n==null?void 0:n.left)||0)+r/2,a=((e==null?void 0:e.top)||(n==null?void 0:n.top)||0)+d/2;this.rootElm.style.setProperty("--vistaview-container-initial-width",r+"px"),this.rootElm.style.setProperty("--vistaview-container-initial-height",d+"px"),this.rootElm.style.setProperty("--vistaview-container-initial-top",a+"px"),this.rootElm.style.setProperty("--vistaview-container-initial-left",o+"px"),this.rootElm.style.setProperty("--vistaview-image-border-radius",H(e==null?void 0:e.borderRadius)||H(n==null?void 0:n.borderRadius)||"0px")}updateZoomButtonsVisibility(){var e;const t=(e=this.rootElm)==null?void 0:e.querySelector('[data-vistaview-pos="0"] img.vistaview-image-highres');if(!t)return;const i=this;function n(){var l,h;const r=(l=i.rootElm)==null?void 0:l.querySelector("button.vistaview-zoom-in-btn"),d=(h=i.rootElm)==null?void 0:h.querySelector("button.vistaview-zoom-out-btn"),o=parseInt(t.style.width)||t.width,a=t.naturalWidth*i.options.maxZoomLevel,c=o<a&&a>0;r&&(r.style.display=c?"":"none"),d&&(d.style.display=c?"":"none")}t.complete&&t.naturalWidth>0?n():t.addEventListener("load",n)}loadImages(){if(!this.rootElm)return;this.rootElm.querySelectorAll(".vistaview-image-highres:not(.vistaview-image-loaded)").forEach((i,n)=>{const e=i,d=this.currentImages[n].imageElm,o={w:0,h:0};if(d){const{width:c,height:l}=j(d);o.w=Math.min(d.width,c),o.h=Math.min(d.height,l)}const a=()=>{var l;const c=()=>{var h;o.w&&o.h&&(e.style.width=`${o.w}px`,e.style.height=`${o.h}px`,e.style.setProperty("--vistaview-fitted-width",`${o.w}px`),e.style.setProperty("--vistaview-fitted-height",`${o.h}px`)),e.classList.add("vistaview-image-loaded"),e.width=e.naturalWidth,e.height=e.naturalHeight,setTimeout(()=>{this.setFullSizeImageDim(e)},100),(h=i.parentElement)!=null&&h.matches('[data-vistaview-pos="0"]')&&this.updateZoomButtonsVisibility()};if((l=this.rootElm)!=null&&l.classList.contains("vistaview--opened"))c();else{const h=setInterval(()=>{var v;(v=this.rootElm)!=null&&v.classList.contains("vistaview--opened")&&(clearInterval(h),c())},50)}};e.complete&&e.naturalWidth>0?a():e.onload=a})}setIndexDisplay(){this.elements.length!==1&&(this.rootElm.querySelector(".vistaview-index-display").textContent=`${this.currentIndex.value+1} / ${this.elements.length}`)}setCurrentDescription(){this.rootElm.querySelector(".vistaview-description").textContent=(this.currentImages[1]||this.currentImages[0]).alt||""}getCurrentIndexes(t){const i=this.options.preloads,n=this.elements.length,e=n<1||!i?[t]:[...new Set([...Array.from({length:i},(d,o)=>((t-i+o)%n+n)%n),t,...Array.from({length:i},(d,o)=>(t+1+o)%n)])],r=n<1||!i?[0]:e.map((d,o)=>o-Math.floor(e.length/2));return{images:e,positions:r}}setKeyboardListeners(){this.onKeyDown=t=>{switch(t.key){case"ArrowLeft":t.preventDefault(),this.prev();break;case"ArrowRight":t.preventDefault(),this.next();break;case"ArrowUp":t.preventDefault(),this.zoomIn();break;case"ArrowDown":t.preventDefault(),this.zoomOut();break;case"Escape":t.preventDefault(),this.close();break}},window.addEventListener("keydown",this.onKeyDown)}setResizeListeners(){this.onResizeHandler=()=>{var i;this.setInitialDimPos();const t=(i=this.rootElm)==null?void 0:i.querySelectorAll(".vistaview-image-highres.vistaview-image-loaded");t==null||t.forEach(n=>{const e=n,{width:r,height:d}=q(e);e.classList.contains("vistaview-image--zooming")?(e.dataset.vistaviewInitialWidth=r.toString(),e.dataset.vistaviewInitialHeight=d.toString()):(e.style.width=`${r}px`,e.style.height=`${d}px`)})},window.addEventListener("resize",this.onResizeHandler)}open(t=0){var o,a,c,l,h,v,f,m,u,y,g,b,I;if(C.somethingOpened){console.error("VistaView: another instance is already opened. Returning.");return}if(C.somethingOpened=this,this.currentIndex._value=t,document.body.prepend(st({controls:this.options.controls,isReducedMotion:this.isReducedMotion})),this.rootElm=document.querySelector("#vistaview-root"),this.imageContainerElm=((o=this.rootElm)==null?void 0:o.querySelector(".vistaview-image-container"))||null,!this.rootElm||!this.imageContainerElm)throw C.somethingOpened=null,new Error("Failed to create VistaView element");this.options.arrowOnSmallScreens||this.rootElm.classList.add("vistaview-no-arrows-sm");const{images:i,positions:n}=this.getCurrentIndexes(t);this.currentImages=this.getImages(i);const e=this.currentImages.map((p,x)=>W(p,n[x]));this.currentItems=e;const r={htmlElements:{from:null,to:this.currentItems},images:{from:null,to:this.currentImages},index:{from:null,to:t},via:this.currentIndex.via,container:this.imageContainerElm,elements:this.elements,isReducedMotion:this.isReducedMotion,navActive:this.navActive,isZoomed:this.isZoomed,options:this.options};this.userSetup(r),this.imageContainerElm.innerHTML="",this.currentItems.forEach(p=>{this.imageContainerElm.appendChild(p)});let d=0;this.rootElm.addEventListener("animationend",p=>{var x;p.currentTarget===this.rootElm&&(d++,d>=2&&((x=this.rootElm)==null||x.classList.add("vistaview--opened")))}),(a=this.rootElm.querySelector(".vistaview-close-btn"))==null||a.addEventListener("click",()=>this.close()),(c=this.rootElm.querySelector(".vistaview-zoom-in-btn"))==null||c.addEventListener("click",()=>this.zoomIn()),(l=this.rootElm.querySelector(".vistaview-zoom-out-btn"))==null||l.addEventListener("click",()=>this.zoomOut()),(h=this.rootElm.querySelector(".vistaview-prev-btn>button"))==null||h.addEventListener("click",()=>this.prev()),(v=this.rootElm.querySelector(".vistaview-next-btn>button"))==null||v.addEventListener("click",()=>this.next()),[...this.options.controls.topLeft||[],...this.options.controls.topRight||[],...this.options.controls.topCenter||[],...this.options.controls.bottomCenter||[],...this.options.controls.bottomLeft||[],...this.options.controls.bottomRight||[]].forEach(p=>{typeof p!="string"&&(this.customControls[p.name]=p)}),this.rootElm.querySelectorAll("button[data-vistaview-custom-control]").forEach(p=>{p.addEventListener("click",x=>{const E=this.customControls[x.currentTarget.dataset.vistaviewCustomControl],L=this.currentImages.find(S=>S.index===this.currentIndex.value);E&&L&&(E.onClick.constructor.name==="AsyncFunction"?(p.classList.add("vistaview-button--loading"),E.onClick(L).finally(()=>{p.classList.remove("vistaview-button--loading")})):E.onClick(L))})}),this.options.animationDurationBase&&this.rootElm.style.setProperty("--vistaview-animation-duration",`${this.options.animationDurationBase}`),this.options.initialZIndex!==void 0&&this.rootElm.style.setProperty("--vistaview-initial-z-index",`${this.options.initialZIndex}`),this.setInitialDimPos(),this.setResizeListeners(),this.options.keyboardListeners&&this.setKeyboardListeners(),this.elements.length===1&&((f=this.rootElm.querySelector(".vistaview-prev-btn"))==null||f.classList.add("vistaview-ui--none"),(m=this.rootElm.querySelector(".vistaview-next-btn"))==null||m.classList.add("vistaview-ui--none"),(u=this.rootElm.querySelector(".vistaview-index-display"))==null||u.classList.add("vistaview-ui--none")),this.rootElm&&this.rootElm.classList.add("vistaview--initialized"),this.loadImages(),this.setCurrentDescription(),this.setIndexDisplay(),this.userInit(this),(g=(y=this.options).onOpen)==null||g.call(y,r),(I=(b=this.options).onImageView)==null||I.call(b,r)}async close(t=!0){var n,e,r;if(C.somethingOpened!==this)return;t&&((n=this.rootElm)==null||n.classList.add("vistaview--closing"),await new Promise(d=>{var a;let o;(a=this.rootElm)==null||a.addEventListener("transitionend",c=>{c.currentTarget===this.rootElm&&(o&&clearTimeout(o),o=setTimeout(()=>{d()},333))})}));const i={htmlElements:{from:this.currentItems,to:null},images:{from:this.currentImages,to:null},index:{from:this.currentIndex.value,to:null},container:this.imageContainerElm,elements:this.elements,via:{prev:!1,next:!1},isReducedMotion:this.isReducedMotion,navActive:this.navActive,isZoomed:this.isZoomed,options:this.options};this.userClose(this),(r=(e=this.options).onClose)==null||r.call(e,i),document.body.removeChild(this.rootElm),this.currentIndex._value=null,this.currentIndex._via={next:!1,prev:!1},this.rootElm=null,this.imageContainerElm=null,this.currentImages=null,this.currentItems=null,this.navActive=!0,this.onResizeHandler&&(window.removeEventListener("resize",this.onResizeHandler),this.onResizeHandler=null),this.onKeyDown&&(window.removeEventListener("keydown",this.onKeyDown),this.onKeyDown=null),(this.onZoomedPointerDown||this.onZoomedPointerMove||this.onZoomedPointerUp)&&(this.setZoomed(!1),this.onZoomedPointerDown=null,this.onZoomedPointerMove=null,this.onZoomedPointerUp=null);for(const d in this.transitionAbortControllers)this.transitionAbortControllers[d].abort();this.transitionAbortControllers={},C.somethingOpened=null}destroy(){this.close(!1),this.elements instanceof NodeList&&this.elements.forEach(t=>{t.dataset.vistaviewIndex&&delete t.dataset.vistaviewIndex,t.removeEventListener("click",this.defaultOnClickHandler),t.removeEventListener("pointerup",this.onClickElements)})}view(t,i){C.somethingOpened===this&&this.navActive&&(t<0&&(t=this.elements.length-1),t>=this.elements.length&&(t=0),this.currentIndex.via=i||{next:!1,prev:!1},this.currentIndex.value=t)}next(){C.somethingOpened===this&&this.view(this.currentIndex.value+1,{next:!0,prev:!1})}prev(){C.somethingOpened===this&&this.view(this.currentIndex.value-1,{next:!1,prev:!0})}getCurrentIndex(){return C.somethingOpened===this?this.currentIndex.value:-1}}function rt(s){let t=null;if(typeof s=="string"?t=document.querySelectorAll(s):s instanceof NodeList&&(t=s),t)for(let i=0;i<t.length;i++){const n=t[i];if(!(n.dataset.vistaviewSrc||n.getAttribute("href")||n.getAttribute("src")||""))return`Element at index ${i} is missing 'src' / 'data-vistaview-src' / 'href' attribute.`}else{const i=s;for(let n=0;n<i.length;n++)if(!i[n].src)return`Element at index ${n} is missing 'src' attribute.`}return t||s}function at({elements:s,...t}){if(!s)throw new Error("No elements");let i=rt(s);if(typeof i=="string")return console.error(i),console.warn("VistaView: silently returning."),null;const n=new ot(i,t);return{open:(e=0)=>n.open(e),close:()=>n.close(),next:()=>n.next(),prev:()=>n.prev(),destroy:()=>n.destroy(),getCurrentIndex:()=>n.getCurrentIndex(),view:e=>{n.view(e)}}}exports.DefaultOptions=z;exports.VistaViewTransitionAbortedError=D;exports.defaultClose=_;exports.defaultInit=Y;exports.defaultSetup=B;exports.defaultTransition=F;exports.removeTouchActions=T;exports.setTouchActions=X;exports.vistaView=at;exports.vistaViewDownload=V;
package/dist/vistaview.js CHANGED
@@ -1,6 +1,6 @@
1
1
  var X = Object.defineProperty;
2
2
  var Y = (s, t, i) => t in s ? X(s, t, { enumerable: !0, configurable: !0, writable: !0, value: i }) : s[t] = i;
3
- var g = (s, t, i) => Y(s, typeof t != "symbol" ? t + "" : t, i);
3
+ var w = (s, t, i) => Y(s, typeof t != "symbol" ? t + "" : t, i);
4
4
  function z(s) {
5
5
  const t = getComputedStyle(s), i = s.getBoundingClientRect();
6
6
  return {
@@ -16,11 +16,11 @@ function z(s) {
16
16
  naturalHeight: s.naturalHeight
17
17
  };
18
18
  }
19
- let D = null;
19
+ let S = null;
20
20
  function B() {
21
- return D || (window.trustedTypes || (window.trustedTypes = {
21
+ return S || (window.trustedTypes || (window.trustedTypes = {
22
22
  createPolicy: (s, t) => t
23
- }), D = window.trustedTypes.createPolicy("vistaView-policy", {
23
+ }), S = window.trustedTypes.createPolicy("vistaView-policy", {
24
24
  createHTML: (s) => s,
25
25
  // HTML is generated by us, not user input
26
26
  createScript: () => {
@@ -29,7 +29,7 @@ function B() {
29
29
  createScriptURL: () => {
30
30
  throw new Error("Not implemented");
31
31
  }
32
- }), D);
32
+ }), S);
33
33
  }
34
34
  function W(s) {
35
35
  const i = B().createHTML(s), n = document.createElement("template");
@@ -63,7 +63,7 @@ function F(s) {
63
63
  }
64
64
  return { width: n, height: e };
65
65
  }
66
- function H(s) {
66
+ function T(s) {
67
67
  const t = window.innerWidth, i = window.innerHeight, n = s.naturalWidth, e = s.naturalHeight;
68
68
  if (!n || !e)
69
69
  throw console.error("Error", s), new Error("Image natural dimensions are zero");
@@ -79,7 +79,7 @@ function H(s) {
79
79
  height: a
80
80
  };
81
81
  }
82
- function T(s, t) {
82
+ function H(s, t) {
83
83
  const i = window.innerHeight, n = window.innerWidth, e = s, r = t, d = Math.max(0, (e - n) / 2) + n / 2, o = Math.max(0, (r - i) / 2) + i / 2, a = -d, c = -o;
84
84
  return {
85
85
  maxDiffX: d,
@@ -159,46 +159,46 @@ function tt(s) {
159
159
  l.preventDefault(), l.stopPropagation(), s.isZoomed === !1 && (c = !0, n = l.pageX, e = l.pageY, r = l.pageX, d = l.pageY, a = Date.now(), o = null, t.setPointerCapture(l.pointerId));
160
160
  }, $ = (l) => {
161
161
  if (l.preventDefault(), l.stopPropagation(), s.isZoomed !== !1 || !c) return;
162
- const h = l.pageX - n, m = l.pageY - e;
163
- r = l.pageX, d = l.pageY, Math.abs(h) >= Math.abs(m) && (o === null || o === !0) ? (t.style.setProperty("--vistaview-pointer-diff-x", `${h}px`), o = !0) : Math.abs(m) > Math.abs(h) && (o === null || o === !1) && (t.style.setProperty("--vistaview-pointer-diff-y", `${m}px`), o = !1);
162
+ const h = l.pageX - n, v = l.pageY - e;
163
+ r = l.pageX, d = l.pageY, Math.abs(h) >= Math.abs(v) && (o === null || o === !0) ? (t.style.setProperty("--vistaview-pointer-diff-x", `${h}px`), o = !0) : Math.abs(v) > Math.abs(h) && (o === null || o === !1) && (t.style.setProperty("--vistaview-pointer-diff-y", `${v}px`), o = !1);
164
164
  }, Z = (l) => {
165
165
  if (l.preventDefault(), l.stopPropagation(), t.releasePointerCapture(l.pointerId), s.isZoomed !== !1 || !c) return;
166
166
  c = !1, o = null;
167
167
  const h = Array.from(t.querySelectorAll(".vistaview-item"));
168
- t.style.removeProperty("--vistaview-pointer-diff-x"), t.style.removeProperty("--vistaview-pointer-diff-y"), h.forEach((m) => {
169
- m.style.transition = "", m.style.translate = "";
168
+ t.style.removeProperty("--vistaview-pointer-diff-x"), t.style.removeProperty("--vistaview-pointer-diff-y"), h.forEach((v) => {
169
+ v.style.transition = "", v.style.translate = "";
170
170
  });
171
171
  }, M = (l) => {
172
172
  if (l.preventDefault(), l.stopPropagation(), t.releasePointerCapture(l.pointerId), s.isZoomed !== !1 || !c) return;
173
173
  c = !1;
174
- const h = Array.from(t.querySelectorAll(".vistaview-item")), m = r - n, v = d - e, w = Date.now() - a, u = m / w, p = v / w, f = s.options.touchSpeedThreshold || 0.5, x = h.find(
174
+ const h = Array.from(t.querySelectorAll(".vistaview-item")), v = r - n, f = d - e, m = Date.now() - a, u = v / m, y = f / m, g = s.options.touchSpeedThreshold || 0.5, x = h.find(
175
175
  (E) => E.dataset.vistaviewPos === "0"
176
176
  ), I = Number(x.dataset.vistaviewIndex);
177
- function y() {
178
- h[0].removeEventListener("transitionend", y), t.style.removeProperty("--vistaview-pointer-diff-x"), t.style.removeProperty("--vistaview-pointer-diff-y"), h.forEach((E) => {
177
+ function p() {
178
+ h[0].removeEventListener("transitionend", p), t.style.removeProperty("--vistaview-pointer-diff-x"), t.style.removeProperty("--vistaview-pointer-diff-y"), h.forEach((E) => {
179
179
  E.style.transition = "", E.style.translate = "";
180
180
  });
181
181
  }
182
182
  function b(E = "0%", L = "0%") {
183
- h.forEach((S) => {
184
- S.style.transition = `translate ${s.options.animationDurationBase * 0.5}ms ease-out`, S.style.translate = `${E} ${L}`;
183
+ h.forEach((D) => {
184
+ D.style.transition = `translate ${s.options.animationDurationBase * 0.5}ms ease-out`, D.style.translate = `${E} ${L}`;
185
185
  });
186
186
  }
187
- if (u < -f || u > f) {
187
+ if (u < -g || u > g) {
188
188
  let E = function() {
189
189
  h[0].removeEventListener("transitionend", E), setTimeout(() => {
190
190
  const L = s.isReducedMotion;
191
- s.isReducedMotion = !0, y(), s.view(
192
- u < -f ? (I + 1) % i : (I - 1 + i) % i,
191
+ s.isReducedMotion = !0, p(), s.view(
192
+ u < -g ? (I + 1) % i : (I - 1 + i) % i,
193
193
  {
194
- next: u < -f,
195
- prev: u > f
194
+ next: u < -g,
195
+ prev: u > g
196
196
  }
197
197
  ), s.isReducedMotion = L;
198
198
  }, 100);
199
199
  };
200
- b(u < -f ? "-100%" : "100%"), h[0].addEventListener("transitionend", E);
201
- } else p < -f || p > f ? (s.close(), b("0%", "0%")) : (h[0].addEventListener("transitionend", y), b("0%"), u === 0 && p === 0 && s.zoomIn());
200
+ b(u < -g ? "-100%" : "100%"), h[0].addEventListener("transitionend", E);
201
+ } else y < -g || y > g ? (s.close(), b("0%", "0%")) : (h[0].addEventListener("transitionend", p), b("0%"), u === 0 && y === 0 && s.zoomIn());
202
202
  }, t.addEventListener("pointermove", $), t.addEventListener("pointerup", M), t.addEventListener("pointerdown", A), t.addEventListener("pointercancel", Z);
203
203
  }
204
204
  function O(s) {
@@ -234,16 +234,16 @@ const et = (s) => {
234
234
  l(new P("Transition aborted"));
235
235
  return;
236
236
  }
237
- const m = (v) => {
237
+ const v = (f) => {
238
238
  if (o.aborted)
239
239
  return l(new P("Transition aborted"));
240
- if (v.currentTarget.removeEventListener("transitionend", m), h++, h < a.length) return;
241
- const w = t == null ? void 0 : t.find((y) => y.dataset.vistaviewPos === "0"), u = w ? Number(w.dataset.vistaviewIndex) : 0, p = a.find((y) => Number(y.dataset.vistaviewIndex) === u), f = p == null ? void 0 : p.querySelector(
240
+ if (f.currentTarget.removeEventListener("transitionend", v), h++, h < a.length) return;
241
+ const m = t == null ? void 0 : t.find((p) => p.dataset.vistaviewPos === "0"), u = m ? Number(m.dataset.vistaviewIndex) : 0, y = a.find((p) => Number(p.dataset.vistaviewIndex) === u), g = y == null ? void 0 : y.querySelector(
242
242
  ".vistaview-image-highres"
243
243
  );
244
- if (!f)
244
+ if (!g)
245
245
  return l(new Error("current image element not found"));
246
- if (!f.classList.contains("vistaview-image-loaded") || f.classList.contains("vistaview-image-settled"))
246
+ if (!g.classList.contains("vistaview-image-loaded") || g.classList.contains("vistaview-image-settled"))
247
247
  return c(0);
248
248
  let x = 0;
249
249
  const I = setInterval(() => {
@@ -251,12 +251,12 @@ const et = (s) => {
251
251
  return clearInterval(I), l(new P("Transition aborted"));
252
252
  if (x++, x > r.animationDurationBase / 20 * 1.5)
253
253
  return clearInterval(I), c(0);
254
- if (f.classList.contains("vistaview-image-settled"))
255
- return w == null || w.classList.add("vistaview-image-settled"), clearInterval(I), c(0);
254
+ if (g.classList.contains("vistaview-image-settled"))
255
+ return m == null || m.classList.add("vistaview-image-settled"), clearInterval(I), c(0);
256
256
  }, 20);
257
257
  };
258
- a.forEach((v) => {
259
- v.style.transition = `translate ${r.animationDurationBase * 0.5}ms ease-out`, v.style.translate = n ? "-100%" : e ? "100%" : "0%", v.addEventListener("transitionend", m);
258
+ a.forEach((f) => {
259
+ f.style.transition = `translate ${r.animationDurationBase * 0.5}ms ease-out`, f.style.translate = n ? "-100%" : e ? "100%" : "0%", f.addEventListener("transitionend", v);
260
260
  });
261
261
  });
262
262
  }, st = (s) => {
@@ -288,10 +288,10 @@ const k = {
288
288
  };
289
289
  class ot {
290
290
  constructor(t, i) {
291
- g(this, "options");
292
- g(this, "elements");
293
- g(this, "isReducedMotion");
294
- g(this, "currentIndex", {
291
+ w(this, "options");
292
+ w(this, "elements");
293
+ w(this, "isReducedMotion");
294
+ w(this, "currentIndex", {
295
295
  _value: null,
296
296
  _vistaView: null,
297
297
  _via: { next: !1, prev: !1 },
@@ -313,30 +313,53 @@ class ot {
313
313
  this._via = t;
314
314
  }
315
315
  });
316
- g(this, "rootElm", null);
317
- g(this, "imageContainerElm", null);
318
- g(this, "customControls", {});
319
- g(this, "currentImages", null);
320
- g(this, "currentItems", null);
321
- g(this, "navActive", !0);
322
- g(this, "isZoomed", !1);
323
- g(this, "onClickElements", (t) => {
316
+ w(this, "rootElm", null);
317
+ w(this, "imageContainerElm", null);
318
+ w(this, "customControls", {});
319
+ w(this, "currentImages", null);
320
+ w(this, "currentItems", null);
321
+ w(this, "navActive", !0);
322
+ w(this, "isZoomed", !1);
323
+ w(this, "onClickElements", (t) => {
324
324
  t.preventDefault();
325
325
  const i = t.currentTarget;
326
326
  i.dataset.vistaviewIndex && this.open(parseInt(i.dataset.vistaviewIndex));
327
327
  });
328
- g(this, "defaultOnClickHandler", (t) => t.preventDefault());
329
- g(this, "onResizeHandler", null);
330
- g(this, "onKeyDown", null);
331
- g(this, "userSetup", it);
332
- g(this, "userTransition", nt);
333
- g(this, "userClose", st);
334
- g(this, "userInit", et);
335
- g(this, "onZoomedPointerDown", null);
336
- g(this, "onZoomedPointerMove", null);
337
- g(this, "onZoomedPointerUp", null);
338
- g(this, "transitionAbortControllers", {});
339
- g(this, "loadImageTimeout", null);
328
+ w(this, "defaultOnClickHandler", (t) => t.preventDefault());
329
+ w(this, "onResizeHandler", null);
330
+ w(this, "onKeyDown", null);
331
+ w(this, "userSetup", it);
332
+ w(this, "userTransition", nt);
333
+ w(this, "userClose", st);
334
+ w(this, "userInit", et);
335
+ w(this, "onZoomedPointerDown", null);
336
+ w(this, "onZoomedPointerMove", null);
337
+ w(this, "onZoomedPointerUp", null);
338
+ w(this, "transitionAbortControllers", {});
339
+ // weird on iphones
340
+ // private loadImageWaiting = (img: HTMLImageElement): Promise<void> => {
341
+ // return new Promise((resolve) => {
342
+ // const observer = new MutationObserver((mutations) => {
343
+ // mutations.forEach((mutation) => {
344
+ // if (
345
+ // mutation.type === 'attributes' &&
346
+ // mutation.attributeName === 'class' &&
347
+ // (mutation.target as HTMLElement).classList.contains('vistaview-image-settled')
348
+ // ) {
349
+ // console.log('vistaview-image-settled detected')
350
+ // resolve()
351
+ // }
352
+ // });
353
+ // // Start observing
354
+ // observer.observe(img, {
355
+ // attributes: true,
356
+ // attributeOldValue: true,
357
+ // attributeFilter: ['class']
358
+ // });
359
+ // });
360
+ // });
361
+ // };
362
+ w(this, "loadImageTimeout", null);
340
363
  this.elements = t, this.currentIndex._vistaView = this, this.options = {
341
364
  ...k,
342
365
  ...i || {},
@@ -350,7 +373,7 @@ class ot {
350
373
  }
351
374
  setFullSizeImageDim(t) {
352
375
  var r, d;
353
- const i = t.getBoundingClientRect(), { width: n, height: e } = H(t);
376
+ const i = t.getBoundingClientRect(), { width: n, height: e } = T(t);
354
377
  if (n === i.width && e === i.height)
355
378
  (d = (r = t.parentElement) == null ? void 0 : r.querySelector(".vistaview-image-lowres")) == null || d.classList.add("vistaview-image--hidden"), t.classList.add("vistaview-image-settled");
356
379
  else {
@@ -365,12 +388,12 @@ class ot {
365
388
  }
366
389
  }
367
390
  async swap(t, i) {
368
- var l, h, m;
391
+ var l, h;
369
392
  if (!C.somethingOpened || t === i || t === null) return;
370
393
  if (!this.imageContainerElm)
371
394
  throw new Error("VistaView: imageContainerElm is null in swap()");
372
395
  this.setIndexDisplay(), this.clearZoom();
373
- const { images: n, positions: e } = this.getCurrentIndexes(i), r = this.getImages(n), d = r.map((v, w) => q(v, e[w])), o = {
396
+ const { images: n, positions: e } = this.getCurrentIndexes(i), r = this.getImages(n), d = r.map((v, f) => q(v, e[f])), o = {
374
397
  htmlElements: { from: this.currentItems, to: d },
375
398
  images: { from: this.currentImages, to: r },
376
399
  index: { from: t, to: i },
@@ -382,9 +405,7 @@ class ot {
382
405
  isZoomed: this.isZoomed,
383
406
  options: this.options
384
407
  };
385
- this.userSetup(o), (l = this.currentItems) == null || l.forEach((v) => {
386
- v.classList.add("vistaview-image--ending");
387
- });
408
+ this.userSetup(o);
388
409
  const a = Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15);
389
410
  this.transitionAbortControllers[a] = new AbortController();
390
411
  try {
@@ -392,25 +413,24 @@ class ot {
392
413
  } catch (v) {
393
414
  v instanceof P || console.warn(v);
394
415
  }
395
- delete this.transitionAbortControllers[a];
396
416
  const c = d.find((v) => v.dataset.vistaviewPos === "0");
397
417
  if (c) {
398
- const v = c.dataset.vistaviewIndex, w = this.currentItems.find((p) => p.dataset.vistaviewIndex === v), u = w == null ? void 0 : w.querySelector(".vistaview-image-highres");
399
- if (u) {
400
- const p = c.querySelector(
418
+ const v = c.dataset.vistaviewIndex, f = this.currentItems.find((u) => u.dataset.vistaviewIndex === v), m = f == null ? void 0 : f.querySelector(".vistaview-image-highres");
419
+ if (m) {
420
+ const u = c.querySelector(
401
421
  ".vistaview-image-highres"
402
422
  );
403
- if (p.setAttribute("class", u.getAttribute("class") || ""), p.setAttribute("style", u.getAttribute("style") || ""), p.classList.remove("vistaview-image--zooming"), u.classList.contains("vistaview-image-loaded") && !u.classList.contains("vistaview-image-settled")) {
404
- const f = u.getBoundingClientRect();
405
- p.dataset.vistaviewCurrentWidth = f.width.toString(), p.dataset.vistaviewCurrentHeight = f.height.toString(), p.style.width = `${f.width}px`, p.style.height = `${f.height}px`;
423
+ if (u.setAttribute("class", m.getAttribute("class") || ""), u.setAttribute("style", m.getAttribute("style") || ""), u.classList.remove("vistaview-image--zooming"), m.classList.contains("vistaview-image-loaded") && !m.classList.contains("vistaview-image-settled")) {
424
+ const y = m.getBoundingClientRect();
425
+ u.style.width = `${y.width}px`, u.style.height = `${y.height}px`;
406
426
  }
407
427
  }
408
428
  }
409
- this.imageContainerElm.innerHTML = "", d.forEach((v) => {
410
- var f;
411
- const w = v.querySelector(".vistaview-image-highres"), u = !!w.classList.contains("vistaview-image-loaded"), p = !!w.classList.contains("vistaview-image-settled");
412
- this.imageContainerElm.appendChild(v), u && !p ? this.setFullSizeImageDim(w) : u && p && ((f = v == null ? void 0 : v.querySelector(".vistaview-image-lowres")) == null || f.classList.add("vistaview-image--hidden"));
413
- }), this.setInitialDimPos(), this.currentImages = r, this.currentItems = d, this.setCurrentDescription(), this.updateZoomButtonsVisibility(), (m = (h = this.options).onImageView) == null || m.call(h, o), this.loadImageTimeout && clearTimeout(this.loadImageTimeout), this.loadImageTimeout = setTimeout(() => {
429
+ delete this.transitionAbortControllers[a], this.imageContainerElm.innerHTML = "", d.forEach((v) => {
430
+ var y;
431
+ const f = v.querySelector(".vistaview-image-highres"), m = !!f.classList.contains("vistaview-image-loaded"), u = !!f.classList.contains("vistaview-image-settled");
432
+ this.imageContainerElm.appendChild(v), m && !u ? this.setFullSizeImageDim(f) : m && u && ((y = v == null ? void 0 : v.querySelector(".vistaview-image-lowres")) == null || y.classList.add("vistaview-image--hidden"));
433
+ }), this.setInitialDimPos(), this.currentImages = r, this.currentItems = d, this.setCurrentDescription(), this.updateZoomButtonsVisibility(), (h = (l = this.options).onImageView) == null || h.call(l, o), this.loadImageTimeout && clearTimeout(this.loadImageTimeout), this.loadImageTimeout = setTimeout(() => {
414
434
  this.loadImages();
415
435
  }, 333);
416
436
  }
@@ -426,19 +446,19 @@ class ot {
426
446
  }
427
447
  if (t) {
428
448
  this.isZoomed = t, t.classList.add("vistaview-image--zooming"), t == null || t.style.setProperty("--pointer-diff-x", "0px"), t == null || t.style.setProperty("--pointer-diff-y", "0px");
429
- let a = !1, c = 0, l = 0, h = 0, m = 0, v = 0, w = 0;
449
+ let a = !1, c = 0, l = 0, h = 0, v = 0, f = 0, m = 0;
430
450
  this.onZoomedPointerDown = (u) => {
431
451
  u.preventDefault(), u.stopPropagation(), a = !0, c = u.pageX, l = u.pageY, t.setPointerCapture(u.pointerId);
432
452
  }, this.onZoomedPointerMove = (u) => {
433
453
  if (!a) return;
434
- u.preventDefault(), v = u.pageX - c, w = u.pageY - l;
435
- const p = parseInt((t == null ? void 0 : t.dataset.vistaviewCurrentWidth) || "0"), f = parseInt((t == null ? void 0 : t.dataset.vistaviewCurrentHeight) || "0"), { maxDiffX: x, minDiffY: I, maxDiffY: y, minDiffX: b } = T(
436
- p,
437
- f
438
- ), E = Math.min(x, Math.max(b, h + v)), L = Math.min(y, Math.max(I, m + w));
439
- v = E - h, w = L - m, t == null || t.style.setProperty("--pointer-diff-x", `${E}px`), t == null || t.style.setProperty("--pointer-diff-y", `${L}px`);
454
+ u.preventDefault(), f = u.pageX - c, m = u.pageY - l;
455
+ const y = parseInt((t == null ? void 0 : t.dataset.vistaviewCurrentWidth) || "0"), g = parseInt((t == null ? void 0 : t.dataset.vistaviewCurrentHeight) || "0"), { maxDiffX: x, minDiffY: I, maxDiffY: p, minDiffX: b } = H(
456
+ y,
457
+ g
458
+ ), E = Math.min(x, Math.max(b, h + f)), L = Math.min(p, Math.max(I, v + m));
459
+ f = E - h, m = L - v, t == null || t.style.setProperty("--pointer-diff-x", `${E}px`), t == null || t.style.setProperty("--pointer-diff-y", `${L}px`);
440
460
  }, this.onZoomedPointerUp = (u) => {
441
- a = !1, t.releasePointerCapture(u.pointerId), h += v, m += w, v = 0, w = 0;
461
+ a = !1, t.releasePointerCapture(u.pointerId), h += f, v += m, f = 0, m = 0;
442
462
  }, (r = t == null ? void 0 : t.parentElement) == null || r.addEventListener("pointerdown", this.onZoomedPointerDown), (d = t == null ? void 0 : t.parentElement) == null || d.addEventListener("pointermove", this.onZoomedPointerMove), (o = t == null ? void 0 : t.parentElement) == null || o.addEventListener("pointerup", this.onZoomedPointerUp);
443
463
  return;
444
464
  }
@@ -468,15 +488,15 @@ class ot {
468
488
  if (t.addEventListener("transitionend", r), t.classList.add("vistaview-image--zooming-out"), i && e && i > e) {
469
489
  const h = Math.max(i - this.options.zoomStep, e);
470
490
  t.style.width = `${h}px`;
471
- const m = h / i * n;
472
- t.style.height = `${m}px`, (a = (o = this.rootElm) == null ? void 0 : o.querySelector("button.vistaview-zoom-in-btn")) == null || a.removeAttribute("disabled"), t.dataset.vistaviewCurrentWidth = h.toString(), t.dataset.vistaviewCurrentHeight = m.toString();
473
- const { maxDiffX: v, minDiffY: w, maxDiffY: u, minDiffX: p } = T(h, m);
474
- let f = parseInt(
491
+ const v = h / i * n;
492
+ t.style.height = `${v}px`, (a = (o = this.rootElm) == null ? void 0 : o.querySelector("button.vistaview-zoom-in-btn")) == null || a.removeAttribute("disabled"), t.dataset.vistaviewCurrentWidth = h.toString(), t.dataset.vistaviewCurrentHeight = v.toString();
493
+ const { maxDiffX: f, minDiffY: m, maxDiffY: u, minDiffX: y } = H(h, v);
494
+ let g = parseInt(
475
495
  (t == null ? void 0 : t.style.getPropertyValue("--pointer-diff-x").replace("px", "")) || "0"
476
496
  ), x = parseInt(
477
497
  (t == null ? void 0 : t.style.getPropertyValue("--pointer-diff-y").replace("px", "")) || "0"
478
498
  );
479
- f = Math.min(v, Math.max(p, f)), x = Math.min(u, Math.max(w, x)), t == null || t.style.setProperty("--pointer-diff-x", `${f}px`), t == null || t.style.setProperty("--pointer-diff-y", `${x}px`), h === e && ((l = (c = this.rootElm) == null ? void 0 : c.querySelector("button.vistaview-zoom-out-btn")) == null || l.setAttribute("disabled", "true"), t.removeAttribute("data-vistaview-current-width"), t.removeAttribute("data-vistaview-current-height"), t.removeAttribute("data-vistaview-initial-width"), t.removeAttribute("data-vistaview-initial-height"), this.setZoomed(!1));
499
+ g = Math.min(f, Math.max(y, g)), x = Math.min(u, Math.max(m, x)), t == null || t.style.setProperty("--pointer-diff-x", `${g}px`), t == null || t.style.setProperty("--pointer-diff-y", `${x}px`), h === e && ((l = (c = this.rootElm) == null ? void 0 : c.querySelector("button.vistaview-zoom-out-btn")) == null || l.setAttribute("disabled", "true"), t.removeAttribute("data-vistaview-current-width"), t.removeAttribute("data-vistaview-current-height"), t.removeAttribute("data-vistaview-initial-width"), t.removeAttribute("data-vistaview-initial-height"), this.setZoomed(!1));
480
500
  }
481
501
  }
482
502
  clearZoom() {
@@ -538,22 +558,19 @@ class ot {
538
558
  o.w = Math.min(d.width, c), o.h = Math.min(d.height, l);
539
559
  }
540
560
  const a = () => {
541
- var l, h;
542
- if ((l = e.parentElement) != null && l.classList.contains("vistaview-image--ending"))
543
- return;
561
+ var l;
544
562
  const c = () => {
545
- var m;
563
+ var h;
546
564
  o.w && o.h && (e.style.width = `${o.w}px`, e.style.height = `${o.h}px`, e.style.setProperty("--vistaview-fitted-width", `${o.w}px`), e.style.setProperty("--vistaview-fitted-height", `${o.h}px`)), e.classList.add("vistaview-image-loaded"), e.width = e.naturalWidth, e.height = e.naturalHeight, setTimeout(() => {
547
- var v;
548
- (v = e.parentElement) != null && v.classList.contains("vistaview-image--ending") || this.setFullSizeImageDim(e);
549
- }, 100), (m = i.parentElement) != null && m.matches('[data-vistaview-pos="0"]') && this.updateZoomButtonsVisibility();
565
+ this.setFullSizeImageDim(e);
566
+ }, 100), (h = i.parentElement) != null && h.matches('[data-vistaview-pos="0"]') && this.updateZoomButtonsVisibility();
550
567
  };
551
- if ((h = this.rootElm) != null && h.classList.contains("vistaview--opened"))
568
+ if ((l = this.rootElm) != null && l.classList.contains("vistaview--opened"))
552
569
  c();
553
570
  else {
554
- const m = setInterval(() => {
571
+ const h = setInterval(() => {
555
572
  var v;
556
- (v = this.rootElm) != null && v.classList.contains("vistaview--opened") && (clearInterval(m), c());
573
+ (v = this.rootElm) != null && v.classList.contains("vistaview--opened") && (clearInterval(h), c());
557
574
  }, 50);
558
575
  }
559
576
  };
@@ -611,13 +628,13 @@ class ot {
611
628
  ".vistaview-image-highres.vistaview-image-loaded"
612
629
  );
613
630
  t == null || t.forEach((n) => {
614
- const e = n, { width: r, height: d } = H(e);
631
+ const e = n, { width: r, height: d } = T(e);
615
632
  e.classList.contains("vistaview-image--zooming") ? (e.dataset.vistaviewInitialWidth = r.toString(), e.dataset.vistaviewInitialHeight = d.toString()) : (e.style.width = `${r}px`, e.style.height = `${d}px`);
616
633
  });
617
634
  }, window.addEventListener("resize", this.onResizeHandler);
618
635
  }
619
636
  open(t = 0) {
620
- var o, a, c, l, h, m, v, w, u, p, f, x, I;
637
+ var o, a, c, l, h, v, f, m, u, y, g, x, I;
621
638
  if (C.somethingOpened) {
622
639
  console.error("VistaView: another instance is already opened. Returning.");
623
640
  return;
@@ -632,7 +649,7 @@ class ot {
632
649
  this.options.arrowOnSmallScreens || this.rootElm.classList.add("vistaview-no-arrows-sm");
633
650
  const { images: i, positions: n } = this.getCurrentIndexes(t);
634
651
  this.currentImages = this.getImages(i);
635
- const e = this.currentImages.map((y, b) => q(y, n[b]));
652
+ const e = this.currentImages.map((p, b) => q(p, n[b]));
636
653
  this.currentItems = e;
637
654
  const r = {
638
655
  htmlElements: { from: null, to: this.currentItems },
@@ -646,29 +663,29 @@ class ot {
646
663
  isZoomed: this.isZoomed,
647
664
  options: this.options
648
665
  };
649
- this.userSetup(r), this.imageContainerElm.innerHTML = "", this.currentItems.forEach((y) => {
650
- this.imageContainerElm.appendChild(y);
666
+ this.userSetup(r), this.imageContainerElm.innerHTML = "", this.currentItems.forEach((p) => {
667
+ this.imageContainerElm.appendChild(p);
651
668
  });
652
669
  let d = 0;
653
- this.rootElm.addEventListener("animationend", (y) => {
670
+ this.rootElm.addEventListener("animationend", (p) => {
654
671
  var b;
655
- y.currentTarget === this.rootElm && (d++, d >= 2 && ((b = this.rootElm) == null || b.classList.add("vistaview--opened")));
656
- }), (a = this.rootElm.querySelector(".vistaview-close-btn")) == null || a.addEventListener("click", () => this.close()), (c = this.rootElm.querySelector(".vistaview-zoom-in-btn")) == null || c.addEventListener("click", () => this.zoomIn()), (l = this.rootElm.querySelector(".vistaview-zoom-out-btn")) == null || l.addEventListener("click", () => this.zoomOut()), (h = this.rootElm.querySelector(".vistaview-prev-btn>button")) == null || h.addEventListener("click", () => this.prev()), (m = this.rootElm.querySelector(".vistaview-next-btn>button")) == null || m.addEventListener("click", () => this.next()), [
672
+ p.currentTarget === this.rootElm && (d++, d >= 2 && ((b = this.rootElm) == null || b.classList.add("vistaview--opened")));
673
+ }), (a = this.rootElm.querySelector(".vistaview-close-btn")) == null || a.addEventListener("click", () => this.close()), (c = this.rootElm.querySelector(".vistaview-zoom-in-btn")) == null || c.addEventListener("click", () => this.zoomIn()), (l = this.rootElm.querySelector(".vistaview-zoom-out-btn")) == null || l.addEventListener("click", () => this.zoomOut()), (h = this.rootElm.querySelector(".vistaview-prev-btn>button")) == null || h.addEventListener("click", () => this.prev()), (v = this.rootElm.querySelector(".vistaview-next-btn>button")) == null || v.addEventListener("click", () => this.next()), [
657
674
  ...this.options.controls.topLeft || [],
658
675
  ...this.options.controls.topRight || [],
659
676
  ...this.options.controls.topCenter || [],
660
677
  ...this.options.controls.bottomCenter || [],
661
678
  ...this.options.controls.bottomLeft || [],
662
679
  ...this.options.controls.bottomRight || []
663
- ].forEach((y) => {
664
- typeof y != "string" && (this.customControls[y.name] = y);
665
- }), this.rootElm.querySelectorAll("button[data-vistaview-custom-control]").forEach((y) => {
666
- y.addEventListener("click", (b) => {
680
+ ].forEach((p) => {
681
+ typeof p != "string" && (this.customControls[p.name] = p);
682
+ }), this.rootElm.querySelectorAll("button[data-vistaview-custom-control]").forEach((p) => {
683
+ p.addEventListener("click", (b) => {
667
684
  const E = this.customControls[b.currentTarget.dataset.vistaviewCustomControl], L = this.currentImages.find(
668
- (S) => S.index === this.currentIndex.value
685
+ (D) => D.index === this.currentIndex.value
669
686
  );
670
- E && L && (E.onClick.constructor.name === "AsyncFunction" ? (y.classList.add("vistaview-button--loading"), E.onClick(L).finally(() => {
671
- y.classList.remove("vistaview-button--loading");
687
+ E && L && (E.onClick.constructor.name === "AsyncFunction" ? (p.classList.add("vistaview-button--loading"), E.onClick(L).finally(() => {
688
+ p.classList.remove("vistaview-button--loading");
672
689
  })) : E.onClick(L));
673
690
  });
674
691
  }), this.options.animationDurationBase && this.rootElm.style.setProperty(
@@ -677,7 +694,7 @@ class ot {
677
694
  ), this.options.initialZIndex !== void 0 && this.rootElm.style.setProperty(
678
695
  "--vistaview-initial-z-index",
679
696
  `${this.options.initialZIndex}`
680
- ), this.setInitialDimPos(), this.setResizeListeners(), this.options.keyboardListeners && this.setKeyboardListeners(), this.elements.length === 1 && ((v = this.rootElm.querySelector(".vistaview-prev-btn")) == null || v.classList.add("vistaview-ui--none"), (w = this.rootElm.querySelector(".vistaview-next-btn")) == null || w.classList.add("vistaview-ui--none"), (u = this.rootElm.querySelector(".vistaview-index-display")) == null || u.classList.add("vistaview-ui--none")), this.rootElm && this.rootElm.classList.add("vistaview--initialized"), this.loadImages(), this.setCurrentDescription(), this.setIndexDisplay(), this.userInit(this), (f = (p = this.options).onOpen) == null || f.call(p, r), (I = (x = this.options).onImageView) == null || I.call(x, r);
697
+ ), this.setInitialDimPos(), this.setResizeListeners(), this.options.keyboardListeners && this.setKeyboardListeners(), this.elements.length === 1 && ((f = this.rootElm.querySelector(".vistaview-prev-btn")) == null || f.classList.add("vistaview-ui--none"), (m = this.rootElm.querySelector(".vistaview-next-btn")) == null || m.classList.add("vistaview-ui--none"), (u = this.rootElm.querySelector(".vistaview-index-display")) == null || u.classList.add("vistaview-ui--none")), this.rootElm && this.rootElm.classList.add("vistaview--initialized"), this.loadImages(), this.setCurrentDescription(), this.setIndexDisplay(), this.userInit(this), (g = (y = this.options).onOpen) == null || g.call(y, r), (I = (x = this.options).onImageView) == null || I.call(x, r);
681
698
  }
682
699
  async close(t = !0) {
683
700
  var n, e, r;
@@ -1,4 +1,4 @@
1
- (function(E,x){typeof exports=="object"&&typeof module<"u"?x(exports):typeof define=="function"&&define.amd?define(["exports"],x):(E=typeof globalThis<"u"?globalThis:E||self,x(E.VistaView={}))})(this,(function(E){"use strict";var at=Object.defineProperty;var lt=(E,x,P)=>x in E?at(E,x,{enumerable:!0,configurable:!0,writable:!0,value:P}):E[x]=P;var g=(E,x,P)=>lt(E,typeof x!="symbol"?x+"":x,P);function x(s){const t=getComputedStyle(s),i=s.getBoundingClientRect();return{objectFit:t.objectFit,borderRadius:t.borderRadius,objectPosition:t.objectPosition,overflow:t.overflow,top:i.top,left:i.left,width:i.width,height:i.height,naturalWidth:s.naturalWidth,naturalHeight:s.naturalHeight}}let P=null;function U(){return P||(window.trustedTypes||(window.trustedTypes={createPolicy:(s,t)=>t}),P=window.trustedTypes.createPolicy("vistaView-policy",{createHTML:s=>s,createScript:()=>{throw new Error("Not implemented")},createScriptURL:()=>{throw new Error("Not implemented")}}),P)}function q(s){const i=U().createHTML(s),n=document.createElement("template");n.innerHTML=i;const e=n.content;return n.remove(),e}function k(s){return s&&!/^0(px|%|r?em|vw|vh|vmin|vmax|cm|mm|in|pt|pc|ex|ch)?$/i.test(s.trim())&&s}function j(s){const i=window.getComputedStyle(s).objectFit||"",{width:n,height:e}=s.getBoundingClientRect(),r=s.naturalWidth,d=s.naturalHeight;if(!i)return{width:n,height:e};if(!r||!d)return{width:n,height:e};const o=r/d,a=n/e;switch(i){case"fill":return{width:n,height:e};case"none":return{width:r,height:d};case"contain":return o>a?{width:n,height:n/o}:{width:e*o,height:e};case"cover":return o<a?{width:n,height:n/o}:{width:e*o,height:e};case"scale-down":{const c={width:r,height:d},l=o>a?{width:n,height:n/o}:{width:e*o,height:e};return l.width<=c.width&&l.height<=c.height?l:c}}return{width:n,height:e}}function W(s){const t=window.innerWidth,i=window.innerHeight,n=s.naturalWidth,e=s.naturalHeight;if(!n||!e)throw console.error("Error",s),new Error("Image natural dimensions are zero");if(n<t&&e<i)return{width:n,height:e};const r=n/e,d=t/i;let o,a;return r>d?(o=t,a=t/r):(a=i,o=i*r),{width:o,height:a}}function O(s,t){const i=window.innerHeight,n=window.innerWidth,e=s,r=t,d=Math.max(0,(e-n)/2)+n/2,o=Math.max(0,(r-i)/2)+i/2,a=-d,c=-o;return{maxDiffX:d,minDiffY:c,maxDiffY:o,minDiffX:a}}const K='<svg viewBox="0 0 24 24"><path d="m15 18-6-6 6-6"/></svg>',G='<svg viewBox="0 0 24 24"><path d="m9 18 6-6-6-6"/></svg>',J='<svg viewBox="0 0 24 24"><circle cx="11" cy="11" r="8"/><line x1="21" x2="16.65" y1="21" y2="16.65"/><line x1="11" x2="11" y1="8" y2="14"/><line x1="8" x2="14" y1="11" y2="11"/></svg>',Q='<svg viewBox="0 0 24 24"><circle cx="11" cy="11" r="8"/><line x1="21" x2="16.65" y1="21" y2="16.65"/><line x1="8" x2="14" y1="11" y2="11"/></svg>',tt='<svg viewBox="0 0 24 24"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>',et='<svg viewBox="0 0 24 24"><path d="M12 15V3"/><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><path d="m7 10 5 5 5-5"/></svg>';function V(){return{name:"download",icon:et,onClick:async s=>{var r;const t=await fetch(s.src),i=await t.blob(),n=t.url,e=document.createElement("a");e.href=URL.createObjectURL(i),e.download=((r=n.split("/").pop())==null?void 0:r.split("?")[0].split("#")[0])||"download",document.body.appendChild(e),e.click(),document.body.removeChild(e)}}}function it(s){if(typeof s=="string")switch(s){case"zoomIn":return`<button class="vistaview-zoom-in-btn">${J}</button>`;case"zoomOut":return`<button disabled class="vistaview-zoom-out-btn">${Q}</button>`;case"close":return`<button class="vistaview-close-btn">${tt}</button>`;case"indexDisplay":return'<div class="vistaview-index-display"></div>';case"description":return'<div class="vistaview-description"></div>';default:return""}return`<button data-vistaview-custom-control="${s.name}">${s.icon}</button>`}function X(s,t){var l,h;const i=s.imageElm?getComputedStyle(s.imageElm):null,n=(i==null?void 0:i.objectFit)||"",e=((l=s.imageElm)==null?void 0:l.naturalWidth)||"",r=((h=s.imageElm)==null?void 0:h.naturalHeight)||"",d=(i==null?void 0:i.width)||"",o=(i==null?void 0:i.height)||"",a=document.createElement("div");a.className="vistaview-item",a.dataset.vistaviewPos=`${t!==void 0?t:""}`,a.dataset.vistaviewIndex=s.index.toString();const c=q(`<img class="vistaview-image-lowres"
1
+ (function(y,x){typeof exports=="object"&&typeof module<"u"?x(exports):typeof define=="function"&&define.amd?define(["exports"],x):(y=typeof globalThis<"u"?globalThis:y||self,x(y.VistaView={}))})(this,(function(y){"use strict";var at=Object.defineProperty;var lt=(y,x,P)=>x in y?at(y,x,{enumerable:!0,configurable:!0,writable:!0,value:P}):y[x]=P;var w=(y,x,P)=>lt(y,typeof x!="symbol"?x+"":x,P);function x(s){const t=getComputedStyle(s),i=s.getBoundingClientRect();return{objectFit:t.objectFit,borderRadius:t.borderRadius,objectPosition:t.objectPosition,overflow:t.overflow,top:i.top,left:i.left,width:i.width,height:i.height,naturalWidth:s.naturalWidth,naturalHeight:s.naturalHeight}}let P=null;function U(){return P||(window.trustedTypes||(window.trustedTypes={createPolicy:(s,t)=>t}),P=window.trustedTypes.createPolicy("vistaView-policy",{createHTML:s=>s,createScript:()=>{throw new Error("Not implemented")},createScriptURL:()=>{throw new Error("Not implemented")}}),P)}function q(s){const i=U().createHTML(s),n=document.createElement("template");n.innerHTML=i;const e=n.content;return n.remove(),e}function k(s){return s&&!/^0(px|%|r?em|vw|vh|vmin|vmax|cm|mm|in|pt|pc|ex|ch)?$/i.test(s.trim())&&s}function j(s){const i=window.getComputedStyle(s).objectFit||"",{width:n,height:e}=s.getBoundingClientRect(),r=s.naturalWidth,d=s.naturalHeight;if(!i)return{width:n,height:e};if(!r||!d)return{width:n,height:e};const o=r/d,a=n/e;switch(i){case"fill":return{width:n,height:e};case"none":return{width:r,height:d};case"contain":return o>a?{width:n,height:n/o}:{width:e*o,height:e};case"cover":return o<a?{width:n,height:n/o}:{width:e*o,height:e};case"scale-down":{const c={width:r,height:d},l=o>a?{width:n,height:n/o}:{width:e*o,height:e};return l.width<=c.width&&l.height<=c.height?l:c}}return{width:n,height:e}}function W(s){const t=window.innerWidth,i=window.innerHeight,n=s.naturalWidth,e=s.naturalHeight;if(!n||!e)throw console.error("Error",s),new Error("Image natural dimensions are zero");if(n<t&&e<i)return{width:n,height:e};const r=n/e,d=t/i;let o,a;return r>d?(o=t,a=t/r):(a=i,o=i*r),{width:o,height:a}}function O(s,t){const i=window.innerHeight,n=window.innerWidth,e=s,r=t,d=Math.max(0,(e-n)/2)+n/2,o=Math.max(0,(r-i)/2)+i/2,a=-d,c=-o;return{maxDiffX:d,minDiffY:c,maxDiffY:o,minDiffX:a}}const K='<svg viewBox="0 0 24 24"><path d="m15 18-6-6 6-6"/></svg>',G='<svg viewBox="0 0 24 24"><path d="m9 18 6-6-6-6"/></svg>',J='<svg viewBox="0 0 24 24"><circle cx="11" cy="11" r="8"/><line x1="21" x2="16.65" y1="21" y2="16.65"/><line x1="11" x2="11" y1="8" y2="14"/><line x1="8" x2="14" y1="11" y2="11"/></svg>',Q='<svg viewBox="0 0 24 24"><circle cx="11" cy="11" r="8"/><line x1="21" x2="16.65" y1="21" y2="16.65"/><line x1="8" x2="14" y1="11" y2="11"/></svg>',tt='<svg viewBox="0 0 24 24"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>',et='<svg viewBox="0 0 24 24"><path d="M12 15V3"/><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><path d="m7 10 5 5 5-5"/></svg>';function V(){return{name:"download",icon:et,onClick:async s=>{var r;const t=await fetch(s.src),i=await t.blob(),n=t.url,e=document.createElement("a");e.href=URL.createObjectURL(i),e.download=((r=n.split("/").pop())==null?void 0:r.split("?")[0].split("#")[0])||"download",document.body.appendChild(e),e.click(),document.body.removeChild(e)}}}function it(s){if(typeof s=="string")switch(s){case"zoomIn":return`<button class="vistaview-zoom-in-btn">${J}</button>`;case"zoomOut":return`<button disabled class="vistaview-zoom-out-btn">${Q}</button>`;case"close":return`<button class="vistaview-close-btn">${tt}</button>`;case"indexDisplay":return'<div class="vistaview-index-display"></div>';case"description":return'<div class="vistaview-description"></div>';default:return""}return`<button data-vistaview-custom-control="${s.name}">${s.icon}</button>`}function X(s,t){var l,h;const i=s.imageElm?getComputedStyle(s.imageElm):null,n=(i==null?void 0:i.objectFit)||"",e=((l=s.imageElm)==null?void 0:l.naturalWidth)||"",r=((h=s.imageElm)==null?void 0:h.naturalHeight)||"",d=(i==null?void 0:i.width)||"",o=(i==null?void 0:i.height)||"",a=document.createElement("div");a.className="vistaview-item",a.dataset.vistaviewPos=`${t!==void 0?t:""}`,a.dataset.vistaviewIndex=s.index.toString();const c=q(`<img class="vistaview-image-lowres"
2
2
  style="${n?`object-fit:${n};`:""}${d?`width:${d};`:""}${o?`height:${o};`:""}"
3
3
  src="${s.thumb||s.src}"
4
4
  alt="${s.alt||""}"
@@ -13,4 +13,4 @@
13
13
  <div class="vistaview-prev-btn vistaview-ui"><button>${K}</button></div>
14
14
  <div class="vistaview-next-btn vistaview-ui"><button>${G}</button></div>
15
15
  </div>
16
- </div>`)}let M=null,$=null,Z=null,z=null;function Y(s){R(s);const t=s.imageContainerElm,i=s.elements.length;if(!t)return;let n=0,e=0,r=0,d=0,o=null,a=0,c=!1;M=l=>{l.preventDefault(),l.stopPropagation(),s.isZoomed===!1&&(c=!0,n=l.pageX,e=l.pageY,r=l.pageX,d=l.pageY,a=Date.now(),o=null,t.setPointerCapture(l.pointerId))},$=l=>{if(l.preventDefault(),l.stopPropagation(),s.isZoomed!==!1||!c)return;const h=l.pageX-n,m=l.pageY-e;r=l.pageX,d=l.pageY,Math.abs(h)>=Math.abs(m)&&(o===null||o===!0)?(t.style.setProperty("--vistaview-pointer-diff-x",`${h}px`),o=!0):Math.abs(m)>Math.abs(h)&&(o===null||o===!1)&&(t.style.setProperty("--vistaview-pointer-diff-y",`${m}px`),o=!1)},z=l=>{if(l.preventDefault(),l.stopPropagation(),t.releasePointerCapture(l.pointerId),s.isZoomed!==!1||!c)return;c=!1,o=null;const h=Array.from(t.querySelectorAll(".vistaview-item"));t.style.removeProperty("--vistaview-pointer-diff-x"),t.style.removeProperty("--vistaview-pointer-diff-y"),h.forEach(m=>{m.style.transition="",m.style.translate=""})},Z=l=>{if(l.preventDefault(),l.stopPropagation(),t.releasePointerCapture(l.pointerId),s.isZoomed!==!1||!c)return;c=!1;const h=Array.from(t.querySelectorAll(".vistaview-item")),m=r-n,v=d-e,w=Date.now()-a,u=m/w,p=v/w,f=s.options.touchSpeedThreshold||.5,I=h.find(b=>b.dataset.vistaviewPos==="0"),C=Number(I.dataset.vistaviewIndex);function y(){h[0].removeEventListener("transitionend",y),t.style.removeProperty("--vistaview-pointer-diff-x"),t.style.removeProperty("--vistaview-pointer-diff-y"),h.forEach(b=>{b.style.transition="",b.style.translate=""})}function L(b="0%",D="0%"){h.forEach(T=>{T.style.transition=`translate ${s.options.animationDurationBase*.5}ms ease-out`,T.style.translate=`${b} ${D}`})}if(u<-f||u>f){let b=function(){h[0].removeEventListener("transitionend",b),setTimeout(()=>{const D=s.isReducedMotion;s.isReducedMotion=!0,y(),s.view(u<-f?(C+1)%i:(C-1+i)%i,{next:u<-f,prev:u>f}),s.isReducedMotion=D},100)};L(u<-f?"-100%":"100%"),h[0].addEventListener("transitionend",b)}else p<-f||p>f?(s.close(),L("0%","0%")):(h[0].addEventListener("transitionend",y),L("0%"),u===0&&p===0&&s.zoomIn())},t.addEventListener("pointermove",$),t.addEventListener("pointerup",Z),t.addEventListener("pointerdown",M),t.addEventListener("pointercancel",z)}function R(s){const t=s.imageContainerElm;t&&($&&t.removeEventListener("pointermove",$),Z&&t.removeEventListener("pointerup",Z),M&&t.removeEventListener("pointerdown",M),z&&t.removeEventListener("pointercancel",z))}const B=s=>{Y(s)},F=({htmlElements:{to:s},index:{to:t},elements:i})=>{i instanceof NodeList&&t!==null&&(i.forEach(n=>n.style.opacity="1"),i[t].style.opacity="0"),s&&s.forEach(n=>{const e=Number(n.dataset.vistaviewPos);e!==0?(n.style.zIndex="1",n.style.left=100*e+"%"):n.style.zIndex="2"})},_=async({htmlElements:{from:s,to:t},images:{to:i},via:{next:n,prev:e},options:r,isReducedMotion:d},o)=>{if(!i)throw new Error("VistaView: images is null in defaultTransition()");if(d)return;const a=s.filter(c=>c.dataset.vistaviewPos==="0"||(n?c.dataset.vistaviewPos==="1":c.dataset.vistaviewPos==="-1"));await new Promise((c,l)=>{let h=0;if(o.aborted){l(new A("Transition aborted"));return}const m=v=>{if(o.aborted)return l(new A("Transition aborted"));if(v.currentTarget.removeEventListener("transitionend",m),h++,h<a.length)return;const w=t==null?void 0:t.find(y=>y.dataset.vistaviewPos==="0"),u=w?Number(w.dataset.vistaviewIndex):0,p=a.find(y=>Number(y.dataset.vistaviewIndex)===u),f=p==null?void 0:p.querySelector(".vistaview-image-highres");if(!f)return l(new Error("current image element not found"));if(!f.classList.contains("vistaview-image-loaded")||f.classList.contains("vistaview-image-settled"))return c(0);let I=0;const C=setInterval(()=>{if(o.aborted)return clearInterval(C),l(new A("Transition aborted"));if(I++,I>r.animationDurationBase/20*1.5)return clearInterval(C),c(0);if(f.classList.contains("vistaview-image-settled"))return w==null||w.classList.add("vistaview-image-settled"),clearInterval(C),c(0)},20)};a.forEach(v=>{v.style.transition=`translate ${r.animationDurationBase*.5}ms ease-out`,v.style.translate=n?"-100%":e?"100%":"0%",v.addEventListener("transitionend",m)})})},N=s=>{s.elements instanceof NodeList&&s.elements.forEach(t=>t.style.opacity="1"),R(s)};class A extends Error{constructor(t){super(t),this.name="VistaViewTransitionAbortedError"}}const H={detectReducedMotion:!0,animationDurationBase:333,zoomStep:500,maxZoomLevel:2,touchSpeedThreshold:.5,preloads:1,keyboardListeners:!0,arrowOnSmallScreens:!1,controls:{topLeft:["indexDisplay"],topRight:["zoomIn","zoomOut",V(),"close"],bottomCenter:["description"]}},S={somethingOpened:null};class st{constructor(t,i){g(this,"options");g(this,"elements");g(this,"isReducedMotion");g(this,"currentIndex",{_value:null,_vistaView:null,_via:{next:!1,prev:!1},set value(t){var n,e,r;const i=this._value;this._value=t;for(const d in(n=this._vistaView)==null?void 0:n.transitionAbortControllers)(e=this._vistaView)==null||e.transitionAbortControllers[d].abort();(r=this._vistaView)==null||r.swap(i,this._value)},get value(){return this._value},get via(){return this._via},set via(t){this._via=t}});g(this,"rootElm",null);g(this,"imageContainerElm",null);g(this,"customControls",{});g(this,"currentImages",null);g(this,"currentItems",null);g(this,"navActive",!0);g(this,"isZoomed",!1);g(this,"onClickElements",t=>{t.preventDefault();const i=t.currentTarget;i.dataset.vistaviewIndex&&this.open(parseInt(i.dataset.vistaviewIndex))});g(this,"defaultOnClickHandler",t=>t.preventDefault());g(this,"onResizeHandler",null);g(this,"onKeyDown",null);g(this,"userSetup",F);g(this,"userTransition",_);g(this,"userClose",N);g(this,"userInit",B);g(this,"onZoomedPointerDown",null);g(this,"onZoomedPointerMove",null);g(this,"onZoomedPointerUp",null);g(this,"transitionAbortControllers",{});g(this,"loadImageTimeout",null);this.elements=t,this.currentIndex._vistaView=this,this.options={...H,...i||{},controls:{...H.controls,...(i==null?void 0:i.controls)||{}}},this.options.initFunction&&(this.userInit=this.options.initFunction),this.options.transitionFunction&&(this.userTransition=this.options.transitionFunction),this.options.closeFunction&&(this.userClose=this.options.closeFunction),this.options.initFunction&&(this.userInit=this.options.initFunction),this.isReducedMotion=window.matchMedia("(prefers-reduced-motion: reduce)").matches,this.elements instanceof NodeList&&this.elements.forEach((n,e)=>{n.dataset.vistaviewIndex=e.toString(),n.addEventListener("click",this.defaultOnClickHandler),n.addEventListener("pointerup",this.onClickElements)})}setFullSizeImageDim(t){var r,d;const i=t.getBoundingClientRect(),{width:n,height:e}=W(t);if(n===i.width&&e===i.height)(d=(r=t.parentElement)==null?void 0:r.querySelector(".vistaview-image-lowres"))==null||d.classList.add("vistaview-image--hidden"),t.classList.add("vistaview-image-settled");else{let o=0;const a=()=>{var c,l;o++,!(o<3)&&(t.removeEventListener("transitionend",a),(l=(c=t.parentElement)==null?void 0:c.querySelector(".vistaview-image-lowres"))==null||l.classList.add("vistaview-image--hidden"),t.classList.add("vistaview-image-settled"))};requestAnimationFrame(()=>{t.addEventListener("transitionend",a),t.style.width=`${n}px`,t.style.height=`${e}px`})}}async swap(t,i){var l,h,m;if(!S.somethingOpened||t===i||t===null)return;if(!this.imageContainerElm)throw new Error("VistaView: imageContainerElm is null in swap()");this.setIndexDisplay(),this.clearZoom();const{images:n,positions:e}=this.getCurrentIndexes(i),r=this.getImages(n),d=r.map((v,w)=>X(v,e[w])),o={htmlElements:{from:this.currentItems,to:d},images:{from:this.currentImages,to:r},index:{from:t,to:i},via:this.currentIndex.via,container:this.imageContainerElm,elements:this.elements,isReducedMotion:this.isReducedMotion,navActive:this.navActive,isZoomed:this.isZoomed,options:this.options};this.userSetup(o),(l=this.currentItems)==null||l.forEach(v=>{v.classList.add("vistaview-image--ending")});const a=Math.random().toString(36).substring(2,15)+Math.random().toString(36).substring(2,15);this.transitionAbortControllers[a]=new AbortController;try{await this.userTransition(o,this.transitionAbortControllers[a].signal)}catch(v){v instanceof A||console.warn(v)}delete this.transitionAbortControllers[a];const c=d.find(v=>v.dataset.vistaviewPos==="0");if(c){const v=c.dataset.vistaviewIndex,w=this.currentItems.find(p=>p.dataset.vistaviewIndex===v),u=w==null?void 0:w.querySelector(".vistaview-image-highres");if(u){const p=c.querySelector(".vistaview-image-highres");if(p.setAttribute("class",u.getAttribute("class")||""),p.setAttribute("style",u.getAttribute("style")||""),p.classList.remove("vistaview-image--zooming"),u.classList.contains("vistaview-image-loaded")&&!u.classList.contains("vistaview-image-settled")){const f=u.getBoundingClientRect();p.dataset.vistaviewCurrentWidth=f.width.toString(),p.dataset.vistaviewCurrentHeight=f.height.toString(),p.style.width=`${f.width}px`,p.style.height=`${f.height}px`}}}this.imageContainerElm.innerHTML="",d.forEach(v=>{var f;const w=v.querySelector(".vistaview-image-highres"),u=!!w.classList.contains("vistaview-image-loaded"),p=!!w.classList.contains("vistaview-image-settled");this.imageContainerElm.appendChild(v),u&&!p?this.setFullSizeImageDim(w):u&&p&&((f=v==null?void 0:v.querySelector(".vistaview-image-lowres"))==null||f.classList.add("vistaview-image--hidden"))}),this.setInitialDimPos(),this.currentImages=r,this.currentItems=d,this.setCurrentDescription(),this.updateZoomButtonsVisibility(),(m=(h=this.options).onImageView)==null||m.call(h,o),this.loadImageTimeout&&clearTimeout(this.loadImageTimeout),this.loadImageTimeout=setTimeout(()=>{this.loadImages()},333)}setZoomed(t){var i,n,e,r,d,o;if(this.isZoomed!==t){if(this.isZoomed){let a=this.isZoomed;if(a.classList.remove("vistaview-image--zooming"),this.onZoomedPointerDown&&((i=a.parentElement)==null||i.removeEventListener("pointerdown",this.onZoomedPointerDown),this.onZoomedPointerDown=null),this.onZoomedPointerMove&&((n=a.parentElement)==null||n.removeEventListener("pointermove",this.onZoomedPointerMove),this.onZoomedPointerMove=null),this.onZoomedPointerUp&&((e=a.parentElement)==null||e.removeEventListener("pointerup",this.onZoomedPointerUp),this.onZoomedPointerUp=null),a==null||a.style.removeProperty("--pointer-diff-x"),a==null||a.style.removeProperty("--pointer-diff-y"),setTimeout(()=>{a==null||a.classList.remove("vistaview-image--zooming")},500),this.isZoomed=!1,!t)return}if(t){this.isZoomed=t,t.classList.add("vistaview-image--zooming"),t==null||t.style.setProperty("--pointer-diff-x","0px"),t==null||t.style.setProperty("--pointer-diff-y","0px");let a=!1,c=0,l=0,h=0,m=0,v=0,w=0;this.onZoomedPointerDown=u=>{u.preventDefault(),u.stopPropagation(),a=!0,c=u.pageX,l=u.pageY,t.setPointerCapture(u.pointerId)},this.onZoomedPointerMove=u=>{if(!a)return;u.preventDefault(),v=u.pageX-c,w=u.pageY-l;const p=parseInt((t==null?void 0:t.dataset.vistaviewCurrentWidth)||"0"),f=parseInt((t==null?void 0:t.dataset.vistaviewCurrentHeight)||"0"),{maxDiffX:I,minDiffY:C,maxDiffY:y,minDiffX:L}=O(p,f),b=Math.min(I,Math.max(L,h+v)),D=Math.min(y,Math.max(C,m+w));v=b-h,w=D-m,t==null||t.style.setProperty("--pointer-diff-x",`${b}px`),t==null||t.style.setProperty("--pointer-diff-y",`${D}px`)},this.onZoomedPointerUp=u=>{a=!1,t.releasePointerCapture(u.pointerId),h+=v,m+=w,v=0,w=0},(r=t==null?void 0:t.parentElement)==null||r.addEventListener("pointerdown",this.onZoomedPointerDown),(d=t==null?void 0:t.parentElement)==null||d.addEventListener("pointermove",this.onZoomedPointerMove),(o=t==null?void 0:t.parentElement)==null||o.addEventListener("pointerup",this.onZoomedPointerUp);return}}}zoomIn(){var r,d,o,a,c;const t=(r=this.rootElm)==null?void 0:r.querySelector('[data-vistaview-pos="0"] .vistaview-image-highres'),i=t.width,n=t.height;t.dataset.vistaviewInitialWidth||(t.dataset.vistaviewInitialWidth=i.toString()),t.dataset.vistaviewInitialHeight||(t.dataset.vistaviewInitialHeight=n.toString()),this.setZoomed(t);const e=(t.naturalWidth||0)*this.options.maxZoomLevel;if(i&&e&&i<e){const l=Math.min(i+this.options.zoomStep,e);t.style.width=`${l}px`;const h=l/i*n;t.style.height=`${h}px`,(o=(d=this.rootElm)==null?void 0:d.querySelector("button.vistaview-zoom-out-btn"))==null||o.removeAttribute("disabled"),t.dataset.vistaviewCurrentWidth=l.toString(),t.dataset.vistaviewCurrentHeight=h.toString(),l===e&&((c=(a=this.rootElm)==null?void 0:a.querySelector("button.vistaview-zoom-in-btn"))==null||c.setAttribute("disabled","true"))}}zoomOut(){var d,o,a,c,l;const t=(d=this.rootElm)==null?void 0:d.querySelector('[data-vistaview-pos="0"] .vistaview-image-highres'),i=t.width,n=t.height,e=t.dataset.vistaviewInitialWidth?parseInt(t.dataset.vistaviewInitialWidth):0,r=h=>{h.target===t&&(t.classList.remove("vistaview-image--zooming-out"),t.removeEventListener("transitionend",r))};if(t.addEventListener("transitionend",r),t.classList.add("vistaview-image--zooming-out"),i&&e&&i>e){const h=Math.max(i-this.options.zoomStep,e);t.style.width=`${h}px`;const m=h/i*n;t.style.height=`${m}px`,(a=(o=this.rootElm)==null?void 0:o.querySelector("button.vistaview-zoom-in-btn"))==null||a.removeAttribute("disabled"),t.dataset.vistaviewCurrentWidth=h.toString(),t.dataset.vistaviewCurrentHeight=m.toString();const{maxDiffX:v,minDiffY:w,maxDiffY:u,minDiffX:p}=O(h,m);let f=parseInt((t==null?void 0:t.style.getPropertyValue("--pointer-diff-x").replace("px",""))||"0"),I=parseInt((t==null?void 0:t.style.getPropertyValue("--pointer-diff-y").replace("px",""))||"0");f=Math.min(v,Math.max(p,f)),I=Math.min(u,Math.max(w,I)),t==null||t.style.setProperty("--pointer-diff-x",`${f}px`),t==null||t.style.setProperty("--pointer-diff-y",`${I}px`),h===e&&((l=(c=this.rootElm)==null?void 0:c.querySelector("button.vistaview-zoom-out-btn"))==null||l.setAttribute("disabled","true"),t.removeAttribute("data-vistaview-current-width"),t.removeAttribute("data-vistaview-current-height"),t.removeAttribute("data-vistaview-initial-width"),t.removeAttribute("data-vistaview-initial-height"),this.setZoomed(!1))}}clearZoom(){}getImages(t){return t.map((i,n)=>{const e=this.elements[i];if(e instanceof HTMLElement){const r=e.querySelector("img"),d=e.getAttribute("href")||"",o=e.getAttribute("src")||"",a=e.dataset.vistaviewSrc||d||o||(r==null?void 0:r.src)||"",c=e.dataset.vistaviewAlt||e.getAttribute("alt")||(r==null?void 0:r.alt)||"",l=e.dataset.vistaviewThumb||(r==null?void 0:r.src)||d||o||"";return{index:t[n],src:a,alt:c,thumb:l,imageElm:e instanceof HTMLImageElement?e:r,anchorElm:e instanceof HTMLAnchorElement?e:void 0}}else return{index:t[n],...e}})}setInitialDimPos(){var c,l;if(!this.rootElm)return;const t=(c=this.rootElm.querySelector('[data-vistaview-pos="0"]'))==null?void 0:c.dataset.vistaviewIndex,i=((l=this.currentImages)==null?void 0:l.find(h=>h.index===Number(t)))||null;if(!i)return;const n=i.imageElm?x(i.imageElm):void 0,e=i.anchorElm?x(i.anchorElm):void 0,r=(e==null?void 0:e.width)||(n==null?void 0:n.width)||0,d=(e==null?void 0:e.height)||(n==null?void 0:n.height)||0,o=((e==null?void 0:e.left)||(n==null?void 0:n.left)||0)+r/2,a=((e==null?void 0:e.top)||(n==null?void 0:n.top)||0)+d/2;this.rootElm.style.setProperty("--vistaview-container-initial-width",r+"px"),this.rootElm.style.setProperty("--vistaview-container-initial-height",d+"px"),this.rootElm.style.setProperty("--vistaview-container-initial-top",a+"px"),this.rootElm.style.setProperty("--vistaview-container-initial-left",o+"px"),this.rootElm.style.setProperty("--vistaview-image-border-radius",k(e==null?void 0:e.borderRadius)||k(n==null?void 0:n.borderRadius)||"0px")}updateZoomButtonsVisibility(){var e;const t=(e=this.rootElm)==null?void 0:e.querySelector('[data-vistaview-pos="0"] img.vistaview-image-highres');if(!t)return;const i=this;function n(){var l,h;const r=(l=i.rootElm)==null?void 0:l.querySelector("button.vistaview-zoom-in-btn"),d=(h=i.rootElm)==null?void 0:h.querySelector("button.vistaview-zoom-out-btn"),o=parseInt(t.style.width)||t.width,a=t.naturalWidth*i.options.maxZoomLevel,c=o<a&&a>0;r&&(r.style.display=c?"":"none"),d&&(d.style.display=c?"":"none")}t.complete&&t.naturalWidth>0?n():t.addEventListener("load",n)}loadImages(){if(!this.rootElm)return;this.rootElm.querySelectorAll(".vistaview-image-highres:not(.vistaview-image-loaded)").forEach((i,n)=>{const e=i,d=this.currentImages[n].imageElm,o={w:0,h:0};if(d){const{width:c,height:l}=j(d);o.w=Math.min(d.width,c),o.h=Math.min(d.height,l)}const a=()=>{var l,h;if((l=e.parentElement)!=null&&l.classList.contains("vistaview-image--ending"))return;const c=()=>{var m;o.w&&o.h&&(e.style.width=`${o.w}px`,e.style.height=`${o.h}px`,e.style.setProperty("--vistaview-fitted-width",`${o.w}px`),e.style.setProperty("--vistaview-fitted-height",`${o.h}px`)),e.classList.add("vistaview-image-loaded"),e.width=e.naturalWidth,e.height=e.naturalHeight,setTimeout(()=>{var v;(v=e.parentElement)!=null&&v.classList.contains("vistaview-image--ending")||this.setFullSizeImageDim(e)},100),(m=i.parentElement)!=null&&m.matches('[data-vistaview-pos="0"]')&&this.updateZoomButtonsVisibility()};if((h=this.rootElm)!=null&&h.classList.contains("vistaview--opened"))c();else{const m=setInterval(()=>{var v;(v=this.rootElm)!=null&&v.classList.contains("vistaview--opened")&&(clearInterval(m),c())},50)}};e.complete&&e.naturalWidth>0?a():e.onload=a})}setIndexDisplay(){this.elements.length!==1&&(this.rootElm.querySelector(".vistaview-index-display").textContent=`${this.currentIndex.value+1} / ${this.elements.length}`)}setCurrentDescription(){this.rootElm.querySelector(".vistaview-description").textContent=(this.currentImages[1]||this.currentImages[0]).alt||""}getCurrentIndexes(t){const i=this.options.preloads,n=this.elements.length,e=n<1||!i?[t]:[...new Set([...Array.from({length:i},(d,o)=>((t-i+o)%n+n)%n),t,...Array.from({length:i},(d,o)=>(t+1+o)%n)])],r=n<1||!i?[0]:e.map((d,o)=>o-Math.floor(e.length/2));return{images:e,positions:r}}setKeyboardListeners(){this.onKeyDown=t=>{switch(t.key){case"ArrowLeft":t.preventDefault(),this.prev();break;case"ArrowRight":t.preventDefault(),this.next();break;case"ArrowUp":t.preventDefault(),this.zoomIn();break;case"ArrowDown":t.preventDefault(),this.zoomOut();break;case"Escape":t.preventDefault(),this.close();break}},window.addEventListener("keydown",this.onKeyDown)}setResizeListeners(){this.onResizeHandler=()=>{var i;this.setInitialDimPos();const t=(i=this.rootElm)==null?void 0:i.querySelectorAll(".vistaview-image-highres.vistaview-image-loaded");t==null||t.forEach(n=>{const e=n,{width:r,height:d}=W(e);e.classList.contains("vistaview-image--zooming")?(e.dataset.vistaviewInitialWidth=r.toString(),e.dataset.vistaviewInitialHeight=d.toString()):(e.style.width=`${r}px`,e.style.height=`${d}px`)})},window.addEventListener("resize",this.onResizeHandler)}open(t=0){var o,a,c,l,h,m,v,w,u,p,f,I,C;if(S.somethingOpened){console.error("VistaView: another instance is already opened. Returning.");return}if(S.somethingOpened=this,this.currentIndex._value=t,document.body.prepend(nt({controls:this.options.controls,isReducedMotion:this.isReducedMotion})),this.rootElm=document.querySelector("#vistaview-root"),this.imageContainerElm=((o=this.rootElm)==null?void 0:o.querySelector(".vistaview-image-container"))||null,!this.rootElm||!this.imageContainerElm)throw S.somethingOpened=null,new Error("Failed to create VistaView element");this.options.arrowOnSmallScreens||this.rootElm.classList.add("vistaview-no-arrows-sm");const{images:i,positions:n}=this.getCurrentIndexes(t);this.currentImages=this.getImages(i);const e=this.currentImages.map((y,L)=>X(y,n[L]));this.currentItems=e;const r={htmlElements:{from:null,to:this.currentItems},images:{from:null,to:this.currentImages},index:{from:null,to:t},via:this.currentIndex.via,container:this.imageContainerElm,elements:this.elements,isReducedMotion:this.isReducedMotion,navActive:this.navActive,isZoomed:this.isZoomed,options:this.options};this.userSetup(r),this.imageContainerElm.innerHTML="",this.currentItems.forEach(y=>{this.imageContainerElm.appendChild(y)});let d=0;this.rootElm.addEventListener("animationend",y=>{var L;y.currentTarget===this.rootElm&&(d++,d>=2&&((L=this.rootElm)==null||L.classList.add("vistaview--opened")))}),(a=this.rootElm.querySelector(".vistaview-close-btn"))==null||a.addEventListener("click",()=>this.close()),(c=this.rootElm.querySelector(".vistaview-zoom-in-btn"))==null||c.addEventListener("click",()=>this.zoomIn()),(l=this.rootElm.querySelector(".vistaview-zoom-out-btn"))==null||l.addEventListener("click",()=>this.zoomOut()),(h=this.rootElm.querySelector(".vistaview-prev-btn>button"))==null||h.addEventListener("click",()=>this.prev()),(m=this.rootElm.querySelector(".vistaview-next-btn>button"))==null||m.addEventListener("click",()=>this.next()),[...this.options.controls.topLeft||[],...this.options.controls.topRight||[],...this.options.controls.topCenter||[],...this.options.controls.bottomCenter||[],...this.options.controls.bottomLeft||[],...this.options.controls.bottomRight||[]].forEach(y=>{typeof y!="string"&&(this.customControls[y.name]=y)}),this.rootElm.querySelectorAll("button[data-vistaview-custom-control]").forEach(y=>{y.addEventListener("click",L=>{const b=this.customControls[L.currentTarget.dataset.vistaviewCustomControl],D=this.currentImages.find(T=>T.index===this.currentIndex.value);b&&D&&(b.onClick.constructor.name==="AsyncFunction"?(y.classList.add("vistaview-button--loading"),b.onClick(D).finally(()=>{y.classList.remove("vistaview-button--loading")})):b.onClick(D))})}),this.options.animationDurationBase&&this.rootElm.style.setProperty("--vistaview-animation-duration",`${this.options.animationDurationBase}`),this.options.initialZIndex!==void 0&&this.rootElm.style.setProperty("--vistaview-initial-z-index",`${this.options.initialZIndex}`),this.setInitialDimPos(),this.setResizeListeners(),this.options.keyboardListeners&&this.setKeyboardListeners(),this.elements.length===1&&((v=this.rootElm.querySelector(".vistaview-prev-btn"))==null||v.classList.add("vistaview-ui--none"),(w=this.rootElm.querySelector(".vistaview-next-btn"))==null||w.classList.add("vistaview-ui--none"),(u=this.rootElm.querySelector(".vistaview-index-display"))==null||u.classList.add("vistaview-ui--none")),this.rootElm&&this.rootElm.classList.add("vistaview--initialized"),this.loadImages(),this.setCurrentDescription(),this.setIndexDisplay(),this.userInit(this),(f=(p=this.options).onOpen)==null||f.call(p,r),(C=(I=this.options).onImageView)==null||C.call(I,r)}async close(t=!0){var n,e,r;if(S.somethingOpened!==this)return;t&&((n=this.rootElm)==null||n.classList.add("vistaview--closing"),await new Promise(d=>{var a;let o;(a=this.rootElm)==null||a.addEventListener("transitionend",c=>{c.currentTarget===this.rootElm&&(o&&clearTimeout(o),o=setTimeout(()=>{d()},333))})}));const i={htmlElements:{from:this.currentItems,to:null},images:{from:this.currentImages,to:null},index:{from:this.currentIndex.value,to:null},container:this.imageContainerElm,elements:this.elements,via:{prev:!1,next:!1},isReducedMotion:this.isReducedMotion,navActive:this.navActive,isZoomed:this.isZoomed,options:this.options};this.userClose(this),(r=(e=this.options).onClose)==null||r.call(e,i),document.body.removeChild(this.rootElm),this.currentIndex._value=null,this.currentIndex._via={next:!1,prev:!1},this.rootElm=null,this.imageContainerElm=null,this.currentImages=null,this.currentItems=null,this.navActive=!0,this.onResizeHandler&&(window.removeEventListener("resize",this.onResizeHandler),this.onResizeHandler=null),this.onKeyDown&&(window.removeEventListener("keydown",this.onKeyDown),this.onKeyDown=null),(this.onZoomedPointerDown||this.onZoomedPointerMove||this.onZoomedPointerUp)&&(this.setZoomed(!1),this.onZoomedPointerDown=null,this.onZoomedPointerMove=null,this.onZoomedPointerUp=null);for(const d in this.transitionAbortControllers)this.transitionAbortControllers[d].abort();this.transitionAbortControllers={},S.somethingOpened=null}destroy(){this.close(!1),this.elements instanceof NodeList&&this.elements.forEach(t=>{t.dataset.vistaviewIndex&&delete t.dataset.vistaviewIndex,t.removeEventListener("click",this.defaultOnClickHandler),t.removeEventListener("pointerup",this.onClickElements)})}view(t,i){S.somethingOpened===this&&this.navActive&&(t<0&&(t=this.elements.length-1),t>=this.elements.length&&(t=0),this.currentIndex.via=i||{next:!1,prev:!1},this.currentIndex.value=t)}next(){S.somethingOpened===this&&this.view(this.currentIndex.value+1,{next:!0,prev:!1})}prev(){S.somethingOpened===this&&this.view(this.currentIndex.value-1,{next:!1,prev:!0})}getCurrentIndex(){return S.somethingOpened===this?this.currentIndex.value:-1}}function ot(s){let t=null;if(typeof s=="string"?t=document.querySelectorAll(s):s instanceof NodeList&&(t=s),t)for(let i=0;i<t.length;i++){const n=t[i];if(!(n.dataset.vistaviewSrc||n.getAttribute("href")||n.getAttribute("src")||""))return`Element at index ${i} is missing 'src' / 'data-vistaview-src' / 'href' attribute.`}else{const i=s;for(let n=0;n<i.length;n++)if(!i[n].src)return`Element at index ${n} is missing 'src' attribute.`}return t||s}function rt({elements:s,...t}){if(!s)throw new Error("No elements");let i=ot(s);if(typeof i=="string")return console.error(i),console.warn("VistaView: silently returning."),null;const n=new st(i,t);return{open:(e=0)=>n.open(e),close:()=>n.close(),next:()=>n.next(),prev:()=>n.prev(),destroy:()=>n.destroy(),getCurrentIndex:()=>n.getCurrentIndex(),view:e=>{n.view(e)}}}E.DefaultOptions=H,E.VistaViewTransitionAbortedError=A,E.defaultClose=N,E.defaultInit=B,E.defaultSetup=F,E.defaultTransition=_,E.removeTouchActions=R,E.setTouchActions=Y,E.vistaView=rt,E.vistaViewDownload=V,Object.defineProperty(E,Symbol.toStringTag,{value:"Module"})}));
16
+ </div>`)}let M=null,$=null,Z=null,z=null;function Y(s){R(s);const t=s.imageContainerElm,i=s.elements.length;if(!t)return;let n=0,e=0,r=0,d=0,o=null,a=0,c=!1;M=l=>{l.preventDefault(),l.stopPropagation(),s.isZoomed===!1&&(c=!0,n=l.pageX,e=l.pageY,r=l.pageX,d=l.pageY,a=Date.now(),o=null,t.setPointerCapture(l.pointerId))},$=l=>{if(l.preventDefault(),l.stopPropagation(),s.isZoomed!==!1||!c)return;const h=l.pageX-n,v=l.pageY-e;r=l.pageX,d=l.pageY,Math.abs(h)>=Math.abs(v)&&(o===null||o===!0)?(t.style.setProperty("--vistaview-pointer-diff-x",`${h}px`),o=!0):Math.abs(v)>Math.abs(h)&&(o===null||o===!1)&&(t.style.setProperty("--vistaview-pointer-diff-y",`${v}px`),o=!1)},z=l=>{if(l.preventDefault(),l.stopPropagation(),t.releasePointerCapture(l.pointerId),s.isZoomed!==!1||!c)return;c=!1,o=null;const h=Array.from(t.querySelectorAll(".vistaview-item"));t.style.removeProperty("--vistaview-pointer-diff-x"),t.style.removeProperty("--vistaview-pointer-diff-y"),h.forEach(v=>{v.style.transition="",v.style.translate=""})},Z=l=>{if(l.preventDefault(),l.stopPropagation(),t.releasePointerCapture(l.pointerId),s.isZoomed!==!1||!c)return;c=!1;const h=Array.from(t.querySelectorAll(".vistaview-item")),v=r-n,f=d-e,m=Date.now()-a,u=v/m,E=f/m,g=s.options.touchSpeedThreshold||.5,I=h.find(b=>b.dataset.vistaviewPos==="0"),C=Number(I.dataset.vistaviewIndex);function p(){h[0].removeEventListener("transitionend",p),t.style.removeProperty("--vistaview-pointer-diff-x"),t.style.removeProperty("--vistaview-pointer-diff-y"),h.forEach(b=>{b.style.transition="",b.style.translate=""})}function L(b="0%",S="0%"){h.forEach(T=>{T.style.transition=`translate ${s.options.animationDurationBase*.5}ms ease-out`,T.style.translate=`${b} ${S}`})}if(u<-g||u>g){let b=function(){h[0].removeEventListener("transitionend",b),setTimeout(()=>{const S=s.isReducedMotion;s.isReducedMotion=!0,p(),s.view(u<-g?(C+1)%i:(C-1+i)%i,{next:u<-g,prev:u>g}),s.isReducedMotion=S},100)};L(u<-g?"-100%":"100%"),h[0].addEventListener("transitionend",b)}else E<-g||E>g?(s.close(),L("0%","0%")):(h[0].addEventListener("transitionend",p),L("0%"),u===0&&E===0&&s.zoomIn())},t.addEventListener("pointermove",$),t.addEventListener("pointerup",Z),t.addEventListener("pointerdown",M),t.addEventListener("pointercancel",z)}function R(s){const t=s.imageContainerElm;t&&($&&t.removeEventListener("pointermove",$),Z&&t.removeEventListener("pointerup",Z),M&&t.removeEventListener("pointerdown",M),z&&t.removeEventListener("pointercancel",z))}const B=s=>{Y(s)},F=({htmlElements:{to:s},index:{to:t},elements:i})=>{i instanceof NodeList&&t!==null&&(i.forEach(n=>n.style.opacity="1"),i[t].style.opacity="0"),s&&s.forEach(n=>{const e=Number(n.dataset.vistaviewPos);e!==0?(n.style.zIndex="1",n.style.left=100*e+"%"):n.style.zIndex="2"})},_=async({htmlElements:{from:s,to:t},images:{to:i},via:{next:n,prev:e},options:r,isReducedMotion:d},o)=>{if(!i)throw new Error("VistaView: images is null in defaultTransition()");if(d)return;const a=s.filter(c=>c.dataset.vistaviewPos==="0"||(n?c.dataset.vistaviewPos==="1":c.dataset.vistaviewPos==="-1"));await new Promise((c,l)=>{let h=0;if(o.aborted){l(new A("Transition aborted"));return}const v=f=>{if(o.aborted)return l(new A("Transition aborted"));if(f.currentTarget.removeEventListener("transitionend",v),h++,h<a.length)return;const m=t==null?void 0:t.find(p=>p.dataset.vistaviewPos==="0"),u=m?Number(m.dataset.vistaviewIndex):0,E=a.find(p=>Number(p.dataset.vistaviewIndex)===u),g=E==null?void 0:E.querySelector(".vistaview-image-highres");if(!g)return l(new Error("current image element not found"));if(!g.classList.contains("vistaview-image-loaded")||g.classList.contains("vistaview-image-settled"))return c(0);let I=0;const C=setInterval(()=>{if(o.aborted)return clearInterval(C),l(new A("Transition aborted"));if(I++,I>r.animationDurationBase/20*1.5)return clearInterval(C),c(0);if(g.classList.contains("vistaview-image-settled"))return m==null||m.classList.add("vistaview-image-settled"),clearInterval(C),c(0)},20)};a.forEach(f=>{f.style.transition=`translate ${r.animationDurationBase*.5}ms ease-out`,f.style.translate=n?"-100%":e?"100%":"0%",f.addEventListener("transitionend",v)})})},N=s=>{s.elements instanceof NodeList&&s.elements.forEach(t=>t.style.opacity="1"),R(s)};class A extends Error{constructor(t){super(t),this.name="VistaViewTransitionAbortedError"}}const H={detectReducedMotion:!0,animationDurationBase:333,zoomStep:500,maxZoomLevel:2,touchSpeedThreshold:.5,preloads:1,keyboardListeners:!0,arrowOnSmallScreens:!1,controls:{topLeft:["indexDisplay"],topRight:["zoomIn","zoomOut",V(),"close"],bottomCenter:["description"]}},D={somethingOpened:null};class st{constructor(t,i){w(this,"options");w(this,"elements");w(this,"isReducedMotion");w(this,"currentIndex",{_value:null,_vistaView:null,_via:{next:!1,prev:!1},set value(t){var n,e,r;const i=this._value;this._value=t;for(const d in(n=this._vistaView)==null?void 0:n.transitionAbortControllers)(e=this._vistaView)==null||e.transitionAbortControllers[d].abort();(r=this._vistaView)==null||r.swap(i,this._value)},get value(){return this._value},get via(){return this._via},set via(t){this._via=t}});w(this,"rootElm",null);w(this,"imageContainerElm",null);w(this,"customControls",{});w(this,"currentImages",null);w(this,"currentItems",null);w(this,"navActive",!0);w(this,"isZoomed",!1);w(this,"onClickElements",t=>{t.preventDefault();const i=t.currentTarget;i.dataset.vistaviewIndex&&this.open(parseInt(i.dataset.vistaviewIndex))});w(this,"defaultOnClickHandler",t=>t.preventDefault());w(this,"onResizeHandler",null);w(this,"onKeyDown",null);w(this,"userSetup",F);w(this,"userTransition",_);w(this,"userClose",N);w(this,"userInit",B);w(this,"onZoomedPointerDown",null);w(this,"onZoomedPointerMove",null);w(this,"onZoomedPointerUp",null);w(this,"transitionAbortControllers",{});w(this,"loadImageTimeout",null);this.elements=t,this.currentIndex._vistaView=this,this.options={...H,...i||{},controls:{...H.controls,...(i==null?void 0:i.controls)||{}}},this.options.initFunction&&(this.userInit=this.options.initFunction),this.options.transitionFunction&&(this.userTransition=this.options.transitionFunction),this.options.closeFunction&&(this.userClose=this.options.closeFunction),this.options.initFunction&&(this.userInit=this.options.initFunction),this.isReducedMotion=window.matchMedia("(prefers-reduced-motion: reduce)").matches,this.elements instanceof NodeList&&this.elements.forEach((n,e)=>{n.dataset.vistaviewIndex=e.toString(),n.addEventListener("click",this.defaultOnClickHandler),n.addEventListener("pointerup",this.onClickElements)})}setFullSizeImageDim(t){var r,d;const i=t.getBoundingClientRect(),{width:n,height:e}=W(t);if(n===i.width&&e===i.height)(d=(r=t.parentElement)==null?void 0:r.querySelector(".vistaview-image-lowres"))==null||d.classList.add("vistaview-image--hidden"),t.classList.add("vistaview-image-settled");else{let o=0;const a=()=>{var c,l;o++,!(o<3)&&(t.removeEventListener("transitionend",a),(l=(c=t.parentElement)==null?void 0:c.querySelector(".vistaview-image-lowres"))==null||l.classList.add("vistaview-image--hidden"),t.classList.add("vistaview-image-settled"))};requestAnimationFrame(()=>{t.addEventListener("transitionend",a),t.style.width=`${n}px`,t.style.height=`${e}px`})}}async swap(t,i){var l,h;if(!D.somethingOpened||t===i||t===null)return;if(!this.imageContainerElm)throw new Error("VistaView: imageContainerElm is null in swap()");this.setIndexDisplay(),this.clearZoom();const{images:n,positions:e}=this.getCurrentIndexes(i),r=this.getImages(n),d=r.map((v,f)=>X(v,e[f])),o={htmlElements:{from:this.currentItems,to:d},images:{from:this.currentImages,to:r},index:{from:t,to:i},via:this.currentIndex.via,container:this.imageContainerElm,elements:this.elements,isReducedMotion:this.isReducedMotion,navActive:this.navActive,isZoomed:this.isZoomed,options:this.options};this.userSetup(o);const a=Math.random().toString(36).substring(2,15)+Math.random().toString(36).substring(2,15);this.transitionAbortControllers[a]=new AbortController;try{await this.userTransition(o,this.transitionAbortControllers[a].signal)}catch(v){v instanceof A||console.warn(v)}const c=d.find(v=>v.dataset.vistaviewPos==="0");if(c){const v=c.dataset.vistaviewIndex,f=this.currentItems.find(u=>u.dataset.vistaviewIndex===v),m=f==null?void 0:f.querySelector(".vistaview-image-highres");if(m){const u=c.querySelector(".vistaview-image-highres");if(u.setAttribute("class",m.getAttribute("class")||""),u.setAttribute("style",m.getAttribute("style")||""),u.classList.remove("vistaview-image--zooming"),m.classList.contains("vistaview-image-loaded")&&!m.classList.contains("vistaview-image-settled")){const E=m.getBoundingClientRect();u.style.width=`${E.width}px`,u.style.height=`${E.height}px`}}}delete this.transitionAbortControllers[a],this.imageContainerElm.innerHTML="",d.forEach(v=>{var E;const f=v.querySelector(".vistaview-image-highres"),m=!!f.classList.contains("vistaview-image-loaded"),u=!!f.classList.contains("vistaview-image-settled");this.imageContainerElm.appendChild(v),m&&!u?this.setFullSizeImageDim(f):m&&u&&((E=v==null?void 0:v.querySelector(".vistaview-image-lowres"))==null||E.classList.add("vistaview-image--hidden"))}),this.setInitialDimPos(),this.currentImages=r,this.currentItems=d,this.setCurrentDescription(),this.updateZoomButtonsVisibility(),(h=(l=this.options).onImageView)==null||h.call(l,o),this.loadImageTimeout&&clearTimeout(this.loadImageTimeout),this.loadImageTimeout=setTimeout(()=>{this.loadImages()},333)}setZoomed(t){var i,n,e,r,d,o;if(this.isZoomed!==t){if(this.isZoomed){let a=this.isZoomed;if(a.classList.remove("vistaview-image--zooming"),this.onZoomedPointerDown&&((i=a.parentElement)==null||i.removeEventListener("pointerdown",this.onZoomedPointerDown),this.onZoomedPointerDown=null),this.onZoomedPointerMove&&((n=a.parentElement)==null||n.removeEventListener("pointermove",this.onZoomedPointerMove),this.onZoomedPointerMove=null),this.onZoomedPointerUp&&((e=a.parentElement)==null||e.removeEventListener("pointerup",this.onZoomedPointerUp),this.onZoomedPointerUp=null),a==null||a.style.removeProperty("--pointer-diff-x"),a==null||a.style.removeProperty("--pointer-diff-y"),setTimeout(()=>{a==null||a.classList.remove("vistaview-image--zooming")},500),this.isZoomed=!1,!t)return}if(t){this.isZoomed=t,t.classList.add("vistaview-image--zooming"),t==null||t.style.setProperty("--pointer-diff-x","0px"),t==null||t.style.setProperty("--pointer-diff-y","0px");let a=!1,c=0,l=0,h=0,v=0,f=0,m=0;this.onZoomedPointerDown=u=>{u.preventDefault(),u.stopPropagation(),a=!0,c=u.pageX,l=u.pageY,t.setPointerCapture(u.pointerId)},this.onZoomedPointerMove=u=>{if(!a)return;u.preventDefault(),f=u.pageX-c,m=u.pageY-l;const E=parseInt((t==null?void 0:t.dataset.vistaviewCurrentWidth)||"0"),g=parseInt((t==null?void 0:t.dataset.vistaviewCurrentHeight)||"0"),{maxDiffX:I,minDiffY:C,maxDiffY:p,minDiffX:L}=O(E,g),b=Math.min(I,Math.max(L,h+f)),S=Math.min(p,Math.max(C,v+m));f=b-h,m=S-v,t==null||t.style.setProperty("--pointer-diff-x",`${b}px`),t==null||t.style.setProperty("--pointer-diff-y",`${S}px`)},this.onZoomedPointerUp=u=>{a=!1,t.releasePointerCapture(u.pointerId),h+=f,v+=m,f=0,m=0},(r=t==null?void 0:t.parentElement)==null||r.addEventListener("pointerdown",this.onZoomedPointerDown),(d=t==null?void 0:t.parentElement)==null||d.addEventListener("pointermove",this.onZoomedPointerMove),(o=t==null?void 0:t.parentElement)==null||o.addEventListener("pointerup",this.onZoomedPointerUp);return}}}zoomIn(){var r,d,o,a,c;const t=(r=this.rootElm)==null?void 0:r.querySelector('[data-vistaview-pos="0"] .vistaview-image-highres'),i=t.width,n=t.height;t.dataset.vistaviewInitialWidth||(t.dataset.vistaviewInitialWidth=i.toString()),t.dataset.vistaviewInitialHeight||(t.dataset.vistaviewInitialHeight=n.toString()),this.setZoomed(t);const e=(t.naturalWidth||0)*this.options.maxZoomLevel;if(i&&e&&i<e){const l=Math.min(i+this.options.zoomStep,e);t.style.width=`${l}px`;const h=l/i*n;t.style.height=`${h}px`,(o=(d=this.rootElm)==null?void 0:d.querySelector("button.vistaview-zoom-out-btn"))==null||o.removeAttribute("disabled"),t.dataset.vistaviewCurrentWidth=l.toString(),t.dataset.vistaviewCurrentHeight=h.toString(),l===e&&((c=(a=this.rootElm)==null?void 0:a.querySelector("button.vistaview-zoom-in-btn"))==null||c.setAttribute("disabled","true"))}}zoomOut(){var d,o,a,c,l;const t=(d=this.rootElm)==null?void 0:d.querySelector('[data-vistaview-pos="0"] .vistaview-image-highres'),i=t.width,n=t.height,e=t.dataset.vistaviewInitialWidth?parseInt(t.dataset.vistaviewInitialWidth):0,r=h=>{h.target===t&&(t.classList.remove("vistaview-image--zooming-out"),t.removeEventListener("transitionend",r))};if(t.addEventListener("transitionend",r),t.classList.add("vistaview-image--zooming-out"),i&&e&&i>e){const h=Math.max(i-this.options.zoomStep,e);t.style.width=`${h}px`;const v=h/i*n;t.style.height=`${v}px`,(a=(o=this.rootElm)==null?void 0:o.querySelector("button.vistaview-zoom-in-btn"))==null||a.removeAttribute("disabled"),t.dataset.vistaviewCurrentWidth=h.toString(),t.dataset.vistaviewCurrentHeight=v.toString();const{maxDiffX:f,minDiffY:m,maxDiffY:u,minDiffX:E}=O(h,v);let g=parseInt((t==null?void 0:t.style.getPropertyValue("--pointer-diff-x").replace("px",""))||"0"),I=parseInt((t==null?void 0:t.style.getPropertyValue("--pointer-diff-y").replace("px",""))||"0");g=Math.min(f,Math.max(E,g)),I=Math.min(u,Math.max(m,I)),t==null||t.style.setProperty("--pointer-diff-x",`${g}px`),t==null||t.style.setProperty("--pointer-diff-y",`${I}px`),h===e&&((l=(c=this.rootElm)==null?void 0:c.querySelector("button.vistaview-zoom-out-btn"))==null||l.setAttribute("disabled","true"),t.removeAttribute("data-vistaview-current-width"),t.removeAttribute("data-vistaview-current-height"),t.removeAttribute("data-vistaview-initial-width"),t.removeAttribute("data-vistaview-initial-height"),this.setZoomed(!1))}}clearZoom(){}getImages(t){return t.map((i,n)=>{const e=this.elements[i];if(e instanceof HTMLElement){const r=e.querySelector("img"),d=e.getAttribute("href")||"",o=e.getAttribute("src")||"",a=e.dataset.vistaviewSrc||d||o||(r==null?void 0:r.src)||"",c=e.dataset.vistaviewAlt||e.getAttribute("alt")||(r==null?void 0:r.alt)||"",l=e.dataset.vistaviewThumb||(r==null?void 0:r.src)||d||o||"";return{index:t[n],src:a,alt:c,thumb:l,imageElm:e instanceof HTMLImageElement?e:r,anchorElm:e instanceof HTMLAnchorElement?e:void 0}}else return{index:t[n],...e}})}setInitialDimPos(){var c,l;if(!this.rootElm)return;const t=(c=this.rootElm.querySelector('[data-vistaview-pos="0"]'))==null?void 0:c.dataset.vistaviewIndex,i=((l=this.currentImages)==null?void 0:l.find(h=>h.index===Number(t)))||null;if(!i)return;const n=i.imageElm?x(i.imageElm):void 0,e=i.anchorElm?x(i.anchorElm):void 0,r=(e==null?void 0:e.width)||(n==null?void 0:n.width)||0,d=(e==null?void 0:e.height)||(n==null?void 0:n.height)||0,o=((e==null?void 0:e.left)||(n==null?void 0:n.left)||0)+r/2,a=((e==null?void 0:e.top)||(n==null?void 0:n.top)||0)+d/2;this.rootElm.style.setProperty("--vistaview-container-initial-width",r+"px"),this.rootElm.style.setProperty("--vistaview-container-initial-height",d+"px"),this.rootElm.style.setProperty("--vistaview-container-initial-top",a+"px"),this.rootElm.style.setProperty("--vistaview-container-initial-left",o+"px"),this.rootElm.style.setProperty("--vistaview-image-border-radius",k(e==null?void 0:e.borderRadius)||k(n==null?void 0:n.borderRadius)||"0px")}updateZoomButtonsVisibility(){var e;const t=(e=this.rootElm)==null?void 0:e.querySelector('[data-vistaview-pos="0"] img.vistaview-image-highres');if(!t)return;const i=this;function n(){var l,h;const r=(l=i.rootElm)==null?void 0:l.querySelector("button.vistaview-zoom-in-btn"),d=(h=i.rootElm)==null?void 0:h.querySelector("button.vistaview-zoom-out-btn"),o=parseInt(t.style.width)||t.width,a=t.naturalWidth*i.options.maxZoomLevel,c=o<a&&a>0;r&&(r.style.display=c?"":"none"),d&&(d.style.display=c?"":"none")}t.complete&&t.naturalWidth>0?n():t.addEventListener("load",n)}loadImages(){if(!this.rootElm)return;this.rootElm.querySelectorAll(".vistaview-image-highres:not(.vistaview-image-loaded)").forEach((i,n)=>{const e=i,d=this.currentImages[n].imageElm,o={w:0,h:0};if(d){const{width:c,height:l}=j(d);o.w=Math.min(d.width,c),o.h=Math.min(d.height,l)}const a=()=>{var l;const c=()=>{var h;o.w&&o.h&&(e.style.width=`${o.w}px`,e.style.height=`${o.h}px`,e.style.setProperty("--vistaview-fitted-width",`${o.w}px`),e.style.setProperty("--vistaview-fitted-height",`${o.h}px`)),e.classList.add("vistaview-image-loaded"),e.width=e.naturalWidth,e.height=e.naturalHeight,setTimeout(()=>{this.setFullSizeImageDim(e)},100),(h=i.parentElement)!=null&&h.matches('[data-vistaview-pos="0"]')&&this.updateZoomButtonsVisibility()};if((l=this.rootElm)!=null&&l.classList.contains("vistaview--opened"))c();else{const h=setInterval(()=>{var v;(v=this.rootElm)!=null&&v.classList.contains("vistaview--opened")&&(clearInterval(h),c())},50)}};e.complete&&e.naturalWidth>0?a():e.onload=a})}setIndexDisplay(){this.elements.length!==1&&(this.rootElm.querySelector(".vistaview-index-display").textContent=`${this.currentIndex.value+1} / ${this.elements.length}`)}setCurrentDescription(){this.rootElm.querySelector(".vistaview-description").textContent=(this.currentImages[1]||this.currentImages[0]).alt||""}getCurrentIndexes(t){const i=this.options.preloads,n=this.elements.length,e=n<1||!i?[t]:[...new Set([...Array.from({length:i},(d,o)=>((t-i+o)%n+n)%n),t,...Array.from({length:i},(d,o)=>(t+1+o)%n)])],r=n<1||!i?[0]:e.map((d,o)=>o-Math.floor(e.length/2));return{images:e,positions:r}}setKeyboardListeners(){this.onKeyDown=t=>{switch(t.key){case"ArrowLeft":t.preventDefault(),this.prev();break;case"ArrowRight":t.preventDefault(),this.next();break;case"ArrowUp":t.preventDefault(),this.zoomIn();break;case"ArrowDown":t.preventDefault(),this.zoomOut();break;case"Escape":t.preventDefault(),this.close();break}},window.addEventListener("keydown",this.onKeyDown)}setResizeListeners(){this.onResizeHandler=()=>{var i;this.setInitialDimPos();const t=(i=this.rootElm)==null?void 0:i.querySelectorAll(".vistaview-image-highres.vistaview-image-loaded");t==null||t.forEach(n=>{const e=n,{width:r,height:d}=W(e);e.classList.contains("vistaview-image--zooming")?(e.dataset.vistaviewInitialWidth=r.toString(),e.dataset.vistaviewInitialHeight=d.toString()):(e.style.width=`${r}px`,e.style.height=`${d}px`)})},window.addEventListener("resize",this.onResizeHandler)}open(t=0){var o,a,c,l,h,v,f,m,u,E,g,I,C;if(D.somethingOpened){console.error("VistaView: another instance is already opened. Returning.");return}if(D.somethingOpened=this,this.currentIndex._value=t,document.body.prepend(nt({controls:this.options.controls,isReducedMotion:this.isReducedMotion})),this.rootElm=document.querySelector("#vistaview-root"),this.imageContainerElm=((o=this.rootElm)==null?void 0:o.querySelector(".vistaview-image-container"))||null,!this.rootElm||!this.imageContainerElm)throw D.somethingOpened=null,new Error("Failed to create VistaView element");this.options.arrowOnSmallScreens||this.rootElm.classList.add("vistaview-no-arrows-sm");const{images:i,positions:n}=this.getCurrentIndexes(t);this.currentImages=this.getImages(i);const e=this.currentImages.map((p,L)=>X(p,n[L]));this.currentItems=e;const r={htmlElements:{from:null,to:this.currentItems},images:{from:null,to:this.currentImages},index:{from:null,to:t},via:this.currentIndex.via,container:this.imageContainerElm,elements:this.elements,isReducedMotion:this.isReducedMotion,navActive:this.navActive,isZoomed:this.isZoomed,options:this.options};this.userSetup(r),this.imageContainerElm.innerHTML="",this.currentItems.forEach(p=>{this.imageContainerElm.appendChild(p)});let d=0;this.rootElm.addEventListener("animationend",p=>{var L;p.currentTarget===this.rootElm&&(d++,d>=2&&((L=this.rootElm)==null||L.classList.add("vistaview--opened")))}),(a=this.rootElm.querySelector(".vistaview-close-btn"))==null||a.addEventListener("click",()=>this.close()),(c=this.rootElm.querySelector(".vistaview-zoom-in-btn"))==null||c.addEventListener("click",()=>this.zoomIn()),(l=this.rootElm.querySelector(".vistaview-zoom-out-btn"))==null||l.addEventListener("click",()=>this.zoomOut()),(h=this.rootElm.querySelector(".vistaview-prev-btn>button"))==null||h.addEventListener("click",()=>this.prev()),(v=this.rootElm.querySelector(".vistaview-next-btn>button"))==null||v.addEventListener("click",()=>this.next()),[...this.options.controls.topLeft||[],...this.options.controls.topRight||[],...this.options.controls.topCenter||[],...this.options.controls.bottomCenter||[],...this.options.controls.bottomLeft||[],...this.options.controls.bottomRight||[]].forEach(p=>{typeof p!="string"&&(this.customControls[p.name]=p)}),this.rootElm.querySelectorAll("button[data-vistaview-custom-control]").forEach(p=>{p.addEventListener("click",L=>{const b=this.customControls[L.currentTarget.dataset.vistaviewCustomControl],S=this.currentImages.find(T=>T.index===this.currentIndex.value);b&&S&&(b.onClick.constructor.name==="AsyncFunction"?(p.classList.add("vistaview-button--loading"),b.onClick(S).finally(()=>{p.classList.remove("vistaview-button--loading")})):b.onClick(S))})}),this.options.animationDurationBase&&this.rootElm.style.setProperty("--vistaview-animation-duration",`${this.options.animationDurationBase}`),this.options.initialZIndex!==void 0&&this.rootElm.style.setProperty("--vistaview-initial-z-index",`${this.options.initialZIndex}`),this.setInitialDimPos(),this.setResizeListeners(),this.options.keyboardListeners&&this.setKeyboardListeners(),this.elements.length===1&&((f=this.rootElm.querySelector(".vistaview-prev-btn"))==null||f.classList.add("vistaview-ui--none"),(m=this.rootElm.querySelector(".vistaview-next-btn"))==null||m.classList.add("vistaview-ui--none"),(u=this.rootElm.querySelector(".vistaview-index-display"))==null||u.classList.add("vistaview-ui--none")),this.rootElm&&this.rootElm.classList.add("vistaview--initialized"),this.loadImages(),this.setCurrentDescription(),this.setIndexDisplay(),this.userInit(this),(g=(E=this.options).onOpen)==null||g.call(E,r),(C=(I=this.options).onImageView)==null||C.call(I,r)}async close(t=!0){var n,e,r;if(D.somethingOpened!==this)return;t&&((n=this.rootElm)==null||n.classList.add("vistaview--closing"),await new Promise(d=>{var a;let o;(a=this.rootElm)==null||a.addEventListener("transitionend",c=>{c.currentTarget===this.rootElm&&(o&&clearTimeout(o),o=setTimeout(()=>{d()},333))})}));const i={htmlElements:{from:this.currentItems,to:null},images:{from:this.currentImages,to:null},index:{from:this.currentIndex.value,to:null},container:this.imageContainerElm,elements:this.elements,via:{prev:!1,next:!1},isReducedMotion:this.isReducedMotion,navActive:this.navActive,isZoomed:this.isZoomed,options:this.options};this.userClose(this),(r=(e=this.options).onClose)==null||r.call(e,i),document.body.removeChild(this.rootElm),this.currentIndex._value=null,this.currentIndex._via={next:!1,prev:!1},this.rootElm=null,this.imageContainerElm=null,this.currentImages=null,this.currentItems=null,this.navActive=!0,this.onResizeHandler&&(window.removeEventListener("resize",this.onResizeHandler),this.onResizeHandler=null),this.onKeyDown&&(window.removeEventListener("keydown",this.onKeyDown),this.onKeyDown=null),(this.onZoomedPointerDown||this.onZoomedPointerMove||this.onZoomedPointerUp)&&(this.setZoomed(!1),this.onZoomedPointerDown=null,this.onZoomedPointerMove=null,this.onZoomedPointerUp=null);for(const d in this.transitionAbortControllers)this.transitionAbortControllers[d].abort();this.transitionAbortControllers={},D.somethingOpened=null}destroy(){this.close(!1),this.elements instanceof NodeList&&this.elements.forEach(t=>{t.dataset.vistaviewIndex&&delete t.dataset.vistaviewIndex,t.removeEventListener("click",this.defaultOnClickHandler),t.removeEventListener("pointerup",this.onClickElements)})}view(t,i){D.somethingOpened===this&&this.navActive&&(t<0&&(t=this.elements.length-1),t>=this.elements.length&&(t=0),this.currentIndex.via=i||{next:!1,prev:!1},this.currentIndex.value=t)}next(){D.somethingOpened===this&&this.view(this.currentIndex.value+1,{next:!0,prev:!1})}prev(){D.somethingOpened===this&&this.view(this.currentIndex.value-1,{next:!1,prev:!0})}getCurrentIndex(){return D.somethingOpened===this?this.currentIndex.value:-1}}function ot(s){let t=null;if(typeof s=="string"?t=document.querySelectorAll(s):s instanceof NodeList&&(t=s),t)for(let i=0;i<t.length;i++){const n=t[i];if(!(n.dataset.vistaviewSrc||n.getAttribute("href")||n.getAttribute("src")||""))return`Element at index ${i} is missing 'src' / 'data-vistaview-src' / 'href' attribute.`}else{const i=s;for(let n=0;n<i.length;n++)if(!i[n].src)return`Element at index ${n} is missing 'src' attribute.`}return t||s}function rt({elements:s,...t}){if(!s)throw new Error("No elements");let i=ot(s);if(typeof i=="string")return console.error(i),console.warn("VistaView: silently returning."),null;const n=new st(i,t);return{open:(e=0)=>n.open(e),close:()=>n.close(),next:()=>n.next(),prev:()=>n.prev(),destroy:()=>n.destroy(),getCurrentIndex:()=>n.getCurrentIndex(),view:e=>{n.view(e)}}}y.DefaultOptions=H,y.VistaViewTransitionAbortedError=A,y.defaultClose=N,y.defaultInit=B,y.defaultSetup=F,y.defaultTransition=_,y.removeTouchActions=R,y.setTouchActions=Y,y.vistaView=rt,y.vistaViewDownload=V,Object.defineProperty(y,Symbol.toStringTag,{value:"Module"})}));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "vistaview",
3
- "version": "0.3.11",
3
+ "version": "0.3.12",
4
4
  "description": "A lightweight, zero-dependency image lightbox library with smooth animations and touch support",
5
5
  "keywords": [
6
6
  "image",