function t(t,i,e,n){Object.defineProperty(t,i,{get:e,set:n,enumerable:!0,configurable:!0})}function i(t){return t&&t.__esModule?t.default:t}var e="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:"undefined"!=typeof window?window:"undefined"!=typeof global?global:{},n={},s={},h=e.parcelRequire6268;null==h&&((h=function(t){if(t in n)return n[t].exports;if(t in s){var i=s[t];delete s[t];var e={id:t,exports:{}};return n[t]=e,i.call(e.exports,e,e.exports),e.exports}var h=new Error("Cannot find module '"+t+"'");throw h.code="MODULE_NOT_FOUND",h}).register=function(t,i){s[t]=i},e.parcelRequire6268=h),h.register("bXuNP",(function(i,e){var n,s;t(i.exports,"register",(()=>n),(t=>n=t)),t(i.exports,"resolve",(()=>s),(t=>s=t));var h={};n=function(t){for(var i=Object.keys(t),e=0;e<i.length;e++)h[i[e]]=t[i[e]]},s=function(t){var i=h[t];if(null==i)throw new Error("Could not resolve bundle with id "+t);return i}})),h("bXuNP").register(JSON.parse('{"aPhKc":"index.25ae014e.js","7Sx0m":"pine.d54da871.webp"}'));var a;h.register("kPq84",(function(i,e){var n;t(i.exports,"getBundleURL",(()=>n),(t=>n=t));var s={};function h(t){return(""+t).replace(/^((?:https?|file|ftp):\/\/.+)\/[^/]+$/,"$1")+"/"}n=function(t){var i=s[t];return i||(i=function(){try{throw new Error}catch(i){var t=(""+i.stack).match(/(https?|file|ftp):\/\/[^)\n]+/g);if(t)return h(t[2])}return"/"}(),s[t]=i),i}})),a=h("kPq84").getBundleURL("aPhKc")+h("bXuNP").resolve("7Sx0m");class r{constructor(t){this.canvasWidth=0,this.canvasHeight=0,this.fit=!0,this.baseScale=1,this.maxScale=5,this.minScale=1,this.onResize=this.debounce((()=>{if(!this.img)return;const t=this.canvas.offsetWidth-this.canvasWidth,i=this.canvas.offsetHeight-this.canvasHeight;this.canvasWidth=this.canvas.width=this.canvas.offsetWidth,this.canvasHeight=this.canvas.height=this.canvas.offsetHeight,this.fit&&this.imgWidth<this.canvasWidth?(this.netPanningX=0,this.onImageLoad()):this.fit&&this.imgHeight<this.canvasHeight?(this.netPanningY=0,this.onImageLoad()):(this.netPanningX+=t/2,this.netPanningY+=i/2,this.originalWidth=this.canvasWidth,this.originalHeight=this.canvasWidth*this.ratio,this.draw()),this.fixScale()}),300),this.baseScale=t?.baseScale||this.baseScale,this.maxScale=t?.maxScale||this.maxScale,this.minScale=t?.minScale||this.minScale,this.loadCanvas(t?.canvas||document.createElement("canvas"),t?.width,t?.height),t?.rangeInput&&this.loadSlider(t.rangeInput),t?.imageUrl&&this.loadImageFromUrl(t?.imageUrl,t?.fit,(()=>{this.move(t?.x||0,t?.y||0),t?.onImageLoad?.()}))}clamp(t,i,e){return Math.max(i,Math.min(t,e))}debounce(t,i){let e;return(...n)=>{clearTimeout(e),e=setTimeout((()=>{t(...n)}),i)}}initPointerAndZoom(){this.isDown=!1,this.netPanningX=0,this.netPanningY=0,this.eventCache=[],this.prevDiff=-1,this.slider&&(this.slider.value=String(this.baseScale))}draw(){this.img&&(this.canvasContext?.clearRect(0,0,this.canvasWidth,this.canvasHeight),this.canvasContext?.drawImage(this.img,this.netPanningX,this.netPanningY,this.imgWidth,this.imgHeight))}fixScale(){this.fit?this.scale=Math.min(this.imgWidth/this.canvasWidth,this.imgWidth/this.canvasHeight)||this.baseScale:this.scale=Math.min(this.imgWidth/this.originalWidth,this.imgWidth/this.originalHeight)||this.baseScale,this.slider&&(this.slider.value=String(this.scale))}onImageLoad(){this.fit&&(this.scale=Math.max(this.canvasHeight/this.imgHeight,this.canvasWidth/this.imgWidth),this.imgHeight*=this.scale,this.imgWidth*=this.scale),this.pointerX=this.pointerY=0,this.originalWidth=this.imgWidth,this.originalHeight=this.imgHeight,this.ratio=this.originalHeight/this.originalWidth,this.draw()}getPointerAverage(){let t=0,i=0;for(let e=0;e<this.eventCache.length;e++)t+=this.eventCache[e].offsetX,i+=this.eventCache[e].offsetY;return t/=this.eventCache.length,i/=this.eventCache.length,[t,i]}calcOrigin(t,i){this.originX=(-this.netPanningX+t)/this.imgWidth,this.originY=(-this.netPanningY+i)/this.imgHeight}move(t,i){const e=t-this.pointerX,n=i-this.pointerY;this.pointerX=t,this.pointerY=i,this.netPanningX=this.fit?this.clamp(this.netPanningX+e,this.canvasWidth-this.imgWidth,0):this.netPanningX+e,this.netPanningY=this.fit?this.clamp(this.netPanningY+n,this.canvasHeight-this.imgHeight,0):this.netPanningY+n}drawZoom(t,i){this.netPanningX=this.fit?this.clamp(this.netPanningX-t*this.originX,this.canvasWidth-this.imgWidth,0):this.netPanningX-t*this.originX,this.netPanningY=this.fit?this.clamp(this.netPanningY-i*this.originY,this.canvasHeight-this.imgHeight,0):this.netPanningY-i*this.originY}zoomDelta(t,i){const e=this.imgWidth+t;e<this.originalWidth||this.imgHeight+i<this.originalHeight||e/this.originalWidth>this.maxScale||e/this.originalWidth<this.minScale||(this.slider&&(this.slider.value=String(this.scale=e/this.originalWidth)),this.imgWidth=e,this.imgHeight+=i,this.drawZoom(t,i))}zoomScale(t){if(t>this.maxScale||t<this.minScale)return;this.prevDiff=-1;let i=this.imgWidth,e=this.imgHeight;this.imgWidth=this.originalWidth*t,this.imgHeight=this.originalHeight*t,i-=this.imgWidth,e-=this.imgHeight,this.calcOrigin(this.canvasWidth/2,this.canvasHeight/2),this.drawZoom(-i,-e)}pinch(){if(2===this.eventCache.length){const t=Math.hypot(this.eventCache[0].offsetX-this.eventCache[1].offsetX,this.eventCache[0].offsetY-this.eventCache[1].offsetY);if(this.prevDiff>0){const i=t-this.prevDiff;this.zoomDelta(i,i*this.ratio)}this.prevDiff=t}}onSliderMove(t){const i=t.target.value;this.scale=+i,this.zoomScale(this.scale),this.draw()}onPointerdown(t){this.img&&(this.eventCache.push(t),[this.pointerX,this.pointerY]=this.getPointerAverage(),this.isDown=!0)}onPointerUp(t){this.isDown&&(this.eventCache=this.eventCache.filter((i=>i.pointerId!==t.pointerId)),this.eventCache.length<2&&(this.prevDiff=-1),[this.pointerX,this.pointerY]=this.getPointerAverage(),0===this.eventCache.length&&(this.isDown=!1))}onPointermove(t){if(!this.isDown)return;for(let i=0;i<this.eventCache.length;i++)if(t.pointerId===this.eventCache[i].pointerId){this.eventCache[i]=t;break}const[i,e]=this.getPointerAverage();this.move(i,e),this.pinch(),this.calcOrigin(this.canvasWidth/2,this.canvasHeight/2),this.draw()}prevent(t){t.preventDefault(),t.stopPropagation()}leadListeners(){this.canvas.addEventListener("pointerdown",(t=>{this.prevent(t),this.onPointerdown(t)})),this.canvas.addEventListener("pointermove",(t=>{this.prevent(t),this.onPointermove(t)})),this.canvas.addEventListener("pointerout",(t=>{this.prevent(t),this.onPointerUp(t)})),this.canvas.addEventListener("pointerup",(t=>{this.prevent(t),this.onPointerUp(t)})),this.canvas.addEventListener("pointercancel",(t=>{this.prevent(t),this.onPointerUp(t)})),this.canvas.addEventListener("pointerleave",(t=>{this.prevent(t),this.onPointerUp(t)})),new ResizeObserver(this.onResize).observe(this.canvas)}loadSlider(t){this.slider=t,this.slider.value=String(this.scale||this.baseScale),this.slider.addEventListener("input",(t=>{this.prevent(t),this.onSliderMove(t)}))}loadCanvas(t,i,e){this.canvas=t,this.canvasContext=this.canvas.getContext("2d"),this.canvasWidth=this.canvas.width=i||this.canvas.offsetWidth,this.canvasHeight=this.canvas.height=e||this.canvas.offsetHeight,this.leadListeners()}loadImageFromUrl(t,i=!0,e){if(!this.canvas)throw Error("first call loadCanvas");this.fit=i,this.img=new Image,this.img.onload=()=>{this.initPointerAndZoom(),this.imgHeight=this.img.naturalHeight,this.imgWidth=this.img.naturalWidth,this.onImageLoad(),e?.()},this.img.src=t}getCanvas(t){if(!this.img)throw Error("please set an image");const i=document.createElement("canvas");i.width=this.canvasWidth*t,i.height=this.canvasHeight*t;return i.getContext("2d").drawImage(this.img,this.netPanningX*t,this.netPanningY*t,this.imgWidth*t,this.imgHeight*t),i}getBlob(t=1){return new Promise((i=>{this.getCanvas(t).toBlob((t=>{i(t)}))}))}getDataUrl(t=1){return this.getCanvas(t).toDataURL()}download(t=1){const i=document.createElement("a");i.download="canvas.png",i.href=this.getDataUrl(t),i.click()}getCropInfo(){return{width:this.imgWidth,imgHeight:this.imgHeight,x:this.netPanningX,y:this.netPanningY}}}new r({});const o=new r({imageUrl:i(a),canvas:document.getElementById("canvas"),rangeInput:document.getElementById("myRange")}),g=document.getElementById("filePicker");g.addEventListener("change",(t=>{const i=g.files?.[0];if(!i)return;const e=new FileReader;e.onload=()=>o.loadImageFromUrl(String(e.result)),e.readAsDataURL(i)}));const c=document.getElementById("dropdown");document.getElementById("menu").addEventListener("click",(()=>{c.classList.toggle("hidden")})),document.getElementById("download").addEventListener("click",(()=>{o.download()}));
//# sourceMappingURL=index.25ae014e.js.map
