28 lines
16 KiB
JavaScript
28 lines
16 KiB
JavaScript
|
import{dh as t,dS as e,dg as n,eF as o,eG as a,eH as i,eI as r,eJ as s,eK as c,eL as l,a as d,s as h,x as u,eM as m,_ as p,n as f,b as v,t as g}from"./card-09c4bade.js";var _=function(){return _=Object.assign||function(t){for(var e,n=1,o=arguments.length;n<o;n++)for(var a in e=arguments[n])Object.prototype.hasOwnProperty.call(e,a)&&(t[a]=e[a]);return t},_.apply(this,arguments)};function w(t,e){for(var n=t.length;n--;)if(t[n].pointerId===e.pointerId)return n;return-1}function y(t,e){var n;if(e.touches){n=0;for(var o=0,a=e.touches;o<a.length;o++){var i=a[o];i.pointerId=n++,y(t,i)}}else(n=w(t,e))>-1&&t.splice(n,1),t.push(e)}function z(t){for(var e,n=(t=t.slice(0)).pop();e=t.pop();)n={clientX:(e.clientX-n.clientX)/2+n.clientX,clientY:(e.clientY-n.clientY)/2+n.clientY};return n}function b(t){if(t.length<2)return 0;var e=t[0],n=t[1];return Math.sqrt(Math.pow(Math.abs(n.clientX-e.clientX),2)+Math.pow(Math.abs(n.clientY-e.clientY),2))}"undefined"!=typeof window&&(window.NodeList&&!NodeList.prototype.forEach&&(NodeList.prototype.forEach=Array.prototype.forEach),"function"!=typeof window.CustomEvent&&(window.CustomEvent=function(t,e){e=e||{bubbles:!1,cancelable:!1,detail:null};var n=document.createEvent("CustomEvent");return n.initCustomEvent(t,e.bubbles,e.cancelable,e.detail),n}));var x={down:"mousedown",move:"mousemove",up:"mouseup mouseleave"};function S(t,e,n,o){x[t].split(" ").forEach((function(t){e.addEventListener(t,n,o)}))}function E(t,e,n){x[t].split(" ").forEach((function(t){e.removeEventListener(t,n)}))}function P(t){if(t.parentElement)return t.parentElement;var e=t.getRootNode();return e instanceof ShadowRoot&&e.host instanceof HTMLElement?e.host:void 0}"undefined"!=typeof window&&("function"==typeof window.PointerEvent?x={down:"pointerdown",move:"pointermove",up:"pointerup pointerleave pointercancel"}:"function"==typeof window.TouchEvent&&(x={down:"touchstart",move:"touchmove",up:"touchend touchcancel"}));var M,C="undefined"!=typeof document&&!!document.documentMode;function A(){return M||(M=document.createElement("div").style)}var O=["webkit","moz","ms"],X={};function Y(t){if(X[t])return X[t];var e=A();if(t in e)return X[t]=t;for(var n=t[0].toUpperCase()+t.slice(1),o=O.length;o--;){var a="".concat(O[o]).concat(n);if(a in e)return X[t]=a}}function H(t,e){return parseFloat(e[Y(t)])||0}function T(t,e,n){void 0===n&&(n=window.getComputedStyle(t));var o="border"===e?"Width":"";return{left:H("".concat(e,"Left").concat(o),n),right:H("".concat(e,"Right").concat(o),n),top:H("".concat(e,"Top").concat(o),n),bottom:H("".concat(e,"Bottom").concat(o),n)}}function L(t,e,n){t.style[Y(e)]=n}function U(t){var e=P(t),n=window.getComputedStyle(t),o=window.getComputedStyle(e),a=t.getBoundingClientRect(),i=e.getBoundingClientRect();return{elem:{style:n,width:a.width,height:a.height,top:a.top,bottom:a.bottom,left:a.left,right:a.right,margin:T(t,"margin",n),border:T(t,"border",n)},parent:{style:o,width:i.width,height:i.height,top:i.top,bottom:i.bottom,left:i.left,right:i.right,padding:T(e,"padding",o),border:T(e,"border",o)}}}function k(t,e){return 1===t.nodeType&&" ".concat(function(t){return(t.getAttribute("class")||"").trim()}(t)," ").indexOf(" ".concat(e," "))>-1}var Z=/^http:[\w\.\/]+svg$/;var D={animate:!1,canvas:!1,cursor:"move",disablePan:!1,disableZoom:!1,disableXAxis:!1,disableYAxis:!1,duration:200,easing:"ease-in-out",exclude:[],excludeClass:"panzoom-exclude",handleStartEvent:function(t){t.preventDefault(),t.stopPropagation()},maxScale:4,minScale:.125,overflow:"hidden",panOnlyWhenZoomed:!1,pinchAndPan:!1,relative:!1,setTransform:function(t,e,n){var o=e.x,a=e.y,i=e.scale,r=e.isSVG;if(L(t,"transform","scale(".concat(i,") translate(").concat(o,"px, ").concat(a,"px)")),r&&C){var s=window.getComputedStyle(t).getPropertyValue("transform");t.setAttribute("transform",s)}},startX:0,startY:0,startScale:1,step:.3,touchAction:"none"};function N(t,e){if(!t)throw new Error("Panzoom requires an element as an argument");if(1!==t.nodeType)throw new Error("Panzoom requires an element with a nodeType of 1");if(!function(t){for(var e=t;e&&e.parentN
|
||
|
/* istanbul ignore next @preserve */
|
||
|
i}});const n=(t,e,n)=>{t.forEach((t=>{this._element.addEventListener(t,e,n)}))};n(this._events.down,this._downHandler,{capture:!0}),n(this._events.move,this._moveHandler,{capture:!0}),n(this._events.up,this._upHandler,{capture:!0}),n(["wheel"],this._wheelHandler),n(["click"],this._clickHandler,{capture:!0}),this._resizeObserver.observe(this._element),this._element.addEventListener("panzoomchange",this._debouncedChangeHandler)}deactivate(){const t=(t,e,n)=>{t.forEach((t=>{this._element.removeEventListener(t,e,n)}))};t(this._events.down,this._downHandler,{capture:!0}),t(this._events.move,this._moveHandler,{capture:!0}),t(this._events.up,this._upHandler,{capture:!0}),t(["wheel"],this._wheelHandler),t(["click"],this._clickHandler,{capture:!0}),this._resizeObserver.disconnect(),this._element.removeEventListener("panzoomchange",this._debouncedChangeHandler)}setDefaultSettings(t){this._defaultSettings=t,this._debouncedUpdater()}setSettings(t){this._settings=t,this._debouncedUpdater()}_changeHandler(t){const e=t.detail,i=this._isUnzoomed(e.scale);i&&this._zoomed?(this._zoomed=!1,this._setTouchAction(!0),n(this._element,"zoom:unzoomed")):i||this._zoomed||(this._zoomed=!0,this._setTouchAction(!1),n(this._element,"zoom:zoomed"));const r=this._convertXYPanToPercent(e.x,e.y,e.scale),s={pan:{x:r?.x??o,y:r?.y??a},zoom:e.scale,isDefault:this._isAtDefaultZoomAndPan(e.x,e.y,e.scale),unzoomed:i};n(this._element,"zoom:change",s)}_isZoomEqual(t,e){return r(
|
||
|
/* istanbul ignore next @preserve */
|
||
|
t.zoom??i,
|
||
|
/* istanbul ignore next @preserve */
|
||
|
e.zoom??i,l)&&r(
|
||
|
/* istanbul ignore next @preserve */
|
||
|
t.pan?.x??o,
|
||
|
/* istanbul ignore next @preserve */
|
||
|
e.pan?.x??o,l)&&r(
|
||
|
/* istanbul ignore next @preserve */
|
||
|
t.pan?.y??a,
|
||
|
/* istanbul ignore next @preserve */
|
||
|
e.pan?.y??a,l)}_getConfigToUse(){return s(this._settings)?this._defaultSettings:this._settings}_updateBasedOnConfig(){if(!this._panzoom)return;const t=this._getConfigToUse(),e=t?.zoom??i,n=this._convertPercentToXYPan(t?.pan?.x??o,t?.pan?.y??a,e),r=n?.x??0,s=n?.y??0;this._isZoomEqual({zoom:e,pan:{x:r,y:s}},{zoom:this._panzoom.getScale(),pan:this._panzoom.getPan()})||(this._panzoom.zoom(e,{animate:!1}),window.requestAnimationFrame((()=>{this._panzoom?.pan(r,s,{animate:!0,duration:100})})))}_convertPercentToXYPan(t,e,n){const o=this._getTransformMinMax(n,this._panzoom?.getScale());return null===o?null:{x:o.minX+(o.maxX-o.minX)*(t/100),y:o.minY+(o.maxY-o.minY)*(e/100)}}_convertXYPanToPercent(t,e,n){const o=this._getTransformMinMax(n,this._panzoom?.getScale());return null===o?null:{x:(-t+Math.abs(o.minX))/(Math.abs(o.maxX)+Math.abs(o.minX))*100,y:(-e+Math.abs(o.minY))/(Math.abs(o.maxY)+Math.abs(o.minY))*100}}_getTransformMinMax(t,e){const n=this._getRenderedSize(e);if(!n.width||!n.height)return null;const o=n.width*(t-1)/t/2,a=n.height*(t-1)/t/2;return r(o,0)||r(a,0)?null:{minX:o,maxX:-o,minY:a,maxY:-a}}_getRenderedSize(t){const e=this._element.getBoundingClientRect();return{width:e.width/(t??i),height:e.height/(t??i)}}_isUnzoomed(t){return void 0!==t&&c(t,l)<=1}_isAtDefaultZoomAndPan(t,e,n){if(!this._defaultSettings)return this._isUnzoomed(n);const s=this._convertPercentToXYPan(this._defaultSettings.pan?.x??o,this._defaultSettings.pan?.y??a,this._defaultSettings.zoom??i);return!s||r(t,s.x)&&r(e,s.y)&&r(n,this._defaultSettings.zoom??
|
||
|
/* istanbul ignore next @preserve */
|
||
|
i)}_shouldZoomOrPan(t){return!this._isUnzoomed(this._panzoom?.getScale())||window.TouchEvent&&t instanceof TouchEvent&&t.touches.length>1||t instanceof WheelEvent&&t.ctrlKey}_setTouchAction(t){this._element.style.touchAction=t?"":"none"}}let W=class extends d{constructor(){super(...arguments),this._zoom=null,this._zoomed=!1,this._zoomHandler=()=>this._zoomed=!0,this._unzoomHandler=()=>this._zoomed=!1}connectedCallback(){super.connectedCallback(),this.addEventListener("frigate-card:zoom:zoomed",this._zoomHandler),this.addEventListener("frigate-card:zoom:unzoomed",this._unzoomHandler),this.requestUpdate()}disconnectedCallback(){this._zoom?.deactivate(),this.removeEventListener("frigate-card:zoom:zoomed",this._zoomHandler),this.removeEventListener("frigate-card:zoom:unzoomed",this._unzoomHandler)}willUpdate(t){t.has("_zoomed")&&h(this,this._zoomed,"zoomed"),this._zoom?(t.has("defaultSettings")&&this._zoom.setDefaultSettings(this.defaultSettings??null),t.has("settings")&&this.settings&&this._zoom.setSettings(this.settings)):(this._zoom=new R(this,{config:this.settings,defaultConfig:this.defaultSettings}),this._zoom.activate())}render(){return u` <slot></slot> `}static get styles(){return m`
|
||
|
:host {
|
||
|
width: 100%;
|
||
|
height: 100%;
|
||
|
display: block;
|
||
|
cursor: auto;
|
||
|
}
|
||
|
:host([zoomed]) {
|
||
|
cursor: move;
|
||
|
}
|
||
|
`}};p([f({attribute:!1})],W.prototype,"defaultSettings",void 0),p([f({attribute:!1})],W.prototype,"settings",void 0),p([v()],W.prototype,"_zoomed",void 0),W=p([g("frigate-card-zoomer")],W);export{W as FrigateCardZoomer};
|