@fancyapps/ui/dist/panzoom/panzoom.js

Robust JavaScript UI Component Library

/*! License details at fancyapps.com/license */
import{isString as e}from"../utils/isString.js";import{isNode as t}from"../utils/isNode.js";import{getScrollableParent as n}from"../utils/getScrollableParent.js";import{stringToHtml as o}from"../utils/strToHtml.js";import{clamp as i}from"../utils/clamp.js";import{Tween as a}from"../libs/tween.js";import{getMidpoint as s,getChangedPosition as r,Gestures as l}from"../libs/gestures.js";import{en_EN as c}from"./l10n/en_EN.js";import{addClass as u}from"../utils/addClass.js";import{removeClass as d}from"../utils/removeClass.js";import{toggleClass as f}from"../utils/toggleClass.js";import{isEqual as g}from"../utils/isEqual.js";const h=e=>{e.cancelable&&e.preventDefault()},m=(e,t=1e4)=>(e=parseFloat(e+"")||0,Math.round((e+Number.EPSILON)*t)/t),p=e=>e instanceof HTMLImageElement;var v,b;!function(e){e.Reset="reset",e.Zoom="zoom",e.ZoomIn="zoomIn",e.ZoomOut="zoomOut",e.ZoomTo="zoomTo",e.ToggleCover="toggleCover",e.ToggleFull="toggleFull",e.ToggleMax="toggleMax",e.IterateZoom="iterateZoom",e.Pan="pan",e.Swipe="swipe",e.Move="move",e.MoveLeft="moveLeft",e.MoveRight="moveRight",e.MoveUp="moveUp",e.MoveDown="moveDown",e.RotateCCW="rotateCCW",e.RotateCW="rotateCW",e.FlipX="flipX",e.FlipY="flipY",e.ToggleFS="toggleFS"}(v||(v={})),function(e){e.Cover="cover",e.Full="full",e.Max="max"}(b||(b={}));const y={x:0,y:0,scale:1,angle:0,flipX:1,flipY:1},x={bounds:!0,classes:{container:"f-panzoom",wrapper:"f-panzoom__wrapper",content:"f-panzoom__content",viewport:"f-panzoom__viewport"},clickAction:v.ToggleFull,dblClickAction:!1,gestures:{},height:"auto",l10n:c,maxScale:4,minScale:1,mouseMoveFactor:1,panMode:"drag",protected:!1,singleClickAction:!1,spinnerTpl:'<div class="f-spinner"></div>',wheelAction:v.Zoom,width:"auto"};let w,M=0,k=0,j=0;const E=(c,b={},E={})=>{let S,O,A,C,T,F,Z,L,P=0,X=Object.assign(Object.assign({},x),b),Y={},R=Object.assign({},y),z=Object.assign({},y);const D=[];function I(e){let t=X[e];return t&&"function"==typeof t?t(je):t}function W(){return c&&c.parentElement&&S&&3===P}const q=new Map;function H(e,...t){const n=[...q.get(e)||[]];X.on&&n.push(X.on[e]);for(const e of n)e&&e instanceof Function&&e(je,...t);"*"!==e&&H("*",e,...t)}function $(e){if(!W())return;const t=e.target;if(n(t))return;const o=Date.now(),a=[-e.deltaX||0,-e.deltaY||0,-e.detail||0].reduce((function(e,t){return Math.abs(t)>Math.abs(e)?t:e})),s=i(-1,a,1);H("wheel",e,s);const r=I("wheelAction");if(!r)return;if(e.defaultPrevented)return;const l=z.scale;let c=l*(s>0?1.5:.5);if(r===v.Zoom){const t=Math.abs(e.deltaY)<100&&Math.abs(e.deltaX)<100;if(o-k<(t?200:45))return void h(e);k=o;const n=ne(),a=se();if(m(c)<m(n)&&m(l)<=m(n)?(j+=Math.abs(s),c=n):m(c)>m(a)&&m(l)>=m(a)?(j+=Math.abs(s),c=a):(j=0,c=i(n,c,a)),j>7)return}switch(h(e),r){case v.Pan:ue(r,{srcEvent:e,deltaX:2*-e.deltaX,deltaY:2*-e.deltaY});break;case v.Zoom:ue(v.ZoomTo,{srcEvent:e,scale:c,center:{x:e.clientX,y:e.clientY}});break;default:ue(r,{srcEvent:e})}}function _(e){var n,o;const i=e.composedPath()[0];if(!l.isClickAllowed())return;if(!t(i)||e.defaultPrevented)return;if(!(null==c?void 0:c.contains(i)))return;if(i.hasAttribute("disabled")||i.hasAttribute("aria-disabled")||i.hasAttribute("data-carousel-go-prev")||i.hasAttribute("data-carousel-go-next"))return;const a=i.closest("[data-panzoom-action]"),s=null===(n=null==a?void 0:a.dataset)||void 0===n?void 0:n.panzoomAction,r=(null===(o=null==a?void 0:a.dataset)||void 0===o?void 0:o.panzoomValue)||"";if(s){switch(h(e),s){case v.ZoomTo:case v.ZoomIn:case v.ZoomOut:ue(s,{scale:parseFloat(r||"")||void 0});break;case v.MoveLeft:case v.MoveRight:ue(s,{deltaX:parseFloat(r||"")||void 0});break;case v.MoveUp:case v.MoveDown:ue(s,{deltaY:parseFloat(r||"")||void 0});break;case v.ToggleFS:Me();break;default:ue(s)}return}if(!(null==S?void 0:S.contains(i)))return;const u={srcEvent:e};if(ue(I("clickAction"),u),I("dblClickAction")){const e=Date.now(),t=e-(M||e);M=e,t>0&&t<=250?(w&&(clearTimeout(w),w=void 0),ue(I("dblClickAction"),u)):w=setTimeout((()=>{ue(I("singleClickAction"),u)}),250)}}function B(e){if(L=e,!W()||!Q())return;if(R.scale<=1||z.scale<=1)return;if(((null==S?void 0:S.dataset.animationName)||"").indexOf("zoom")>-1)return;const t=ee(z.scale);if(!t)return;const{x:n,y:o}=t;ue(v.Pan,{deltaX:n-z.x,deltaY:o-z.y})}function N(){var e;c&&(d(c,"is-loading"),null===(e=c.querySelector(".f-spinner"))||void 0===e||e.remove())}function V(){if(!c||!O)return;if(N(),p(O)&&(!O.complete||!O.naturalWidth))return P=2,null==S||S.classList.add("has-error"),void H("error");H("loaded");const{width:e,height:t}=J();p(O)&&(O.setAttribute("width",e+""),O.setAttribute("height",t+"")),S&&(d(S,"has-error"),p(O)&&(S.setAttribute("width",e+""),S.setAttribute("height",t+""),S.style.aspectRatio=`${e/t||""}`)),F=a().on("start",((e,t)=>{void 0!==t.angle&&(t.angle=90*Math.round(t.angle/90)),void 0!==t.flipX&&(t.flipX=t.flipX>0?1:-1),void 0!==t.flipY&&(t.flipY=t.flipY>0?1:-1),z=Object.assign(Object.assign({},y),t),ce(),H("animationStart")})).on("pause",(e=>{z=Object.assign(Object.assign({},y),e)})).on("step",(e=>{if(!W())return void(null==F||F.end());if(R=Object.assign(Object.assign({},y),e),Q()||!I("bounds")||ye()||z.scale>R.scale||z.scale<oe())return void de();const t=re(z.scale);let n=!1,o=!1,a=!1,s=!1;R.x<t.x[0]&&(n=!0),R.x>t.x[1]&&(o=!0),R.y<t.y[0]&&(s=!0),R.y>t.y[1]&&(a=!0);let r=!1,l=!1,c=!1,u=!1;z.x<t.x[0]&&(r=!0),z.x>t.x[1]&&(l=!0),z.y<t.y[0]&&(u=!0),z.y>t.y[1]&&(c=!0);let d=!1;(o&&l||n&&r)&&(z.x=i(t.x[0],z.x,t.x[1]),d=!0),(a&&c||s&&u)&&(z.y=i(t.y[0],z.y,t.y[1]),d=!0),d&&F&&F.spring({tension:94,friction:17,maxSpeed:555*z.scale,restDelta:.1,restSpeed:.1,velocity:F.getCurrentVelocities()}).from(R).to(z).start(),de()})).on("end",(()=>{(null==T?void 0:T.isPointerDown())||le(),(null==F?void 0:F.isRunning())||(ce(),H("animationEnd"))})),function(){const e=I("gestures");if(!e)return;if(!C||!O)return;let t=!1;T=l(C,e).on("start",(e=>{if(!I("gestures"))return;if(!F)return;if(!W()||Q())return;const n=e.srcEvent;(R.scale>1||e.currentTouch.length>1)&&(null==n||n.stopPropagation(),F.pause(),t=!0),1===e.currentTouch.length&&H("touchStart")})).on("move",(e=>{var n;t&&(1!==z.scale||e.currentTouch.length>1)&&(h(e.srcEvent),null===(n=e.srcEvent)||void 0===n||n.stopPropagation())})).on("pan",(e=>{if(!t)return;const n=e.srcEvent;(1!==z.scale||e.currentTouch.length>1)&&(h(n),ue(v.Pan,e))})).on("swipe",(e=>{t&&z.scale>1&&ue(v.Swipe,e)})).on("tap",(e=>{H("click",e)})).on("singleTap",(e=>{H("singleClick",e)})).on("doubleTap",(e=>{H("dblClick",e)})).on("pinch",(e=>{t&&(e.scale>oe()?ue(v.ZoomIn,e):e.scale<oe()?ue(v.ZoomOut,e):ue(v.Pan,e))})).on("end",(e=>{t&&(e.currentTouch.length?(e.srcEvent.stopPropagation(),h(e.srcEvent),null==F||F.end()):(t=!1,ce(),le(),H("touchEnd")))})).init()}(),C&&(C.addEventListener("wheel",$,{passive:!1}),D.push((()=>{null==C||C.removeEventListener("wheel",$,{passive:!1})}))),null==c||c.addEventListener("click",_),null===document||void 0===document||document.addEventListener("mousemove",B),D.push((()=>{null==c||c.removeEventListener("click",_),null===document||void 0===document||document.removeEventListener("mousemove",B)}));const n=U();R=Object.assign({},n),z=Object.assign({},n),P=3,de(),ce(),H("ready"),requestAnimationFrame((()=>{N(),C&&(C.style.visibility="")}))}function U(){const e=Object.assign({},I("startPos")||{});let t=e.scale,n=1;n="string"==typeof t?te(t):"number"==typeof t?t:oe();const o=Object.assign(Object.assign(Object.assign({},y),e),{scale:n}),i=Q()?ee(n):void 0;if(i){const{x:e,y:t}=i;o.x=e,o.y=t}return o}function G(){const e={top:0,left:0,width:0,height:0};if(S){const t=S.getBoundingClientRect();z.angle%180==90?(e.top=t.top+.5*t.height-.5*t.width,e.left=t.left+.5*t.width-.5*t.height,e.width=t.height,e.height=t.width):(e.top=t.top,e.left=t.left,e.width=t.width,e.height=t.height)}return e}function J(){let t=I("width"),n=I("height");if(O&&"auto"===t){const e=O.getAttribute("width");t=e?parseFloat(e+""):void 0!==O.dataset.width?parseFloat(O.dataset.width+""):p(C)?C.naturalWidth:p(O)?O.naturalWidth:(null==S?void 0:S.getBoundingClientRect().width)||0}else t=e(t)?parseFloat(t):t;if(O&&"auto"===n){const e=O.getAttribute("height");n=e?parseFloat(e+""):void 0!==O.dataset.height?parseFloat(O.dataset.height+""):p(C)?C.naturalHeight:p(O)?O.naturalHeight:(null==S?void 0:S.getBoundingClientRect().height)||0}else n=e(n)?parseFloat(n):n;return{width:t,height:n}}function K(){const e=G();return{width:e.width,height:e.height}}function Q(){return"mousemove"===I("panMode")&&matchMedia("(hover: hover)").matches}function ee(e){const t=L||I("event"),n=null==S?void 0:S.getBoundingClientRect();if(!t||!n||e<=1)return{x:0,y:0};const o=(t.clientX||0)-n.left,a=(t.clientY||0)-n.top,{width:s,height:r}=K(),l=re(e);if(e>1){const t=I("mouseMoveFactor");t>1&&(e*=t)}let c=s*e,u=r*e,d=.5*(c-s)-o/s*100/100*(c-s),f=.5*(u-r)-a/r*100/100*(u-r);return d=i(l.x[0],d,l.x[1]),f=i(l.y[0],f,l.y[1]),{x:d,y:f}}function te(e="base"){if(!c)return 1;const t=c.getBoundingClientRect(),n=G(),{width:o,height:a}=J(),s=e=>{if("number"==typeof e)return e;switch(e){case"min":case"base":return 1;case"cover":return Math.max(t.height/n.height,t.width/n.width)||1;case"full":case"max":{const e=z.angle%180==90?a:o;return e&&n.width?e/n.width:1}}},r=I("minScale"),l=I("maxScale"),u=Math.min(s("full"),s(r)),d="number"==typeof l?s("full")*l:Math.min(s("full"),s(l));switch(e){case"min":return u;case"base":return i(u,1,d);case"cover":return s("cover");case"full":return Math.min(d,s("full"));case"max":return d}}function ne(){return te("min")}function oe(){return te("base")}function ie(){return te("cover")}function ae(){return te("full")}function se(){return te("max")}function re(e){const t={x:[0,0],y:[0,0]},n=null==c?void 0:c.getBoundingClientRect();if(!n)return t;const o=G(),i=n.width,a=n.height;let s=o.width,r=o.height,l=e=void 0===e?z.scale:e,u=e;if(Q()&&e>1){const t=I("mouseMoveFactor");t>1&&(s*e>i+.01&&(l*=t),r*e>a+.01&&(u*=t))}return s*=l,r*=u,e>1&&(s>i&&(t.x[0]=.5*(i-s),t.x[1]=.5*(s-i)),t.x[0]-=.5*(o.left-n.left),t.x[1]-=.5*(o.left-n.left),t.x[0]-=.5*(o.left+o.width-n.right),t.x[1]-=.5*(o.left+o.width-n.right),r>a&&(t.y[0]=.5*(a-r),t.y[1]=.5*(r-a)),t.y[0]-=.5*(o.top-n.top),t.y[1]-=.5*(o.top-n.top),t.y[0]-=.5*(o.top+o.height-n.bottom),t.y[1]-=.5*(o.top+o.height-n.bottom)),t}function le(){if(!W())return;if(!I("bounds"))return;if(!F)return;const e=ne(),t=se(),n=i(e,z.scale,t);if(z.scale<e-.01||z.scale>t+.01)return void ue(v.ZoomTo,{scale:n});if(F.isRunning())return;if(ye())return;const o=re(n);z.x<o.x[0]||z.x>o.x[1]||z.y<o.y[0]||z.y>o.y[1]?(z.x=i(o.x[0],z.x,o.x[1]),z.y=i(o.y[0],z.y,o.y[1]),F.spring({tension:170,friction:17,restDelta:.001,restSpeed:.001,maxSpeed:1/0,velocity:F.getCurrentVelocities()}),F.from(R).to(z).start()):de()}function ce(e){var t;if(!W())return;const n=be(),o=ye(),i=xe(),a=we(),s=ge(),r=he();f(S,"is-fullsize",a),f(S,"is-expanded",i),f(S,"is-dragging",o),f(S,"can-drag",n),f(S,"will-zoom-in",s),f(S,"will-zoom-out",r);const l=pe(),u=ve(),d=me(),g=!W();for(const n of(null===(t=e||c)||void 0===t?void 0:t.querySelectorAll("[data-panzoom-action]"))||[]){const e=n.dataset.panzoomAction;let t=!1;if(g)t=!0;else switch(e){case v.ZoomIn:l||(t=!0);break;case v.ZoomOut:d||(t=!0);break;case v.ToggleFull:{u||d||(t=!0);const e=n.querySelector("g");e&&(e.style.display=a&&!t?"none":"");break}case v.IterateZoom:{l||d||(t=!0);const e=n.querySelector("g");e&&(e.style.display=l||t?"":"none");break}case v.ToggleCover:case v.ToggleMax:l||d||(t=!0)}t?(n.setAttribute("aria-disabled",""),n.setAttribute("tabindex","-1")):(n.removeAttribute("aria-disabled"),n.removeAttribute("tabindex"))}}function ue(e,t){var n;if(!(e&&c&&O&&F&&W()))return;if(e===v.Swipe&&Math.abs(F.getCurrentVelocities().scale)>.01)return;const o=Object.assign({},z);let a=Object.assign({},z),l=re(Q()?o.scale:R.scale);const u=F.getCurrentVelocities(),d=G(),f=((null===(n=(t=t||{}).currentTouch)||void 0===n?void 0:n.length)||0)>1,h=t.velocityX||0,m=t.velocityY||0;let p=t.center;t.srcEvent&&(p=s(r(t.srcEvent)));let b=t.deltaX||0,x=t.deltaY||0;switch(e){case v.MoveRight:b=t.deltaX||100;break;case v.MoveLeft:b=t.deltaX||-100;break;case v.MoveUp:x=t.deltaY||-100;break;case v.MoveDown:x=t.deltaY||100}let w=[];switch(e){case v.Reset:a=Object.assign({},y),a.scale=oe();break;case v.Pan:case v.Move:case v.MoveLeft:case v.MoveRight:case v.MoveUp:case v.MoveDown:if(ye()){let e=1,t=1;a.x<=l.x[0]&&h<=0&&(e=Math.max(.01,1-Math.abs(1/d.width*Math.abs(a.x-l.x[0]))),e*=.2),a.x>=l.x[1]&&h>=0&&(e=Math.max(.01,1-Math.abs(1/d.width*Math.abs(a.x-l.x[1]))),e*=.2),a.y<=l.y[0]&&m<=0&&(t=Math.max(.01,1-Math.abs(1/d.height*Math.abs(a.y-l.y[0]))),t*=.2),a.y>=l.y[1]&&m>=0&&(t=Math.max(.01,1-Math.abs(1/d.height*Math.abs(a.y-l.y[1]))),t*=.2),a.x+=b*e,a.y+=x*t}else a.x=i(l.x[0],a.x+b,l.x[1]),a.y=i(l.y[0],a.y+x,l.y[1]);break;case v.Swipe:const e=(e=0)=>Math.sign(e)*Math.pow(Math.abs(e),1.5);a.x+=i(-1e3,e(h),1e3),a.y+=i(-1e3,e(m),1e3),m&&!h&&(a.x=i(l.x[0],a.x,l.x[1])),!m&&h&&(a.y=i(l.y[0],a.y,l.y[1])),u.x=h,u.y=m;break;case v.ZoomTo:a.scale=t.scale||1;break;case v.ZoomIn:a.scale=a.scale*(t.scale||2),f||(a.scale=Math.min(a.scale,se()));break;case v.ZoomOut:a.scale=a.scale*(t.scale||.5),f||(a.scale=Math.max(a.scale,ne()));break;case v.ToggleCover:w=[oe(),ie()];break;case v.ToggleFull:w=[oe(),ae()];break;case v.ToggleMax:w=[oe(),se()];break;case v.IterateZoom:w=[oe(),ae(),se()];break;case v.Zoom:const n=ae();a.scale>=n-.05?a.scale=oe():a.scale=Math.min(n,a.scale*(t.scale||2));break;case v.RotateCW:a.angle+=90;break;case v.RotateCCW:a.angle-=90;break;case v.FlipX:a.flipX*=-1;break;case v.FlipY:a.flipY*=-1}if(void 0!==R.angle&&Math.abs(R.angle)>=360&&(a.angle-=360*Math.floor(R.angle/360),R.angle-=360*Math.floor(R.angle/360)),w.length){const e=w.findIndex((e=>e>a.scale+1e-4));a.scale=w[e]||w[0]}if(f&&(a.scale=i(ne()*(f?.8:1),a.scale,se()*(f?1.6:1))),Q()){const e=ee(a.scale);if(e){const{x:t,y:n}=e;a.x=t,a.y=n}}else if(Math.abs(a.scale-o.scale)>1e-4){let e=0,t=0;if(p)e=p.x,t=p.y;else{const n=c.getBoundingClientRect();e=n.x+.5*n.width,t=n.y+.5*n.height}let n=e-d.left,s=t-d.top;n-=.5*d.width,s-=.5*d.height;const r=(n-o.x)/o.scale,u=(s-o.y)/o.scale;a.x=n-r*a.scale,a.y=s-u*a.scale,!f&&I("bounds")&&(l=re(a.scale),a.x=i(l.x[0],a.x,l.x[1]),a.y=i(l.y[0],a.y,l.y[1]))}if(e===v.Swipe){let e=94,t=17,n=500*a.scale,o=u;F.spring({tension:e,friction:t,maxSpeed:n,restDelta:.1,restSpeed:.1,velocity:o})}else e===v.Pan||f?F.spring({tension:900,friction:17,restDelta:.01,restSpeed:.01,maxSpeed:1}):F.spring({tension:170,friction:17,restDelta:.001,restSpeed:.001,maxSpeed:1/0,velocity:u});if(0===t.velocity||g(R,a))R=Object.assign({},a),z=Object.assign({},a),F.end(),de(),ce();else{if(g(z,a))return;F.from(R).to(a).start()}H("action",e)}function de(){if(!O||!S||!C)return;const{width:e,height:t}=J();Object.assign(S.style,{maxWidth:`min(${e}px, 100%)`,maxHeight:`min(${t}px, 100%)`});const n=function(){const{width:e,height:t}=J(),{width:n,height:o}=K();if(!c)return{x:0,y:0,width:0,height:0,scale:0,flipX:0,flipY:0,angle:0,fitWidth:n,fitHeight:o,fullWidth:e,fullHeight:t};let{x:i,y:a,scale:s,angle:r,flipX:l,flipY:u}=R,d=1/ae(),f=e,g=t,h=R.scale*d,m=z.scale*d;const p=Math.max(n,o),v=Math.min(n,o);e>t?(f=p,g=v):(f=v,g=p);h=e>t?p*s/e||1:p*s/t||1;let b=f?e*m:0,y=g?t*m:0,x=f&&g?e*h/b:0;return i=i+.5*f-.5*b,a=a+.5*g-.5*y,{x:i,y:a,width:b,height:y,scale:x,flipX:l,flipY:u,angle:r,fitWidth:n,fitHeight:o,fullWidth:e,fullHeight:t}}(),{x:o,y:i,width:a,height:s,scale:r,angle:l,flipX:u,flipY:d}=n;let f=`translate(${m(o)}px, ${m(i)}px)`;f+=1!==u||1!==d?` scaleX(${m(r*u)}) scaleY(${m(r*d)})`:` scale(${m(r)})`,0!==l&&(f+=` rotate(${l}deg)`),C.style.width=`${m(a)}px`,C.style.height=`${m(s)}px`,C.style.transform=`${f}`,H("render")}function fe(){let e=z.scale;const t=I("clickAction");let n=oe();if(t){let o=[];switch(t){case v.ZoomIn:n=2*e;break;case v.ZoomOut:n=.5*e;break;case v.ToggleCover:o=[oe(),ie()];break;case v.ToggleFull:o=[oe(),ae()];break;case v.ToggleMax:o=[oe(),se()];break;case v.IterateZoom:o=[oe(),ae(),se()];break;case v.Zoom:const t=ae();n=e>=t-.05?oe():Math.min(t,2*e)}if(o.length){const t=o.findIndex((t=>t>e+1e-4));n=o[t]||oe()}}return n=i(ne(),n,se()),n}function ge(){return!!(W()&&fe()>z.scale)}function he(){return!!(W()&&fe()<z.scale)}function me(){return!!(W()&&z.scale>ne())}function pe(){return!!(W()&&z.scale<se())}function ve(){return!!(W()&&z.scale<ae())}function be(){return!(!(W()&&xe()&&T)||Q())}function ye(){return!(!W()||!(null==T?void 0:T.isPointerDown())||Q())}function xe(){return!!(W()&&z.scale>oe())}function we(){return!!(W()&&z.scale>=ae())}function Me(){const e="in-fullscreen",t="with-panzoom-in-fullscreen";null==c||c.classList.toggle(e);const n=null==c?void 0:c.classList.contains(e);n?(document.documentElement.classList.add(t),document.addEventListener("keydown",ke,!0)):(document.documentElement.classList.remove(t),document.removeEventListener("keydown",ke,!0)),de(),H(n?"enterFS":"exitFS")}function ke(e){"Escape"!==e.key||e.defaultPrevented||Me()}const je={canDrag:be,canZoomIn:pe,canZoomOut:me,canZoomToFull:ve,destroy:function(){H("destroy");for(const e of Object.values(Y))null==e||e.destroy(je);for(const e of D)e();return S&&(S.style.aspectRatio="",S.style.maxWidth="",S.style.maxHeight=""),C&&(C.style.width="",C.style.height="",C.style.transform=""),S=void 0,O=void 0,C=void 0,R=Object.assign({},y),z=Object.assign({},y),null==F||F.destroy(),F=void 0,null==T||T.destroy(),T=void 0,P=4,je},emit:H,execute:ue,getBoundaries:re,getContainer:function(){return c},getContent:function(){return O},getFullDim:J,getGestures:function(){return T},getMousemovePos:ee,getOptions:function(){return X},getPlugins:function(){return Y},getScale:te,getStartPosition:U,getState:function(){return P},getTransform:function(e){return!0===e?z:R},getTween:function(){return F},getViewport:function(){return C},getWrapper:function(){return S},init:function(){return P=0,H("init"),function(){for(const[e,t]of Object.entries(Object.assign(Object.assign({},E),X.plugins||{})))if(e&&!Y[e]&&t instanceof Function){const n=t();n.init(je),Y[e]=n}H("initPlugins")}(),function(){const e=Object.assign(Object.assign({},x.classes),I("classes"));if(!c)return;if(u(c,e.container),O=c.querySelector("."+e.content),!O)return;O.setAttribute("draggable","false"),S=c.querySelector("."+e.wrapper),S||(S=document.createElement("div"),u(S,e.wrapper),O.insertAdjacentElement("beforebegin",S),S.insertAdjacentElement("afterbegin",O));C=c.querySelector("."+e.viewport),C||(C=document.createElement("div"),u(C,e.viewport),C.insertAdjacentElement("afterbegin",O),S.insertAdjacentElement("beforeend",C));A=O.cloneNode(!0),A.removeAttribute("id"),S.insertAdjacentElement("afterbegin",A),O instanceof HTMLPictureElement&&(O=O.querySelector("img"));A instanceof HTMLPictureElement&&(A=A.querySelector("img"));C instanceof HTMLPictureElement&&(C=C.querySelector("img"));if(C&&(C.style.visibility="hidden",I("protected"))){C.addEventListener("contextmenu",(e=>{h(e)}));const e=document.createElement("div");u(e,"f-panzoom__protected"),C.appendChild(e)}H("initLayout")}(),function(){if(c&&S&&!Z){let e=null;Z=new ResizeObserver((()=>{W()&&(e=e||requestAnimationFrame((()=>{W()&&(ce(),le(),H("refresh")),e=null})))})),Z.observe(S),D.push((()=>{null==Z||Z.disconnect(),Z=void 0,e&&(cancelAnimationFrame(e),e=null)}))}}(),function(){if(!c||!O)return;if(!p(O)||!p(A))return void V();const e=()=>{O&&p(O)&&O.decode().then((()=>{V()})).catch((()=>{V()}))};if(P=1,c.classList.add("is-loading"),H("loading"),A.src&&A.complete)return void e();(function(){if(!c)return;if(null==c?void 0:c.querySelector(".f-spinner"))return;const e=I("spinnerTpl"),t=o(e);t&&(t.classList.add("f-spinner"),c.classList.add("is-loading"),null==S||S.insertAdjacentElement("afterbegin",t))})(),A.addEventListener("load",e,!1),A.addEventListener("error",e,!1),D.push((()=>{null==A||A.removeEventListener("load",e,!1),null==A||A.removeEventListener("error",e,!1)}))}(),je},isDragging:ye,isExpanded:xe,isFullsize:we,isMousemoveMode:Q,localize:function(e,t=[]){const n=I("l10n")||{};e=String(e).replace(/\{\{(\w+)\}\}/g,((e,t)=>n[t]||e));for(let n=0;n<t.length;n++)e=e.split(t[n][0]).join(t[n][1]);return e=e.replace(/\{\{(.*?)\}\}/g,((e,t)=>t))},off:function(e,t){for(const n of e instanceof Array?e:[e])q.has(n)&&q.set(n,q.get(n).filter((e=>e!==t)));return je},on:function(e,t){for(const n of e instanceof Array?e:[e])q.set(n,[...q.get(n)||[],t]);return je},toggleFS:Me,updateControls:ce,version:"6.1.7",willZoomIn:ge,willZoomOut:he};return je};E.l10n={en_EN:c},E.getDefaults=()=>x;export{y as PANZOOM_DEFAULT_POS,E as Panzoom,v as PanzoomAction,b as PanzoomZoomLevel};