canvas-select/lib/canvas-select.esm.js

一个用于图片标注的javascript库，基于canvas，简单轻量，支持矩形、多边形、点、折线、圆形、网格、画笔、橡皮擦

/*!
 * canvas-select v2.36.0
 * 一个用于图片标注的javascript库，基于canvas，简单轻量，支持矩形、多边形、点、折线、圆形、网格、画笔、橡皮擦
 * (c) 2026 heylight
 * Released under the MIT License.
 */
function t(t,e){(null==e||e>t.length)&&(e=t.length);for(var i=0,s=Array(e);i<e;i++)s[i]=t[i];return s}function e(t,e,i){return e=n(e),function(t,e){if(e&&("object"==typeof e||"function"==typeof e))return e;if(void 0!==e)throw new TypeError("Derived constructors may only return object or undefined");return function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(t)}(t,h()?Reflect.construct(e,i||[],n(t).constructor):e.apply(t,i))}function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function s(t,e,i){return e&&function(t,e){for(var i=0;i<e.length;i++){var s=e[i];s.enumerable=s.enumerable||!1,s.configurable=!0,"value"in s&&(s.writable=!0),Object.defineProperty(t,d(s.key),s)}}(t.prototype,e),Object.defineProperty(t,"prototype",{writable:!1}),t}function a(t,e,i){return(e=d(e))in t?Object.defineProperty(t,e,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[e]=i,t}function n(t){return n=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(t){return t.__proto__||Object.getPrototypeOf(t)},n(t)}function r(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),Object.defineProperty(t,"prototype",{writable:!1}),e&&l(t,e)}function h(){try{var t=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}))}catch(t){}return(h=function(){return!!t})()}function o(t,e){var i=Object.keys(t);if(Object.getOwnPropertySymbols){var s=Object.getOwnPropertySymbols(t);e&&(s=s.filter(function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})),i.push.apply(i,s)}return i}function c(t){for(var e=1;e<arguments.length;e++){var i=null!=arguments[e]?arguments[e]:{};e%2?o(Object(i),!0).forEach(function(e){a(t,e,i[e])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(i)):o(Object(i)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(i,e))})}return t}function l(t,e){return l=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,e){return t.__proto__=e,t},l(t,e)}function u(e,i){return function(t){if(Array.isArray(t))return t}(e)||function(t,e){var i=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=i){var s,a,n,r,h=[],o=!0,c=!1;try{if(n=(i=i.call(t)).next,0===e){if(Object(i)!==i)return;o=!1}else for(;!(o=(s=n.call(i)).done)&&(h.push(s.value),h.length!==e);o=!0);}catch(t){c=!0,a=t}finally{try{if(!o&&null!=i.return&&(r=i.return(),Object(r)!==r))return}finally{if(c)throw a}}return h}}(e,i)||function(e,i){if(e){if("string"==typeof e)return t(e,i);var s={}.toString.call(e).slice(8,-1);return"Object"===s&&e.constructor&&(s=e.constructor.name),"Map"===s||"Set"===s?Array.from(e):"Arguments"===s||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(s)?t(e,i):void 0}}(e,i)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function d(t){var e=function(t,e){if("object"!=typeof t||!t)return t;var i=t[Symbol.toPrimitive];if(void 0!==i){var s=i.call(t,e);if("object"!=typeof s)return s;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(t)}(t,"string");return"symbol"==typeof e?e:e+""}var v=s(function t(e,s){i(this,t),a(this,"label",""),a(this,"coor",[]),a(this,"active",!1),a(this,"creating",!1),a(this,"dragging",!1),a(this,"uuid",function(){for(var t=[],e="0123456789abcdef",i=0;i<36;i++){var s=Math.floor(16*Math.random());t[i]=e.slice(s,s+1)}t[14]="4";var a=3&t[19]|8;return t[19]=e.slice(a,a+1),t[8]=t[13]=t[18]=t[23]="-",t.join("")}()),this.index=s,Object.assign(this,e)}),f=function(){function t(s,n,r){var h,o,c,l,u;return i(this,t),a(u=e(this,t,[s,n]),"type",1),a(u,"rotation",0),u.lineWidth=null!==(h=s.lineWidth)&&void 0!==h?h:r.lineWidth,u.fillStyle=null!==(o=s.fillStyle)&&void 0!==o?o:r.fillStyle,u.strokeStyle=null!==(c=s.strokeStyle)&&void 0!==c?c:r.strokeStyle,u.showRotation=null!==(l=s.showRotation)&&void 0!==l?l:r.showRotation,u}return r(t,v),s(t,[{key:"ctrlsData",get:function(){var t=this,e=u(this.coor,2),i=u(e[0],2),s=i[0],a=i[1],n=u(e[1],2),r=n[0],h=n[1],o=(s+r)/2,c=(a+h)/2,l=r-s,d=h-a,v=[[s,a],[s+l/2,a],[r,a],[r,a+d/2],[r,h],[s+l/2,h],[s,h],[s,a+d/2]];return this.showRotation&&v.push([o,a-20,"green"]),0===this.rotation?v:v.map(function(e){var i=u(e,2),s=i[0],a=i[1],n=s-o,r=a-c,h=n*Math.cos(t.rotation)-r*Math.sin(t.rotation),l=n*Math.sin(t.rotation)+r*Math.cos(t.rotation);return[h+o,l+c]})}},{key:"center",get:function(){var t=u(this.coor,2),e=u(t[0],2),i=e[0],s=e[1],a=u(t[1],2);return[(i+a[0])/2,(s+a[1])/2]}}])}(),y=function(){function t(s,n,r){var h,o,c;return i(this,t),a(c=e(this,t,[s,n]),"type",2),c.fillStyle=null!==(h=s.fillStyle)&&void 0!==h?h:r.fillStyle,c.strokeStyle=null!==(o=s.strokeStyle)&&void 0!==o?o:r.strokeStyle,c}return r(t,v),s(t,[{key:"ctrlsData",get:function(){return this.coor.length>2?this.coor:[]}}])}(),p=function(){function t(s,n,r){var h,o,c;return i(this,t),a(c=e(this,t,[s,n]),"type",3),c.fillStyle=null!==(h=s.fillStyle)&&void 0!==h?h:r.fillStyle,c.strokeStyle=null!==(o=s.strokeStyle)&&void 0!==o?o:r.strokeStyle,c}return r(t,v),s(t)}(),g=function(){return s(function t(){i(this,t),a(this,"_eventTree",{})},[{key:"on",value:function(t,e){var i=this._eventTree[t];Array.isArray(i)?i.push(e):this._eventTree[t]=[e]}},{key:"emit",value:function(t){for(var e=arguments.length,i=new Array(e>1?e-1:0),s=1;s<e;s++)i[s-1]=arguments[s];var a=this._eventTree[t];Array.isArray(a)&&a.forEach(function(t){return t.apply(void 0,i)})}},{key:"off",value:function(t,e){var i=this._eventTree[t],s=i.find(function(t){return t===e});Array.isArray(i)&&s&&i.splice(s,1)}}])}(),S=function(){function t(s,n,r){var h,o;return i(this,t),a(o=e(this,t,[s,n]),"type",4),o.strokeStyle=null!==(h=s.strokeStyle)&&void 0!==h?h:r.strokeStyle,o}return r(t,v),s(t,[{key:"ctrlsData",get:function(){return this.coor.length>1?this.coor:[]}}])}(),I=function(){function t(s,n,r){var h,o,c;return i(this,t),a(c=e(this,t,[s,n]),"type",5),a(c,"radius",0),c.radius=s.radius||c.radius,c.fillStyle=null!==(h=s.fillStyle)&&void 0!==h?h:r.fillStyle,c.strokeStyle=null!==(o=s.strokeStyle)&&void 0!==o?o:r.strokeStyle,c}return r(t,v),s(t,[{key:"ctrlsData",get:function(){var t=u(this.coor,2),e=t[0],i=t[1];return[[e,i-this.radius],[e+this.radius,i],[e,i+this.radius],[e-this.radius,i]]}}])}(),m=function(){function t(s,n,r){var h,o,c;return i(this,t),a(c=e(this,t,[s,n]),"type",6),a(c,"row",1),a(c,"col",1),a(c,"selected",[]),c.row=s.row>0?s.row:c.row,c.col=s.col>0?s.col:c.col,c.selected=Array.isArray(s.selected)?s.selected:[],c.fillStyle=null!==(h=s.fillStyle)&&void 0!==h?h:r.fillStyle,c.strokeStyle=null!==(o=s.strokeStyle)&&void 0!==o?o:r.strokeStyle,c}return r(t,v),s(t,[{key:"ctrlsData",get:function(){var t=u(this.coor,2),e=u(t[0],2),i=e[0],s=e[1],a=u(t[1],2),n=a[0],r=a[1];return[[i,s],[i+(n-i)/2,s],[n,s],[n,s+(r-s)/2],[n,r],[i+(n-i)/2,r],[i,r],[i,s+(r-s)/2]]}},{key:"gridRects",get:function(){for(var t=u(this.coor,2),e=u(t[0],2),i=e[0],s=e[1],a=u(t[1],2),n=a[0],r=a[1],h=this.row,o=this.col,c=this.strokeStyle,l=this.fillStyle,d=this.active,v=this.creating,y=this.lineWidth,p=(n-i)/this.col,g=(r-s)/this.row,S=[],I=0;I<h;I++)for(var m=0;m<o;m++){var b=[i+m*p,s+I*g],x=new f({coor:[b,[b[0]+p,b[1]+g]],strokeStyle:c,fillStyle:l,active:d,creating:v,lineWidth:y},I*o+m,{});S.push(x)}return S}}])}(),b="2.36.0",x=function(){function t(s,n,r){var h,o,c;return i(this,t),a(c=e(this,t,[s,n]),"type",7),a(c,"coor",[]),c.brushSize=null!==(h=s.brushSize)&&void 0!==h?h:r.brushSize,c.brushStokeStyle=null!==(o=s.brushStokeStyle)&&void 0!==o?o:r.brushStokeStyle,c.coor=s.coor,c}return r(t,v),s(t)}(),M=function(){function t(s,n,r){var h,o;return i(this,t),a(o=e(this,t,[s,n]),"type",8),a(o,"coor",[]),o.eraserSize=null!==(h=s.eraserSize)&&void 0!==h?h:r.eraserSize,o.coor=s.coor,o}return r(t,v),s(t)}(),k=function(t){return t[t.None=0]="None",t[t.Rect=1]="Rect",t[t.Polygon=2]="Polygon",t[t.Dot=3]="Dot",t[t.Line=4]="Line",t[t.Circle=5]="Circle",t[t.Grid=6]="Grid",t[t.Brush=7]="Brush",t[t.Eraser=8]="Eraser",t}(k||{}),E=function(){function t(s,n){var r;i(this,t),a(r=e(this,t),"version",b),a(r,"lock",!1),a(r,"readonly",!1),a(r,"MIN_WIDTH",10),a(r,"MIN_HEIGHT",10),a(r,"MIN_RADIUS",5),a(r,"strokeStyle","#0f0"),a(r,"fillStyle","rgba(0, 0, 255, 0.1)"),a(r,"lineWidth",1),a(r,"activeStrokeStyle","#f00"),a(r,"activeFillStyle","rgba(0, 0, 255, 0.1)"),a(r,"ctrlStrokeStyle","#000"),a(r,"ctrlFillStyle","#fff"),a(r,"ctrlRadius",3),a(r,"hideLabel",!1),a(r,"labelFillStyle","#fff"),a(r,"labelFont","10px sans-serif"),a(r,"textFillStyle","#000"),a(r,"labelMaxLen",10),a(r,"WIDTH",0),a(r,"HEIGHT",0),a(r,"crossX",new S({},0,{})),a(r,"crossY",new S({},1,{})),a(r,"crossStroke","#ff0"),a(r,"showCross",!1),a(r,"showRotation",!1),a(r,"dataset",[]),a(r,"isMagnifierVisible",!1),a(r,"magnifierPosition","auto"),a(r,"remmber",[]),a(r,"mouse",[0,0]),a(r,"remmberOrigin",[0,0]),a(r,"createType",k.None),a(r,"ctrlIndex",-1),a(r,"image",new Image),a(r,"IMAGE_ORIGIN_WIDTH",0),a(r,"IMAGE_WIDTH",0),a(r,"IMAGE_ORIGIN_HEIGHT",0),a(r,"IMAGE_HEIGHT",0),a(r,"originX",0),a(r,"originY",0),a(r,"scaleStep",0),a(r,"scrollZoom",!0),a(r,"timer",null),a(r,"dblTouch",300),a(r,"dblTouchStore",0),a(r,"alpha",!0),a(r,"focusMode",!1),a(r,"scaleTouchStore",0),a(r,"isTouch2",!1),a(r,"isMobile",navigator.userAgent.includes("Mobile")),a(r,"labelUp",!1),a(r,"isCtrlKey",!1),a(r,"ctrlCode","ControlLeft"),a(r,"gridMenuEnable",!0),a(r,"gridSelectedFillStyle","rgba(255, 255, 0, 0.6)"),a(r,"brushSize",20),a(r,"brushStokeStyle","#f00"),a(r,"eraserSize",20),a(r,"position",[0,0]),a(r,"scaleDelta",.05),r.handleLoad=r.handleLoad.bind(r),r.handleContextmenu=r.handleContextmenu.bind(r),r.handleMousewheel=r.handleMousewheel.bind(r),r.handleMouseDown=r.handleMouseDown.bind(r),r.handleMouseMove=r.handleMouseMove.bind(r),r.handleMouseUp=r.handleMouseUp.bind(r),r.handleDblclick=r.handleDblclick.bind(r),r.handleKeyup=r.handleKeyup.bind(r),r.handleKeydown=r.handleKeydown.bind(r);var h="string"==typeof s?document.querySelector(s):s;return h instanceof HTMLCanvasElement?(r.canvas=h,r.offScreen=document.createElement("canvas"),r.initSetting(),r.initEvents(),n&&r.setImage(n)):console.warn("HTMLCanvasElement is required!"),r.crossX.strokeStyle=r.crossStroke,r.crossY.strokeStyle=r.crossStroke,r}return r(t,g),s(t,[{key:"activeShape",get:function(){return this.dataset.find(function(t){return t.active})||{}}},{key:"scale",get:function(){return this.IMAGE_ORIGIN_WIDTH&&this.IMAGE_WIDTH?this.IMAGE_WIDTH/this.IMAGE_ORIGIN_WIDTH:1}},{key:"imageMin",get:function(){return Math.min(this.IMAGE_WIDTH,this.IMAGE_HEIGHT)}},{key:"imageOriginMax",get:function(){return Math.max(this.IMAGE_ORIGIN_WIDTH,this.IMAGE_ORIGIN_HEIGHT)}},{key:"createMagnifierCanvas",value:function(){this.isMagnifierVisible&&(this.magnifierCanvas=this.magnifierCanvas||document.createElement("canvas"),this.magnifierCtx=this.magnifierCanvas&&this.magnifierCanvas.getContext("2d",{willReadFrequently:!0}),this.magnifierCanvas.style.position="fixed",this.magnifierCanvas.style.pointerEvents="none",this.magnifierCanvas.style.zIndex="1000",this.magnifierCanvas.style.border="1px solid black",this.magnifierCanvas.style.borderRadius="50%",this.magnifierCanvas.style.width="100px",this.magnifierCanvas.style.height="100px",document.body.appendChild(this.magnifierCanvas))}},{key:"createMagnifier",value:function(t,e){this.magnifierCanvas?this.updateMagnifier(t,e):this.createMagnifierCanvas()}},{key:"updateMagnifier",value:function(t,e){if(this.canvas&&this.magnifierCanvas&&this.magnifierCtx){var i,s=100,a=window.devicePixelRatio||1;if(this.magnifierCanvas.width=s,this.magnifierCanvas.height=s,this.magnifierCtx.clearRect(0,0,s,s),this.magnifierPosition&&2===this.magnifierPosition.length){var n=u(this.magnifierPosition,2),r=n[0],h=n[1];this.magnifierCanvas.style.left="".concat(r,"px"),this.magnifierCanvas.style.top="".concat(h,"px")}else this.magnifierCanvas.style.left="".concat(t+10,"px"),this.magnifierCanvas.style.top="".concat(e+10,"px");var o=this.getImageDataFromCanvas(this.canvas,[t*a-50,e*a-50,s,s]),c=null===(i=this.magnifierCanvas.getContext("2d",{willReadFrequently:!0}))||void 0===i?void 0:i.createImageData(this.magnifierCanvas.width,this.magnifierCanvas.height);if(c&&o){for(var l,d=0,v=0;v<s;v+=1)for(var f=0;f<s;f+=1){for(var y=v;y<v+1;y++)for(var p=f;p<f+1;p++){var g=4*(y*s+p);c.data[g]=o.data[d],c.data[g+1]=o.data[d+1],c.data[g+2]=o.data[d+2],c.data[g+3]=o.data[d+3]}d+=4}null===(l=this.magnifierCanvas.getContext("2d",{willReadFrequently:!0}))||void 0===l||l.putImageData(c,0,0),this.magnifierCtx.strokeStyle="rgba(0, 0, 0, 0.5)",this.magnifierCtx.lineWidth=2,this.magnifierCtx.strokeRect(0,0,s,s)}}}},{key:"destroyMagnifier",value:function(){this.magnifierCanvas&&(this.magnifierCanvas.remove(),this.magnifierCanvas=void 0,this.magnifierCtx=void 0)}},{key:"getImageDataFromCanvas",value:function(t,e){var i=u(e,4),s=i[0],a=i[1],n=i[2],r=i[3],h=t.getContext("2d",{willReadFrequently:!0});return null==h?void 0:h.getImageData(s,a,n,r)}},{key:"mergeEvent",value:function(t){var e=0,i=0,s=0,a=0;if(this.isMobile&&t.touches){var n,r,h=t.touches[0],o=h.clientX,l=h.clientY,u=t.target.getBoundingClientRect(),d=u.left,v=u.top;if(e=Math.round(o-d),i=Math.round(l-v),2===(null===(n=t.touches)||void 0===n?void 0:n.length)){var f=t.touches[1]||{},y=f.clientX,p=void 0===y?0:y,g=f.clientY,S=void 0===g?0:g;s=Math.round(Math.abs((p-o)/2+o)-d),a=Math.round(Math.abs((S-l)/2+l)-v)}else 1===(null===(r=t.touches)||void 0===r?void 0:r.length)&&(s=Math.round(o-d),a=Math.round(l-v))}else e=t.offsetX,i=t.offsetY;return c(c({},t),{},{mouseX:e,mouseY:i,mouseCX:s,mouseCY:a})}},{key:"handleLoad",value:function(){this.emit("load",this.image.src),this.IMAGE_ORIGIN_WIDTH=this.IMAGE_WIDTH=this.image.width,this.IMAGE_ORIGIN_HEIGHT=this.IMAGE_HEIGHT=this.image.height,this.fitZoom()}},{key:"handleContextmenu",value:function(t){t.preventDefault(),this.lock}},{key:"handleMousewheel",value:function(t){if(t.preventDefault(),t.stopPropagation(),!this.lock&&this.scrollZoom){var e=this.mergeEvent(t),i=e.mouseX,s=e.mouseY;this.mouse=[i,s],this.setScale(t.deltaY<0,!0)}}},{key:"handleMouseDown",value:function(t){var e,i,s,a=this;if(t.stopPropagation(),!this.lock){var n=this.mergeEvent(t),r=n.mouseX,h=n.mouseY,o=n.mouseCX,c=n.mouseCY,l=Math.round(r/this.scale),d=Math.round(h/this.scale);if(this.mouse=this.isMobile&&2===(null===(e=t.touches)||void 0===e?void 0:e.length)?[o,c]:[r,h],this.remmberOrigin=[r-this.originX,h-this.originY],!this.isMobile&&1===t.buttons||this.isMobile&&1===(null===(i=t.touches)||void 0===i?void 0:i.length)){var v=this.activeShape.ctrlsData||[];if(this.ctrlIndex=v.findIndex(function(t){return a.isPointInCircle(a.mouse,t,a.ctrlRadius)}),this.ctrlIndex>-1&&!this.readonly){var g=u(v[this.ctrlIndex],2),b=g[0],E=g[1];this.activeShape.type===k.Polygon&&this.activeShape.coor.length>2&&0===this.ctrlIndex&&this.handleDblclick(t),this.remmber=[[l-b,d-E]]}else if(this.isInBackground(t)){var w=Math.round(l-this.originX/this.scale),H=Math.round(d-this.originY/this.scale);if(this.activeShape.creating&&!this.readonly){if([k.Polygon,k.Line].includes(this.activeShape.type)){var T=u(this.activeShape.coor[this.activeShape.coor.length-1],2),G=T[0],C=T[1];G!==l&&C!==d&&this.activeShape.coor.push([w,H])}}else if(this.createType===k.None||this.readonly||this.isCtrlKey){var D,_;if(this.isCtrlKey&&this.activeShape.type){var W=this.hitAllOnShape(this.mouse),R=W.findIndex(function(t){return t.index===a.activeShape.index});_=R>=0&&R<W.length-1?W[R+1]:W[0],D=_?this.dataset.indexOf(_):-1}else{var O=u(this.hitOnShape(this.mouse),2);D=O[0],_=O[1]}if(D>-1&&_){if(this.isCtrlKey||(this.dataset.splice(D,1),this.dataset.push(_),D=this.dataset.length-1),_.dragging=!0,this.dataset.forEach(function(t,e){return t.active=e===D}),!this.readonly)if(this.remmber=[],[k.Dot,k.Circle].includes(_.type)){var P=u(_.coor,2),A=P[0],L=P[1];this.remmber=[[l-A,d-L]]}else _.coor.forEach(function(t){a.remmber.push([l-t[0],d-t[1]])});this.emit("select",_)}else this.activeShape.active=!1,this.dataset.sort(function(t,e){return t.index-e.index}),this.emit("select",null)}else{var N,X=[w,H];switch(this.createType){case k.Rect:(N=new f({coor:[X,X]},this.dataset.length,this)).creating=!0;break;case k.Polygon:(N=new y({coor:[X]},this.dataset.length,this)).creating=!0;break;case k.Dot:N=new p({coor:X},this.dataset.length,this),this.emit("add",N);break;case k.Line:(N=new S({coor:[X]},this.dataset.length,this)).creating=!0;break;case k.Circle:N=new I({coor:X},this.dataset.length,this),console.log(N),N.creating=!0;break;case k.Grid:(N=new m({coor:[X,X]},this.dataset.length,this)).creating=!0;break;case k.Brush:(N=new x({coor:[X]},this.dataset.length,this)).creating=!0;break;case k.Eraser:(N=new M({coor:[X]},this.dataset.length,this)).creating=!0}N&&(this.dataset.forEach(function(t){t.active=!1}),N.active=!0,this.dataset.push(N))}this.update()}}else if(!this.isMobile&&2===t.buttons||this.isMobile&&3===(null===(s=t.touches)||void 0===s?void 0:s.length)&&!this.readonly){if([k.Grid].includes(this.activeShape.type)&&this.gridMenuEnable){var Y=prompt("x 行 y 列 x,y",[this.activeShape.row,this.activeShape.col].join(","));if("string"==typeof Y){var j=u(Y.split(","),2),F=j[0],B=j[1];/^[1-9]\d*$/.test(F)&&/^[1-9]\d*$/.test(B)&&(this.activeShape.row=Number(F),this.activeShape.col=Number(B),this.update())}}this.emit("contextmenu",t)}}}},{key:"handleMouseMove",value:function(t){var e,i,s,a;if(t.stopPropagation(),!this.lock){var n=this.mergeEvent(t),r=n.mouseX,h=n.mouseY,o=n.mouseCX,c=n.mouseCY,l=Math.round(r/this.scale),d=Math.round(h/this.scale);!this.isCtrlKey&&this.isInBackground(t)?(this.crossX.coor=[[l-this.originX/this.scale,0],[l-this.originX/this.scale,this.image.height]],this.crossY.coor=[[0,d-this.originY/this.scale],[this.image.width,d-this.originY/this.scale]]):(this.crossX.coor=[],this.crossY.coor=[]),this.mouse=this.isMobile&&2===(null===(e=t.touches)||void 0===e?void 0:e.length)?[o,c]:[r,h];var v=Math.round(l-this.originX/this.scale),f=Math.round(d-this.originY/this.scale);if(this.position=[v,f],(!this.isMobile&&1===t.buttons||this.isMobile&&1===(null===(i=t.touches)||void 0===i?void 0:i.length))&&this.activeShape.type){if(this.ctrlIndex>-1&&this.remmber.length&&(this.isInBackground(t)||this.activeShape.type===k.Circle)){var y=u(this.remmber,1),p=u(y[0],2),g=p[0],S=p[1];if([k.Rect,k.Grid].includes(this.activeShape.type))if(8===this.ctrlIndex){var I=u(this.activeShape.center,2),m=l-g-I[0],b=d-S-I[1];this.activeShape.rotation=Math.atan2(b,m)+Math.PI/2}else{var x=u(this.activeShape.coor,2),M=u(x[0],2),E=M[0],w=M[1],H=u(x[1],2),T=H[0],G=H[1],C=[];switch(this.ctrlIndex){case 0:C=[[l-g,d-S],[T,G]];break;case 1:C=[[E,d-S],[T,G]];break;case 2:C=[[E,d-S],[l-g,G]];break;case 3:C=[[E,w],[l-g,G]];break;case 4:C=[[E,w],[l-g,d-S]];break;case 5:C=[[E,w],[T,d-S]];break;case 6:C=[[l-g,w],[T,d-S]];break;case 7:C=[[l-g,w],[T,G]]}var D=u(C,2),_=u(D[0],2),W=_[0],R=_[1],O=u(D[1],2),P=O[0],A=O[1];(W<0||P<0||R<0||A<0||P>this.IMAGE_ORIGIN_WIDTH||A>this.IMAGE_ORIGIN_HEIGHT)&&(W<0&&(W=0),P<0&&(P=0),R<0&&(R=0),A<0&&(A=0),P>this.IMAGE_ORIGIN_WIDTH&&(P=this.IMAGE_ORIGIN_WIDTH),A>this.IMAGE_ORIGIN_HEIGHT&&(A=this.IMAGE_ORIGIN_HEIGHT)),P-W>=this.MIN_WIDTH&&A-R>=this.MIN_HEIGHT?this.activeShape.coor=[[W,R],[P,A]]:this.emit("warn","Width cannot be less than ".concat(this.MIN_WIDTH,",Height cannot be less than").concat(this.MIN_HEIGHT,"。"))}else if([k.Polygon,k.Line].includes(this.activeShape.type)){var L=[v,f];this.activeShape.coor.splice(this.ctrlIndex,1,L)}else if(this.activeShape.type===k.Circle){var N=Math.round(l-this.originX/this.scale)-this.activeShape.coor[0];N>=this.MIN_RADIUS&&(this.activeShape.radius=N)}if(this.isMagnifierVisible){var X=u(this.isMobile?[o,c]:[r,h],2),Y=X[0],j=X[1];this.createMagnifier(Y,j)}}else if(this.activeShape.dragging&&!this.readonly){if(this.isMagnifierVisible&&3===this.activeShape.type){var F=u(this.isMobile?[o,c]:[r,h],2),B=F[0],K=F[1];this.createMagnifier(B,K)}var z=[],U=!0,q=this.IMAGE_ORIGIN_WIDTH||this.WIDTH,J=this.IMAGE_ORIGIN_HEIGHT||this.HEIGHT;if([k.Dot,k.Circle].includes(this.activeShape.type)){var V=u(this.remmber[0],2),Z=l-V[0],$=d-V[1];(Z<0||Z>q||$<0||$>J)&&(U=!1),z=[Z,$]}else for(var Q=0;Q<this.activeShape.coor.length;Q++){var tt=this.remmber[Q],et=l-tt[0],it=d-tt[1];(et<0||et>q||it<0||it>J)&&(U=!1),z.push([et,it])}U&&(this.activeShape.coor=z)}else if(this.activeShape.creating&&this.isInBackground(t))if([k.Rect,k.Grid].includes(this.activeShape.type))this.activeShape.coor.splice(1,1,[v,f]);else if(this.activeShape.type===k.Circle){var st=u(this.activeShape.coor,2),at=st[0],nt=st[1],rt=Math.sqrt(Math.pow(at-v,2)+Math.pow(nt-f,2));this.activeShape.radius=rt}else[k.Brush,k.Eraser].includes(this.activeShape.type)&&this.activeShape.coor.push([v,f]);this.update()}else if([k.Polygon,k.Line].includes(this.activeShape.type)&&this.activeShape.creating)this.update();else if(!this.isMobile&&[1,2].includes(t.buttons)||this.isMobile&&1===(null===(s=t.touches)||void 0===s?void 0:s.length)&&!this.isTouch2)this.originX=Math.round(r-this.remmberOrigin[0]),this.originY=Math.round(h-this.remmberOrigin[1]),this.update();else if(this.isMobile&&2===(null===(a=t.touches)||void 0===a?void 0:a.length)){this.isTouch2=!0;var ht=t.touches[0],ot=t.touches[1],ct=this.scaleTouchStore;this.scaleTouchStore=Math.abs((ot.clientX-ht.clientX)*(ot.clientY-ht.clientY)),this.setScale(this.scaleTouchStore>ct,!0)}else this.isCtrlKey||this.update()}}},{key:"handleMouseUp",value:function(t){if(t.stopPropagation(),!this.lock){if(this.destroyMagnifier(),this.isMobile){var e;if(0===(null===(e=t.touches)||void 0===e?void 0:e.length)&&(this.isTouch2=!1),Date.now()-this.dblTouchStore<this.dblTouch)return void this.handleDblclick(t);this.dblTouchStore=Date.now()}if(this.remmber=[],this.activeShape.type!==k.None&&!this.isCtrlKey&&(this.activeShape.dragging=!1,this.activeShape.creating)){if([k.Rect,k.Grid].includes(this.activeShape.type)){var i=u(this.activeShape.coor,2),s=u(i[0],2),a=s[0],n=s[1],r=u(i[1],2),h=r[0],o=r[1];Math.abs(a-h)<this.MIN_WIDTH||Math.abs(n-o)<this.MIN_HEIGHT?(this.dataset.pop(),this.emit("warn","Width cannot be less than ".concat(this.MIN_WIDTH,",Height cannot be less than ").concat(this.MIN_HEIGHT))):(this.activeShape.coor=[[Math.min(a,h),Math.min(n,o)],[Math.max(a,h),Math.max(n,o)]],this.activeShape.creating=!1,this.emit("add",this.activeShape))}else this.activeShape.type===k.Circle?this.activeShape.radius<this.MIN_RADIUS?(this.dataset.pop(),this.emit("warn","Radius cannot be less than ".concat(this.MIN_WIDTH))):(this.activeShape.creating=!1,this.emit("add",this.activeShape)):[k.Brush,k.Eraser].includes(this.activeShape.type)&&(this.activeShape.creating=!1,this.emit("add",this.activeShape));this.update()}}}},{key:"handleDblclick",value:function(t){var e=this;if(t.stopPropagation(),!this.lock)if([k.Polygon,k.Line].includes(this.activeShape.type)){var i=this.activeShape.type===k.Polygon&&this.activeShape.coor.length>2,s=this.activeShape.type===k.Line&&this.activeShape.coor.length>1;(i||s)&&(this.emit("add",this.activeShape),this.activeShape.creating=!1,this.update())}else[k.Grid].includes(this.activeShape.type)&&this.activeShape.active&&(this.activeShape.gridRects.forEach(function(t){if(e.isPointInRect(e.mouse,t.coor)){var i=e.activeShape.selected.findIndex(function(e){return t.index===e});i>-1?e.activeShape.selected.splice(i,1):e.activeShape.selected.push(t.index)}}),this.update())}},{key:"handleKeydown",value:function(t){t.code===this.ctrlCode&&(this.isCtrlKey=!0)}},{key:"handleKeyup",value:function(t){if(t.code===this.ctrlCode){this.isCtrlKey=!1;var e=this.activeShape;if(e.type){var i=this.dataset.indexOf(e);i>-1&&i<this.dataset.length-1&&(this.dataset.splice(i,1),this.dataset.push(e),this.update())}}this.lock||document.activeElement!==document.body||this.readonly||this.activeShape.type&&([k.Polygon,k.Line].includes(this.activeShape.type)&&"Escape"===t.key?(this.activeShape.coor.length>1&&this.activeShape.creating?this.activeShape.coor.pop():this.deleteByIndex(this.activeShape.index),this.update()):["Delete","Backspace"].includes(t.key)&&this.deleteByIndex(this.activeShape.index))}},{key:"initSetting",value:function(){var t;if(this.canvas&&this.offScreen){var e=window.devicePixelRatio||1;this.image.crossOrigin="anonymous",this.canvas.style.userSelect="none",this.ctx=this.ctx||this.canvas.getContext("2d",{alpha:this.alpha}),this.WIDTH=Math.round(this.canvas.clientWidth),this.HEIGHT=Math.round(this.canvas.clientHeight),this.canvas.width=this.WIDTH*e,this.canvas.height=this.HEIGHT*e,this.canvas.style.width=this.WIDTH+"px",this.canvas.style.height=this.HEIGHT+"px",this.offScreen.width=this.WIDTH,this.offScreen.height=this.HEIGHT,this.offScreenCtx=this.offScreenCtx||this.offScreen.getContext("2d",{willReadFrequently:!0}),null===(t=this.ctx)||void 0===t||t.scale(e,e)}}},{key:"initEvents",value:function(){this.canvas&&(this.image.addEventListener("load",this.handleLoad),this.canvas.addEventListener("touchstart",this.handleMouseDown),this.canvas.addEventListener("touchmove",this.handleMouseMove),this.canvas.addEventListener("touchend",this.handleMouseUp),this.canvas.addEventListener("contextmenu",this.handleContextmenu),this.canvas.addEventListener("mousewheel",this.handleMousewheel),this.canvas.addEventListener("wheel",this.handleMousewheel),this.canvas.addEventListener("mousedown",this.handleMouseDown),this.canvas.addEventListener("mousemove",this.handleMouseMove),this.canvas.addEventListener("mouseup",this.handleMouseUp),this.canvas.addEventListener("dblclick",this.handleDblclick),document.body.addEventListener("keydown",this.handleKeydown,!0),document.body.addEventListener("keyup",this.handleKeyup,!0))}},{key:"setImage",value:function(t){var e="string"==typeof t?t:"";this.emit("loading",e),"string"==typeof t?this.image.src=t:(this.image=t,this.image.crossOrigin="anonymous",this.image.complete?this.handleLoad():this.image.addEventListener("load",this.handleLoad))}},{key:"setData",value:function(t){var e=this;setTimeout(function(){var i=[];t.forEach(function(t,s){if(Object.prototype.toString.call(t).includes("Object")){var a;switch(t.type){case k.Rect:a=new f(t,s,e);break;case k.Polygon:a=new y(t,s,e);break;case k.Dot:a=new p(t,s,e);break;case k.Line:a=new S(t,s,e);break;case k.Circle:a=new I(t,s,e);break;case k.Grid:a=new m(t,s,e);break;case k.Brush:a=new x(t,s,e);break;case k.Eraser:a=new M(t,s,e);break;default:console.warn("Invalid shape",t)}[k.Rect,k.Polygon,k.Dot,k.Line,k.Circle,k.Grid,k.Brush,k.Eraser].includes(t.type)&&a&&i.push(a)}else console.warn("Shape must be an enumerable Object.",t)}),e.dataset=i,e.update()})}},{key:"isShapeHit",value:function(t,e){return t.type===k.Dot?this.isPointInCircle(e,t.coor,this.ctrlRadius):t.type===k.Circle?this.isPointInCircle(e,t.coor,t.radius*this.scale):t.type===k.Rect?this.isPointInRect(e,t.coor):t.type===k.Polygon?this.isPointInPolygon(e,t.coor):t.type===k.Line?this.isPointInLine(e,t.coor):t.type===k.Grid&&this.isPointInRect(e,t.coor)}},{key:"hitOnShape",value:function(t){var e=this.hitAllOnShape(t)[0];return e?[this.dataset.indexOf(e),e]:[-1,e]}},{key:"hitAllOnShape",value:function(t){for(var e=[],i=this.dataset.length-1;i>-1;i--){var s=this.dataset[i];if(!s.hide&&this.isShapeHit(s,t)){if(this.focusMode&&!s.active)continue;e.push(s)}}return e}},{key:"isInBackground",value:function(t){var e=this.mergeEvent(t),i=e.mouseX,s=e.mouseY;return i>=this.originX&&s>=this.originY&&i<=this.originX+this.IMAGE_ORIGIN_WIDTH*this.scale&&s<=this.originY+this.IMAGE_ORIGIN_HEIGHT*this.scale}},{key:"isPointInRect",value:function(t,e){var i=this,s=u(t,2),a=s[0],n=s[1],r=u(e.map(function(t){return t.map(function(t){return t*i.scale})}),2),h=u(r[0],2),o=h[0],c=h[1],l=u(r[1],2),d=l[0],v=l[1];return o+this.originX<=a&&a<=d+this.originX&&c+this.originY<=n&&n<=v+this.originY}},{key:"isPointInPolygon",value:function(t,e){var i=this;if(!this.offScreenCtx)return!1;this.offScreenCtx.save(),this.offScreenCtx.clearRect(0,0,this.WIDTH,this.HEIGHT),this.offScreenCtx.translate(this.originX,this.originY),this.offScreenCtx.beginPath(),e.forEach(function(t,e){var s,a,n=u(t.map(function(t){return Math.round(t*i.scale)}),2),r=n[0],h=n[1];0===e?null===(s=i.offScreenCtx)||void 0===s||s.moveTo(r,h):null===(a=i.offScreenCtx)||void 0===a||a.lineTo(r,h)}),this.offScreenCtx.closePath(),this.offScreenCtx.fill();var s=this.offScreenCtx.getImageData(0,0,this.WIDTH,this.HEIGHT),a=(t[1]-1)*this.WIDTH*4+4*t[0];return this.offScreenCtx.restore(),0!==s.data[a+3]}},{key:"isPointInCircle",value:function(t,e,i){var s=this,a=u(t,2),n=a[0],r=a[1],h=u(e.map(function(t){return t*s.scale}),2),o=h[0],c=h[1];return Math.sqrt(Math.pow(o+this.originX-n,2)+Math.pow(c+this.originY-r,2))<=i}},{key:"isPointInLine",value:function(t,e){var i=this;if(!this.offScreenCtx)return!1;this.offScreenCtx.save(),this.offScreenCtx.clearRect(0,0,this.WIDTH,this.HEIGHT),this.offScreenCtx.translate(this.originX,this.originY),this.offScreenCtx.lineWidth=this.lineWidth>5?this.lineWidth:5,this.offScreenCtx.beginPath(),e.forEach(function(t,e){var s,a,n=u(t.map(function(t){return Math.round(t*i.scale)}),2),r=n[0],h=n[1];0===e?null===(s=i.offScreenCtx)||void 0===s||s.moveTo(r,h):null===(a=i.offScreenCtx)||void 0===a||a.lineTo(r,h)}),this.offScreenCtx.stroke();var s=this.offScreenCtx.getImageData(0,0,this.WIDTH,this.HEIGHT),a=(t[1]-1)*this.WIDTH*4+4*t[0];return this.offScreenCtx.restore(),0!==s.data[a+3]}},{key:"drawRect",value:function(t,e){var i=this;if(this.ctx&&2===t.coor.length){var s=t.strokeStyle,a=void 0===s?"":s,n=t.fillStyle,r=void 0===n?"":n,h=t.active,o=t.creating,c=t.coor,l=t.lineWidth,d=t.rotation,v=u(c.map(function(t){return t.map(function(t){return Math.round(t*i.scale)})}),2),f=u(v[0],2),y=f[0],p=f[1],g=u(v[1],2),S=g[0],I=g[1],m=(y+S)/2,b=(p+I)/2,x=S-y,M=I-p;this.ctx.save(),this.ctx.lineWidth=l||this.lineWidth,null!=e&&e.isSelected?this.ctx.fillStyle=(null==e?void 0:e.selectedFillStyle)||r:this.ctx.fillStyle=h||o?this.activeFillStyle:r,this.ctx.strokeStyle=h||o?this.activeStrokeStyle:a,this.ctx.translate(m,b),this.ctx.rotate(d),this.ctx.translate(-m,-b),o||this.ctx.fillRect(y,p,x,M),this.ctx.strokeRect(y,p,x,M),this.ctx.restore(),this.drawLabel(c[0],t)}}},{key:"drawPolygon",value:function(t){var e=this;if(this.ctx){var i=t.strokeStyle,s=void 0===i?"":i,a=t.fillStyle,n=void 0===a?"":a,r=t.active,h=t.creating,o=t.coor,c=t.lineWidth;if(this.ctx.save(),this.ctx.lineJoin="round",this.ctx.lineWidth=c||this.lineWidth,this.ctx.fillStyle=r||h?this.activeFillStyle:n,this.ctx.strokeStyle=r||h?this.activeStrokeStyle:s,this.ctx.beginPath(),o.forEach(function(t,i){var s,a,n=u(t.map(function(t){return Math.round(t*e.scale)}),2),r=n[0],h=n[1];0===i?null===(s=e.ctx)||void 0===s||s.moveTo(r,h):null===(a=e.ctx)||void 0===a||a.lineTo(r,h)}),h){var l=u(this.mouse||[],2),d=l[0],v=l[1];this.ctx.lineTo(d-this.originX,v-this.originY)}else o.length>2&&this.ctx.closePath();this.ctx.fill(),this.ctx.stroke(),this.ctx.restore(),this.drawLabel(o[0],t)}}},{key:"drawDot",value:function(t){var e=this;if(this.ctx){var i=t.strokeStyle,s=void 0===i?"":i,a=t.creating,n=t.fillStyle,r=void 0===n?"":n,h=t.active,o=t.coor,c=t.lineWidth,l=u(o.map(function(t){return t*e.scale}),2),d=l[0],v=l[1];this.ctx.save(),this.ctx.lineWidth=c||this.lineWidth,this.ctx.fillStyle=h||a?this.activeFillStyle:r,this.ctx.strokeStyle=h?this.activeStrokeStyle:s,this.ctx.beginPath(),this.ctx.arc(d,v,this.ctrlRadius,0,2*Math.PI,!0),this.ctx.fill(),this.ctx.arc(d,v,this.ctrlRadius,0,2*Math.PI,!0),this.ctx.stroke(),this.ctx.restore(),this.drawLabel(o,t)}}},{key:"drawCirle",value:function(t){var e=this;if(this.ctx){var i=t.strokeStyle,s=void 0===i?"":i,a=t.fillStyle,n=void 0===a?"":a,r=t.active,h=t.coor,o=t.creating,c=t.radius,l=t.ctrlsData,d=t.lineWidth,v=u(h.map(function(t){return t*e.scale}),2),f=v[0],y=v[1];this.ctx.save(),this.ctx.lineWidth=d||this.lineWidth,this.ctx.fillStyle=r||o?this.activeFillStyle:n,this.ctx.strokeStyle=r||o?this.activeStrokeStyle:s,this.ctx.beginPath(),this.ctx.arc(f,y,c*this.scale,0,2*Math.PI,!0),this.ctx.fill(),this.ctx.arc(f,y,c*this.scale,0,2*Math.PI,!0),this.ctx.stroke(),this.ctx.restore(),this.drawLabel(l[0],t)}}},{key:"drawLine",value:function(t){var e=this;if(this.ctx){var i=t.strokeStyle,s=void 0===i?"":i,a=t.active,n=t.creating,r=t.coor,h=t.lineWidth;if(this.ctx.save(),this.ctx.lineJoin="round",this.ctx.lineWidth=h||this.lineWidth,this.ctx.strokeStyle=a||n?this.activeStrokeStyle:s,this.ctx.beginPath(),r.forEach(function(t,i){var s,a,n=u(t.map(function(t){return Math.round(t*e.scale)}),2),r=n[0],h=n[1];0===i?null===(s=e.ctx)||void 0===s||s.moveTo(r,h):null===(a=e.ctx)||void 0===a||a.lineTo(r,h)}),n){var o=u(this.mouse||[],2),c=o[0],l=o[1];this.ctx.lineTo(c-this.originX,l-this.originY)}this.ctx.stroke(),this.ctx.restore(),this.drawLabel(r[0],t)}}},{key:"drawGrid",value:function(t){var e=this;if(this.ctx&&2===t.coor.length){var i=t.strokeStyle,s=void 0===i?"":i,a=t.fillStyle,n=void 0===a?"":a,r=t.active,h=t.creating,o=t.coor,c=t.lineWidth,l=u(o.map(function(t){return t.map(function(t){return Math.round(t*e.scale)})}),2),d=u(l[0],2),v=d[0],f=d[1],y=u(l[1],2),p=y[0],g=y[1];this.ctx.save(),this.ctx.lineWidth=c||this.lineWidth,this.ctx.fillStyle=r||h?this.activeFillStyle:n,this.ctx.strokeStyle=r||h?this.activeStrokeStyle:s,t.gridRects.forEach(function(i,s){var a;e.drawRect(i,{selectedFillStyle:t.selectedFillStyle||e.gridSelectedFillStyle,isSelected:null===(a=t.selected)||void 0===a?void 0:a.includes(s)})});var S=p-v,I=g-f;h||this.ctx.fillRect(v,f,S,I),this.ctx.strokeRect(v,f,S,I),this.ctx.restore(),this.drawLabel(o[0],t)}}},{key:"drawBrushPath",value:function(t){var e=this;if(this.ctx){var i=t.coor,s=t.brushSize,a=void 0===s?1:s,n=t.brushStokeStyle,r=void 0===n?"":n;this.ctx.save(),this.ctx.globalCompositeOperation="source-over",this.ctx.lineCap="round",this.ctx.lineJoin="round",this.ctx.lineWidth=Math.round(a*this.scale),this.ctx.strokeStyle=r,this.ctx.beginPath(),i.forEach(function(t,i){var s,a,n=u(t.map(function(t){return Math.round(t*e.scale)}),2),r=n[0],h=n[1];0===i?null===(s=e.ctx)||void 0===s||s.moveTo(r,h):null===(a=e.ctx)||void 0===a||a.lineTo(r,h)}),this.ctx.stroke(),this.ctx.restore()}}},{key:"drawEraserPath",value:function(t){var e=this;if(this.ctx){var i=t.coor,s=t.eraserSize,a=void 0===s?1:s;this.ctx.save(),this.ctx.globalCompositeOperation="destination-out",this.ctx.lineCap="round",this.ctx.lineJoin="round",this.ctx.lineWidth=Math.round(a*this.scale),this.ctx.beginPath(),i.forEach(function(t,i){var s,a,n=u(t.map(function(t){return Math.round(t*e.scale)}),2),r=n[0],h=n[1];0===i?null===(s=e.ctx)||void 0===s||s.moveTo(r,h):null===(a=e.ctx)||void 0===a||a.lineTo(r,h)}),this.ctx.stroke(),this.ctx.restore()}}},{key:"clearBrush",value:function(){var t=this.dataset.filter(function(t){return![k.Brush,k.Eraser].includes(t.type)});this.setData(t)}},{key:"drawCtrl",value:function(t,e){var i=this;if(this.ctx){var s=u(t.map(function(t){return t*i.scale}),2),a=s[0],n=s[1];this.ctx.save(),this.ctx.beginPath(),this.ctx.fillStyle=e||this.ctrlFillStyle,this.ctx.strokeStyle=this.ctrlStrokeStyle,this.ctx.arc(a,n,this.ctrlRadius,0,2*Math.PI,!0),this.ctx.fill(),this.ctx.arc(a,n,this.ctrlRadius,0,2*Math.PI,!0),this.ctx.stroke(),this.ctx.restore()}}},{key:"drawCtrlList",value:function(t){var e=this;t.ctrlsData.forEach(function(i,s){t.type===k.Circle?1===s&&e.drawCtrl(i):e.drawCtrl(i,t.type===k.Rect&&8===s?"yellow":void 0)})}},{key:"drawLabel",value:function(t,e){var i=this,s=e.label,a=void 0===s?"":s,n=e.labelFillStyle,r=void 0===n?"":n,h=e.labelFont,o=void 0===h?"":h,c=e.textFillStyle,l=void 0===c?"":c,d=e.hideLabel,v=e.labelUp,f=e.lineWidth,y="boolean"==typeof d?d:this.hideLabel,p="boolean"==typeof v?v:this.labelUp,g=f||this.lineWidth;if(this.ctx&&a.length&&!y){this.ctx.font=o||this.labelFont;var S=a.length<this.labelMaxLen+1?a:"".concat(a.slice(0,this.labelMaxLen),"..."),I=this.ctx.measureText(S),m=parseInt(this.ctx.font)-4,b=I.width+8,x=m+8,M=u(t.map(function(t){return t*i.scale}),2),E=M[0],w=M[1];if(e.type===k.Rect&&0!==e.rotation){var H=e,T=u(H.coor,2),G=u(T[0],2),C=G[0],D=G[1],_=u(T[1],2),W=_[0],R=_[1],O=(C+W)/2*this.scale,P=(D+R)/2*this.scale,A=E-O,L=w-P;E=A*Math.cos(H.rotation)-L*Math.sin(H.rotation)+O,w=A*Math.sin(H.rotation)+L*Math.cos(H.rotation)+P}var N=this.IMAGE_ORIGIN_WIDTH-t[0]<b/this.scale,X=this.IMAGE_ORIGIN_HEIGHT-t[1]<x/this.scale,Y=t[1]>x/this.scale,j=p?Y:X;this.ctx.save(),this.ctx.fillStyle=r||this.labelFillStyle,this.ctx.fillRect(N?E-I.width-4-g/2:E+g/2,j?w-x-g/2:w+g/2,b,x),this.ctx.fillStyle=l||this.textFillStyle,this.ctx.fillText(S,N?E-I.width:E+4+g/2,j?w-x+m+4:w+m+4+g/2,180),this.ctx.restore()}}},{key:"update",value:function(){var t=this;window.cancelAnimationFrame(this.timer),this.timer=window.requestAnimationFrame(function(){var e,i,s;if(t.ctx){t.ctx.save(),t.ctx.clearRect(0,0,t.WIDTH,t.HEIGHT),t.ctx.translate(t.originX,t.originY);for(var a=t.focusMode?t.activeShape.type?[t.activeShape]:[]:t.dataset,n=a.filter(function(t){return t.type===k.Brush||t.type===k.Eraser}),r=0;r<n.length;r++){var h=n[r];if(!h.hide)switch(h.type){case k.Brush:h.brushSize=null!==(e=h.brushSize)&&void 0!==e?e:t.brushSize,h.brushStokeStyle=null!==(i=h.brushStokeStyle)&&void 0!==i?i:t.brushStokeStyle,t.drawBrushPath(h);break;case k.Eraser:h.eraserSize=null!==(s=h.eraserSize)&&void 0!==s?s:t.eraserSize,t.drawEraserPath(h)}}for(var o=a.filter(function(t){return t.type!==k.Brush&&t.type!==k.Eraser}),c=0;c<o.length;c++){var l=o[c];if(!l.hide)switch(l.type){case k.Rect:t.drawRect(l);break;case k.Polygon:t.drawPolygon(l);break;case k.Dot:t.drawDot(l);break;case k.Line:t.drawLine(l);break;case k.Circle:t.drawCirle(l);break;case k.Grid:t.drawGrid(l)}}!t.isCtrlKey&&t.showCross&&(t.drawLine(t.crossX),t.drawLine(t.crossY)),[k.Rect,k.Polygon,k.Line,k.Circle,k.Grid].includes(t.activeShape.type)&&!t.activeShape.hide&&t.drawCtrlList(t.activeShape),t.ctx.globalCompositeOperation="destination-over",t.IMAGE_WIDTH&&t.IMAGE_HEIGHT&&t.ctx.drawImage(t.image,0,0,t.IMAGE_WIDTH,t.IMAGE_HEIGHT),t.ctx.globalCompositeOperation="source-over",t.ctx.restore(),t.emit("updated",t.dataset)}})}},{key:"deleteByIndex",value:function(t){var e=this.dataset.findIndex(function(e){return e.index===t});e>-1&&(this.emit("delete",this.dataset[e]),this.dataset.splice(e,1),this.dataset.forEach(function(t,e){t.index=e}),this.update())}},{key:"deleteByUuid",value:function(t){var e=this.dataset.find(function(e){return e.uuid===t});e&&(this.emit("delete",e),this.dataset=this.dataset.filter(function(e){return e.uuid!==t}),this.update())}},{key:"calcStep",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"";this.IMAGE_WIDTH<this.WIDTH&&this.IMAGE_HEIGHT<this.HEIGHT&&(""!==t&&"b"!==t||(this.setScale(!0,!1,!0),this.calcStep("b"))),(this.IMAGE_WIDTH>this.WIDTH||this.IMAGE_HEIGHT>this.HEIGHT)&&(""!==t&&"s"!==t||(this.setScale(!1,!1,!0),this.calcStep("s")))}},{key:"setScale",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]&&arguments[1],i=arguments.length>2&&void 0!==arguments[2]&&arguments[2];if(!this.lock&&!(!t&&this.imageMin<20||t&&this.IMAGE_WIDTH>100*this.imageOriginMax)){t?this.scaleStep++:this.scaleStep--;var s=0,a=0,n=u(this.mouse||[],2),r=n[0],h=n[1];e&&(s=(r-this.originX)/this.scale,a=(h-this.originY)/this.scale);var o=Math.abs(this.scaleStep),c=this.IMAGE_WIDTH,l=this.scaleStep>=0?1+this.scaleDelta:1-this.scaleDelta;if(this.IMAGE_WIDTH=Math.round(this.IMAGE_ORIGIN_WIDTH*Math.pow(l,o)),this.IMAGE_HEIGHT=Math.round(this.IMAGE_ORIGIN_HEIGHT*Math.pow(l,o)),e)this.originX=r-s*this.scale,this.originY=h-a*this.scale;else{var d=this.IMAGE_WIDTH/c;this.originX=this.WIDTH/2-(this.WIDTH/2-this.originX)*d,this.originY=this.HEIGHT/2-(this.HEIGHT/2-this.originY)*d}i||this.update()}}},{key:"fitZoom",value:function(){this.calcStep(),this.IMAGE_HEIGHT/this.IMAGE_WIDTH>=this.HEIGHT/this.WIDTH?(this.IMAGE_WIDTH=this.IMAGE_ORIGIN_WIDTH/(this.IMAGE_ORIGIN_HEIGHT/this.HEIGHT),this.IMAGE_HEIGHT=this.HEIGHT):(this.IMAGE_WIDTH=this.WIDTH,this.IMAGE_HEIGHT=this.IMAGE_ORIGIN_HEIGHT/(this.IMAGE_ORIGIN_WIDTH/this.WIDTH)),this.originX=(this.WIDTH-this.IMAGE_WIDTH)/2,this.originY=(this.HEIGHT-this.IMAGE_HEIGHT)/2,this.update()}},{key:"setFocusMode",value:function(t){this.focusMode=t,this.update()}},{key:"destroy",value:function(){this.canvas&&(this.image.removeEventListener("load",this.handleLoad),this.canvas.removeEventListener("contextmenu",this.handleContextmenu),this.canvas.removeEventListener("mousewheel",this.handleMousewheel),this.canvas.removeEventListener("wheel",this.handleMousewheel),this.canvas.removeEventListener("mousedown",this.handleMouseDown),this.canvas.removeEventListener("touchend",this.handleMouseDown),this.canvas.removeEventListener("mousemove",this.handleMouseMove),this.canvas.removeEventListener("touchmove",this.handleMouseMove),this.canvas.removeEventListener("mouseup",this.handleMouseUp),this.canvas.removeEventListener("touchend",this.handleMouseUp),this.canvas.removeEventListener("dblclick",this.handleDblclick),document.body.removeEventListener("keydown",this.handleKeydown,!0),document.body.removeEventListener("keyup",this.handleKeyup,!0),this.canvas.width=this.WIDTH,this.canvas.height=this.HEIGHT,this.canvas.style.width="",this.canvas.style.height="",this.canvas.style.userSelect="")}},{key:"resize",value:function(){this.canvas&&(this.canvas.removeAttribute("width"),this.canvas.removeAttribute("height"),this.canvas.style.width="",this.canvas.style.height="",this.initSetting(),this.update())}}])}();export{E as default};
//# sourceMappingURL=canvas-select.esm.js.map