vue-advanced-cropper
Version:
The advanced library to create your own croppers suited for any website design
1 lines • 63.6 kB
JavaScript
(function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue")):"function"==typeof define&&define.amd?define(["exports","vue"],t):(e=e||self,t(e["vue-advanced-cropper"]={},e.Vue))})(this,function(e,t){'use strict';var F=Math.floor,N=Math.abs,q=Math.max,j=Math.min,G=Math.ceil,Z=String.fromCharCode;function i(e){return i="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},i(e)}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function a(e,t){for(var o,a=0;a<t.length;a++)o=t[a],o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(e,o.key,o)}function n(e,t,i){return t&&a(e.prototype,t),i&&a(e,i),e}function s(e,t,i){return t in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function r(e){for(var t=1;t<arguments.length;t++){var o=null==arguments[t]?{}:arguments[t],a=Object.keys(o);"function"==typeof Object.getOwnPropertySymbols&&(a=a.concat(Object.getOwnPropertySymbols(o).filter(function(e){return Object.getOwnPropertyDescriptor(o,e).enumerable}))),a.forEach(function(t){s(e,t,o[t])})}return e}function l(e){return c(e)||h(e)||d()}function c(e){if(Array.isArray(e)){for(var t=0,o=Array(e.length);t<e.length;t++)o[t]=e[t];return o}}function h(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}function d(){throw new TypeError("Invalid attempt to spread non-iterable instance")}function m(e,t,i){function o(){var c=Date.now()-r;c<t&&0<=c?a=setTimeout(o,t-c):(a=null,!i&&(l=e.apply(s,n),s=n=null))}var a,n,s,r,l;null==t&&(t=100);var c=function(){s=this,n=arguments,r=Date.now();var c=i&&!a;return a||(a=setTimeout(o,t)),c&&(l=e.apply(s,n),s=n=null),l};return c.clear=function(){a&&(clearTimeout(a),a=null)},c.flush=function(){a&&(l=e.apply(s,n),s=n=null,clearTimeout(a),a=null)},c}function p(e,t){var i,o;return e&&t?(i="".concat(e).concat(t[0].toUpperCase()).concat(t.slice(1)),o="".concat(e,"-").concat(t)):(i=e||t,o=e||t),{name:i,classname:o}}function g(e){return /^data:/.test(e)||/^blob:/.test(e)}function f(e){if(g(e))return!1;var t=window.location,i=/(\w+:)?(?:\/\/)([\w.-]+)?(?::(\d+))?\/?/,o=i.exec(e)||[],a={protocol:o[1]||"",host:o[2]||"",port:o[3]||""},n=function(e){return{"http:":80,"https:":443}[e]},s=function(e){return e.port||n(e.protocol||t.protocol)};return(a.protocol||a.host||a.port)&&!!!(a.protocol&&a.protocol==t.protocol&&a.host&&a.host==t.host&&a.host&&s(a)==s(t))}function u(e){return"undefined"==typeof e}function v(e){return"object"===i(e)&&null!==e}function w(e){var t="timestamp=".concat(new Date().getTime());return e+(-1===e.indexOf("?")?"?":"&")+t}function b(e,t){var i=Math.pow;return Math.sqrt(i(e.x-t.x,2)+i(e.y-t.y,2))}function y(e){var t=1<arguments.length&&void 0!==arguments[1]?arguments[1]:{},i=r({enabled:!!e},t);return v(e)&&(i=r({},i,e)),i}function x(e){var t=Number.isNaN,i=+e;return t(i)?e:i}function C(e,t,i){var o=Math.PI,a=i.flipped,n=i.orientation,s=t.naturalWidth,r=t.naturalHeight,l=e.getContext("2d");return e.width=s,e.height=r,l.save(),a&&(e.width=r,e.height=s),2==n?(l.translate(s,0),l.scale(-1,1)):3==n?(l.translate(s,r),l.rotate(1*o)):4==n?(l.translate(0,r),l.scale(1,-1)):5==n?(l.rotate(90/180*o),l.scale(1,-1)):6==n?(l.rotate(90/180*o),l.translate(0,-r)):7==n?(l.rotate(270/180*o),l.translate(-s,r),l.scale(1,-1)):8==n&&(l.translate(0,s),l.rotate(270/180*o)),l.drawImage(t,0,0,s,r),l.restore(),e}function z(e){var t={orientation:e};return e&&(2===e?t.scaleX=-1:3===e?t.rotate=-180:4===e?t.scaleY=-1:5===e?(t.rotate=90,t.scaleY=-1):6===e?t.rotate=90:7===e?(t.rotate=90,t.scaleX=-1):8===e?t.rotate=-90:void 0),(90===t.rotate||-90===t.rotate)&&(t.flipped=!0),t}function E(e){var t=e.rotate,i=e.scaleX,o=e.scaleY,a="";return(t||i||o)&&(t&&(a+=" rotate(".concat(t,"deg) ")),i&&(a+=" scaleX(".concat(i,") ")),o&&(a+=" scaleY(".concat(o,") "))),a}function S(e){return new Promise(function(t){R(e).then(function(i){t(i?{source:e,arrayBuffer:i,orientation:H(i)}:{source:e,arrayBuffer:null,orientation:null})}).catch(function(i){console.warn(i),t({source:e,arrayBuffer:null,orientation:null})})})}function R(e){return new Promise(function(t,i){try{if(!e)i("Error: the image is empty");else if(/^data:/i.test(e))t(T(e));else if(/^blob:/i.test(e)){var o=new FileReader;o.onload=function(i){t(i.target.result)},W(e,function(e){o.readAsArrayBuffer(e)})}else{var a=new XMLHttpRequest;a.onreadystatechange=function(){4!==a.readyState||(200===a.status||0===a.status?t(a.response):i("Warning: could not load an image to parse its orientation"),a=null)},a.onprogress=function(){"image/jpeg"!==a.getResponseHeader("content-type")&&a.abort()},a.withCredentials=!1,a.open("GET",e,!0),a.responseType="arraybuffer",a.send(null)}}catch(t){i(t)}})}function W(e,t){var i=new XMLHttpRequest;i.open("GET",e,!0),i.responseType="blob",i.onload=function(){(200==this.status||0===this.status)&&t(this.response)},i.send()}function T(e){e=e.replace(/^data:([^;]+);base64,/gmi,"");for(var t=atob(e),o=t.length,a=new ArrayBuffer(o),n=new Uint8Array(a),s=0;s<o;s++)n[s]=t.charCodeAt(s);return a}function M(e,t,o){var a,n="";for(a=t,o+=t;a<o;a++)n+=Z(e.getUint8(a));return n}function H(e){try{var t,o,a,n,s,r,l=new DataView(e);if(255===l.getUint8(0)&&216===l.getUint8(1))for(var c=l.byteLength,h=2;h+1<c;){if(255===l.getUint8(h)&&225===l.getUint8(h+1)){s=h;break}h++}if(s&&(o=s+4,a=s+10,"Exif"===M(l,o,4))){var d=l.getUint16(a);if(n=18761===d,(n||19789===d)&&42===l.getUint16(a+2,n)){var m=l.getUint32(a+4,n);8<=m&&(r=a+m)}}if(r)for(var p,g=l.getUint16(r,n),f=0;f<g;f++)if(p=r+12*f+2,274===l.getUint16(p,n)){p+=8,t=l.getUint16(p,n),l.setUint16(p,1,n);break}return t}catch(e){return null}}function A(e){for(var t=[],i=8192,o=new Uint8Array(e);0<o.length;){var a=o.subarray(0,i);t.push(Z.apply(null,Array.from?Array.from(a):Array.slice(a))),o=o.subarray(i)}return"data:image/jpeg;base64,".concat(btoa(t.join("")))}function D(e){return{left:e.left,top:e.top,right:e.left+e.width,bottom:e.top+e.height}}function $(e){if("right"===e)return"left";return"bottom"===e?"top":"left"===e||"top"===e?e:void 0}function P(e,t){return e.width+(t.left+t.right)}function L(e,t){return e.height+(t.top+t.bottom)}function _(e,t,i){return{left:"left"in i?-j(0,G(e.left-i.left)-t.left):0,top:"top"in i?-j(0,G(e.top-i.top)-t.top):0,bottom:"bottom"in i?-j(0,i.bottom-(e.bottom+t.bottom)):0,right:"right"in i?-j(0,i.right-(e.right+t.right)):0}}function I(e){var t=e.directions,i=e.coordinates,o=e.restrictions,a=e.preserveAspectRatio,n=e.stopOnBreak,s=e.mode,c=void 0===s?"crop":s,h=e.allowedArea,d=void 0===h?{}:h,m=r({},t),p=P(i,m),g=L(i,m);0>p&&(0>m.left&&0>m.right?(m.left=-(i.width-o.minWidth)/(m.left/m.right),m.right=-(i.width-o.minWidth)/(m.right/m.left)):0>m.left?m.left=-(i.width-o.minWidth):0>m.right&&(m.right=-(i.width-o.minWidth))),0>g&&(0>m.top&&0>m.bottom?(m.top=-(i.height-o.minHeight)/(m.top/m.bottom),m.bottom=-(i.height-o.minHeight)/(m.bottom/m.top)):0>m.top?m.top=-(i.height-o.minHeight):0>m.bottom&&(m.bottom=-(i.height-o.minHeight)));var f=_(i,m,d);"move"===c&&(0<f.left&&0===f.right?(m.right+=f.left,m.left-=f.left):0<f.right&&0===f.left&&(m.left+=f.right,m.right-=f.right),0<f.top&&0===f.bottom?(m.bottom+=f.top,m.top-=f.top):0<f.bottom&&0===f.top&&(m.top+=f.bottom,m.bottom-=f.bottom),f=_(i,m,d));var u={width:1/0,height:1/0};if(Ee.forEach(function(e){u[e]=f[e]&&m[e]?q(0,1-f[e]/m[e]):1/0}),a){var v=j.apply(Math,l(Ee.map(function(e){return u[e]})));v!==1/0&&Ee.forEach(function(e){m[e]*=v})}else Ce.forEach(function(e){var t=n?j(u.top,u.bottom):u[e];t!==1/0&&(m[e]*=t)}),ze.forEach(function(e){var t=n?j(u.top,u.bottom):u[e];t!==1/0&&(m[e]*=t)});if(p=P(i,m),g=L(i,m),m.right+m.left&&(p>o.maxWidth?u.width=(o.maxWidth-i.width)/(m.right+m.left):p<o.minWidth&&(u.width=(o.minWidth-i.width)/(m.right+m.left))),m.bottom+m.top&&(g>o.maxHeight?u.height=(o.maxHeight-i.height)/(m.bottom+m.top):g<o.minHeight&&(u.height=(o.minHeight-i.height)/(m.bottom+m.top))),a){var w=j(u.width,u.height);w!==1/0&&Ee.forEach(function(e){m[e]*=w})}else u.width!==1/0&&Ce.forEach(function(e){m[e]*=u.width}),u.height!==1/0&&ze.forEach(function(e){m[e]*=u.height});return m}function Y(e,t,i,o,a){var n;return i.minimum&&e/t<i.minimum?n=i.minimum:i.maximum&&e/t>i.maximum?n=i.maximum:a&&(n=o.width/o.height),n}function X(e){var t=e.coordinates,i=e.allowedArea,o=void 0===i?{}:i,a=e.moveEvent,n=r({},a.directions),s={left:t.left+n.left,top:t.top+n.top,width:t.width,height:t.height};return"left"in o&&s.left<o.left&&(s.left=o.left),"right"in o&&s.left+s.width>o.right&&(s.left=o.right-s.width),"top"in o&&s.top<o.top&&(s.top=o.top),"bottom"in o&&s.top+s.height>o.bottom&&(s.top=o.bottom-s.height),s}function k(e){var t=e.coordinates,i=e.stencilCoordinates,o=e.worldTransforms,a=e.coefficient,n=e.imageSize,s=e.allowedArea,l=r({},o),c={width:l.scale*t.width/a,height:l.scale*t.height/a,left:i.left,top:i.top};l.shift.left-=t.left*l.scale+l.shift.left-i.left*a,l.shift.top-=t.top*l.scale+l.shift.top-i.top*a;var h=1;c.width>n.width/a&&(h=j(h,n.width/a/c.width)),c.height>n.height/a&&(h=j(h,n.height/a/c.height)),1!==h&&(l.scale*=h,c.left+=c.width*(1-h)/2,c.top+=c.height*(1-h)/2,l.shift.left=c.left*a-t.left*l.scale,l.shift.top=c.top*a-t.top*l.scale,c.width*=h,c.height*=h),0>c.left&&(l.shift.left-=c.left*a,c.left=0),0>c.top&&(l.shift.top-=c.top*a,c.top=0),c.left+c.width>n.width/a&&(l.shift.left-=(c.left+c.width)*a-n.width,c.left=n.width/a-c.width),c.top+c.height>n.height/a&&(l.shift.top-=(c.top+c.height)*a-n.height,c.top=n.height/a-c.height);var d={width:n.width*l.scale,height:n.height*l.scale};return l.shift.left>-s.left*l.scale&&(c.left-=(l.shift.left+s.left*l.scale)/a,l.shift.left=-(s.left*l.scale)),l.shift.left<n.width-d.width-(s.right-n.width)*l.scale&&(c.left-=(l.shift.left-(n.width-d.width)+(s.right-n.width)*l.scale)/a,l.shift.left=n.width-d.width-(s.right-n.width)*l.scale),l.shift.top>-s.top*l.scale&&(c.top-=(l.shift.top+s.top*l.scale)/a,l.shift.top=-s.top*l.scale),l.shift.top<n.height-d.height-(s.bottom-n.height)*l.scale&&(c.top-=(l.shift.top-(n.height-d.height)+(s.bottom-n.height)*l.scale)/a,l.shift.top=n.height-d.height-(s.bottom-n.height)*l.scale),{stencilCoordinates:c,worldTransforms:l}}function B(e){var t=e.manipulateImageEvent,i=e.coordinates,o=e.stencilRestrictions,a=e.coefficient,n=e.stencilCoordinates,s=e.worldTransforms,l=e.imageSize,c=e.frozenDirections,h=e.allowedArea,d=e.fitImage,m=t.scale,p=t.move,g=r({},s),f={width:l.width*g.scale,height:l.height*g.scale},u={left:p.left||0,top:p.top||0},v=1,w=1,b=d?1:q("left"in h&&"right"in h?n.width*a/(h.right-h.left):.01,"top"in h&&"bottom"in h?n.height*a/(h.bottom-h.top):.01);if(!c.width&&!c.height&&1e-3<N(m.factor-1)){var y=N(1-v)/2,x=o.maxWidth,C=o.maxHeight,z=o.minWidth,E=o.minHeight;v=m.factor,g.scale/v<b+y&&(v=g.scale/b);var S=i.width*v,R=i.height*v,W={minWidth:S<z+y,minHeight:R<E+y,maxWidth:S>x-y,maxHeight:R>C-y};if(W.minWidth&&(v=z/i.width),W.minHeight&&(v=E/i.height),W.maxHeight||W.maxWidth){var T=v;W.maxWidth&&W.maxHeight?T=j(C/i.height,i.width):W.maxHeight?T=C/i.height:W.maxWidth&&(T=x/i.width),1<=g.scale*v?w=T/v:v=T}var M={width:f.width*(1-1/v),height:f.height*(1-1/v)};u.left+=M.width*N((g.shift.left-m.center.left*a)/f.width),u.top+=M.height*N((g.shift.top-m.center.top*a)/f.height),f.width/=v,f.height/=v}if(g.scale/=v,d)0<G(g.shift.left+u.left)?u.left=-g.shift.left:g.shift.left+u.left<l.width-f.width&&(u.left=l.width-f.width-g.shift.left),0<G(g.shift.top+u.top)?u.top=-g.shift.top:g.shift.top+u.top<l.height-f.height&&(u.top=l.height-f.height-g.shift.top);else{var H={};Ee.forEach(function(e){H[e]=e in h?g.shift[$(e)]+u[$(e)]+(h[e]*g.scale-D(n)[e]*a):0}),0<H.left?u.left-=H.left:0>H.right&&(u.left-=H.right),0<H.top?u.top-=H.top:0>H.bottom&&(u.top-=H.bottom)}g.shift.left+=u.left,g.shift.top+=u.top;var A={left:0,top:0};return l.width!==i.width&&1<=g.scale&&(A.left=n.width*(1-w)*(i.left/(l.width-i.width))),l.height!==i.height&&1<=g.scale&&(A.top=n.height*(1-w)*(i.top/(l.height-i.height))),{coordinates:{width:i.width*v*w,height:i.height*v*w,left:(n.left-g.shift.left/a+A.left)*a/g.scale,top:(n.top-g.shift.top/a+A.top)*a/g.scale},worldTransforms:g}}function U(e){var t=Math.round,i=e.coordinates,o=e.restrictions,a=e.allowedArea,n={width:t(i.width),height:t(i.height),left:t(i.left),top:t(i.top)};return n.width>o.maxWidth?n.width=F(i.width):n.width<o.minWidth&&(n.width=G(i.width)),n.height>o.maxHeight?n.height=F(i.height):n.height<o.minHeight&&(n.height=G(i.height)),(n.left<a.left||n.left+n.width>a.right)&&(n.left=F(a.left)),(n.top<a.top||n.top+n.height>a.bottom)&&(n.top=F(a.top)),n}function O(e,t,i){function o(o){return console.warn("The arguments will be passed to the prop '".concat(t,"' as an single object {").concat(Object.keys(o).join(","),"} in the future releases. You should change the interface of your function.")),e.apply(void 0,l(i(o)))}return function(t){if(1<e.length)return o(t);try{return e(t)}catch(i){return o(t)}}}t=t&&t.hasOwnProperty("default")?t["default"]:t;var V=function(e,t){return t={exports:{}},e(t,t.exports),t.exports}(function(e){(function(){function t(){for(var e,o=[],a=0;a<arguments.length;a++)if(e=arguments[a],e){var n=typeof e;if("string"===n||"number"===n)o.push(e);else if(Array.isArray(e)&&e.length){var s=t.apply(null,e);s&&o.push(s)}else if("object"===n)for(var r in e)i.call(e,r)&&e[r]&&o.push(r)}return o.join(" ")}var i={}.hasOwnProperty;e.exports?(t.default=t,e.exports=t):window.classNames=t})()}),K=function(e){return function(t,i){if(!t)return e;var o;"string"==typeof t?o=t:i=t;var a=e;return o&&(a+="__"+o),a+(i?Object.keys(i).reduce(function(e,t){var o=i[t];return o&&(e+=" "+("boolean"==typeof o?a+"--"+t:a+"--"+t+"_"+o)),e},""):"")}};m.debounce=m;var J=function e(t){var i=1<arguments.length&&arguments[1]!==void 0?arguments[1]:{},a=2<arguments.length&&arguments[2]!==void 0?arguments[2]:{},n=3<arguments.length&&arguments[3]!==void 0?arguments[3]:{};o(this,e),this.nativeEvent=t,this.move=i,this.scale=a,this.params=n},Q=function e(t,i){var a=2<arguments.length&&arguments[2]!==void 0?arguments[2]:{};o(this,e),this.nativeEvent=t,this.directions=i,this.params=a},ee=function e(t,i){o(this,e),this.nativeEvent=t,this.directions=i},te=function(){function e(t,i,a,n,s){o(this,e),this.nativeEvent=t,this.position=a,this.previousPosition=n,this.element=i,this.anchor=s}return n(e,[{key:"shift",value:function(){var e=this.element,t=this.anchor,i=this.position,o=e.getBoundingClientRect(),a=o.left,n=o.top;return{left:i.left-a-t.left,top:i.top-n-t.top}}}]),e}(),ie={name:"DraggableElement",mixins:[{beforeMount:function(){window.addEventListener("mouseup",this.onMouseUp,{passive:!1}),window.addEventListener("mousemove",this.onMouseMove,{passive:!1}),window.addEventListener("touchmove",this.onTouchMove,{passive:!1}),window.addEventListener("touchend",this.onTouchEnd,{passive:!1})},beforeDestroy:function(){window.removeEventListener("mouseup",this.onMouseUp),window.removeEventListener("mousemove",this.onMouseMove),window.removeEventListener("touchmove",this.onTouchMove),window.removeEventListener("touchend",this.onTouchEnd)},mounted:function(){if(!this.$refs.draggable)throw new Error("You should add ref \"draggable\" to your root element to use draggable mixin");this.touches=[],this.draggingAnchor=[],this.hovered=!1},methods:{onMouseOver:function(){this.hovered||(this.hovered=!0,this.$emit("enter"))},onMouseLeave:function(){this.hovered&&(this.hovered=!1,this.$emit("leave"))},onTouchStart:function(t){t.cancelable&&!this.disabled&&1===t.touches.length&&(this.touches=l(t.touches),!this.hovered&&this.$emit("enter"),t.touches.length&&this.initAnchor(this.touches.reduce(function(e,i){return{clientX:e.clientX+i.clientX/t.touches.length,clientY:e.clientY+i.clientY/t.touches.length}},{clientX:0,clientY:0})),t.preventDefault&&t.preventDefault(),t.stopPropagation())},onTouchEnd:function(){this.processEnd()},onTouchMove:function(t){this.touches.length&&(this.processMove(t,t.touches),t.preventDefault&&t.preventDefault(),t.stopPropagation&&t.stopPropagation())},onMouseDown:function(t){if(!this.disabled){var e={fake:!0,clientX:t.clientX,clientY:t.clientY};this.touches=[e],this.initAnchor(e),t.stopPropagation()}},onMouseMove:function(t){this.touches.length&&(this.processMove(t,[{fake:!0,clientX:t.clientX,clientY:t.clientY}]),t.preventDefault&&t.preventDefault())},onMouseUp:function(){this.touches=[]},initAnchor:function(e){var t=this.$refs.draggable,i=t.getBoundingClientRect(),o=i.left,a=i.right,n=i.bottom,s=i.top;this.anchor={left:e.clientX-o,top:e.clientY-s,bottom:n-e.clientY,right:a-e.clientX}},processMove:function(e,t){var i=l(t);if(this.touches.length){if(1===this.touches.length&&1===i.length){var o=this.$refs.draggable;this.$emit("drag",new te(e,o,{left:i[0].clientX,top:i[0].clientY},{left:this.touches[0].clientX,top:this.touches[0].clientY},this.anchor))}this.touches=i}},processEnd:function(){this.touches=[],this.hovered&&(this.$emit("leave"),this.hovered=!1)}}}],props:{classname:{type:String}}},oe=function(e,t,i,o,a,n,s,r,l,c){"boolean"!=typeof s&&(l=r,r=s,s=!1);var h="function"==typeof i?i.options:i;e&&e.render&&(h.render=e.render,h.staticRenderFns=e.staticRenderFns,h._compiled=!0,a&&(h.functional=!0)),o&&(h._scopeId=o);var d;if(n?(d=function(e){e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,e||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),t&&t.call(this,l(e)),e&&e._registeredComponents&&e._registeredComponents.add(n)},h._ssrRegister=d):t&&(d=s?function(){t.call(this,c(this.$root.$options.shadowRoot))}:function(e){t.call(this,r(e))}),d)if(h.functional){var m=h.render;h.render=function(e,t){return d.call(t),m(e,t)}}else{var p=h.beforeCreate;h.beforeCreate=p?[].concat(p,d):[d]}return i},ae=oe({render:function(){var e=this,t=e.$createElement,i=e._self._c||t;return i("div",{ref:"draggable",class:e.classname,on:{touchstart:e.onTouchStart,mousedown:e.onMouseDown,mouseover:e.onMouseOver,mouseleave:e.onMouseLeave}},[e._t("default")],2)},staticRenderFns:[]},void 0,ie,void 0,!1,void 0,void 0,void 0),ne=K("vue-handler-wrapper"),se={name:"HandlerWrapper",components:{DraggableElement:ae},props:{horizontalPosition:{type:String},verticalPosition:{type:String},classname:{type:String},disabled:{type:Boolean,default:!1}},computed:{classnames:function(){var e;if(this.horizontalPosition||this.verticalPosition){var t,i=p(this.horizontalPosition,this.verticalPosition);e=V(this.classname,ne((t={},s(t,i.classname,!0),s(t,"disabled",this.disabled),t)))}else e=V(this.classname,ne({disabled:this.disabled}));return{default:e,draggable:ne("draggable")}}}},re=oe({render:function(){var e=this,t=e.$createElement,i=e._self._c||t;return i("div",{class:e.classnames.default},[i("DraggableElement",{class:e.classnames.draggable,attrs:{disabled:e.disabled},on:{drag:function(t){return e.$emit("drag",t)},leave:function(){return e.$emit("leave")},enter:function(){return e.$emit("enter")}}},[e._t("default")],2)],1)},staticRenderFns:[]},void 0,se,void 0,!1,void 0,void 0,void 0),le=K("vue-line-wrapper"),ce={name:"LineWrapper",components:{DraggableElement:ae},props:{position:{type:String,required:!0},disabled:{type:Boolean,default:!1}},computed:{classname:function(){var e;return le((e={},s(e,this.position,!0),s(e,"disabled",this.disabled),e))}}},he=oe({render:function(){var e=this,t=e.$createElement,i=e._self._c||t;return i("DraggableElement",{class:e.classname,attrs:{disabled:e.disabled},on:{drag:function(t){return e.$emit("drag",t)},leave:function(){return e.$emit("leave")},enter:function(){return e.$emit("enter")}}},[e._t("default")],2)},staticRenderFns:[]},void 0,ce,void 0,!1,void 0,void 0,void 0),de=K("vue-square-handler"),me={name:"SimpleHandler",components:{HandlerWrapper:re},props:{classname:{type:String},hoverClassname:{type:String},horizontalPosition:{type:String},verticalPosition:{type:String},disabled:{type:Boolean,default:!1}},computed:{classnames:function(){return{default:V(de(s({},this.position,!0)),this.classname,this.hover&&this.hoverClassname)}}},methods:{onDrag:function(e){this.$emit("drag",e)},onEnter:function(){this.hover=!0},onLeave:function(){this.hover=!1}}},pe=oe({render:function(){var e=this,t=e.$createElement,i=e._self._c||t;return i("HandlerWrapper",{attrs:{"vertical-position":e.verticalPosition,"horizontal-position":e.horizontalPosition,disabled:e.disabled},on:{drag:e.onDrag}},[i("div",{class:e.classnames.default})])},staticRenderFns:[]},void 0,me,void 0,!1,void 0,void 0,void 0),ge=K("vue-bounding-box"),fe=["east","west",null],ue=["south","north",null],ve={name:"BoundingBox",props:{classname:{type:String},handlers:{type:Object,default:function(){return{eastNorth:!0,north:!0,westNorth:!0,west:!0,westSouth:!0,south:!0,eastSouth:!0,east:!0}}},handlerComponent:{type:[Object,String],default:function(){return pe}},handlersClassnames:{type:Object,default:function(){return{}}},lines:{type:Object,default:function(){return{west:!0,north:!0,east:!0,south:!0}}},lineComponent:{type:[Object,String]},linesClassnames:{type:Object,default:function(){return{}}},scalable:{type:Boolean,default:!0}},data:function(){var e=[];return fe.forEach(function(t){ue.forEach(function(i){if(t!==i){var o=p(t,i),a=o.name,n=o.classname;e.push({name:a,classname:n,verticalDirection:i,horizontalDirection:t})}})}),{points:e}},computed:{classnames:function(){var e=this.handlersClassnames,t=this.linesClassnames;return{default:V(ge(),this.classname),handlers:e,lines:t}},lineNodes:function(){var e=this,t=[];return this.points.forEach(function(i){i.horizontalDirection&&i.verticalDirection||!e.lines[i.name]||t.push({name:i.name,component:e.lineComponent,classname:V(e.classnames.lines.default,e.classnames.lines[i.name],!e.scalable&&e.classnames.lines.disabled),hoverClassname:e.classnames.lines.hover,verticalDirection:i.verticalDirection,horizontalDirection:i.horizontalDirection,disabled:!e.scalable})}),t},handlerNodes:function(){var e=this,t=[];return this.points.forEach(function(i){e.handlers[i.name]&&t.push({name:i.name,component:e.handlerComponent,classname:V(e.classnames.handlers.default,e.classnames.handlers[i.name]),hoverClassname:e.classnames.handlers.hover,verticalDirection:i.verticalDirection,horizontalDirection:i.horizontalDirection,disabled:!e.scalable})}),t}},beforeMount:function(){window.addEventListener("mouseup",this.onMouseUp,{passive:!1}),window.addEventListener("mousemove",this.onMouseMove,{passive:!1}),window.addEventListener("touchmove",this.onTouchMove,{passive:!1}),window.addEventListener("touchend",this.onTouchEnd,{passive:!1})},beforeDestroy:function(){window.removeEventListener("mouseup",this.onMouseUp),window.removeEventListener("mousemove",this.onMouseMove),window.removeEventListener("touchmove",this.onTouchMove),window.removeEventListener("touchend",this.onTouchEnd)},mounted:function(){this.touches=[]},methods:{onHandlerDrag:function(e,t,i){var o=e.shift(),a=o.left,n=o.top,s={left:0,right:0,top:0,bottom:0};"west"===t?s.left-=a:"east"==t&&(s.right+=a),"north"===i?s.top-=n:"south"==i&&(s.bottom+=n);var r;!i&&t?r="width":i&&!t&&(r="height"),this.scalable&&this.$emit("resize",new Q(e.nativeEvent,s,{allowedDirections:{left:"west"===t||!t,right:"east"===t||!t,bottom:"south"===i||!i,top:"north"===i||!i},preserveAspectRatio:e.nativeEvent.shiftKey,respectDirection:r}))}}},we=oe({render:function(){var e=this,t=e.$createElement,i=e._self._c||t;return i("div",{ref:"box",class:e.classnames.default},[e._t("default"),e._v(" "),i("div",e._l(e.lineNodes,function(t){return i(t.component,{key:t.name,tag:"component",attrs:{classname:t.classname,"hover-classname":t.hoverClassname,position:t.name,disabled:t.disabled},on:{drag:function(i){return e.onHandlerDrag(i,t.horizontalDirection,t.verticalDirection)}}})}),1),e._v(" "),i("div",e._l(e.handlerNodes,function(t){return i(t.component,{key:t.name,tag:"component",attrs:{classname:t.classname,"hover-classname":t.hoverClassname,"horizontal-position":t.horizontalDirection,"vertical-position":t.verticalDirection,disabled:t.disabled},on:{drag:function(i){return e.onHandlerDrag(i,t.horizontalDirection,t.verticalDirection)}}})}),1)],2)},staticRenderFns:[]},void 0,ve,void 0,!1,void 0,void 0,void 0),be=K("vue-draggable-area"),ye={name:"DraggableArea",props:{movable:{type:Boolean,default:!0},activationDistance:{type:Number,default:10}},computed:{classnames:function(){return{default:V(be(),this.classname)}}},beforeMount:function(){window.addEventListener("mouseup",this.onMouseUp,{passive:!1}),window.addEventListener("mousemove",this.onMouseMove,{passive:!1}),window.addEventListener("touchmove",this.onTouchMove,{passive:!1}),window.addEventListener("touchend",this.onTouchEnd,{passive:!1})},beforeDestroy:function(){window.removeEventListener("mouseup",this.onMouseUp),window.removeEventListener("mousemove",this.onMouseMove),window.removeEventListener("touchmove",this.onTouchMove),window.removeEventListener("touchend",this.onTouchEnd)},mounted:function(){this.touches=[],this.touchStarted=!1},methods:{onTouchStart:function(t){if(t.cancelable){var e=this.movable&&1===t.touches.length;e&&(this.touches=l(t.touches)),(this.touchStarted||e)&&(t.preventDefault(),t.stopPropagation())}},onTouchEnd:function(){this.touchStarted=!1,this.processEnd()},onTouchMove:function(t){1<=this.touches.length&&(this.touchStarted?(this.processMove(t,t.touches),t.preventDefault(),t.stopPropagation()):b({x:this.touches[0].clientX,y:this.touches[0].clientY},{x:t.touches[0].clientX,y:t.touches[0].clientY})>this.activationDistance&&(this.initAnchor({clientX:t.touches[0].clientX,clientY:t.touches[0].clientY}),this.touchStarted=!0))},onMouseDown:function(t){if(this.movable){var e={fake:!0,clientX:t.clientX,clientY:t.clientY};this.touches=[e],this.initAnchor(e),t.stopPropagation()}},onMouseMove:function(t){this.touches.length&&(this.processMove(t,[{fake:!0,clientX:t.clientX,clientY:t.clientY}]),t.preventDefault&&t.cancelable&&t.preventDefault(),t.stopPropagation())},onMouseUp:function(){this.touches=[]},initAnchor:function(e){var t=this.$refs.container,i=t.getBoundingClientRect(),o=i.left,a=i.top;this.anchor={x:e.clientX-o,y:e.clientY-a}},processMove:function(e,t){var i=l(t);if(this.touches.length){var o=this.$refs.container,a=o.getBoundingClientRect(),n=a.left,s=a.top;1===this.touches.length&&1===i.length&&this.$emit("move",new ee(e,{left:i[0].clientX-n-this.anchor.x,top:i[0].clientY-s-this.anchor.y}))}},processEnd:function(){this.touches=[]}}},xe=oe({render:function(){var e=this,t=e.$createElement,i=e._self._c||t;return i("div",{ref:"container",on:{touchstart:e.onTouchStart,mousedown:e.onMouseDown}},[e._t("default")],2)},staticRenderFns:[]},void 0,ye,void 0,!1,void 0,void 0,void 0),Ce=["left","right"],ze=["top","bottom"],Ee=["left","right","top","bottom"],Se=["area","stencil","none"],Re=.1,We={left:0,top:0,width:0,height:0},Te=K("vue-preview-result"),Me={name:"PreviewResult",props:{img:{type:Object},classname:{type:String},imageClassname:{type:String},stencilCoordinates:{type:Object,default:function(){return{width:0,height:0,left:0,top:0}}}},computed:{classnames:function(){return{default:V(Te(),this.classname),image:V(Te("image"),this.imageClassname),wrapper:Te("wrapper")}},wrapperStyle:function(){return{width:"".concat(this.stencilCoordinates.width,"px"),height:"".concat(this.stencilCoordinates.height,"px"),left:"calc(50% - ".concat(this.stencilCoordinates.width/2,"px)"),top:"calc(50% - ".concat(this.stencilCoordinates.height/2,"px)")}},imageStyle:function(){var e=this.img.transforms,t=e.flipped,i=this.img.coefficient,o=this.img.size.height/i,a=this.img.size.width/i,n={width:"".concat(a,"px"),height:"".concat(o,"px")};return t?(n.width="".concat(o,"px"),n.height="".concat(a,"px"),n.left="".concat(-this.stencilCoordinates.left-(o-a)/2+e.translateX,"px"),n.top="".concat(-this.stencilCoordinates.top-(a-o)/2+e.translateY,"px")):(n.left="".concat(-this.stencilCoordinates.left+e.translateX,"px"),n.top="".concat(-this.stencilCoordinates.top+e.translateY,"px")),n.transform=E(e),n}}},He=oe({render:function(){var e=this,t=e.$createElement,i=e._self._c||t;return i("div",{class:e.classnames.default},[i("div",{ref:"wrapper",class:e.classnames.wrapper,style:e.wrapperStyle},[i("img",{ref:"image",class:e.classnames.image,style:e.imageStyle,attrs:{src:e.img.src}})])])},staticRenderFns:[]},void 0,Me,void 0,!1,void 0,void 0,void 0),Ae={name:"CropperWrapper",props:{touchMove:{type:Object,required:!0},mouseMove:{type:Object,required:!0},touchResize:{type:Object,required:!0},wheelResize:{type:Object,required:!0}},beforeMount:function(){window.addEventListener("mouseup",this.onMouseUp,{passive:!1}),window.addEventListener("mousemove",this.onMouseMove,{passive:!1}),window.addEventListener("touchmove",this.onTouchMove,{passive:!1}),window.addEventListener("touchend",this.onTouchEnd,{passive:!1})},beforeDestroy:function(){window.removeEventListener("mouseup",this.onMouseUp),window.removeEventListener("mousemove",this.onMouseMove),window.removeEventListener("touchmove",this.onTouchMove),window.removeEventListener("touchend",this.onTouchEnd)},mounted:function(){this.touches=[]},methods:{onTouchStart:function(t){if(t.cancelable&&(this.touchMove.enabled||this.touchResize.enabled&&1<t.touches.length)){var e=this.$refs.container,i=e.getBoundingClientRect(),o=i.left,a=i.top,n=i.bottom,s=i.right;this.touches=l(t.touches).filter(function(e){return e.clientX>o&&e.clientX<s&&e.clientY>a&&e.clientY<n}),this.oldGeometricProperties=this.calculateGeometricProperties(this.touches),t.preventDefault&&t.preventDefault(),t.stopPropagation()}},onTouchEnd:function(t){0===t.touches.length&&this.processEnd()},onTouchMove:function(t){var e=this;if(this.touches.length){var i=l(t.touches).filter(function(t){return!t.identifier||e.touches.find(function(e){return e.identifier===t.identifier})});this.processMove(t,i),t.preventDefault&&t.preventDefault(),t.stopPropagation&&t.stopPropagation()}},onMouseDown:function(t){if(this.mouseMove&&"buttons"in t&&1===t.buttons){var e={fake:!0,clientX:t.clientX,clientY:t.clientY};this.touches=[e],t.stopPropagation()}},onMouseMove:function(t){this.touches.length&&(this.processMove(t,[{fake:!0,clientX:t.clientX,clientY:t.clientY}]),t.preventDefault&&t.cancelable&&t.preventDefault())},onMouseUp:function(){this.touches=[]},calculateGeometricProperties:function(e){var t=this.$refs.container,i=t.getBoundingClientRect(),o=i.left,a=i.top,n={left:0,top:0},s=0;return e.forEach(function(t){n.left+=(t.clientX-o)/e.length,n.top+=(t.clientY-a)/e.length}),e.forEach(function(e){s+=b({x:n.left,y:n.top},{x:e.clientX-o,y:e.clientY-a})}),{centerMass:n,spread:s,count:e.length}},processMove:function(e,t){if(this.touches.length){if(1===this.touches.length&&1===t.length&&this.touchMove.enabled)this.$emit("move",new J(e,{left:t[0].clientX-this.touches[0].clientX,top:t[0].clientY-this.touches[0].clientY}));else if(1<this.touches.length&&this.touchResize){var i=this.oldGeometricProperties,o=this.calculateGeometricProperties(t);i.count===o.count&&1<i.count&&this.$emit("resize",new J(e,{left:o.centerMass.left-i.centerMass.left,top:o.centerMass.top-i.centerMass.top},{factor:i.spread/o.spread,center:o.centerMass})),this.oldGeometricProperties=o}this.touches=t}},processEnd:function(){this.touches=[]},onWheel:function(e){if(this.wheelResize.enabled){var t=this.$refs.container,i=t.getBoundingClientRect(),o=i.left,a=i.top,n=1+this.wheelResize.ratio*Math.sign(e.deltaY||e.detail||e.wheelDelta),s={left:e.clientX-o,top:e.clientY-a};this.$emit("resize",new J(e,{},{factor:n,center:s})),e.preventDefault(),e.stopPropagation()}}}},De=oe({render:function(){var e=this,t=e.$createElement,i=e._self._c||t;return i("div",{ref:"container",on:{touchstart:e.onTouchStart,mousedown:e.onMouseDown,wheel:e.onWheel}},[e._t("default")],2)},staticRenderFns:[]},void 0,Ae,void 0,!1,void 0,void 0,void 0),$e=K("vue-simple-line"),Pe={name:"SimpleLine",components:{LineWrapper:he},props:{classname:{type:String},hoverClassname:{type:String},position:{type:String},disabled:{type:Boolean,default:!1}},data:function(){return{hover:!1}},computed:{classnames:function(){return{default:V($e(s({},this.position,!0)),this.classname,this.hover&&this.hoverClassname)}}},methods:{onDrag:function(e){this.$emit("drag",e)},onEnter:function(){this.hover=!0},onLeave:function(){this.hover=!1}}},Le=oe({render:function(){var e=this,t=e.$createElement,i=e._self._c||t;return i("LineWrapper",{attrs:{position:e.position,disabled:e.disabled},on:{enter:e.onEnter,leave:e.onLeave,drag:e.onDrag}},[i("div",{class:e.classnames.default})])},staticRenderFns:[]},void 0,Pe,void 0,!1,void 0,void 0,void 0),_e=K("vue-rectangle-stencil"),Ie={name:"RectangleStencil",components:{PreviewResult:He,BoundingBox:we,DraggableArea:xe},props:{img:{type:Object},stencilCoordinates:{type:Object},handlers:{type:Object},handlerComponent:{type:[Object,String],default:function(){return pe}},handlersClassnames:{type:Object,default:function(){return{}}},lines:{type:Object},lineComponent:{type:[Object,String],default:function(){return Le}},linesClassnames:{type:Object,default:function(){return{}}},classname:{type:String},previewClassname:{type:String},boundingBoxClassname:{type:String},aspectRatio:{type:[Number,String]},minAspectRatio:{type:[Number,String]},maxAspectRatio:{type:[Number,String]},movable:{type:Boolean,default:!0},scalable:{type:Boolean,default:!0}},computed:{classes:function(){return{stencil:V(_e({movable:this.movable}),this.classname),preview:V(_e("preview"),this.previewClassname),boundingBox:V(_e("bounding-box"),this.boundingBoxClassname)}},style:function(){var e=this.stencilCoordinates,t=e.height,i=e.width,o=e.left,a=e.top;return{width:"".concat(i,"px"),height:"".concat(t,"px"),left:"".concat(o,"px"),top:"".concat(a,"px")}}},methods:{onMove:function(e){this.$emit("move",e)},onResize:function(e){this.$emit("resize",e)},aspectRatios:function(){return{minimum:this.aspectRatio||this.minAspectRatio,maximum:this.aspectRatio||this.maxAspectRatio}}}},Ye=oe({render:function(){var e=this,t=e.$createElement,i=e._self._c||t;return i("div",{class:e.classes.stencil,style:e.style},[i("BoundingBox",{attrs:{classname:e.classes.boundingBox,handlers:e.handlers,"handler-component":e.handlerComponent,"handlers-classnames":e.handlersClassnames,lines:e.lines,"line-component":e.lineComponent,"lines-classnames":e.linesClassnames,scalable:e.scalable},on:{resize:e.onResize}},[i("DraggableArea",{attrs:{movable:e.movable},on:{move:e.onMove}},[i("PreviewResult",{attrs:{img:e.img,classname:e.classes.preview,"stencil-coordinates":e.stencilCoordinates}})],1)],1)],1)},staticRenderFns:[]},void 0,Ie,void 0,!1,void 0,void 0,void 0),Xe=K("vue-circle-stencil"),ke={name:"CircleStencil",components:{PreviewResult:He,BoundingBox:we,DraggableArea:xe},props:{img:{type:Object},stencilClass:{type:String},stencilCoordinates:{type:Object},handlers:{type:Object,default:function(){return{eastNorth:!0,westNorth:!0,westSouth:!0,eastSouth:!0}}},handlerComponent:{type:[Object,String],default:function(){return pe}},handlersClassnames:{type:Object,default:function(){return{}}},lines:{type:Object},lineComponent:{type:[Object,String],default:function(){return Le}},linesClassnames:{type:Object,default:function(){return{}}},classname:{type:String},previewClassname:{type:String},boundingBoxClassname:{type:String},movable:{type:Boolean,default:!0},scalable:{type:Boolean,default:!0}},computed:{classes:function(){return{stencil:V(Xe(),this.classname),preview:V(Xe("preview"),this.previewClassname),boundingBox:V(Xe("bounding-box"),this.boundingBox)}},style:function(){var e=this.stencilCoordinates,t=e.height,i=e.width,o=e.left,a=e.top;return{width:"".concat(i,"px"),height:"".concat(t,"px"),left:"".concat(o,"px"),top:"".concat(a,"px")}}},methods:{onMove:function(e){this.$emit("move",e)},onResize:function(e){this.$emit("resize",e)},aspectRatios:function(){return{minimum:1,maximum:1}}}},Be=oe({render:function(){var e=this,t=e.$createElement,i=e._self._c||t;return i("div",{class:e.classes.stencil,style:e.style},[i("BoundingBox",{attrs:{classname:e.classes.boundingBox,handlers:e.handlers,"handler-component":e.handlerComponent,"handlers-classnames":e.handlersClassnames,lines:e.lines,"line-component":e.lineComponent,"lines-classnames":e.linesClassnames,scalable:e.scalable},on:{resize:e.onResize}},[i("DraggableArea",{attrs:{movable:e.movable},on:{move:e.onMove}},[i("PreviewResult",{attrs:{img:e.img,classname:e.classes.preview,"stencil-coordinates":e.stencilCoordinates}})],1)],1)],1)},staticRenderFns:[]},void 0,ke,void 0,!1,void 0,void 0,void 0),Ue=K("vue-advanced-cropper"),Oe={name:"Cropper",components:{CropperWrapper:De},props:{src:{type:String,default:null},bustCache:{type:Boolean,default:!1},allowedArea:{type:Function,default:function(e){var t=e.breakBoundaries,i=e.imageSize,o=e.worldTransforms,a=e.imageRestriction,n={};if("none"!==a&&(n={left:0,top:0,right:i.width,bottom:i.height}),!t){var s={left:-o.shift.left/o.scale,top:-o.shift.top/o.scale,right:(i.width-o.shift.left)/o.scale,bottom:(i.height-o.shift.top)/o.scale};Ee.forEach(function(e){n[e]=u(n[e])?s[e]:"left"===e||"top"===e?q(n[e],s[e]):j(n[e],s[e])})}return n}},resizeAlgorithm:{type:Function,default:function(e){var t=e.coordinates,i=e.restrictions,o=e.allowedArea,a=e.aspectRatio,n=e.resizeEvent,s=r({},t,{right:t.left+t.width,bottom:t.top+t.height}),l=n.params||{},c=r({},n.directions),h=r({},i,{minWidth:q(i.minWidth,i.minimum),minHeight:q(i.minHeight,i.minimum)}),d=l.allowedDirections||{left:!0,right:!0,bottom:!0,top:!0};Ee.forEach(function(e){d[e]||(c[e]=0)}),c=I({directions:c,restrictions:h,coordinates:s,allowedArea:o,stopOnBreak:l.stopOnBreak});var m=P(s,c),p=L(s,c),g=Y(m,p,a,s,l.preserveAspectRatio);if(g){var f=l.respectDirection;if(f||(s.width>=s.height||1==g?f="width":f="height"),"width"===f){var u=m/g-s.height;d.top&&d.bottom?(c.bottom=u/2,c.top=u/2):d.bottom?c.bottom=u:d.top?c.top=u:d.right?c.right=0:d.left&&(c.left=0)}else if("height"===f){var v=s.width-p*g;d.left&&d.right?(c.left=-v/2,c.right=-v/2):d.left?c.left=-v:d.right?c.right=-v:d.top?c.top=0:d.bottom&&(c.bottom=0)}c=I({directions:c,restrictions:h,coordinates:s,allowedArea:o,preserveAspectRatio:!0,mode:l.compensate&&!l.stopOnBreak?"move":"crop"})}return m=P(s,c),p=L(s,c),g=Y(m,p,a,s,l.preserveAspectRatio),1e-3<N(g-m/p)&&(console.error("Something went wrong and ratio was broken: ".concat(m/p," instead of ").concat(g)),Ee.forEach(function(e){d[e]||(c[e]=0)})),X({coordinates:{width:t.width+c.right+c.left,height:t.height+c.top+c.bottom,left:t.left,top:t.top},allowedArea:o,moveEvent:new ee({},{left:-c.left,top:-c.top})})}},moveAlgorithm:{type:Function,default:X},defaultSize:{type:Function,default:function(e){var t,i,o=e.cropper,a=e.image,n=e.minWidth,s=e.minHeight,r=e.maxWidth,l=e.maxHeight,c=e.imageWidth,h=e.imageHeight,d=e.aspectRatio,m=e.props,p=c,g=h,f=c>h?d.maximum:d.minimum;return(c/h>d.maximum||c/h<d.minimum)&&(1>=f?(g=h,p=g*d.maximum):(p=c,g=p/d.minimum)),t=j(l,q(s,.8*g)),i=j(r,q(n,.8*p)),{height:t,width:i}}},defaultPosition:{type:Function,default:function(e){var t=e.cropper,i=e.image,o=e.stencilWidth,a=e.stencilHeight,n=e.imageWidth,s=e.imageHeight,r=e.props;return{left:n/2-o/2,top:s/2-a/2}}},areaSize:{type:Function,default:function(e){var t=e.cropper,i=e.image,o=e.imageWidth,a=e.imageHeight,n=t.clientHeight,s=t.clientWidth,r=n,l=o*n/a;return l>s&&(l=s,r=a*s/o),{width:l,height:r}}},restrictions:{type:Function,default:function(e){var t=e.minWidth,i=e.minHeight,o=e.maxWidth,a=e.maxHeight,n=e.imageWidth,s=e.imageHeight;return{minWidth:t/100*n,minHeight:i/100*s,maxWidth:o/100*n,maxHeight:a/100*s}}},minWidth:{type:[Number,String]},minHeight:{type:[Number,String]},maxWidth:{type:[Number,String]},maxHeight:{type:[Number,String]},stencilComponent:{type:[Object,String],default:function(){return Ye}},stencilProps:{type:Object,default:function(){return{}}},classname:{type:String},imageClassname:{type:String},areaClassname:{type:String},backgroundClassname:{type:String},debounce:{type:Number,default:500},canvas:{type:Boolean,default:!0},checkCrossOrigin:{type:Boolean,default:!0},checkOrientation:{type:Boolean,default:!0},crossOrigin:{type:String,default:"anonymous"},transitionTime:{type:Number,default:300},wheelResize:{type:[Boolean,Object],default:!0},touchResize:{type:[Boolean,Object],default:!0},touchMove:{type:[Boolean,Object],default:!0},mouseMove:{type:[Boolean,Object],default:!0},imageRestriction:{type:String,default:"area",validator:function(e){return-1!==Se.indexOf(e)}},roundResult:{type:Boolean,default:!0}},data:function(){return{boundarySize:{width:null,height:null},imageLoaded:!1,imageAttributes:{crossOrigin:!1,src:null},basicImageTransforms:{rotate:null,scaleX:null,scaleY:null},imageSize:{width:null,height:null},coordinates:r({},We),stencilCoordinates:r({},We),frozenDirections:{width:!1,height:!1},worldTransforms:{scale:1,shift:{left:0,top:0}}}},computed:{settings:function e(){var e={touchResize:y(this.touchResize),touchMove:y(this.touchMove),mouseMove:y(this.mouseMove),wheelResize:y(this.wheelResize,{ratio:.1})};return e.touchMove.enabled=e.touchMove.enabled&&(1!==this.worldTransforms.scale||"area"!==this.imageRestriction),e},imageTransforms:function(){return r({},this.basicImageTransforms,{scaleX:(this.basicImageTransforms.scaleX||1)*this.worldTransforms.scale,scaleY:(this.basicImageTransforms.scaleY||1)*this.worldTransforms.scale,translateX:this.worldTransforms.shift.left/this.coefficient+(this.imageSize.width*this.worldTransforms.scale-this.imageSize.width)/2/this.coefficient,translateY:this.worldTransforms.shift.top/this.coefficient+(this.imageSize.height*this.worldTransforms.scale-this.imageSize.height)/2/this.coefficient})},coefficient:function(){return this.imageSize.width?this.imageSize.width/this.boundarySize.width:0},classes:function(){return{cropper:V(Ue(),this.classname),image:V(Ue("image"),this.imageClassname),area:V(Ue("area"),this.areaClassname),stretcher:V(Ue("stretcher")),background:V(Ue("background"),this.backgroundClassname),imageWrapper:V(Ue("image-wrapper")),cropperWrapper:V(Ue("cropper-wrapper"))}},wrapperStyle:function(){return{width:"".concat(this.stencilCoordinates.width,"px"),height:"".concat(this.stencilCoordinates.height,"px"),left:"".concat(this.stencilCoordinates.left,"px"),top:"".concat(this.stencilCoordinates.top,"px")}},areaStyle:function(){return{width:this.boundarySize.width?"".concat(this.boundarySize.width,"px"):"auto",height:this.boundarySize.height?"".concat(this.boundarySize.height,"px"):"auto",opacity:this.imageLoaded?1:0,transition:"opacity ".concat(this.transitionTime,"ms"),pointerEvents:this.imageLoaded?"all":"none"}},imageStyle:function(){var e={left:"calc(50% + ".concat(this.imageTransforms.translateX,"px)"),top:"calc(50% + ".concat(this.imageTransforms.translateY,"px)"),transform:"translate(-50%, -50%)"+E(this.imageTransforms)},t=this.imageTransforms.flipped;return t?(e.width="".concat(this.boundarySize.height,"px"),e.height="".concat(this.boundarySize.width,"px")):(e.width="".concat(this.boundarySize.width,"px"),e.height="".concat(this.boundarySize.height,"px")),e},stencilRestrictions:function(){var e=q(Re*this.imageSize.width/this.coefficient/this.worldTransforms.scale,Re*this.imageSize.height/this.coefficient/this.worldTransforms.scale),t={minWidth:u(this.minWidth)?0:this.minWidth,minHeight:u(this.minHeight)?0:this.minHeight,maxWidth:u(this.maxWidth)?1/0:this.maxWidth,maxHeight:u(this.maxHeight)?1/0:this.maxHeight},i=O(this.restrictions,"restrictions",function(e){return[e.minWidth,e.minHeight,e.maxWidth,e.maxHeight,e.imageWidth,e.imageHeight]})({minWidth:x(t.minWidth),minHeight:x(t.minHeight),maxWidth:x(t.maxWidth),maxHeight:x(t.maxHeight),imageWidth:this.imageSize.width,imageHeight:this.imageSize.height,props:this.$props});return u(i.minWidth)&&(i.minWidth=F(e)),u(i.minHeight)&&(i.minHeight=F(e)),i.minWidth>i.maxWidth&&(console.warn("Warning: maximum width (".concat(i.maxWidth,"px) fewer that the minimum width (").concat(i.minWidth,"px). It is set equal to the minimum width and width resizing was blocked")),i.maxWidth=i.minWidth,i.widthFrozen=!0),i.minHeight>i.maxHeight&&(console.warn("Warning: maximum height (".concat(i.maxHeight,"px) fewer that the minimum height (").concat(i.minHeight,"px). It is set equal to the minimum height and height resizing was blocked")),i.maxHeight=i.minHeight,i.heightFrozen=!0),"none"!==this.imageRestriction&&((!i.maxWidth||i.maxWidth>this.imageSize.width)&&(i.maxWidth=this.imageSize.width),(!i.maxHeight||i.maxHeight>this.imageSize.height)&&(i.maxHeight=this.imageSize.height)),i.minimum=20*this.coefficient/this.worldTransforms.scale,i}},watch:{src:function(){this.onChangeImage()},minWidth:function(){this.onPropsChange()},maxWidth:function(){this.onPropsChange()},minHeight:function(){this.onPropsChange()},maxHeight:function(){this.onPropsChange()},imageRestriction:function(){this.resetCoordinates()},stencilProps:function(e,i){["aspectRatio","minAspectRatio","maxAspectRatio"].find(function(t){return e[t]!==i[t]})&&t.nextTick(this.onPropsChange)}},mounted:function(){var e=this;this.debouncedUpdate=m(this.update,this.debounce),window.addEventListener("resize",this.onResizeWindow),window.addEventListener("orientationchange",this.onResizeWindow),this.$refs.image.addEventListener("load",function(){e.onSuccessLoadImage()}),this.$refs.image.addEventListener("error",function(){e.onFailLoadImage()}),this.onChangeImage()},destroyed:function(){window.removeEventListener("resize",this.refreshImage),window.removeEventListener("orientationchange",this.refreshImage)},methods:{getResult:function(){var e=this.prepareResult(r({},this.coordinates));return this.canvas&&this.src&&this.imageLoaded?(this.updateCanvas(this.coordinates),{coordinates:e,canvas:this.$refs.canvas}):{coordinates:e}},prepareResult:function(e){return this.roundResult?U({coordinates:e,restrictions:this.restrictions,allowedArea:this.getAllowedArea()}):e},getArea:function(){return this.$refs.area},getStencil:function(){return this.$refs.stencil},autoZoom:function(e){var t=k({coordinates:e,stencilCoordinates:this.stencilCoordinates,worldTransforms:this.worldTransforms,coefficient:this.coefficient,imageSize:this.imageSize,allowedArea:this.getAllowedArea(!0)}),i=t.worldTransforms,o=t.stencilCoordinates;this.worldTransforms=i,this.stencilCoordinates=o},updateStencilCoordinates:function(e){var t=e.width,i=e.height,o=e.left,a=e.top;this.stencilCoordinates={width:this.worldTransforms.scale*t/this.coefficient,height:this.worldTransforms.scale*i/this.coefficient,left:(o*this.worldTransforms.scale+this.worldTransforms.shift.left)/this.coefficient,top:(a*this.worldTransforms.scale+this.worldTransforms.shift.top)/this.coefficient}},updateCanvas:function(e){if(this.$refs.canvas){var t=this.$refs.image,i=this.checkOrientation?C(this.$refs.sourceCanvas,t,this.imageTransforms):t,o=this.$refs.canvas;o.width=e.width,o.height=e.height;var a=o.getContext("2d");a.clearRect(0,0,o.width,o.height),a.drawImage(i,e.left,e.top,e.width,e.height,0,0,e.width,e.height)}},update:function(){this.$emit("change",this.getResult())},onResizeWindow:function(){var e=this,t=this.$refs.image;this.src&&t&&this.refreshImage().then(function(){e.updateStencilCoordinates(e.coordinates)})},onChangeCoordinates:function(e){var t=!(1<arguments.length&&arguments[1]!==void 0)||arguments[1];this.coordinates=e,this.$listeners&&this.$listeners.change&&(t?this.debouncedUpdate():this.update())},onChangeImage:function(){var e=this;if(this.imageLoaded=!1,this.delayedTransforms=null,this.imageAttributes.src=null,this.src){var t=f(this.src);t&&this.canvas&&this.checkCrossOrigin&&(this.imageAttributes.crossOrigin=this.crossOrigin),setTimeout(function(){var t=e.bustCache?w(e.src):e.src;e.checkOrientation?S(t).then(e.onParseImage):e.onParseImage({source:t})},this.transitionTime)}else this.clearImage()},onFailLoadImage:function(){this.clearImage(),this.$emit("error")},onSuccessLoadImage:function(){var e=this;this.$refs.image&&!this.imageLoaded&&(this.imageLoaded=!0,this.refreshImage().then(function(){e.resetCoordinates(),e.$emit("ready")}))},onParseImage:function(e){var i=this,o=e.source,a=e.arrayBuffer,n=e.orientation;this.imageAttributes.src=a&&n&&g(o)?A(a):o,this.basicImageTransforms=z(n),t.nextTick(function(){var e=i.$refs.image;e&&e.complete&&(e.naturalWidth?i.onSuccessLoadImage():i.onFailLoadImage())})},onResize:function(e){var t=this;this.frozenDirections.width&&(e.directions.left=0,e.directions.right=0),this.frozenDirections.height&&(e.directions.top=0,e.directions.bottom=0),Ee.forEach(function(i){e.directions[i]/=t.worldTransforms.scale/t.coefficient}),this.onChangeCoordinates(this.resizeAlgorithm({coordinates:this.coordinates,restrictions:this.stencilRestrictions,allowedArea:this.getAllowedArea(),aspectRatio:this.stencilAspectRatios(),resizeEvent:e})),this.updateStencilCoordinates(this.coordinates)},onManipulateImage:function(e){e.move.left&&(e.move.left*=this.coefficient),e.move.top&&(e.move.top*=this.coefficient);var t=B({manipulateImageEvent:e,coordinates:this.coordinates,coefficient:this.coefficient,stencilRestrictions:this.stencilRestrictions,imageSize:this.imageSize,frozenDirections:this.frozenDirections,stencilCoordinates:this.stencilCoordinates,worldTransforms:this.worldTransforms,allowedArea:this.getAllowedArea(!0),minScale:"none"===this.imageRestriction?Re:1,fitImage:"area"===this.imageRestriction}),i=t.worldTransforms,o=t.coordinates;this.worldTransforms=i,this.onChangeCoordinates(o),this.updateStencilCoordinates(o)},onMove:function(e){var t=this;Ee.forEach(function(i){e.directions[i]/=t.worldTransforms.scale/t.coefficient}),this.onChangeCoordinates(this.moveAlgorithm({coordinates:this.coordinates,allowedArea:this.getAllowedArea(),moveEvent:e})),this.updateStencilCoordinates(this.coordinates)},defaultCoordinates:function(){var e=this.