var Cropper=function(){"use strict";function t(t){if(!t)throw Error("Node is not passed or invalid selector.");var e=t;if("string"==typeof e&&!(e=document.querySelector(t)))throw Error("Invalid selector.");if(!(e instanceof window.HTMLElement))throw Error("Node should be instance of window.HTMLElement or valid selector string.");return e}function e(t){if(!t)throw Error("Config is not passed or invalid.");if("[object Object]"!==Object.prototype.toString.call(t))throw Error("Invalid config.")}function n(t){if(!t&&0!==t)throw Error("Dimension is not passed or invalid.");if("number"!=typeof t)throw Error("Invalid dimension.");if(!isFinite(t))throw Error("Invalid dimension.");if(t<0)throw Error("Invalid dimension.");return t}function i(t){if(void 0===t)return function(){};if(!t||"function"!=typeof t)throw Error("Invalid callback.");return t}function r(){throw new Error("Dynamic requires are not currently supported by rollup-plugin-commonjs")}var o={width:560,height:340},s={cutout:{fill:"rgba(0, 0, 0, 0.3)"},pattern:{size:16,fill1:"rgb(215, 215, 215)",fill2:"rgb(250, 250, 250)"}},a="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},h=function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")},u=function(){function t(t,e){for(var n=0;n0&&void 0!==arguments[0]?arguments[0]:0,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0;h(this,t),this.width=e,this.height=n},d=function(){function t(e){if(h(this,t),this._node=e,!e||"string"==typeof e){if("svg"===e||"use"===e)return void(this._node=document.createElementNS("http://www.w3.org/2000/svg",e));this._node=document.createElement(e||"div")}}return u(t,[{key:"render",value:function(t){if(!t)throw Error("Parent node are not passed.");return t.appendChild(this._node),this}},{key:"setWidth",value:function(t){return this._node.width=t,this}},{key:"setHeight",value:function(t){return this._node.height=t,this}},{key:"getSize",value:function(){return new _(this._node.width,this._node.height)}},{key:"getNode",value:function(){return this._node}},{key:"getContext2d",value:function(){return this._node.getContext("2d")}},{key:"setType",value:function(t){return this._node.type=t,this}},{key:"addClass",value:function(t){return this._node.className+=this._node.className.length>1?" "+t:t,this}},{key:"setAttribute",value:function(t,e){return this._node.setAttribute(t,e),this}}]),t}(),g="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:{},v=function(t,e){return e={exports:{}},t(e,e.exports),e.exports}(function(t,e){!function(e,n){t.exports=function(){function t(t){var e=void 0===t?"undefined":a(t);return null!==t&&("object"===e||"function"===e)}function e(t){return"function"==typeof t}function n(t){F=t}function i(t){W=t}function o(){return void 0!==D?function(){D(h)}:s()}function s(){var t=setTimeout;return function(){return t(h,1)}}function h(){for(var t=0;tn?e:n;return this._scale=this._originScale=i,this._scale}},{key:"getSize",value:function(){var t=this.getNode().width*this._scale,e=this.getNode().height*this._scale;return new _(t,e)}},{key:"setZoom",value:function(t){return this._zoom=t,this._scale=this._originScale+this._originScale*t,this}},{key:"getZoom",value:function(){return this._zoom}},{key:"getScale",value:function(){return this._scale}},{key:"getOriginScale",value:function(){return this._originScale}},{key:"_checkFormat",value:function(){return this.getNode().width>this.getNode().height?"landscape":this.getNode().width0&&void 0!==arguments[0]?arguments[0]:0,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0;h(this,t),this.x=e,this.y=n},b=function(){function t(){h(this,t),this._size=0,this._origin={x:0,y:0}}return u(t,[{key:"update",value:function(t){return this._size=t.width>t.height?.85*t.height:.85*t.width,this._origin={x:(t.width-this._size)/2,y:(t.height-this._size)/2},this}},{key:"getRect",value:function(){return{origin:new w(this._origin.x,this._origin.y),size:new _(this._size,this._size)}}},{key:"getMinX",value:function(){return this._origin.x}},{key:"getMaxX",value:function(){return this._origin.x+this._size}},{key:"getMidX",value:function(){return this._origin.x+this._size/2}},{key:"getMinY",value:function(){return this._origin.y}},{key:"getMaxY",value:function(){return this._origin.y+this._size}},{key:"getMidY",value:function(){return this._origin.y+this._size/2}}]),t}(),k=function(){function t(e,n){h(this,t),this._frame=e,this._canvas=n,this._context=new m(this._canvas.getNode().getContext("2d"))}return u(t,[{key:"draw",value:function(){return this._context.fillStyle(s.cutout.fill),this._context.beginPath(),this._context.rect(0,0,this._canvas.getNode().width,this._canvas.getNode().height),this._context.moveTo(this._frame.getMinX(),this._frame.getMinY()),this._context.lineTo(this._frame.getMinX(),this._frame.getMaxY()),this._context.lineTo(this._frame.getMaxX(),this._frame.getMaxY()),this._context.lineTo(this._frame.getMaxX(),this._frame.getMinY()),this._context.closePath(),this._context.fill(),this}}]),t}(),x=function(t){function e(t,n){h(this,e);var i=f(this,(e.__proto__||Object.getPrototypeOf(e)).call(this,"canvas"));return i._frame=t,i._canvas=n,i._context=new m(i._node.getContext("2d")),i}return l(e,t),u(e,[{key:"toDataURL",value:function(){return this.setWidth(this._frame.getRect().size.width),this.setHeight(this._frame.getRect().size.height),this._context.drawImage(this._canvas.getNode(),this._frame.getMinX(),this._frame.getMinY(),this._frame.getRect().size.width,this._frame.getRect().size.height,0,0,this._frame.getRect().size.width,this._frame.getRect().size.height),this.getNode().toDataURL()}}]),e}(d),P=function(){function t(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:new d(document.body);h(this,t),this._element=e,this._parent=n,this._onMoveCallback=function(){},this._onPressCallback=function(){},this._onReleaseCallback=function(){},this._onReleaseHandler=this.onReleaseHandler.bind(this),this._onPressHandler=this.onPressHandler.bind(this),this._onMoveHandler=this.onMoveHandler.bind(this)}return u(t,[{key:"onMove",value:function(t){this._onMoveCallback=t}},{key:"onPress",value:function(t){this._onPressCallback=t}},{key:"onRelease",value:function(t){this._onReleaseCallback=t}},{key:"init",value:function(){this._element.getNode().addEventListener("mousedown",this._onPressHandler,!1),this._element.getNode().addEventListener("touchstart",this._onPressHandler,!1),this._parent.getNode().addEventListener("mouseup",this._onReleaseHandler,!1),this._parent.getNode().addEventListener("touchend",this._onReleaseHandler,!1)}},{key:"onMoveHandler",value:function(t){this._onMoveCallback(this._getEventPoint(t))}},{key:"onPressHandler",value:function(t){this._parent.getNode().addEventListener("mousemove",this._onMoveHandler,!1),this._parent.getNode().addEventListener("touchmove",this._onMoveHandler,!1),this._onPressCallback(this._getEventPoint(t))}},{key:"onReleaseHandler",value:function(t){this._parent.getNode().removeEventListener("mousemove",this._onMoveHandler,!1),this._parent.getNode().removeEventListener("touchmove",this._onMoveHandler,!1),this._onReleaseCallback(this._getEventPoint(t))}},{key:"_convertCoordinates",value:function(t){var e=this._element.getNode().getBoundingClientRect(),n=t.x-e.left*(this._element.getNode().width/e.width),i=t.y-e.top*(this._element.getNode().height/e.height);return new w(n,i)}},{key:"_getEventPoint",value:function(t){var e=t.clientX||t.touches[0].clientX,n=t.clientY||t.touches[0].clientY;return this._convertCoordinates(new w(e,n))}}]),t}(),C=function(t){function e(){h(this,e);var t=f(this,(e.__proto__||Object.getPrototypeOf(e)).call(this,"canvas"));return t._context=new m(t._node.getContext("2d")),t._image=new y,t._pattern=new p,t._frame=new b,t._cutout=new k(t._frame,t),t._generator=new x(t._frame,t),t._moveEventListener=new P(t),t._lastPoint=new w(0,0),t._basePoint=new w(0,0),t._onChangeCallback=function(){},t}return l(e,t),u(e,[{key:"render",value:function(t){var n=this;return c(e.prototype.__proto__||Object.getPrototypeOf(e.prototype),"render",this).call(this,t),this._drawBackground(),this._moveEventListener.init(),this._moveEventListener.onPress(function(t){n._lastPoint=t}),this._moveEventListener.onMove(function(t){n._drawImage(t)}),this}},{key:"setWidth",value:function(t){return c(e.prototype.__proto__||Object.getPrototypeOf(e.prototype),"setWidth",this).call(this,t),this._frame.update(this.getNode()),this}},{key:"setHeight",value:function(t){return c(e.prototype.__proto__||Object.getPrototypeOf(e.prototype),"setHeight",this).call(this,t),this._frame.update(this.getNode()),this}},{key:"setImage",value:function(t){return this._resetPoints(),this._image=t,this._image.scaleToFit(this._frame),this}},{key:"draw",value:function(){return this._drawImage(this._centerImagePoint()),this}},{key:"redraw",value:function(){return this._resetPoints(),this._image.scaleToFit(this._frame),this.draw(),this}},{key:"clear",value:function(){return this._context.clearRect(0,0,this.getNode().width,this.getNode().height),this}},{key:"toDataURL",value:function(){return this._generator.toDataURL()}},{key:"setZoom",value:function(t){var e=this._image.getSize();this._image.setZoom(t);var n=this._image.getSize(),i=this._lastPoint.x-(n.width-e.width)/2,r=this._lastPoint.y-(n.height-e.height)/2;return this._drawImage(new w(i,r)),this}},{key:"onChange",value:function(t){this._onChangeCallback=t}},{key:"getData",value:function(){return{origin:{x:(this._frame.getMinX()-this._basePoint.x)/this._image.getScale(),y:(this._frame.getMinY()-this._basePoint.y)/this._image.getScale()},size:{width:this._frame.getRect().size.width/this._image.getScale(),height:this._frame.getRect().size.width/this._image.getScale()}}}},{key:"setData",value:function(t){var e=this._frame.getRect().size.width/t.size.width,n=(e-this._image.getOriginScale())/this._image.getOriginScale();this.setZoom(n);var i=this._frame.getMinX()-t.origin.x*this._image.getScale(),r=this._frame.getMinY()-t.origin.y*this._image.getScale(),o=new w(i,r);return this._resetPoints(),this._drawImage(o),{origin:o,zoom:n}}},{key:"_resetPoints",value:function(){return this._lastPoint=new w(0,0),this._basePoint=new w(0,0),this}},{key:"_centerImagePoint",value:function(){var t=this._frame.getMidX()-this._image.getSize().width/2,e=this._frame.getMidY()-this._image.getSize().height/2;return new w(t,e)}},{key:"_validatePoint",value:function(t){var e=t;return this._image.getSize().widththis._frame.getMinX()?e.x=this._frame.getMinX():t.x+this._image.getSize().widththis._frame.getMinY()?e.y=this._frame.getMinY():t.y+this._image.getSize().height0&&void 0!==arguments[0]?arguments[0]:new w(0,0);this.clear(),this._drawBackground();var e=this._basePoint.x+(t.x-this._lastPoint.x),n=this._basePoint.y+(t.y-this._lastPoint.y);return this._basePoint=this._validatePoint(new w(e,n)),this._lastPoint=t,this._context.drawImage(this._image.getNode(),this._basePoint.x,this._basePoint.y,this._image.getSize().width,this._image.getSize().height),this._cutout.draw(),this._onChangeCallback(this),this}},{key:"_drawBackground",value:function(){var t=this._context.createPattern(this._pattern.getNode(),"repeat");return this._context.rect(0,0,this.getNode().width,this.getNode().height),this._context.fillStyle(t),this._context.fill(),this}}]),e}(d),S=function(t){function e(){h(this,e);var t=f(this,(e.__proto__||Object.getPrototypeOf(e)).call(this,"input"));return t.setType("range"),t.addClass("slider"),t.setAttribute("min",0),t.setAttribute("max",100),t.setAttribute("value",0),t._onChangeCallback=function(){},t._onChangeHandler=t._onChange.bind(t),t}return l(e,t),u(e,[{key:"onChange",value:function(t){return this._onChangeCallback=t,this.getNode().addEventListener("change",this._onChangeHandler,!1),this.getNode().addEventListener("input",this._onChangeHandler,!1),this}},{key:"setValue",value:function(t){return this.getNode().value=t,this}},{key:"_onChange",value:function(){this._onChangeCallback(Number(this.getNode().value))}}]),e}(d),N=function(t){function e(t){h(this,e);var n=f(this,(e.__proto__||Object.getPrototypeOf(e)).call(this,"svg"));return n.setAttribute("class","icon icon-"+t),n._use=new d("use"),n._use.getNode().setAttributeNS("http://www.w3.org/1999/xlink","xlink:href","#icon-"+t),n._use.render(n.getNode()),n}return l(e,t),e}(d);return function(){function r(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};h(this,r),e(t),this._canvas=new C,this._image=new y,this._slider=new S,this.setWidth(t.width||o.width),this.setHeight(t.height||o.height),this._onInitCallback=i(t.onInit),this._onChangeCallback=i(t.onChange)}return u(r,[{key:"render",value:function(e){var n=this;this._node=t(e);var i=new d;i.addClass("cropper"),i.render(this._node),this._canvas.render(i.getNode());var r=new d;r.addClass("cropper-tools"),r.render(i.getNode());var o=new d;o.addClass("cropper-zoom"),o.render(r.getNode());var s=new N("frame-landscape"),a=new N("frame-landscape");return s.render(o.getNode()),this._slider.render(o.getNode()),this._slider.onChange(function(t){n._canvas.setZoom(t/100)}),a.render(o.getNode()),this._onInitCallback(this),this._canvas.onChange(function(){n._onChangeCallback(n)}),this}},{key:"setWidth",value:function(t){try{n(t)}catch(t){throw Error("Width property: "+t.message)}return this._canvas.setWidth(t),this._canvas.redraw(),this}},{key:"setHeight",value:function(t){try{n(t)}catch(t){throw Error("Height property: "+t.message)}return this._canvas.setHeight(t),this._canvas.redraw(),this}},{key:"loadImage",value:function(t){var e=this;if(!t)throw Error("Image url or path is not passed.");if("string"!=typeof t)throw Error("Invalid url or path.");return this._image.load(t).then(function(t){return e._canvas.setImage(t),e._canvas.draw(),e._slider.setValue(0),e})}},{key:"getCroppedImage",value:function(){return this._canvas.toDataURL()}},{key:"setZoom",value:function(t){try{n(t)}catch(t){throw Error("Zoom property: "+t.message)}return this._canvas.setZoom(t),this._slider.setValue(100*t),this}},{key:"reset",value:function(){return this.setZoom(0),this._canvas.redraw(),this}},{key:"getData",value:function(){return this._canvas.getData()}},{key:"setData",value:function(t){var e=this._canvas.setData(t),n=e.zoom;return this._slider.setValue(100*n),this}}]),r}()}();