text: /*!
   * image-process v0.0.1
   * (c) 2017-2017 dailc
   * Released under the MIT License.
   * https://github.com/dailc/image-process
   */
  !function(t,i){"object"==typeof exports&&"undefined"!=typeof module?module.exports=i():"function"==typeof define&&define.amd?define(i):t.ImageClip=i()}(this,function(){"use strict";function t(t){for(var i=t,s=arguments.length,e=Array(s>1?s-1:0),a=1;a<s;a++)e[a-1]=arguments[a];return e.forEach(function(t){t&&Object.keys(t).forEach(function(s){i[s]=t[s]})}),i}function i(t){var i=t;return"string"==typeof i&&(i=document.querySelector(i)),i}function s(t){(function(t){this.os={};var i=t.match(/(Android);?[\s/]+([\d.]+)?/);i&&(this.os.android=!0,this.os.version=i[2],this.os.isBadAndroid=!/Chrome\/\d/.test(window.navigator.appVersion));var s=t.match(/(iPhone\sOS)\s([\d_]+)/);s&&(this.os.ios=!0,this.os.iphone=!0,this.os.version=s[2].replace(/_/g,"."));var e=t.match(/(iPad).*OS\s([\d_]+)/);e&&(this.os.ios=!0,this.os.ipad=!0,this.os.version=e[2].replace(/_/g,"."));var a=t.match(/QuickHybrid/i);a&&(this.os.quick=!0);var h=t.match(/EpointEJS/i);h&&(this.os.ejs=!0);var n=t.match(/DingTalk/i);n&&(this.os.dd=!0),h||n||a||(this.os.h5=!0)}).call(t,navigator.userAgent)}function e(t,i){if(!(t instanceof i))throw new TypeError("Cannot call a class as a function")}var a=function(){function t(t,i){for(var s=0;s<i.length;s++){var e=i[s];e.enumerable=e.enumerable||!1,e.configurable=!0,"value"in e&&(e.writable=!0),Object.defineProperty(t,e.key,e)}}return function(i,s,e){return s&&t(i.prototype,s),e&&t(i,e),i}}(),h={container:"#imgclip",img:null,isSmooth:!0,captureRadius:30,minMoveDiff:1,quality:.92,mime:"image/jpeg",maxCssHeight:0,sizeTipsStyle:0,compressScaleRatio:1,iphoneFixedRatio:2,isUseOriginSize:!1,maxWidth:0,forceWidth:0,forceHeight:0};return function(){function n(a){e(this,n),s(this),this.options=t({},h,a),this.container=i(this.options.container),this.img=this.options.img,this.domChildren=[],this.events={},this.initCanvas(),this.initClip(),this.initMagnifier(),this.initTransferCanvas(),this.resetClipRect()}return a(n,[{key:"getPixelRatio",value:function(t){var i=t.backingStorePixelRatio||t.webkitBackingStorePixelRatio||t.mozBackingStorePixelRatio||t.msBackingStorePixelRatio||t.oBackingStorePixelRatio||t.backingStorePixelRatio||1,s=(window.devicePixelRatio||1)/i;return s*=this.options.compressScaleRatio||1,this.os.ios&&this.os.iphone&&(s*=this.options.iphoneFixedRatio||1),s}},{key:"clear",value:function(){for(var t=this.domChildren&&this.domChildren.length||0,i=0;i<t;i+=1)this.container.removeChild(this.domChildren[i]);this.domChildren=null;for(var s=Object.keys(this.events||{}),e=s&&s.length||0,a=0;a<e;a+=1)this.container.removeEventListener(s[a],this.events[s[a]]);this.events=null}},{key:"initCanvas",value:function(){this.canvasFull=document.createElement("canvas"),this.ctxFull=this.canvasFull.getContext("2d"),this.canvasFull.className="clip-canvas-full",this.smoothCtx(this.ctxFull),this.RATIO_PIXEL=this.getPixelRatio(this.ctxFull);var t=this.img.width/this.img.height,i=this.container.offsetWidth||window.innerWidth;this.oldWidth=i,this.oldHeight=i/t,this.resizeCanvas(i,this.oldHeight),this.container.appendChild(this.canvasFull),this.domChildren.push(this.canvasFull)}},{key:"resizeCanvas",value:function(t,i){var s=this.options.maxCssHeight,e=t/i,a=this.oldWidth,h=a/e;s&&h>s&&(a=(h=s)*e),this.marginLeft=(this.oldWidth-a)/2,this.canvasFull.style.width=a+"px",this.canvasFull.style.height=h+"px",this.canvasFull.style.marginLeft=this.marginLeft+"px",this.canvasFull.width=a*this.RATIO_PIXEL,this.canvasFull.height=h*this.RATIO_PIXEL,1&this.rotateStep?this.scale=this.canvasFull.width/this.img.height:this.scale=this.canvasFull.width/this.img.width}},{key:"initClip",value:function(){var t=document.createElement("div");t.className="clip-rect",this.clipRect=t,this.container.appendChild(this.clipRect),this.domChildren.push(this.clipRect);var i=document.createElement("span");i.className="clip-tips",this.clipRect.appendChild(i),this.clipTips=i,-1!==this.options.sizeTipsStyle&&0!==this.options.sizeTipsStyle||this.clipTips.classList.add("clip-hidden"),this.clipRectHorns=[];for(var s=0;s<8;s+=1){var e=document.createElement("span");e.className="clip-rect-horn ",0===s?e.className+="horn-nw":1===s?e.className+="horn-ne":2===s?e.className+="horn-sw":3===s?e.className+="horn-se":4===s?e.className+="horn-n":5===s?e.className+="horn-s":6===s?e.className+="horn-w":7===s&&(e.className+="horn-e"),this.clipRect.appendChild(e),this.clipRectHorns.push(e)}this.resizeClip()}},{key:"resizeClip",value:function(){this.listenerHornsResize(),this.listenerRectMove(),this.listenerContainerLeave()}},{key:"listenerHornsResize",value:function(){var t=this;this.clipEventState={};var i=function(i){t.clipEventState.width=t.clipRect.offsetWidth,t.clipEventState.height=t.clipRect.offsetHeight,t.clipEventState.left=t.clipRect.offsetLeft-t.marginLeft,t.clipEventState.top=t.clipRect.offsetTop,t.clipEventState.mouseX=i.touches?i.touches[0].pageX:i.pageX,t.clipEventState.mouseY=i.touches?i.touches[0].pageY:i.pageY,t.clipEventState.evnt=i},s=function(i,s){var e=s-t.canvasFull.offsetTop-t.container.offsetTop,a=i-t.canvasFull.offsetLeft-t.container.offsetLeft;return e=Math.min(e,t.canvasFull.offsetHeight),e=Math.max(0,e),a=Math.min(a,t.canvasFull.offsetWidth),a=Math.max(0,a),t.curX=a,t.curY=e,{curX:a,curY:e}};this.getCurXY=s;var e=function(i){if(t.canResizing){i.preventDefault(),i.stopPropagation();var e=t.clipEventState,a=e.evnt.target,h=i.touches?i.touches[0].pageY:i.pageY,n=i.touches?i.touches[0].pageX:i.pageX,c=s(n,h),l=c.curX,o=c.curY,r=void 0,v=void 0,u=void 0,d=void 0;a.classList.contains("horn-nw")?(r=e.width-(l-e.left),v=e.height-(o-e.top),u=l,d=o):a.classList.contains("horn-ne")?(r=l-e.left,v=e.height-(o-e.top),u=e.left,d=o):a.classList.contains("horn-sw")?(r=e.width-(l-e.left),v=o-e.top,u=l,d=e.top):a.classList.contains("horn-se")?(r=l-e.left,v=o-e.top,u=e.left,d=e.top):a.classList.contains("horn-n")?(r=e.width,v=e.height-(o-e.top),u=e.left,d=o):a.classList.contains("horn-s")?(r=e.width,v=o-e.top,u=e.left,d=e.top):a.classList.contains("horn-w")?(r=e.width-(l-e.left),v=e.height,u=l,d=e.top):a.classList.contains("horn-e")&&(r=l-e.left,v=e.height,u=l-r,d=e.top),t.clipRect.style.left=u+t.marginLeft+"px",t.clipRect.style.top=d+"px",t.clipRect.style.width=r+"px",t.clipRect.style.height=v+"px",t.draw()}};this.container.addEventListener("touchmove",e),this.container.addEventListener("mousemove",e),this.events.touchmove=e,this.events.mousemove=e;var a=function(s){t.canResizing=!0,t.canvasMag.classList.remove("clip-hidden"),0===t.options.sizeTipsStyle&&t.clipTips.classList.remove("clip-hidden"),i(s)},h=function(){t.canResizing=!1,t.canvasMag.classList.add("clip-hidden"),0===t.options.sizeTipsStyle&&t.clipTips.classList.add("clip-hidden")};this.endHronsResize=h;for(var n=0;n<8;n+=1)this.clipRectHorns[n].addEventListener("mousedown",a),this.clipRectHorns[n].addEventListener("touchstart",a),this.clipRectHorns[n].addEventListener("mouseup",h),this.clipRectHorns[n].addEventListener("touchend",h)}},{key:"listenerRectMove",value:function(){var t=this,i=this.clipRect,s=function(s){if(!t.canResizing&&t.canMove){s.preventDefault(),s.stopPropagation();var e=t.options.minMoveDiff,a=s.touches?s.touches[0].pageY:s.pageY,h=s.touches?s.touches[0].pageX:s.pageX,n=h-t.prevRectMouseX,c=a-t.prevRectMouseY;if(n||c){(Math.abs(n)>e||Math.abs(c)>e)&&(t.prevRectMouseX=h,t.prevRectMouseY=a);var l=i.offsetTop+c,o=i.offsetLeft+n;l<0?l=0:l>t.canvasFull.offsetHeight-i.offsetHeight&&(l=t.canvasFull.offsetHeight-i.offsetHeight),o<t.marginLeft?o=t.marginLeft:o>t.canvasFull.offsetWidth-i.offsetWidth+t.marginLeft&&(o=t.canvasFull.offsetWidth-i.offsetWidth+t.marginLeft),t.clipRect.style.left=o+"px",t.clipRect.style.top=l+"px",t.draw()}}};i.addEventListener("touchmove",s),i.addEventListener("mousemove",s);var e=function(i){t.canMove=!0;var s=i.touches?i.touches[0].pageY:i.pageY,e=i.touches?i.touches[0].pageX:i.pageX;t.prevRectMouseX=e,t.prevRectMouseY=s},a=function(){t.canMove=!1};this.endRectMove=a,i.addEventListener("mousedown",e),i.addEventListener("touchstart",e),i.addEventListener("mouseup",a),i.addEventListener("touchend",a)}},{key:"listenerContainerLeave",value:function(){var t=this,i=function(){t.canResizing&&t.endHronsResize(),t.canMove&&t.endRectMove()};this.container.addEventListener("mouseleave",i),this.container.addEventListener("mouseup",i),this.events.mouseleave=i,this.events.mouseup=i}},{key:"draw",value:function(){this.drawMag();var t=this.getRealFinalImgSize(this.clipRect.offsetWidth*this.RATIO_PIXEL,this.clipRect.offsetHeight*this.RATIO_PIXEL),i=t.width,s=t.height;this.clipTips.innerText=i.toFixed(0)+"*"+s.toFixed(0),this.ctxFull.save(),1&this.rotateStep?this.ctxFull.clearRect(0,0,this.canvasFull.height,this.canvasFull.width):this.ctxFull.clearRect(0,0,this.canvasFull.width,this.canvasFull.height),this.drawImage(),this.drawMask(),this.ctxFull.beginPath();var e=this.getClipRectParams(),a=e.srcX,h=e.srcY,n=e.sWidth,c=e.sHeight;this.ctxFull.rect(a,h,n,c),this.ctxFull.clip(),this.drawImage(),this.ctxFull.restore()}},{key:"getClipRectParams",value:function(){var t=this.clipRect.offsetTop,i=this.clipRect.offsetLeft-this.marginLeft,s=this.clipRect.offsetWidth,e=this.clipRect.offsetHeight,a=i+s,h=t+e,n=i,c=t,l=s,o=e;return 1===this.rotateStep?(n=t,c=this.canvasFull.offsetWidth-a,l=e,o=s):2===this.rotateStep?(n=this.canvasFull.offsetWidth-a,c=this.canvasFull.offsetHeight-h,l=s,o=e):3===this.rotateStep&&(n=this.canvasFull.offsetHeight-h,c=i,l=e,o=s),n*=this.RATIO_PIXEL,c*=this.RATIO_PIXEL,l*=this.RATIO_PIXEL,o*=this.RATIO_PIXEL,{srcX:n,srcY:c,sWidth:l,sHeight:o}}},{key:"getRealCoordinate",value:function(t,i){var s=t,e=i;return 1===this.rotateStep?(s=i,e=this.canvasFull.offsetWidth-t):2===this.rotateStep?(s=this.canvasFull.offsetWidth-t,e=this.canvasFull.offsetHeight-i):3===this.rotateStep&&(s=this.canvasFull.offsetHeight-i,e=t),s*=this.RATIO_PIXEL,e*=this.RATIO_PIXEL,{x:s,y:e}}},{key:"drawImage",value:function(){1&this.rotateStep?this.ctxFull.drawImage(this.img,0,0,this.img.width,this.img.height,0,0,this.canvasFull.height,this.canvasFull.width):this.ctxFull.drawImage(this.img,0,0,this.img.width,this.img.height,0,0,this.canvasFull.width,this.canvasFull.height)}},{key:"drawMask",value:function(){this.ctxFull.save(),this.ctxFull.fillStyle="rgba(0, 0, 0, 0.3)",1&this.rotateStep?this.ctxFull.fillRect(0,0,this.canvasFull.height,this.canvasFull.width):this.ctxFull.fillRect(0,0,this.canvasFull.width,this.canvasFull.height),this.ctxFull.restore()}},{key:"drawMag",value:function(){var t=this.options.captureRadius,i=this.getRealCoordinate(this.curX,this.curY),s=2*t,e=2*t,a=i.x-t,h=i.y-t;1&this.rotateStep?this.ctxMag.clearRect(0,0,this.canvasMag.height,this.canvasMag.width):this.ctxMag.clearRect(0,0,this.canvasMag.width,this.canvasMag.height);var n=0,c=0;this.os.ios&&(h<0&&(c=this.canvasMag.height/2*Math.abs(h/t),h=0),a<0&&(n=this.canvasMag.width/2*Math.abs(a/t),a=0)),this.ctxMag.drawImage(this.img,a/this.scale,h/this.scale,s/this.scale,e/this.scale,n,c,this.canvasMag.width,this.canvasMag.height);var l=this.canvasMag.width/2,o=this.canvasMag.height/2,r=5*this.RATIO_PIXEL;this.ctxMag.beginPath(),this.ctxMag.moveTo(l-r,o),this.ctxMag.lineTo(l+r,o),this.ctxMag.moveTo(l,o-r),this.ctxMag.lineTo(l,o+r),this.ctxMag.strokeStyle="#de3c50",this.ctxMag.lineWidth=3,this.ctxMag.stroke()}},{key:"initMagnifier",value:function(){this.canvasMag=document.createElement("canvas"),this.canvasMag.className="magnifier clip-hidden",this.ctxMag=this.canvasMag.getContext("2d"),this.smoothCtx(this.ctxMag),this.container.appendChild(this.canvasMag),this.domChildren.push(this.canvasMag),this.canvasMag.width=2*this.options.captureRadius*this.RATIO_PIXEL,this.canvasMag.height=2*this.options.captureRadius*this.RATIO_PIXEL}},{key:"initTransferCanvas",value:function(){this.canvasTransfer=document.createElement("canvas"),this.canvasTransfer.style.display="none",this.canvasTransfer.className="transfer-canvas",this.ctxTransfer=this.canvasTransfer.getContext("2d"),this.smoothCtx(this.ctxTransfer),this.container.appendChild(this.canvasTransfer),this.domChildren.push(this.canvasTransfer)}},{key:"smoothCtx",value:function(t){var i=this.options.isSmooth;t.mozImageSmoothingEnabled=i,t.webkitImageSmoothingEnabled=i,t.msImageSmoothingEnabled=i,t.imageSmoothingEnabled=i}},{key:"getRealFinalImgSize",value:function(t,i){var s=this.canvasFull.width/this.canvasFull.height,e=this.options.maxWidth||0,a=this.options.forceWidth||0,h=this.options.forceHeight||0,n=t,c=i;return 1&this.rotateStep?((this.options.isUseOriginSize||this.canvasFull.width>this.img.height)&&(n=this.img.width*t/this.canvasFull.height,c=this.img.height*i/this.canvasFull.width),e&&this.canvasFull.height>e&&e<this.img.height&&(n=e*t/this.canvasFull.height,c=e/s*i/this.canvasFull.width),a&&(n=a*t/this.canvasFull.height,c=(h||a/s)*i/this.canvasFull.width)):((this.options.isUseOriginSize||this.canvasFull.width>this.img.width)&&(n=this.img.width*t/this.canvasFull.width,c=this.img.height*i/this.canvasFull.height),e&&this.canvasFull.width>e&&e<this.img.width&&(n=e*t/this.canvasFull.width,c=e/s*i/this.canvasFull.height),a&&(n=a*t/this.canvasFull.width,c=(h||a/s)*i/this.canvasFull.height)),{width:n,height:c}}},{key:"clip",value:function(){var t=this.getClipRectParams(),i=t.srcX,s=t.srcY,e=t.sWidth,a=t.sHeight,h=this.getRealFinalImgSize(e,a),n=h.width,c=h.height;this.rotateStep=this.rotateStep||0;var l=90*this.rotateStep*Math.PI/180;0===this.rotateStep?(this.canvasTransfer.width=n,this.canvasTransfer.height=c):1===this.rotateStep?(this.canvasTransfer.width=c,this.canvasTransfer.height=n,this.ctxTransfer.rotate(l),this.ctxTransfer.translate(0,-this.canvasTransfer.width)):2===this.rotateStep?(this.canvasTransfer.width=n,this.canvasTransfer.height=c,this.ctxTransfer.rotate(l),this.ctxTransfer.translate(-this.canvasTransfer.width,-this.canvasTransfer.height)):3===this.rotateStep&&(this.canvasTransfer.width=c,this.canvasTransfer.height=n,this.ctxTransfer.rotate(l),this.ctxTransfer.translate(-this.canvasTransfer.height,0)),1&this.rotateStep?this.ctxTransfer.drawImage(this.img,i/this.scale,s/this.scale,e/this.scale,a/this.scale,0,0,this.canvasTransfer.height,this.canvasTransfer.width):this.ctxTransfer.drawImage(this.img,i/this.scale,s/this.scale,e/this.scale,a/this.scale,0,0,this.canvasTransfer.width,this.canvasTransfer.height),this.clipImgData=this.canvasTransfer.toDataURL(this.options.mime,this.options.quality)}},{key:"resetClipRect",value:function(){this.clipRect.style.left=(this.marginLeft||0)+"px",this.clipRect.style.top=0,this.clipRect.style.width=this.canvasFull.width/this.RATIO_PIXEL+"px",this.clipRect.style.height=this.canvasFull.height/this.RATIO_PIXEL+"px",this.draw()}},{key:"getClipImgData",value:function(){return this.clipImgData}},{key:"rotate",value:function(t){var i=this.oldWidth,s=this.oldHeight;this.rotateStep=this.rotateStep||0,this.rotateStep+=t?1:-1,this.rotateStep>3?this.rotateStep=0:this.rotateStep<0&&(this.rotateStep=3);var e=90*this.rotateStep*Math.PI/180;this.canvasMag.width=this.canvasMag.width,this.canvasMag.height=this.canvasMag.height,0===this.rotateStep?this.resizeCanvas(i,s):1===this.rotateStep?(this.resizeCanvas(s,i),this.ctxFull.rotate(e),this.ctxFull.translate(0,-this.canvasFull.width),this.ctxMag.rotate(e),this.ctxMag.translate(0,-this.canvasMag.width)):2===this.rotateStep?(this.resizeCanvas(i,s),this.ctxFull.rotate(e),this.ctxFull.translate(-this.canvasFull.width,-this.canvasFull.height),this.ctxMag.rotate(e),this.ctxMag.translate(-this.canvasMag.width,-this.canvasMag.height)):3===this.rotateStep&&(this.resizeCanvas(s,i),this.ctxFull.rotate(e),this.ctxFull.translate(-this.canvasFull.height,0),this.ctxMag.rotate(e),this.ctxMag.translate(-this.canvasMag.height,0)),this.resetClipRect()}},{key:"destroy",value:function(){this.clear(),this.canvasFull=null,this.ctxFull=null,this.canvasTransfer=null,this.ctxTransfer=null,this.canvasMag=null,this.ctxMag=null,this.clipRect=null}}]),n}()});