@niuee/board
Version:
<h1 align="center"> board </h1> <p align="center"> board supercharges your html canvas element giving it the capabilities to pan, zoom, rotate, and much more. </p> <p align="center"> <a href="https://www.npmjs.com/package/@niuee/board">
1 lines • 68 kB
JavaScript
const t=()=>{};class e{constructor(t,e,i){this._states=t,this._currentState=e,this._context=i,this._statesArray=Object.keys(t),this._stateChangeCallbacks=[],this._happensCallbacks=[]}switchTo(t){this._currentState=t}happens(t,e){this._happensCallbacks.forEach((i=>i(t,e,this._context)));const i=this._states[this._currentState].handles(t,e,this._context);if(void 0!==i&&i!==this._currentState){const t=this._currentState;this._states[this._currentState].uponLeave(this._context),this.switchTo(i),this._states[this._currentState].uponEnter(this._context),this._stateChangeCallbacks.forEach((e=>e(t,this._currentState)))}return i}onStateChange(t){this._stateChangeCallbacks.push(t)}onHappens(t){this._happensCallbacks.push(t)}get currentState(){return this._currentState}setContext(t){this._context=t}get possibleStates(){return this._statesArray}get states(){return this._states}}class i{constructor(){this._guards={},this._eventGuards={}}get guards(){return this._guards}get eventGuards(){return this._eventGuards}uponEnter(t){}uponLeave(t){}handles(t,e,i){if(this.eventReactions[t]){this.eventReactions[t].action(i,e);const o=this.eventReactions[t].defaultTargetState,n=this._eventGuards[t];if(n){const t=n.find((t=>!!this.guards[t.guard]&&this.guards[t.guard](i)));return t?t.target:o}return o}}}function o(t){return void 0===t||!(void 0!==t.min&&void 0!==t.max&&t.min>t.max)}function n(t,e){return a(t,e)||void 0===e||(e.max&&(t=Math.min(e.max,t)),e.min&&(t=Math.max(e.min,t))),t}function a(t,e){return void 0===e||!(t<=0||void 0!==e&&(void 0!==e.max&&e.max<t||void 0!==e.min&&e.min>t))}class s{static addVector(t,e){return null==t.z&&null==e.z?{x:t.x+e.x,y:t.y+e.y}:(null!=t.z&&null!=e.z||(null==t.z&&(t.z=0),null==e.z&&(e.z=0)),{x:t.x+e.x,y:t.y+e.y,z:t.z+e.z})}static subVector(t,e){return null==t.z&&null==e.z?{x:t.x-e.x,y:t.y-e.y}:(null!=t.z&&null!=e.z||(null==t.z&&(t.z=0),null==e.z&&(e.z=0)),{x:t.x-e.x,y:t.y-e.y,z:t.z-e.z})}static multiplyVectorByScalar(t,e){return null==t.z?{x:t.x*e,y:t.y*e}:{x:t.x*e,y:t.y*e,z:t.z*e}}static divideVectorByScalar(t,e){return 0==e?{x:t.x,y:t.y}:null==t.z?{x:t.x/e,y:t.y/e}:{x:t.x/e,y:t.y/e,z:t.z/e}}static magnitude(t){return null==t.z&&(t.z=0),Math.sqrt(t.x*t.x+t.y*t.y+t.z*t.z)}static unitVector(t){return null==t.z&&(t.z=0),0!=this.magnitude(t)?{x:t.x/this.magnitude(t),y:t.y/this.magnitude(t),z:t.z/this.magnitude(t)}:{x:0,y:0,z:0}}static dotProduct(t,e){return null==t.z&&null==e.z?t.x*e.x+t.y*e.y:(null!=t.z&&null!=e.z||(null==t.z&&(t.z=0),null==e.z&&(e.z=0)),t.x*e.x+t.y*e.y+t.z*e.z)}static crossProduct(t,e){return null!=t.z&&null!=e.z||(null==t.z&&(t.z=0),null==e.z&&(e.z=0)),{x:t.y*e.z-t.z*e.y,y:t.z*e.x-t.x*e.z,z:t.x*e.y-t.y*e.x}}static unitVectorFromA2B(t,e){return this.unitVector(this.subVector(e,t))}static rotatePoint(t,e){return{x:t.x*Math.cos(e)-t.y*Math.sin(e),y:t.x*Math.sin(e)+t.y*Math.cos(e)}}static transform2NewAxis(t,e){return{x:t.x*Math.cos(e)+t.y*Math.sin(e),y:-t.x*Math.sin(e)+t.y*Math.cos(e)}}static angleFromA2B(t,e){return Math.atan2(t.x*e.y-t.y*e.x,t.x*e.x+t.y*e.y)}static transformPointWRTAnchor(t,e,i){let o=this.rotatePoint(this.subVector(t,e),i);return this.addVector(o,e)}static distanceBetweenPoints(t,e){return this.magnitude(this.subVector(t,e))}static flipYAxis(t){return{x:t.x,y:-t.y,z:t.z}}static linearInterpolation(t,e,i){return null==t.z||null==e.z?{x:t.x+(e.x-t.x)*i,y:t.y+(e.y-t.y)*i}:{x:t.x+(e.x-t.x)*i,y:t.y+(e.y-t.y)*i,z:t.z+(e.z-t.z)*i}}static isEqual(t,e){return null==t.z&&(t.z=0),null==e.z&&(e.z=0),t.x==e.x&&t.y==e.y&&t.z==e.z}static getLineIntersection(t,e,i,o){const n=(o.x-i.x)*(t.y-i.y)-(o.y-i.y)*(t.x-i.x),a=(o.y-i.y)*(e.x-t.x)-(o.x-i.x)*(e.y-t.y);if(0===a)return{intersects:!1};const r=n/a;return r>=0&&r<=1?{intersects:!0,intersection:s.linearInterpolation(t,e,r),offset:r}:{intersects:!1}}}function r(t,e,i,o,n,a){let r={x:i/2,y:o/2},c=s.subVector(e,r);return c=s.multiplyVectorByScalar(c,1/n),c=s.rotatePoint(c,a),s.addVector(t,c)}function c(t,e,i,o,n,a){let r={x:e/2,y:i/2},c=s.subVector(t,r);return c=s.multiplyVectorByScalar(c,1/n),c=s.rotatePoint(c,a),s.addVector(o,c)}function l(t,e,i,o){const n=s.multiplyVectorByScalar(t,1/i),a=s.rotatePoint(n,o);return s.addVector(a,e)}function h(t,e,i,o){const n=s.subVector(t,e),a=s.multiplyVectorByScalar(n,i);return s.rotatePoint(a,-o)}function u(t,e,i,o,n,a){let r={x:e/2,y:i/2},c=s.subVector(t,o);return c=s.rotatePoint(c,-a),c=s.multiplyVectorByScalar(c,n),s.addVector(r,c)}function d(t,e,i,o,n,a){const s=u(t,e,i,o,n,a);return!(s.x<0||s.x>e||s.y<0||s.y>i)}function m(t,e,i){return s.multiplyVectorByScalar(s.rotatePoint(t,i),1/e)}function _(t,e,i){return s.multiplyVectorByScalar(s.rotatePoint(t,-i),e)}function y(t,e,i,o){const n=s.multiplyVectorByScalar(e,1/i),a=s.rotatePoint(n,o);return s.subVector(t,a)}function p(t,e){if(null==e)return!0;let i=!1,o=!1,n=!1,a=!1;return(null==e.max||null==e.max.x||t.x<=e.max.x)&&(o=!0),(null==e.min||null==e.min.x||t.x>=e.min.x)&&(i=!0),(null==e.max||null==e.max.y||t.y<=e.max.y)&&(n=!0),(null==e.min||null==e.min.y||t.y>=e.min.y)&&(a=!0),i&&o&&n&&a}function v(t){var e,i,o,n;if(null==t)return!0;const a=null===(e=t.min)||void 0===e?void 0:e.x,s=null===(i=t.max)||void 0===i?void 0:i.x;if(null!=a&&null!=s&&a>=s)return!1;const r=null===(o=t.min)||void 0===o?void 0:o.y,c=null===(n=t.max)||void 0===n?void 0:n.y;return!(null!=r&&null!=c&&r>=c)}function x(t){return null!=t&&(null!=t.max&&null!=t.min&&(null!=t.max.x&&null!=t.max.y&&null!=t.min.x&&null!=t.min.y))}function f(t,e){if(p(t,e)||null==e)return t;let i={x:t.x,y:t.y},o=e.min;return null!=o&&(null!=o.x&&(i.x=Math.max(i.x,o.x)),null!=o.y&&(i.y=Math.max(i.y,o.y))),o=e.max,null!=o&&(null!=o.x&&(i.x=Math.min(i.x,o.x)),null!=o.y&&(i.y=Math.min(i.y,o.y))),i}function P(t){if(null!=t&&null!=t.min&&null!=t.max&&null!=t.min.x&&null!=t.max.x)return t.max.x-t.min.x}function g(t){const e=P(t);return null!=e?e/2:void 0}function b(t){if(null!=t&&null!=t.min&&null!=t.max&&null!=t.min.y&&null!=t.max.y)return t.max.y-t.min.y}function T(t){const e=b(t);return null!=e?e/2:void 0}function w(t,e,i,o,n,a){if(null==o)return t;let c=r(t,{x:0,y:i},e,i,n,a),l=r(t,{x:0,y:0},e,i,n,a),h=r(t,{x:e,y:i},e,i,n,a),u=r(t,{x:e,y:0},e,i,n,a),d=f(c,o),m=f(h,o),_=f(l,o),y=f(u,o),p=[s.subVector(d,c),s.subVector(m,h),s.subVector(_,l),s.subVector(y,u)],v=Math.abs(p[0].x),x=Math.abs(p[0].y),P=p[0];return p.forEach((t=>{Math.abs(t.x)>v&&(v=Math.abs(t.x),P.x=t.x),Math.abs(t.y)>x&&(x=Math.abs(t.y),P.y=t.y)})),s.addVector(t,P)}function B(t,e){if(I(t,e)||void 0===e)return t;t=z(t);const i=C(e.start,t),o=C(e.end,t);if(e.ccw&&(i<0||o>0)||!e.ccw&&(i>0||o<0)){if(Math.abs(i)===Math.abs(o))return e.startAsTieBreaker?e.start:e.end;return Math.abs(i)<Math.abs(o)?e.start:e.end}return t}function I(t,e){if(void 0===e)return!0;if(z(e.start)===z(e.end))return!0;const i=z(t),o=C(e.start,i),n=C(e.end,i);return!(e.ccw&&(o<0||n>0)||!e.ccw&&(o>0||n<0))}function S(t,e){let i=z(t)-z(e.start);i<0&&(i+=2*Math.PI),!e.positiveDirection&&i>0&&(i=2*Math.PI-i);let o=z(e.end)-z(e.start);return o<0&&(o+=2*Math.PI),!e.positiveDirection&&o>0&&(o=2*Math.PI-o),o>=i}function z(t){return t=((t%=2*Math.PI)+2*Math.PI)%(2*Math.PI)}function C(t,e){t=z(t);let i=(e=z(e))-t;return i>Math.PI&&(i=-(2*Math.PI-i)),i<-Math.PI&&(i+=2*Math.PI),i}function R(t){return t*Math.PI/180}function M(t){return 180*t/Math.PI}function A(...t){const e=Array.isArray(t[0])?t[0]:t;return(t,...i)=>e.reduce(((t,e)=>e(t,...i)),t)}function O(){return A(H,L)}function E(){return A(V,k)}function H(t,e,i){let o=s.subVector(t,e.position);if(o=Z(o,e,i),0===o.x&&0===o.y)return t;return s.addVector(e.position,o)}function V(t,e,i){return t=Z(t,e,i)}function L(t,e,i){if(!i.clampTranslation)return t;let o=f(t,e.boundaries);return i.limitEntireViewPort&&(o=w(t,e.viewPortWidth,e.viewPortHeight,e.boundaries,e.zoomLevel,e.rotation)),o}function k(t,e,i){if(!i.clampTranslation)return t;let o=s.subVector(f(s.addVector(e.position,t),e.boundaries),e.position);return i.limitEntireViewPort&&(o=s.subVector(w(s.addVector(e.position,t),e.viewPortWidth,e.viewPortHeight,e.boundaries,e.zoomLevel,e.rotation),e.position)),o}function Z(t,e,i){if(i.restrictXTranslation&&i.restrictYTranslation)return{x:0,y:0};if(i.restrictRelativeXTranslation&&i.restrictRelativeYTranslation)return{x:0,y:0};if(i.restrictXTranslation&&(t.x=0),i.restrictYTranslation&&(t.y=0),i.restrictRelativeXTranslation){const i=s.rotatePoint({x:0,y:1},e.rotation),o=s.dotProduct(i,t);t=s.multiplyVectorByScalar(i,o)}if(i.restrictRelativeYTranslation){const i=s.rotatePoint({x:1,y:0},e.rotation),o=s.dotProduct(i,t);t=s.multiplyVectorByScalar(i,o)}return t}function N(t,e){return s.multiplyVectorByScalar(s.rotatePoint(t,e.rotation),1/e.zoomLevel)}function D(t,e,i){if(!i.clampRotation)return t;const o=B(z(e.rotation+t),e.rotationBoundaries);return C(e.rotation,o)}function W(t,e,i){return i.restrictRotation?0:t}function U(t,e,i){if(!i.clampRotation)return t;const o=B(t,e.rotationBoundaries);return C(e.rotation,o)}function F(t,e,i){return i.restrictRotation?e.rotation:t}function Y(){return A(W,D)}function j(){return A(F,U)}function G(t,e,i){return i.clampZoom?n(t,e.zoomBoundaries):t}function X(t,e,i){if(!i.clampZoom)return t;let o=e.zoomLevel+t;return o=n(o,e.zoomBoundaries),t=o-e.zoomLevel}function $(t,e,i){return i.restrictZoom?e.zoomLevel:t}function K(t,e,i){return i.restrictZoom?0:t}function J(){return A(G,$)}function q(){return A(X,K)}class Q{constructor(){this.observers=[]}subscribe(t,e){if(this.observers.push(t),null==e?void 0:e.signal){if(e.signal.aborted)return this.observers=this.observers.filter((e=>e!==t)),()=>{};const i=()=>{var o;this.observers=this.observers.filter((e=>e!==t)),null===(o=e.signal)||void 0===o||o.removeEventListener("abort",i)};e.signal.addEventListener("abort",i)}return()=>{this.observers=this.observers.filter((e=>e!==t))}}notify(...t){this.observers.forEach((e=>queueMicrotask((()=>e(...t)))))}}class tt{constructor(){this.pan=new Q,this.zoom=new Q,this.rotate=new Q,this.all=new Q}notifyPan(t,e){this.pan.notify(t,e),this.all.notify({type:"pan",diff:t.diff},e)}notifyZoom(t,e){this.zoom.notify(t,e),this.all.notify({type:"zoom",deltaZoomAmount:t.deltaZoomAmount},e)}notifyRotate(t,e){this.rotate.notify(t,e),this.all.notify({type:"rotate",deltaRotation:t.deltaRotation},e)}on(t,e,i){switch(t){case"pan":return this.pan.subscribe(e,i);case"zoom":return this.zoom.subscribe(e,i);case"rotate":return this.rotate.subscribe(e,i);case"all":return this.all.subscribe(e,i);default:throw new Error(`Invalid event name: ${t}`)}}}class et{constructor(t=1e3,e=1e3,i={x:0,y:0},o=0,n=1,a={min:{x:-1e4,y:-1e4},max:{x:1e4,y:1e4}},s={min:.1,max:10},r=void 0){this._position=i,this._zoomLevel=n,this._rotation=o,this._viewPortHeight=e,this._viewPortWidth=t,this._zoomBoundaries=s,this._rotationBoundaries=r,this._boundaries=a}get boundaries(){return this._boundaries}set boundaries(t){this._boundaries=t}get viewPortWidth(){return this._viewPortWidth}set viewPortWidth(t){this._viewPortWidth=t}get viewPortHeight(){return this._viewPortHeight}set viewPortHeight(t){this._viewPortHeight=t}get position(){return this._position}setPosition(t){if(!p(t,this._boundaries))return!1;const e=s.subVector(t,this._position);return!(s.magnitude(e)<1e-9&&s.magnitude(e)<1/this._zoomLevel)&&(this._position=t,!0)}get zoomLevel(){return this._zoomLevel}get zoomBoundaries(){return this._zoomBoundaries}set zoomBoundaries(t){if(void 0!==t&&void 0!==t.min&&void 0!==t.max&&t.min>t.max){let e=t.max;t.max=t.min,t.min=e}this._zoomBoundaries=t}setMaxZoomLevel(t){return null==this._zoomBoundaries&&(this._zoomBoundaries={min:void 0,max:void 0}),!(null!=this._zoomBoundaries.min&&this._zoomBoundaries.min>t||this._zoomLevel>t)&&(this._zoomBoundaries.max=t,!0)}setMinZoomLevel(t){return null==this._zoomBoundaries&&(this._zoomBoundaries={min:void 0,max:void 0}),!(null!=this._zoomBoundaries.max&&this._zoomBoundaries.max<t)&&(this._zoomBoundaries.min=t,this._zoomLevel<t&&(this._zoomLevel=t),!0)}setZoomLevel(t){return!!a(t,this._zoomBoundaries)&&((void 0===this._zoomBoundaries||void 0===this._zoomBoundaries.max||n(t,this._zoomBoundaries)!=this._zoomBoundaries.max||this._zoomLevel!=this._zoomBoundaries.max)&&((void 0===this._zoomBoundaries||void 0===this._zoomBoundaries.min||n(t,this._zoomBoundaries)!=this._zoomBoundaries.min||this._zoomLevel!=this._zoomBoundaries.min)&&(this._zoomLevel=t,!0)))}get rotation(){return this._rotation}get rotationBoundaries(){return this._rotationBoundaries}set rotationBoundaries(t){if(void 0!==t&&void 0!==t.start&&void 0!==t.end&&t.start>t.end){let e=t.end;t.end=t.start,t.start=e}this._rotationBoundaries=t}getTransform(t,e){const i=t*this._viewPortWidth/2,o=t*this._viewPortHeight/2,n=-this._position.x,a=e?-this._position.y:this._position.y,s=t,r=this._zoomLevel,c=e?-this._rotation:this._rotation,l=Math.sin(c),h=Math.cos(c);return{a:r*s*h,b:r*s*l,c:-s*r*l,d:r*s*h,e:s*r*h*n-s*r*l*a+i,f:s*r*l*n+s*r*h*a+o}}setRotation(t){return!!I(t,this._rotationBoundaries)&&(t=z(t),(void 0===this._rotationBoundaries||void 0===this._rotationBoundaries.end||B(t,this._rotationBoundaries)!=this._rotationBoundaries.end||this._rotation!=this._rotationBoundaries.end)&&((void 0===this._rotationBoundaries||void 0===this.rotationBoundaries.start||B(t,this._rotationBoundaries)!=this._rotationBoundaries.start||this._rotation!=this._rotationBoundaries.start)&&(this._rotation=t,!0)))}getCameraOriginInWindow(t){return t}convertFromViewPort2WorldSpace(t){return l(t,this._position,this._zoomLevel,this._rotation)}convertFromWorld2ViewPort(t){return h(t,this._position,this._zoomLevel,this._rotation)}invertFromWorldSpace2ViewPort(t){let e={x:this.viewPortWidth/2,y:this._viewPortHeight/2},i=s.subVector(t,this._position);return i=s.rotatePoint(i,-this._rotation),i=s.multiplyVectorByScalar(i,this._zoomLevel),s.addVector(e,i)}setHorizontalBoundaries(t,e){if(t>e){let i=e;e=t,t=i}null==this._boundaries&&(this._boundaries={min:{x:void 0,y:void 0},max:{x:void 0,y:void 0}}),this._boundaries.min.x=t,this._boundaries.max.x=e}setVerticalBoundaries(t,e){if(t>e){let i=e;e=t,t=i}null==this._boundaries&&(this._boundaries={min:{x:void 0,y:void 0},max:{x:void 0,y:void 0}}),this._boundaries.min.y=t,this._boundaries.max.y=e}}class it{constructor(t=1e3,e=1e3,i={x:0,y:0},o=0,n=1,a={min:{x:-1e4,y:-1e4},max:{x:1e4,y:1e4}},s={min:.1,max:10},r=void 0){this._baseCamera=new et(t,e,i,o,n,a,s,r),this._observer=new tt}get boundaries(){return this._baseCamera.boundaries}set boundaries(t){this._baseCamera.boundaries=t}get viewPortWidth(){return this._baseCamera.viewPortWidth}set viewPortWidth(t){this._baseCamera.viewPortWidth=t}get viewPortHeight(){return this._baseCamera.viewPortHeight}set viewPortHeight(t){this._baseCamera.viewPortHeight=t}get position(){return this._baseCamera.position}setPosition(t){const e=Object.assign({},this._baseCamera.position);return!!this._baseCamera.setPosition(t)&&(this._observer.notifyPan({diff:s.subVector(t,e)},{position:this._baseCamera.position,rotation:this._baseCamera.rotation,zoomLevel:this._baseCamera.zoomLevel}),!0)}get zoomLevel(){return this._baseCamera.zoomLevel}get zoomBoundaries(){return this._baseCamera.zoomBoundaries}set zoomBoundaries(t){this._baseCamera.zoomBoundaries=t}setMaxZoomLevel(t){const e=this._baseCamera.zoomLevel;return!!this._baseCamera.setMaxZoomLevel(t)&&(this._observer.notifyZoom({deltaZoomAmount:t-e},{position:this._baseCamera.position,rotation:this._baseCamera.rotation,zoomLevel:this._baseCamera.zoomLevel}),!0)}setMinZoomLevel(t){return!!this._baseCamera.setMinZoomLevel(t)}setZoomLevel(t){return!!this._baseCamera.setZoomLevel(t)}get rotation(){return this._baseCamera.rotation}get rotationBoundaries(){return this._baseCamera.rotationBoundaries}set rotationBoundaries(t){this._baseCamera.rotationBoundaries=t}getTransform(t,e){const i=t*this._baseCamera.viewPortWidth/2,o=t*this._baseCamera.viewPortHeight/2,n=-this._baseCamera.position.x,a=e?-this._baseCamera.position.y:this._baseCamera.position.y,s=t,r=this._baseCamera.zoomLevel,c=e?-this._baseCamera.rotation:this._baseCamera.rotation,l=Math.sin(c),h=Math.cos(c);return{a:r*s*h,b:r*s*l,c:-s*r*l,d:r*s*h,e:s*r*h*n-s*r*l*a+i,f:s*r*l*n+s*r*h*a+o}}setRotation(t){const e=this._baseCamera.rotation;return!!this._baseCamera.setRotation(t)&&(this._observer.notifyRotate({deltaRotation:t-e},{position:this._baseCamera.position,rotation:this._baseCamera.rotation,zoomLevel:this._baseCamera.zoomLevel}),!0)}getCameraOriginInWindow(t){return t}convertFromViewPort2WorldSpace(t){return l(t,this._baseCamera.position,this._baseCamera.zoomLevel,this._baseCamera.rotation)}convertFromWorld2ViewPort(t){return h(t,this._baseCamera.position,this._baseCamera.zoomLevel,this._baseCamera.rotation)}invertFromWorldSpace2ViewPort(t){let e={x:this._baseCamera.viewPortWidth/2,y:this._baseCamera.viewPortHeight/2},i=s.subVector(t,this._baseCamera.position);return i=s.rotatePoint(i,-this._baseCamera.rotation),i=s.multiplyVectorByScalar(i,this._baseCamera.zoomLevel),s.addVector(e,i)}setHorizontalBoundaries(t,e){if(t>e){let i=e;e=t,t=i}null==this._baseCamera.boundaries&&(this._baseCamera.boundaries={min:{x:void 0,y:void 0},max:{x:void 0,y:void 0}}),this._baseCamera.boundaries.min.x=t,this._baseCamera.boundaries.max.x=e}setVerticalBoundaries(t,e){if(t>e){let i=e;e=t,t=i}null==this._baseCamera.boundaries&&(this._baseCamera.boundaries={min:{x:void 0,y:void 0},max:{x:void 0,y:void 0}}),this._baseCamera.boundaries.min.y=t,this._baseCamera.boundaries.max.y=e}on(t,e,i){return this._observer.on(t,e,i)}}class ot{constructor(t={x:0,y:0},e=0,i=1,o=1e3,n=1e3,a=new tt,r={min:{x:-1e4,y:-1e4},max:{x:1e4,y:1e4}},c={min:.1,max:10},l={start:0,end:2*Math.PI,ccw:!0,startAsTieBreaker:!1}){this._contextRotation=-e,this._zoomLevel=i,this._contextPosition=s.subVector({x:o/2,y:n/2},s.multiplyVectorByScalar(s.rotatePoint(t,-e),i)),this._viewPortWidth=o,this._viewPortHeight=n,this._observer=a,this._boundaries=r,this._rotationBoundaries=l,this._zoomBoundaries=c}get position(){const t=(this._viewPortWidth/2-this._contextPosition.x)/this._zoomLevel,e=(this._viewPortHeight/2-this._contextPosition.y)/this._zoomLevel;return s.rotatePoint({x:t,y:e},-this._contextRotation)}get contextTransform(){return{position:this._contextPosition,rotation:this._contextRotation,zoomLevel:this._zoomLevel}}setPosition(t){if(p(t,this._boundaries)){const e=s.subVector({x:this._viewPortWidth/2,y:this._viewPortHeight/2},s.multiplyVectorByScalar(s.rotatePoint(t,-this.rotation),this._zoomLevel));this._contextPosition=e}}setPositionByDelta(t){const e=s.addVector(this.position,t);this.setPosition(e)}setPositionWithUserInputDelta(t){this._contextPosition=s.addVector(this._contextPosition,t)}getCameraOriginInWindow(t){return{x:t.x-this._viewPortWidth/2,y:t.y-this._viewPortHeight/2}}convertFromViewPort2WorldSpace(t){const e={x:t.x+this._viewPortWidth/2,y:t.y+this._viewPortHeight/2};return s.multiplyVectorByScalar(s.rotatePoint(s.subVector(e,this._contextPosition),-this._contextRotation),1/this._zoomLevel)}setZoomLevel(t){a(t,this._zoomBoundaries)&&(this._zoomLevel,this._zoomLevel=t)}setRotation(t){const e=-t;I(e,this._rotationBoundaries)&&(this._contextRotation=e)}get zoomLevel(){return this._zoomLevel}get rotation(){return-this._contextRotation}getTransform(t,e,i,o){const n=this._contextPosition.x*i,a=this._contextPosition.y*i,s=-Math.sin(this._contextRotation)*this._zoomLevel*i;return{a:this._zoomLevel*Math.cos(this._contextRotation)*i,b:Math.sin(this._contextRotation)*this._zoomLevel*i,c:s,d:this._zoomLevel*Math.cos(this._contextRotation)*i,e:n,f:a}}get viewPortWidth(){return this._viewPortWidth}get viewPortHeight(){return this._viewPortHeight}set viewportWidth(t){this._viewPortWidth=t}set viewportHeight(t){this._viewPortHeight=t}get zoomBoundaries(){return this._zoomBoundaries}get rotationBoundaries(){return this._rotationBoundaries}viewPortDelta2WorldDelta(t){return t}setMinZoomLevel(t){return null==this._zoomBoundaries&&(this._zoomBoundaries={min:void 0,max:void 0}),!(null!=this._zoomBoundaries.max&&this._zoomBoundaries.max<t)&&(this._zoomBoundaries.min=t,this._zoomLevel<t&&(this._zoomLevel=t),this._zoomBoundaries.min=t,!0)}setHorizontalBoundaries(t,e){this._boundaries.min.x=t,this._boundaries.max.x=e}setVerticalBoundaries(t,e){this._boundaries.min.y=t,this._boundaries.max.y=e}on(t,e){return this._observer.on(t,e)}set viewPortWidth(t){this._viewPortWidth=t}set viewPortHeight(t){this._viewPortHeight=t}}class nt{constructor(t,e=new it){this._panBy=E(),this._panTo=O(),this._zoomTo=J(),this._zoomBy=q(),this._rotateBy=Y(),this._rotateTo=j(),this._config=Object.assign(Object.assign({},t),{restrictRotation:!1,clampRotation:!0}),this._camera=e}zoomToAt(t,e){let i=this._camera.convertFromViewPort2WorldSpace(e);const o=this._zoomTo(t,this._camera,this._config);this._camera.setZoomLevel(o);let n=this._camera.convertFromViewPort2WorldSpace(e);const a=s.subVector(i,n),r=this._panBy(a,this._camera,this._config);this._camera.setPosition(s.addVector(this._camera.position,r))}zoomByAt(t,e){let i=this._camera.convertFromViewPort2WorldSpace(e);const o=this._zoomBy(t,this._camera,this._config);this._camera.setZoomLevel(this._camera.zoomLevel+o);let n=this._camera.convertFromViewPort2WorldSpace(e);const a=s.subVector(i,n),r=this._panBy(a,this._camera,this._config);this._camera.setPosition(s.addVector(this._camera.position,r))}zoomTo(t){this._zoomTo(t,this._camera,this._config)}zoomBy(t){this._zoomBy(t,this._camera,this._config)}zoomToAtWorld(t,e){let i=this._camera.convertFromWorld2ViewPort(e);const o=this._zoomTo(t,this._camera,this._config);this._camera.setZoomLevel(o);let n=this._camera.convertFromWorld2ViewPort(e);const a=s.subVector(i,n),r=this._panBy(a,this._camera,this._config);this._camera.setPosition(s.addVector(this._camera.position,r))}zoomByAtWorld(t,e){let i=this._camera.convertFromWorld2ViewPort(e);const o=this._zoomBy(t,this._camera,this._config);this._camera.setZoomLevel(this._camera.zoomLevel+o);let n=this._camera.convertFromWorld2ViewPort(e);const a=m(s.subVector(i,n),this._camera.zoomLevel,this._camera.rotation),r=this._panBy(a,this._camera,this._config);this._camera.setPosition(s.addVector(this._camera.position,r))}panBy(t){const e=s.multiplyVectorByScalar(s.rotatePoint(t,this._camera.rotation),1/this._camera.zoomLevel),i=this._panBy(e,this._camera,this._config);this._camera.setPosition(s.addVector(this._camera.position,i))}panTo(t){const e=this._panTo(t,this._camera,this._config);this._camera.setPosition(e)}rotateBy(t){const e=this._rotateBy(t,this._camera,this._config);this._camera.setRotation(this._camera.rotation+e)}rotateTo(t){const e=this._rotateTo(t,this._camera,this._config);this._camera.setRotation(e)}set limitEntireViewPort(t){this._config.limitEntireViewPort=t}get limitEntireViewPort(){return this._config.limitEntireViewPort}get camera(){return this._camera}get config(){return this._config}set config(t){this._config=Object.assign({},t)}configure(t){this._config=Object.assign(Object.assign({},this._config),t)}cleanup(){}setup(){}}function at(t){return new nt({limitEntireViewPort:!0,restrictRelativeXTranslation:!1,restrictRelativeYTranslation:!1,restrictXTranslation:!1,restrictYTranslation:!1,restrictZoom:!1,clampTranslation:!0,clampZoom:!0},t)}class st{constructor(t,e){this.bindFunctions(),this._stateMachine=e,this._keyfirstPressed=new Map,this._eventTarget=t}get disabled(){return this._disabled}set disabled(t){this._disabled=t}get stateMachine(){return this._stateMachine}setUp(){this.addEventListeners(this._eventTarget)}addEventListeners(t){t.addEventListener("pointerdown",this.pointerDownHandler),t.addEventListener("pointerup",this.pointerUpHandler),t.addEventListener("pointermove",this.pointerMoveHandler),t.addEventListener("wheel",this.scrollHandler),window.addEventListener("keydown",this.keypressHandler),window.addEventListener("keyup",this.keyupHandler)}tearDown(){this._eventTarget.removeEventListener("pointerdown",this.pointerDownHandler),this._eventTarget.removeEventListener("pointerup",this.pointerUpHandler),this._eventTarget.removeEventListener("pointermove",this.pointerMoveHandler),this._eventTarget.removeEventListener("wheel",this.scrollHandler),window.removeEventListener("keydown",this.keypressHandler),window.removeEventListener("keyup",this.keyupHandler)}bindFunctions(){this.pointerDownHandler=this.pointerDownHandler.bind(this),this.pointerUpHandler=this.pointerUpHandler.bind(this),this.pointerMoveHandler=this.pointerMoveHandler.bind(this),this.scrollHandler=this.scrollHandler.bind(this),this.keypressHandler=this.keypressHandler.bind(this),this.keyupHandler=this.keyupHandler.bind(this)}pointerDownHandler(t){this._disabled||(0!==t.button||"mouse"!==t.pointerType?1!==t.button||"mouse"!==t.pointerType||this.stateMachine.happens("middlePointerDown",{x:t.clientX,y:t.clientY}):this.stateMachine.happens("leftPointerDown",{x:t.clientX,y:t.clientY}))}pointerUpHandler(t){this._disabled||(0!==t.button||"mouse"!==t.pointerType?1!==t.button||"mouse"!==t.pointerType||this.stateMachine.happens("middlePointerUp",{x:t.clientX,y:t.clientY}):this.stateMachine.happens("leftPointerUp",{x:t.clientX,y:t.clientY}))}pointerMoveHandler(t){this._disabled||(1!==t.buttons||"mouse"!==t.pointerType?4!==t.buttons||"mouse"!==t.pointerType||this.stateMachine.happens("middlePointerMove",{x:t.clientX,y:t.clientY}):this.stateMachine.happens("leftPointerMove",{x:t.clientX,y:t.clientY}))}scrollHandler(t){this._disabled||(t.preventDefault(),t.ctrlKey?this.stateMachine.happens("scrollWithCtrl",{x:t.clientX,y:t.clientY,deltaX:t.deltaX,deltaY:t.deltaY}):this.stateMachine.happens("scroll",{deltaX:t.deltaX,deltaY:t.deltaY}))}keypressHandler(t){this._keyfirstPressed.has(t.key)||(this._keyfirstPressed.set(t.key,!0)," "===t.key&&(t.preventDefault(),this.stateMachine.happens("spacebarDown",{})))}keyupHandler(t){this._keyfirstPressed.has(t.key)&&this._keyfirstPressed.delete(t.key)," "===t.key&&this.stateMachine.happens("spacebarUp",{})}}class rt{constructor(t,e){this._panDisabled=!1,this._zoomDisabled=!1,this._rotateDisabled=!1,this.touchPointsMap=new Map,this._canvas=t,this._disabled=!1,this.touchSM=e,this.bindListeners()}get touchStateMachine(){return this.touchSM}bindListeners(){this.touchstartHandler=this.touchstartHandler.bind(this),this.touchendHandler=this.touchendHandler.bind(this),this.touchcancelHandler=this.touchcancelHandler.bind(this),this.touchmoveHandler=this.touchmoveHandler.bind(this)}resetAttributes(){this.touchPointsMap.clear()}enableStrategy(){this._disabled=!1}disableStrategy(){this.resetAttributes(),this._disabled=!0}setUp(){this._canvas.addEventListener("touchstart",this.touchstartHandler),this._canvas.addEventListener("touchend",this.touchendHandler),this._canvas.addEventListener("touchcancel",this.touchcancelHandler),this._canvas.addEventListener("touchmove",this.touchmoveHandler)}tearDown(){this.resetAttributes(),this._canvas.removeEventListener("touchstart",this.touchstartHandler),this._canvas.removeEventListener("touchend",this.touchendHandler),this._canvas.removeEventListener("touchcancel",this.touchcancelHandler),this._canvas.removeEventListener("touchmove",this.touchmoveHandler)}get disabled(){return this._disabled}get alignCoordinateSystem(){return this._touchInputTracker.alignCoordinateSystem}set alignCoordinateSystem(t){this._touchInputTracker.alignCoordinateSystem=t}get panDisabled(){return this._panDisabled}set panDisabled(t){this._panDisabled=t}get zoomDisabled(){return this._zoomDisabled}set zoomDisabled(t){this._zoomDisabled=t}get rotateDisabled(){return this._rotateDisabled}set rotateDisabled(t){this._rotateDisabled=t}touchstartHandler(t){if(this._disabled)return;const e=[];for(let i=0;i<t.changedTouches.length;i++)e.push({ident:t.changedTouches[i].identifier,x:t.changedTouches[i].clientX,y:t.changedTouches[i].clientY});this.touchSM.happens("touchstart",{points:e}),t.preventDefault()}touchcancelHandler(t){if(this._disabled)return;const e=[];for(let i=0;i<t.changedTouches.length;i++)e.push({ident:t.changedTouches[i].identifier,x:t.changedTouches[i].clientX,y:t.changedTouches[i].clientY});this.touchSM.happens("touchend",{points:e})}touchendHandler(t){if(this._disabled)return;const e=[];for(let i=0;i<t.changedTouches.length;i++)e.push({ident:t.changedTouches[i].identifier,x:t.changedTouches[i].clientX,y:t.changedTouches[i].clientY});this.touchSM.happens("touchend",{points:e})}touchmoveHandler(t){if(this._disabled)return;t.preventDefault();const e=[];for(let i=0;i<t.targetTouches.length;i++)e.push({ident:t.targetTouches[i].identifier,x:t.targetTouches[i].clientX,y:t.targetTouches[i].clientY});this.touchSM.happens("touchmove",{points:e})}}function ct(t,e,i,o){const n=P(t),a=b(t);if(null==n||null==a)return;let s=e/Math.abs(n*Math.cos(o)),r=e/Math.abs(a*Math.cos(o)),c=i/Math.abs(n*Math.sin(o)),l=i/Math.abs(a*Math.sin(o));s==1/0&&(s=0),r==1/0&&(r=0),c==1/0&&(c=0),l==1/0&&(l=0);const h=i/a,u=e/n;return Math.max(h,u,s,r,c,l)}function lt(t,e){return null!=e&&(null==t||e!=1/0&&(void 0!==t&&(null==t.min||e>t.min)))}function ht(t,e,i,o){const n=P(t);if(null==n)return;const a=Math.abs(n*Math.cos(o)),s=Math.abs(n*Math.sin(o));if(e/a==1/0)return i/s;return Math.max(e/a,i/s)}function ut(t,e,i,o){const n=b(t);if(null==n)return;const a=e/Math.abs(n*Math.cos(o)),s=i/Math.abs(n*Math.sin(o));if(s==1/0)return a;return Math.max(a,s)}function dt(t){if(t<=0)return 0;let e=0;if(t<1){let i=1;for(;i>t;)i/=10,e--}else{let i=1;for(;10*i<=t;)i*=10,e++}return e}function mt(t,e,i,o,n,a="red"){let s=n/2;s/=i,t.beginPath(),t.strokeStyle=a,t.lineWidth=2/i,o?(t.moveTo(e.x-s,e.y),t.lineTo(e.x+s,e.y),t.moveTo(e.x,e.y-s),t.lineTo(e.x,e.y+s)):(t.moveTo(e.x-s,-e.y),t.lineTo(e.x+s,-e.y),t.moveTo(e.x,-e.y-s),t.lineTo(e.x,-e.y+s)),t.stroke(),t.lineWidth=3}function _t(t,e,i){if(!x(e))return;const o=P(e),n=b(e),a=null==e?void 0:e.min,s=null==a?void 0:a.x,r=null==a?void 0:a.y;null!=s&&null!=r&&null!=o&&null!=n&&(t.beginPath(),t.strokeStyle="blue",t.lineWidth=100,i?t.roundRect(s,r,o,n,5):t.roundRect(s,-r,o,-n,5),t.stroke(),t.lineWidth=3,t.strokeStyle="black")}function yt(t,e,i,o){if(!x(e))return;const n=P(e),a=b(e),s=null==e?void 0:e.min,r=null==s?void 0:s.x,c=null==s?void 0:s.y;null!=r&&null!=c&&null!=n&&null!=a&&(t.lineWidth=1/i,t.beginPath(),t.strokeStyle="rgba(87, 173, 72, 0.8)",t.moveTo(0,0),o?t.lineTo(0,c+a):t.lineTo(0,-c-a),t.stroke(),t.beginPath(),t.strokeStyle="rgba(220, 59, 59, 0.8)",t.moveTo(0,0),t.lineTo(r+n,0),t.stroke(),t.strokeStyle="black")}function pt(t,e,i,o,n,a,r){let c=s.unitVectorFromA2B(e,i),l=s.unitVectorFromA2B(o,e),h=s.distanceBetweenPoints(e,i);s.distanceBetweenPoints(e,o);let u=dt(h),d=Math.pow(10,u)/10,m=Math.ceil(e.x/d)*d,_=Math.floor(i.x/d)*d,y=a?Math.floor(e.y/d)*d:Math.ceil(o.y/d)*d,p=a?Math.ceil(o.y/d)*d:Math.floor(e.y/d)*d;for(let i=m;i<=_;i+=d){const n=s.addVector({x:i,y:e.y},s.multiplyVectorByScalar(c,d)),a=s.addVector({x:i,y:o.y},s.multiplyVectorByScalar(c,d));t.beginPath(),t.strokeStyle="black",t.fillStyle="black",t.lineWidth=.5/r,t.moveTo(n.x,n.y),t.lineTo(a.x,a.y),t.stroke()}for(let o=y;o<=p;o+=d){const n=s.addVector({x:e.x,y:o},s.multiplyVectorByScalar(l,d)),a=s.addVector({x:i.x,y:o},s.multiplyVectorByScalar(l,d));t.beginPath(),t.strokeStyle="black",t.fillStyle="black",t.lineWidth=.5/r,t.moveTo(n.x,n.y),t.lineTo(a.x,a.y),t.stroke()}}function vt(t,e,i,o,n,a,r){let c=s.unitVectorFromA2B(e,i),l=s.unitVectorFromA2B(o,e),h=dt(s.distanceBetweenPoints(e,i)),u=Math.pow(10,h),d=u/2,m=u/10,_=1;h<=0&&(_=Math.pow(10,1-h));let y=Math.ceil(e.x/u)*u,p=Math.floor(i.x/u)*u,v=a?Math.ceil(e.y/u)*u:Math.floor(o.y/u)*u;a?Math.floor(o.y/u):Math.ceil(e.y/u);let x=Math.ceil(e.x/d)*d,f=Math.floor(i.x/d)*d,P=a?Math.ceil(e.y/d)*d:Math.floor(o.y/d)*d,g=a?Math.floor(o.y/d)*d:Math.ceil(e.y/d)*d,b=Math.ceil(e.x/m)*m,T=Math.floor(i.x/m)*m,w=a?Math.ceil(e.y/m)*m:Math.floor(o.y/m)*m,B=a?Math.floor(o.y/m)*m:Math.ceil(e.y/m)*m,I=d*r,S=m*r;t.font=`bold ${20/r}px Helvetica`;const z=t.measureText(""+-(d+x)),C=z.fontBoundingBoxAscent+z.fontBoundingBoxDescent,R=t.measureText(""+-(m+b)),M=R.fontBoundingBoxAscent+R.fontBoundingBoxDescent,A=Math.ceil((p-y)/u);for(let i=0;i<=A;i++){const o=y+i*u;t.beginPath(),t.strokeStyle="black",t.fillStyle="black",t.lineWidth=5/r;let n=s.addVector({x:o,y:e.y},s.multiplyVectorByScalar(l,50/r));a?t.moveTo(n.x,n.y):t.moveTo(n.x,-n.y),n=s.addVector({x:o,y:e.y},s.multiplyVectorByScalar(l,-50/r)),a?t.lineTo(n.x,n.y):t.lineTo(n.x,-n.y),t.textAlign="center",t.textBaseline="middle",t.font=`bold ${20/r}px Helvetica`;const c=t.measureText(`${Math.abs(o)%1==0?o.toFixed(0):o.toFixed(2)}`),h=c.fontBoundingBoxAscent+c.fontBoundingBoxDescent;a?(n=s.addVector(n,{x:0,y:h/2+.2*h}),t.fillText(`${Math.abs(o)%1==0?o.toFixed(0):o.toFixed(2)}`,n.x,n.y)):(n=s.addVector(n,{x:0,y:-h/2-.2*h}),t.fillText(`${Math.abs(o)%1==0?o.toFixed(0):o.toFixed(2)}`,n.x,-n.y)),t.stroke()}const O=Math.ceil((p-y)/u);for(let i=0;i<=O;i++){const o=v+i*u;t.beginPath(),t.strokeStyle="black",t.fillStyle="black",t.lineWidth=5/r;let n=s.addVector({x:e.x,y:o},s.multiplyVectorByScalar(c,-50/r));a?t.moveTo(n.x,n.y):t.moveTo(n.x,-n.y),n=s.addVector({x:e.x,y:o},s.multiplyVectorByScalar(c,50/r)),a?t.lineTo(n.x,n.y):t.lineTo(n.x,-n.y),t.textAlign="center",t.textBaseline="middle",t.font=`bold ${20/r}px Helvetica`;const l=t.measureText(`${Math.abs(o)%1==0?o.toFixed(0):o.toFixed(2)}`);n=s.addVector(n,{x:l.width/2+.3*l.width,y:0}),a?t.fillText(`${Math.abs(o)%1==0?o.toFixed(0):o.toFixed(2)}`,n.x,n.y):t.fillText(`${Math.abs(o)%1==0?o.toFixed(0):o.toFixed(2)}`,n.x,-n.y),t.stroke()}const E=Math.ceil((f-x)/d);for(let i=0;i<=E;i++){const o=x+i*d;if(Math.floor(o*_)%Math.floor(u*_)==0)continue;t.beginPath(),t.strokeStyle="black",t.fillStyle="black",t.lineWidth=3/r;let n=s.addVector({x:o,y:e.y},s.multiplyVectorByScalar(l,25/r));a?t.moveTo(n.x,n.y):t.moveTo(n.x,-n.y),n=s.addVector({x:o,y:e.y},s.multiplyVectorByScalar(l,-25/r)),a?t.lineTo(n.x,n.y):t.lineTo(n.x,-n.y),t.font=15/r+"px Helvetica";const c=t.measureText(`${Math.abs(o)%1==0?o.toFixed(0):o.toFixed(2)}`);if(I>2*z.width){t.textAlign="center",t.textBaseline="middle";const e=c.fontBoundingBoxAscent+c.fontBoundingBoxDescent;a?n=s.addVector(n,{x:0,y:e/2+.2*e}):(n=s.addVector(n,{x:0,y:-e/2-.2*e}),n=s.flipYAxis(n)),t.fillText(`${Math.abs(o)%1==0?o.toFixed(0):o.toFixed(2)}`,n.x,n.y)}t.stroke()}const H=Math.ceil((g-P)/d);for(let i=0;i<=H;i++){const o=P+i*d;if(Math.floor(o*_)%Math.floor(u*_)==0)continue;t.beginPath(),t.strokeStyle="black",t.fillStyle="black",t.lineWidth=3/r;let n=s.addVector({x:e.x,y:o},s.multiplyVectorByScalar(c,-25/r));a?t.moveTo(n.x,n.y):t.moveTo(n.x,-n.y),n=s.addVector({x:e.x,y:o},s.multiplyVectorByScalar(c,25/r)),a?t.lineTo(n.x,n.y):t.lineTo(n.x,-n.y),t.font=18/r+"px Helvetica";const l=t.measureText(`${Math.abs(o)%1==0?o.toFixed(0):o.toFixed(2)}`);l.fontBoundingBoxAscent,l.fontBoundingBoxDescent,I>2*C&&(t.textAlign="center",t.textBaseline="middle",n=s.addVector(n,{x:l.width/2+.3*l.width,y:0}),a||(n=s.flipYAxis(n)),t.fillText(`${Math.abs(o)%1==0?o.toFixed(0):o.toFixed(2)}`,n.x,n.y)),t.stroke()}const V=Math.ceil((T-b)/m);for(let i=0;i<=V;i++){const o=b+i*m;if(Math.floor(o*_)%Math.floor(u*_)==0||Math.floor(o*_)%Math.floor(d*_)==0)continue;t.beginPath(),t.strokeStyle="black",t.fillStyle="black",t.lineWidth=1/r;let n=s.addVector({x:o,y:e.y},s.multiplyVectorByScalar(l,12.5/r));a?t.moveTo(n.x,n.y):t.moveTo(n.x,-n.y),n=s.addVector({x:o,y:e.y},s.multiplyVectorByScalar(l,-12.5/r)),a?t.lineTo(n.x,n.y):t.lineTo(n.x,-n.y),t.font=10/r+"px Helvetica";const c=t.measureText(`${Math.abs(o)%1==0?o.toFixed(0):o.toFixed(2)}`);if(S>2*R.width){t.textAlign="center",t.textBaseline="middle";const e=c.fontBoundingBoxAscent+c.fontBoundingBoxDescent;a?n=s.addVector(n,{x:0,y:e/2+.2*e}):(n=s.addVector(n,{x:0,y:-e/2-.2*e}),n=s.flipYAxis(n)),t.fillText(`${Math.abs(o)%1==0?o.toFixed(0):o.toFixed(2)}`,n.x,n.y)}t.stroke()}const L=Math.ceil((B-w)/m);for(let i=0;i<=L;i++){const o=w+i*m;if(Math.floor(o*_)%Math.floor(u*_)==0||Math.floor(o*_)%Math.floor(d*_)==0)continue;t.beginPath(),t.strokeStyle="black",t.fillStyle="black",t.lineWidth=1/r;let n=s.addVector({x:e.x,y:o},s.multiplyVectorByScalar(c,-12.5/r));a?t.moveTo(n.x,n.y):t.moveTo(n.x,-n.y),n=s.addVector({x:e.x,y:o},s.multiplyVectorByScalar(c,12.5/r)),a?t.lineTo(n.x,n.y):t.lineTo(n.x,-n.y),t.font=12/r+"px Helvetica";const l=t.measureText(`${Math.abs(o)%1==0?o.toFixed(0):o.toFixed(2)}`);l.fontBoundingBoxAscent,l.fontBoundingBoxDescent,S>2*M&&(t.textAlign="center",t.textBaseline="middle",n=s.addVector(n,{x:l.width/2+.3*l.width,y:0}),a||(n=s.flipYAxis(n)),t.fillText(`${Math.abs(o)%1==0?o.toFixed(0):o.toFixed(2)}`,n.x,n.y)),t.stroke()}}function xt(t,e,i,o,n=20,a="red"){n/=i,t.font=20/i+"px Arial",t.fillStyle=a,o?t.fillText(`x: ${e.x.toFixed(2)}, y: ${e.y.toFixed(2)}`,e.x+n,e.y+n):t.fillText(`x: ${e.x.toFixed(2)}, y: ${e.y.toFixed(2)}`,e.x+n,-e.y-n),t.fillStyle="black"}function ft(t,e,i){t.beginPath(),t.strokeStyle="rgba(87, 173, 72, 0.8)",i?t.arc(e.x,e.y,5,0,2*Math.PI):t.arc(e.x,-e.y,5,0,2*Math.PI),t.stroke(),t.strokeStyle="black"}class Pt{constructor(t){this._canvas=t,this.lastRect=t.getBoundingClientRect(),this.resizeObserver=new ResizeObserver((t=>{console.log("resizeObserver",t);for(const e of t){const t=e.target.getBoundingClientRect();gt(this.lastRect,t)&&(bt(t),this.lastRect=t)}})),this.intersectionObserver=new IntersectionObserver((t=>{for(const e of t)if(e.isIntersecting){const t=e.boundingClientRect;gt(this.lastRect,t)&&(bt(t),this.lastRect=t)}})),this.scrollHandler=()=>{const e=t.getBoundingClientRect();gt(this.lastRect,e)&&(bt(e),this.lastRect=e)},this.resizeObserver.observe(t),this.intersectionObserver.observe(t),window.addEventListener("scroll",this.scrollHandler,{passive:!0}),console.log("CanvasPositionDimensionPublisher initialized")}dispose(){this.resizeObserver.disconnect(),this.intersectionObserver.disconnect(),window.removeEventListener("scroll",this.scrollHandler)}}function gt(t,e){return t.top!==e.top||t.left!==e.left||t.width!==e.width||t.height!==e.height}function bt(t){console.log("Position updated:",t)}const Tt={fillRect:[1],strokeRect:[1],fillText:[1],strokeText:[1],lineTo:[1],moveTo:[1],quadraticCurveTo:[1,3],bezierCurveTo:[1,3,5],arc:[1]};function wt(t){return new Proxy(t,{get(t,e,i){const o=Reflect.get(t,e,t);return"string"==typeof e&&e in Tt&&"function"==typeof o?function(...i){const n=[...i],a=Tt[e];for(const t of a)t<n.length&&(n[t]=-n[t]);return o.apply(t,n)}:"function"==typeof o?function(...e){return o.apply(t,e)}:o},set:(t,e,i)=>Reflect.set(t,e,i)})}class Bt extends e{constructor(t,e,i){super(t,e,i)}notifyPanInput(t){this.happens("userPanByInput",{diff:t})}notifyPanToAnimationInput(t){this.happens("transitionPanToInput",{target:t})}initateTransition(){this.happens("initateTransition",{})}set limitEntireViewPort(t){this._context.limitEntireViewPort=t}get limitEntireViewPort(){return this._context.limitEntireViewPort}}class It extends i{constructor(){super(),this.eventReactions={userPanByInput:{action:this.userPanByInputHandler,defaultTargetState:"ACCEPTING_USER_INPUT"},userPanToInput:{action:this.userPanToInputHandler,defaultTargetState:"ACCEPTING_USER_INPUT"},lockedOnObjectPanByInput:{action:this.lockedOnObjectPanByInputHandler,defaultTargetState:"LOCKED_ON_OBJECT"},lockedOnObjectPanToInput:{action:this.lockedOnObjectPanToInputHandler,defaultTargetState:"LOCKED_ON_OBJECT"},initateTransition:{action:t,defaultTargetState:"TRANSITION"}}}userPanByInputHandler(t,e){t.panBy(e.diff)}userPanToInputHandler(t,e){t.panTo(e.target)}lockedOnObjectPanByInputHandler(t,e){t.panBy(e.diff)}lockedOnObjectPanToInputHandler(t,e){t.panTo(e.target)}}class St extends i{constructor(){super(),this.eventReactions={userPanByInput:{action:this.userPanByInputHandler,defaultTargetState:"ACCEPTING_USER_INPUT"},userPanToInput:{action:this.userPanToInputHandler,defaultTargetState:"ACCEPTING_USER_INPUT"},transitionPanByInput:{action:this.transitionPanByInputHandler,defaultTargetState:"TRANSITION"},transitionPanToInput:{action:this.transitionPanToInputHandler,defaultTargetState:"TRANSITION"},lockedOnObjectPanByInput:{action:this.lockedOnObjectPanByInputHandler,defaultTargetState:"LOCKED_ON_OBJECT"},lockedOnObjectPanToInput:{action:this.lockedOnObjectPanToInputHandler,defaultTargetState:"LOCKED_ON_OBJECT"}}}userPanByInputHandler(t,e){return t.panBy(e.diff),"ACCEPTING_USER_INPUT"}userPanToInputHandler(t,e){return t.panTo(e.target),"ACCEPTING_USER_INPUT"}transitionPanByInputHandler(t,e){return t.panBy(e.diff),"TRANSITION"}transitionPanToInputHandler(t,e){return t.panTo(e.target),"TRANSITION"}lockedOnObjectPanByInputHandler(t,e){return t.panBy(e.diff),"LOCKED_ON_OBJECT"}lockedOnObjectPanToInputHandler(t,e){return t.panTo(e.target),"LOCKED_ON_OBJECT"}}class zt extends i{constructor(){super(),this.eventReactions={unlock:{action:t,defaultTargetState:"ACCEPTING_USER_INPUT"},lockedOnObjectPanByInput:{action:this.lockedOnObjectPanByInputHandler,defaultTargetState:"LOCKED_ON_OBJECT"},lockedOnObjectPanToInput:{action:this.lockedOnObjectPanToInputHandler,defaultTargetState:"LOCKED_ON_OBJECT"}}}lockedOnObjectPanByInputHandler(t,e){t.panBy(e.diff)}lockedOnObjectPanToInputHandler(t,e){t.panTo(e.target)}}function Ct(){return{ACCEPTING_USER_INPUT:new It,TRANSITION:new St,LOCKED_ON_OBJECT:new zt}}function Rt(t){return new Bt(Ct(),"ACCEPTING_USER_INPUT",t)}class Mt extends i{constructor(){super(...arguments),this._eventReactions={userZoomByAtInput:{action:this.userZoomByAtInput,defaultTargetState:"ACCEPTING_USER_INPUT"},userZoomToAtInput:{action:this.userZoomToAtInput,defaultTargetState:"ACCEPTING_USER_INPUT"},initiateTransition:{action:t,defaultTargetState:"TRANSITION"}}}get eventReactions(){return this._eventReactions}userZoomByAtInput(t,e){t.zoomByAt(e.deltaZoom,e.anchorPoint)}userZoomToAtInput(t,e){t.zoomToAt(e.targetZoom,e.anchorPoint)}}class At extends i{constructor(){super(),this._eventReactions={lockedOnObjectZoomByAtInput:{action:this.lockedOnObjectZoomByAtInput,defaultTargetState:"LOCKED_ON_OBJECT"},lockedOnObjectZoomToAtInput:{action:this.lockedOnObjectZoomToAtInput,defaultTargetState:"LOCKED_ON_OBJECT"},transitionZoomByAtInput:{action:this.transitionZoomByAtInput,defaultTargetState:"TRANSITION"},transitionZoomToAtInput:{action:this.transitionZoomToAtInput,defaultTargetState:"TRANSITION"},transitionZoomToAtCenterInput:{action:this.transitionZoomToAtCenterInput,defaultTargetState:"TRANSITION"},transitionZoomToAtWorldInput:{action:this.transitionZoomToAtWorldInput,defaultTargetState:"TRANSITION"},userZoomByAtInput:{action:this.userZoomByAtInput,defaultTargetState:"ACCEPTING_USER_INPUT"},userZoomToAtInput:{action:this.userZoomToAtInput,defaultTargetState:"ACCEPTING_USER_INPUT"}}}get eventReactions(){return this._eventReactions}lockedOnObjectZoomByAtInput(t,e){t.zoomBy(e.deltaZoom)}lockedOnObjectZoomToAtInput(t,e){t.zoomTo(e.targetZoom)}userZoomByAtInput(t,e){t.zoomByAt(e.deltaZoom,e.anchorPoint)}userZoomToAtInput(t,e){t.zoomToAt(e.targetZoom,e.anchorPoint)}transitionZoomByAtInput(t,e){t.zoomByAt(e.deltaZoom,e.anchorPoint)}transitionZoomByAtCenterInput(t,e){t.zoomBy(e.deltaZoom)}transitionZoomToAtInput(t,e){t.zoomToAt(e.targetZoom,e.anchorPoint)}transitionZoomToAtCenterInput(t,e){t.zoomTo(e.targetZoom)}transitionZoomToAtWorldInput(t,e){t.zoomToAtWorld(e.targetZoom,e.anchorPoint)}}class Ot extends i{constructor(){super(),this._eventReactions={lockedOnObjectZoomByAtInput:{action:this.lockedOnObjectZoomByAtInput,defaultTargetState:"LOCKED_ON_OBJECT"},lockedOnObjectZoomToAtInput:{action:this.lockedOnObjectZoomToAtInput,defaultTargetState:"LOCKED_ON_OBJECT"},userZoomByAtInput:{action:this.userZoomByAtInput,defaultTargetState:"ACCEPTING_USER_INPUT"},userZoomToAtInput:{action:this.userZoomToAtInput,defaultTargetState:"ACCEPTING_USER_INPUT"}}}get eventReactions(){return this._eventReactions}lockedOnObjectZoomByAtInput(t,e){t.zoomByAt(e.deltaZoom,e.anchorPoint)}lockedOnObjectZoomToAtInput(t,e){t.zoomToAt(e.targetZoom,e.anchorPoint)}userZoomByAtInput(t,e){t.zoomByAt(e.deltaZoom,e.anchorPoint)}userZoomToAtInput(t,e){t.zoomToAt(e.targetZoom,e.anchorPoint)}}class Et extends e{constructor(t,e,i){super(t,e,i)}notifyZoomByAtInput(t,e){this.happens("userZoomByAtInput",{deltaZoom:t,anchorPoint:e})}notifyZoomByAtInputAnimation(t,e){this.happens("transitionZoomByAtInput",{deltaZoom:t,anchorPoint:e})}notifyZoomToAtCenterInput(t,e){this.happens("transitionZoomToAtCenterInput",{targetZoom:t,anchorPoint:e})}notifyZoomToAtWorldInput(t,e){this.happens("transitionZoomToAtWorldInput",{targetZoom:t,anchorPoint:e})}initateTransition(){this.happens("initiateTransition",{})}}function Ht(){return{ACCEPTING_USER_INPUT:new Mt,TRANSITION:new At,LOCKED_ON_OBJECT:new Ot}}function Vt(t){return new Et(Ht(),"ACCEPTING_USER_INPUT",t)}class Lt{constructor(t,e){this._panStateMachine=t,this._zoomStateMachine=e}notifyPanToAnimationInput(t){this._panStateMachine.notifyPanToAnimationInput(t)}notifyPanInput(t){this._panStateMachine.notifyPanInput(t)}notifyZoomInput(t,e){this._zoomStateMachine.notifyZoomByAtInput(t,e)}notifyZoomInputAnimation(t,e={x:0,y:0}){this._zoomStateMachine.notifyZoomToAtCenterInput(t,e)}notifyZoomInputAnimationWorld(t,e={x:0,y:0}){this._zoomStateMachine.notifyZoomToAtWorldInput(t,e)}notifyRotationInput(t){console.error("Rotation input is not implemented")}initatePanTransition(){this._panStateMachine.initateTransition()}initateZoomTransition(){this._zoomStateMachine.initateTransition()}}function kt(t){const e=at(t),i=Rt(e),o=Vt(e);return new Lt(i,o)}function Zt(t){const e=Rt(t),i=Vt(t);return new Lt(e,i)}class Nt{constructor(t=at(new it)){this._cameraRig=t}notifyPanInput(t){this._cameraRig.panBy(t)}notifyZoomInput(t,e){this._cameraRig.zoomByAt(t,e)}notifyRotationInput(t){this._cameraRig.rotateBy(t)}}function Dt(t){const e=at(t);return new Nt(e)}function Wt(t){return new Nt(t)}class Ut{constructor(t){this.pan=new Q,this.zoom=new Q,this.rotate=new Q,this.all=new Q,this._flowControl=t}notifyPan(t){this._flowControl.notifyPanInput(t),this.pan.notify({diff:t}),this.all.notify({type:"pan",diff:t})}notifyZoom(t,e){this._flowControl.notifyZoomInput(t,e),this.zoom.notify({deltaZoomAmount:t,anchorPoint:e}),this.all.notify({type:"zoom",deltaZoomAmount:t,anchorPoint:e})}notifyRotate(t){this._flowControl.notifyRotationInput(t),this.rotate.notify({deltaRotation:t}),this.all.notify({type:"rotate",deltaRotation:t})}on(t,e){switch(t){case"pan":return this.pan.subscribe(e);case"zoom":return this.zoom.subscribe(e);case"rotate":return this.rotate.subscribe(e);case"all":return this.all.subscribe(e);default:throw new Error("Invalid raw user input event name")}}get flowControl(){return this._flowControl}set flowControl(t){this._flowControl=t}}function Ft(t){return new Ut(Dt(t))}function Yt(t,e){const i=e.getBoundingClientRect(),o={x:i.left+(i.right-i.left)/2,y:i.top+(i.bottom-i.top)/2};return s.subVector(t,o)}class jt extends i{constructor(){super(),this._guards={isIdle:()=>!0},this._eventGuards={},this._eventReactions={spacebarDown:{action:this.spacebarDownHandler,defaultTargetState:"READY_TO_PAN_VIA_SPACEBAR"},scroll:{action:this.scrollHandler,defaultTargetState:"IDLE"},scrollWithCtrl:{action:this.scrollWithCtrlHandler,defaultTargetState:"IDLE"},middlePointerDown:{action:this.middlePointerDownHandler,defaultTargetState:"READY_TO_PAN_VIA_SCROLL_WHEEL"}}}get eventReactions(){return this._eventReactions}scrollHandler(t,e){const i=Object.assign({},e);t.alignCoordinateSystem||(i.deltaY=-i.deltaY),t.notifyOnPan({x:i.deltaX,y:i.deltaY})}scrollWithCtrlHandler(t,e){let i=.005;Math.abs(e.deltaY)>100&&(i=5e-4);const o=e.deltaY*i,n=Yt({x:e.x,y:e.y},t.canvas);t.alignCoordinateSystem||(n.y=-n.y),t.notifyOnZoom(-5*o,n)}spacebarDownHandler(t,e){t.canvas.style.cursor="grab"}middlePointerDownHandler(t,e){t.setInitialCursorPosition({x:e.x,y:e.y}),t.canvas.style.cursor="grabbing"}}class Gt extends i{constructor(){super(),this.leftPointerMove=((t,e)=>{const i=Yt({x:e.x,y:e.y},t.canvas);t.setSelectionEndPoint(i),t.toggleSelectionBox(!0)}).bind(this),this._eventReactions={leftPointerUp:{action:()=>"IDLE",defaultTargetState:"IDLE"},leftPointerMove:{action:this.leftPointerMove,defaultTargetState:"SELECTING"}}}get eventReactions(){return this._eventReactions}}class Xt extends i{constructor(){super(),this._eventReactions={spacebarUp:{action:this.spacebarUpHandler,defaultTargetState:"IDLE"},leftPointerDown:{action:this.leftPointerDownHandler,defaultTargetState:"INITIAL_PAN"}}}get eventReactions(){return this._eventReactions}leftPointerDownHandler(t,e){t.setInitialCursorPosition({x:e.x,y:e.y}),t.canvas.style.cursor="grabbing"}spacebarUpHandler(t,e){t.canvas.style.cursor="default"}}class $t extends i{constructor(){super(),this._eventReactions={leftPointerUp:{action:this.leftPointerUpHandler,defaultTargetState:"READY_TO_PAN_VIA_SPACEBAR"},leftPointerMove:{action:this.leftPointerMoveHandler,defaultTargetState:"PAN"},spacebarUp:{action:()=>"IDLE",defaultTargetState:"IDLE"},leftPointerDown:{action:()=>"PAN",defaultTargetState:"PAN"}}}get eventReactions(){return this._eventReactions}leftPointerMoveHandler(t,e){const i={x:t.initialCursorPosition.x-e.x,y:t.initialCursorPosition.y-e.y};t.alignCoordinateSystem||(i.y=-i.y),t.notifyOnPan(i),t.setInitialCursorPosition({x:e.x,y:e.y})}leftPointerUpHandler(t,e){t.canvas.style.cursor="grab"}}class Kt extends i{constructor(){super(),this._eventReactions={middlePointerUp:{action:this.middlePointerUpHandler,defaultTargetState:"IDLE"},middlePointerMove:{action:this.middlePointerMoveHandler,defaultTargetState:"PAN_VIA_SCROLL_WHEEL"}}}get eventReactions(){return this._eventReactions}middlePointerMoveHandler(t,e){t.canvas.style.cursor="grabbing"}middlePointerUpHandler(t,e){t.canvas.style.cursor="default"}}class Jt extends i{constructor(){super(),this._eventReactions={leftPointerUp:{action:this.leftPointerUpHandler,defaultTargetState:"READY_TO_PAN_VIA_SPACEBAR"},leftPointerMove:{action:this.leftPointerMoveHandler,defaultTargetState:"PAN"},spacebarUp:{action:this.spacebarUpHandler,defaultTargetState:"IDLE"}}}get eventReactions(){return this._eventReactions}leftPointerMoveHandler(t,e){const i={x:t.initial