From 3e0edc7aa6b698b2da48f5f50e08214eee481464 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Matthias=20M=C3=BCller?= Date: Wed, 10 Feb 2021 16:13:35 +0100 Subject: [PATCH] Compatibility to Kirby 3.5 --- README.md | 1 + index.js | 2 +- src/components/clipDialog.vue | 558 ++++++++++++++++++---------------- 3 files changed, 291 insertions(+), 270 deletions(-) diff --git a/README.md b/README.md index 6f8a5dd..bb39569 100644 --- a/README.md +++ b/README.md @@ -35,6 +35,7 @@ composer require mullema/k3-image-clip ``` ### Requirements +- Kirby 3.5 -> use v2.2.0 - Kirby 3.3 -> use v2.1.0 - Kirby 3.2.5 -> use v2.0.0 - GD Library or ImageMagick diff --git a/index.js b/index.js index 954aa15..d9681be 100644 --- a/index.js +++ b/index.js @@ -1 +1 @@ -!function(t){"function"==typeof define&&define.amd?define(t):t()}(function(){"use strict";var t=function(t,i,e,n,o,s,a,r,h,l){"boolean"!=typeof a&&(h=r,r=a,a=!1);var d,c="function"==typeof e?e.options:e;if(t&&t.render&&(c.render=t.render,c.staticRenderFns=t.staticRenderFns,c._compiled=!0,o&&(c.functional=!0)),n&&(c._scopeId=n),s?(d=function(t){(t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),i&&i.call(this,h(t)),t&&t._registeredComponents&&t._registeredComponents.add(s)},c._ssrRegister=d):i&&(d=a?function(){i.call(this,l(this.$root.$options.shadowRoot))}:function(t){i.call(this,r(t))}),d)if(c.functional){var u=c.render;c.render=function(t,i){return d.call(i),u(t,i)}}else{var p=c.beforeCreate;c.beforeCreate=p?[].concat(p,d):[d]}return e},i=t({render:function(){var t=this,i=t.$createElement,e=t._self._c||i;return e("k-field",t._b({staticClass:"k-files-field"},"k-field",t.$props,!1),[t.more&&!t.disabled?e("template",{slot:"options"},[e("k-button-group",{staticClass:"k-field-options"},[t.uploads?[e("k-dropdown",[e("k-button",{ref:"pickerToggle",staticClass:"k-field-options-button",attrs:{icon:"add"},on:{click:function(i){return t.$refs.picker.toggle()}}},[t._v("\n "+t._s(t.$t("add"))+"\n ")]),t._v(" "),e("k-dropdown-content",{ref:"picker",attrs:{align:"right"}},[e("k-dropdown-item",{attrs:{icon:"check"},on:{click:t.open}},[t._v(t._s(t.$t("select")))]),t._v(" "),e("k-dropdown-item",{attrs:{icon:"upload"},on:{click:t.upload}},[t._v(t._s(t.$t("upload")))])],1)],1)]:[e("k-button",{staticClass:"k-field-options-button",attrs:{icon:"add"},on:{click:t.open}},[t._v(t._s(t.$t("add")))])]],2)],1):t._e(),t._v(" "),t.selected.length?[e("k-draggable",{attrs:{element:t.elements.list,list:t.selected,"data-size":t.size,handle:!0,"data-invalid":t.isInvalid},on:{end:t.onInput}},t._l(t.selected,function(i,n){return e(t.elements.item,{key:i.filename,tag:"component",attrs:{sortable:!t.disabled&&t.selected.length>1,text:i.text,link:i.link,info:i.info,image:i.image,icon:i.icon,id:i.id,resizable:i.resizable,disabled:i.disabled},on:{openclipdialog:t.openClipDialog}},[t.disabled?t._e():e("k-button",{attrs:{slot:"options",tooltip:t.$t("remove"),icon:"remove"},on:{click:function(i){return t.remove(n)}},slot:"options"})],1)}),1)]:e("k-empty",{attrs:{layout:t.layout,icon:"image","data-invalid":t.isInvalid},on:{click:t.open}},[t._v("\n "+t._s(t.empty||t.$t("field.files.empty"))+"\n ")]),t._v(" "),e("k-files-dialog",{ref:"selector",on:{submit:t.select}}),t._v(" "),e("k-upload",{ref:"fileUpload",on:{success:t.selectUpload}}),t._v(" "),e("k-clip-dialog",{ref:"clip",attrs:{size:"large",image:t.clip_image,clip:t.clip},on:{submit:t.clippedArea}})],2)},staticRenderFns:[]},void 0,{extends:"k-files-field",props:{clip:{type:Object,default:null}},data:function(){return{clip_image:{}}},computed:{elements:function(){var t={cards:{list:"k-cards",item:"k-clip-card"},list:{list:"k-list",item:"k-clip-list-item"}};return t[this.layout]?t[this.layout]:t.list}},methods:{openClipDialog:function(t){this.clip_image=this.value.find(function(i){return i.id===t}),this.$refs.clip.open()},clippedArea:function(t){this.clip_image.clip=t.clip,this.onInput(),this.getPreview(t.id,t.clip)},getPreview:function(t,i){var e=this;this.$api.post(this.endpoints.field+"/preview",{id:t,width:i.width,height:i.height,top:i.top,left:i.left}).then(function(i){if(!i.image)throw new Error("image clip: no image for preview received.");var n=e.name,o=e.$store.state.content.current,s=e.$store.getters["content/values"](o)[n];s?(s.find(function(i){return i.id===t}).image=i.image,e.$store.dispatch("content/update",[n,s,o])):e.selected.find(function(i){return i.id===t}).image=i.image}).catch(function(t){console.log(t)})}}},void 0,!1,void 0,void 0,void 0),e=t({render:function(){var t=this,i=t.$createElement,e=t._self._c||i;return e("figure",t._g({staticClass:"k-card"},t.$listeners),[t.sortable?e("k-sort-handle"):t._e(),t._v(" "),t.resizable&&!t.disabled?e("k-clip-handle",{on:{clicked:t.openClipDialog}}):t._e(),t._v(" "),e(t.wrapper,{tag:"component",attrs:{to:t.link,target:t.target}},[t.imageOptions?e("k-image",t._b({staticClass:"k-card-image"},"k-image",t.imageOptions,!1)):e("span",{staticClass:"k-card-icon",style:"padding-bottom:"+t.ratioPadding},[e("k-icon",t._b({},"k-icon",t.icon,!1))],1),t._v(" "),e("figcaption",{staticClass:"k-card-content"},[e("span",{staticClass:"k-card-text",attrs:{"data-noinfo":!t.info}},[t._v(t._s(t.text))]),t._v(" "),t.info?e("span",{staticClass:"k-card-info",domProps:{innerHTML:t._s(t.info)}}):t._e()])],1),t._v(" "),e("nav",{staticClass:"k-card-options"},[t.flag?e("k-button",t._b({staticClass:"k-card-options-button",on:{click:t.flag.click}},"k-button",t.flag,!1)):t._e(),t._v(" "),t._t("options",[t.options?e("k-button",{staticClass:"k-card-options-button",attrs:{tooltip:t.$t("options"),icon:"dots"},on:{click:function(i){return i.stopPropagation(),t.$refs.dropdown.toggle()}}}):t._e(),t._v(" "),e("k-dropdown-content",{ref:"dropdown",staticClass:"k-card-options-dropdown",attrs:{options:t.options,align:"right"},on:{action:function(i){return t.$emit("action",i)}}})])],2)],1)},staticRenderFns:[]},void 0,{extends:"k-card",props:{id:String,resizable:Boolean,disabled:Boolean},methods:{openClipDialog:function(){this.$emit("openclipdialog",this.id)}}},"data-v-290c02b0",!1,void 0,void 0,void 0),n="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgBAMAAAAQtmoLAAAAMFBMVEUAAAAzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzPzX0yTAAAAD3RSTlMAQIDAEPDQYLAgoFBwMJALzXfXAAAAsElEQVRYw+3TPQoCMRCG4RgXVEQwrVXwFhbilt7AQu+QvYl7BQ9h72XshUUtP+NPQImBDAq7Webtn2I+GMFxXG1JVAzaDjJlm+CivMrvoINQOhnwSPpHG2jarAsGDH4BOREs1zQwMpiRwB44HwhAwlaV0SDb4t5GiOEqCvTxbG5lEQO6eHUErtHAVVDBKU3Qm76lG/MPH2CnbHkIhBonAwbKy7ijY3OzMmg74Djuj90AekzAtvxv03QAAAAASUVORK5CYII=",o=t({render:function(){var t=this.$createElement,i=this._self._c||t;return i("span",{staticClass:"k-sort-handle clip",attrs:{"aria-hidden":"true"}},[i("img",{staticClass:"clipicon",attrs:{src:n,alt:"Clip"},on:{click:this.open}})])},staticRenderFns:[]},void 0,{extends:"k-sort-handle",methods:{open:function(){this.$emit("clicked")}}},"data-v-c59f6268",!1,void 0,void 0,void 0),s=t({render:function(){var t=this,i=t.$createElement,e=t._self._c||i;return e(t.element,t._g({tag:"component",staticClass:"k-list-item"},t.$listeners),[t.sortable?e("k-sort-handle"):t._e(),t._v(" "),e("k-link",{directives:[{name:"tab",rawName:"v-tab"}],staticClass:"k-list-item-content",attrs:{to:t.link,target:t.target}},[e("span",{staticClass:"k-list-item-image"},[t.imageOptions?e("k-image",t._b({},"k-image",t.imageOptions,!1)):e("k-icon",t._b({},"k-icon",t.icon,!1))],1),t._v(" "),e("span",{staticClass:"k-list-item-text"},[e("em",[t._v(t._s(t.text))]),t._v(" "),t.info?e("small",{domProps:{innerHTML:t._s(t.info)}}):t._e()])]),t._v(" "),e("nav",{staticClass:"k-list-item-options"},[t.resizable&&!t.disabled?e("k-clip-button",{on:{clicked:t.openClipDialog}}):t._e(),t._v(" "),t._t("options",[t.flag?e("k-button",t._b({on:{click:t.flag.click}},"k-button",t.flag,!1)):t._e(),t._v(" "),t.options?e("k-button",{staticClass:"k-list-item-toggle",attrs:{tooltip:t.$t("options"),icon:"dots",alt:"Options"},on:{click:function(i){return i.stopPropagation(),t.$refs.options.toggle()}}}):t._e(),t._v(" "),e("k-dropdown-content",{ref:"options",attrs:{options:t.options,align:"right"},on:{action:function(i){return t.$emit("action",i)}}})])],2)],1)},staticRenderFns:[]},void 0,{extends:"k-list-item",props:{id:String,resizable:Boolean,disabled:Boolean},methods:{openClipDialog:function(){this.$emit("openclipdialog",this.id)}}},"data-v-9cf224f4",!1,void 0,void 0,void 0),a=t({render:function(){var t=this.$createElement,i=this._self._c||t;return i("span",{staticClass:"k-button clip",attrs:{"aria-hidden":"true"}},[i("img",{staticClass:"clipicon",attrs:{src:n,alt:"Clip"},on:{click:this.open}})])},staticRenderFns:[]},void 0,{extends:"k-sort-handle",methods:{open:function(){this.$emit("clicked")}}},"data-v-7d15b97a",!1,void 0,void 0,void 0);function r(t,i){for(var e=0;e0&&void 0!==arguments[0]?arguments[0]:null,i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null,e=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null,n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:null;return this.x1=null==t?this.x1:t,this.y1=null==i?this.y1:i,this.x2=null==e?this.x2:e,this.y2=null==n?this.y2:n,this}},{key:"width",value:function(){return Math.abs(this.x2-this.x1)}},{key:"height",value:function(){return Math.abs(this.y2-this.y1)}},{key:"resize",value:function(t,i){var e=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[0,0],n=this.x1+this.width()*e[0],o=this.y1+this.height()*e[1];return this.x1=n-t*e[0],this.y1=o-i*e[1],this.x2=this.x1+t,this.y2=this.y1+i,this}},{key:"scale",value:function(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[0,0],e=this.width()*t,n=this.height()*t;return this.resize(e,n,i),this}},{key:"move",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null,i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null,e=this.width(),n=this.height();return t=null===t?this.x1:t,i=null===i?this.y1:i,this.x1=t,this.y1=i,this.x2=t+e,this.y2=i+n,this}},{key:"getRelativePoint",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:[0,0],i=this.width()*t[0],e=this.height()*t[1];return[i,e]}},{key:"getAbsolutePoint",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:[0,0],i=this.x1+this.width()*t[0],e=this.y1+this.height()*t[1];return[i,e]}},{key:"constrainToRatio",value:function(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[0,0],e=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"height";if(null!==t){switch(this.width(),this.height(),e){case"height":this.resize(this.width(),this.width()*t,i);break;case"width":this.resize(1*this.height()/t,this.height(),i);break;default:this.resize(this.width(),this.width()*t,i)}return this}}},{key:"constrainToBoundary",value:function(t,i){var e=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[0,0],n=this.getAbsolutePoint(e),s=o(n,2),a=s[0],r=s[1],h=a,l=r,d=t-a,c=i-r,u=-2*e[0]+1,p=-2*e[1]+1,v=null,m=null;switch(u){case-1:v=h;break;case 0:v=2*Math.min(h,d);break;case 1:v=d}switch(p){case-1:m=l;break;case 0:m=2*Math.min(l,c);break;case 1:m=c}if(this.width()>v){var g=v/this.width();this.scale(g,e)}if(this.height()>m){var f=m/this.height();this.scale(f,e)}return this}},{key:"constrainToSize",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null,i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null,e=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null,n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:null,o=arguments.length>4&&void 0!==arguments[4]?arguments[4]:[0,0],s=arguments.length>5&&void 0!==arguments[5]?arguments[5]:null;if(s&&(s>1?(t=1*i/s,n=e*s):s<1&&(i=t*s,e=1*n/s)),t&&this.width()>t){var a=t,r=null===s?this.height():i;this.resize(a,r,o)}if(i&&this.height()>i){var h=null===s?this.width():t,l=i;this.resize(h,l,o)}if(e&&this.width()2&&void 0!==arguments[2]&&arguments[2];return t(this,s),n(this,(s.__proto__||Object.getPrototypeOf(s)).call(this,i,e,o))}return function(t,i){if("function"!=typeof i&&null!==i)throw new TypeError("Super expression must either be null or a function, not "+typeof i);t.prototype=Object.create(i&&i.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),i&&(Object.setPrototypeOf?Object.setPrototypeOf(t,i):t.__proto__=i)}(s,o),i(s,[{key:"getValue",value:function(t){return e(s.prototype.__proto__||Object.getPrototypeOf(s.prototype),"getValue",this).call(this,t)}},{key:"setImage",value:function(t){return e(s.prototype.__proto__||Object.getPrototypeOf(s.prototype),"setImage",this).call(this,t)}},{key:"destroy",value:function(){return e(s.prototype.__proto__||Object.getPrototypeOf(s.prototype),"destroy",this).call(this)}},{key:"moveTo",value:function(t,i){return this.box.move(t,i),this.redraw(),null!==this.options.onCropEnd&&this.options.onCropEnd(this.getValue()),this}},{key:"resizeTo",value:function(t,i){var e=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[.5,.5];return this.box.resize(t,i,e),this.redraw(),null!==this.options.onCropEnd&&this.options.onCropEnd(this.getValue()),this}},{key:"scaleBy",value:function(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[.5,.5];return this.box.scale(t,i),this.redraw(),null!==this.options.onCropEnd&&this.options.onCropEnd(this.getValue()),this}},{key:"reset",value:function(){return this.box=this.initializeBox(this.options),this.redraw(),null!==this.options.onCropEnd&&this.options.onCropEnd(this.getValue()),this}}]),s}(function(){function e(i,n){var o=this,s=arguments.length>2&&void 0!==arguments[2]&&arguments[2];if(t(this,e),this.options=e.parseOptions(n||{}),!i.nodeName&&null==(i=document.querySelector(i)))throw"Unable to find element.";if(!i.getAttribute("src"))throw"Image src not provided.";this._initialized=!1,this._restore={parent:i.parentNode,element:i},s||(0===i.width||0===i.height?i.onload=function(){o.initialize(i)}:this.initialize(i))}return i(e,[{key:"initialize",value:function(t){this.createDOM(t),this.options.convertToPixels(this.cropperEl),this.attachHandlerEvents(),this.attachRegionEvents(),this.attachOverlayEvents(),this.box=this.initializeBox(this.options),this.redraw(),this._initialized=!0,null!==this.options.onInitialize&&this.options.onInitialize(this)}},{key:"createDOM",value:function(t){var i;this.containerEl=document.createElement("div"),this.containerEl.className="croppr-container",this.eventBus=this.containerEl,(i=this.containerEl).addEventListener("touchstart",r),i.addEventListener("touchend",r),i.addEventListener("touchmove",r),this.cropperEl=document.createElement("div"),this.cropperEl.className="croppr",this.imageEl=document.createElement("img"),this.imageEl.setAttribute("src",t.getAttribute("src")),this.imageEl.setAttribute("alt",t.getAttribute("alt")),this.imageEl.className="croppr-image",this.imageClippedEl=this.imageEl.cloneNode(),this.imageClippedEl.className="croppr-imageClipped",this.regionEl=document.createElement("div"),this.regionEl.className="croppr-region",this.overlayEl=document.createElement("div"),this.overlayEl.className="croppr-overlay";var e=document.createElement("div");e.className="croppr-handleContainer",this.handles=[];for(var n=0;n>31,l=r[1]-t.cropperEl.offsetHeight/2>>31,d=(h^l)+l+l+4,c=-2*d+8,u=0;uo.width&&(e=o.width),n<0?n=0:n>o.height&&(n=o.height);var s=this.activeHandle.originPoint.slice(),r=this.activeHandle.originX,h=this.activeHandle.originY,l=this.activeHandle.handle,d=1===l.constraints[0],c=1===l.constraints[1],u=1===l.constraints[2],p=1===l.constraints[3],v=(p||c)&&(d||u),m=p||c?r:this.box.x1,g=p||c?r:this.box.x2,f=d||u?h:this.box.y1,w=d||u?h:this.box.y2;m=p?e:m,g=c?e:g,f=d?n:f,w=u?n:w;var _=!1,b=!1;if((p||c)&&(_=p?e>r:eh:nx.y1+k*x.width()||nMath.ceil(o.width)||x.y2>Math.ceil(o.height)||(this.box=x,this.redraw(),null!==this.options.onCropMove&&this.options.onCropMove(this.getValue()))}},{key:"onHandleMoveEnd",value:function(t){null!==this.options.onCropEnd&&this.options.onCropEnd(this.getValue())}},{key:"onRegionMoveStart",value:function(t){var i=t.detail,e=i.mouseX,n=i.mouseY,o=this.cropperEl.getBoundingClientRect();e-=o.left,n-=o.top,this.currentMove={offsetX:e-this.box.x1,offsetY:n-this.box.y1},null!==this.options.onCropStart&&this.options.onCropStart(this.getValue())}},{key:"onRegionMoveMoving",value:function(t){var i=t.detail,e=i.mouseX,n=i.mouseY,o=this.currentMove,s=o.offsetX,a=o.offsetY,r=this.cropperEl.getBoundingClientRect();e-=r.left,n-=r.top,this.box.move(e-s,n-a),this.box.x1<0&&this.box.move(0,null),this.box.x2>r.width&&this.box.move(r.width-this.box.width(),null),this.box.y1<0&&this.box.move(null,0),this.box.y2>r.height&&this.box.move(null,r.height-this.box.height()),this.redraw(),null!==this.options.onCropMove&&this.options.onCropMove(this.getValue())}},{key:"onRegionMoveEnd",value:function(t){null!==this.options.onCropEnd&&this.options.onCropEnd(this.getValue())}},{key:"getValue",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null;if(null===t&&(t=this.options.returnMode),"real"==t){var i=this.imageEl.naturalWidth,e=this.imageEl.naturalHeight,n=this.imageEl.getBoundingClientRect(),o=n.width,s=n.height,a=i/o,r=e/s;return{x:Math.round(this.box.x1*a),y:Math.round(this.box.y1*r),width:Math.round(this.box.width()*a),height:Math.round(this.box.height()*r)}}if("ratio"==t){var h=this.imageEl.getBoundingClientRect(),d=h.width,c=h.height;return{x:l(this.box.x1/d,3),y:l(this.box.y1/c,3),width:l(this.box.width()/d,3),height:l(this.box.height()/c,3)}}if("raw"==t)return{x:Math.round(this.box.x1),y:Math.round(this.box.y1),width:Math.round(this.box.width()),height:Math.round(this.box.height())}}}],[{key:"parseOptions",value:function(t){var i={aspectRatio:null,maxSize:{width:null,height:null},minSize:{width:null,height:null},startSize:{width:100,height:100,unit:"%"},returnMode:"real",onInitialize:null,onCropStart:null,onCropMove:null,onCropEnd:null},e=null;void 0!==t.aspectRatio&&("number"==typeof t.aspectRatio?e=t.aspectRatio:t.aspectRatio instanceof Array&&(e=t.aspectRatio[1]/t.aspectRatio[0]));var n=null;void 0!==t.maxSize&&null!==t.maxSize&&(n={width:t.maxSize[0]||null,height:t.maxSize[1]||null,unit:t.maxSize[2]||"px"});var o=null;void 0!==t.minSize&&null!==t.minSize&&(o={width:t.minSize[0]||null,height:t.minSize[1]||null,unit:t.minSize[2]||"px"});var s=null;void 0!==t.startSize&&null!==t.startSize&&(s={width:t.startSize[0]||null,height:t.startSize[1]||null,unit:t.startSize[2]||"%"});var a=null;"function"==typeof t.onInitialize&&(a=t.onInitialize);var r=null;"function"==typeof t.onCropStart&&(r=t.onCropStart);var h=null;"function"==typeof t.onCropEnd&&(h=t.onCropEnd);var l=null;"function"==typeof t.onUpdate&&(console.warn("Croppr.js: `onUpdate` is deprecated and will be removed in the next major release. Please use `onCropMove` or `onCropEnd` instead."),l=t.onUpdate),"function"==typeof t.onCropMove&&(l=t.onCropMove);var d=null;if(void 0!==t.returnMode){var c=t.returnMode.toLowerCase();if(-1===["real","ratio","raw"].indexOf(c))throw"Invalid return mode.";d=c}var u=function(t,i){return null!==t?t:i};return{aspectRatio:u(e,i.aspectRatio),maxSize:u(n,i.maxSize),minSize:u(o,i.minSize),startSize:u(s,i.startSize),returnMode:u(d,i.returnMode),onInitialize:u(a,i.onInitialize),onCropStart:u(r,i.onCropStart),onCropMove:u(l,i.onCropMove),onCropEnd:u(h,i.onCropEnd),convertToPixels:function(t){for(var i=t.offsetWidth,e=t.offsetHeight,n=["maxSize","minSize","startSize"],o=0;o1&&void 0!==arguments[1]?arguments[1]:null;return i&&i-t>=-1&&i-t<=1?i:Math.round(t)}},{key:"adjustPosition",value:function(t,i,e){return t+i>e?e-i:Math.round(t)}}])&&r(i.prototype,e),n&&r(i,n),t}();var u=t({render:function(){var t=this,i=t.$createElement,e=t._self._c||i;return t.isOpen?e("div",{staticClass:"k-dialog",on:{click:t.cancel}},[e("div",{staticClass:"k-dialog-box",style:t.dialog_width,attrs:{"data-size":t.size},on:{click:function(t){t.stopPropagation()}}},[t.notification?e("div",{staticClass:"k-dialog-notification",attrs:{"data-theme":t.notification.type}},[e("p",[t._v(t._s(t.notification.message))]),t._v(" "),e("k-button",{attrs:{icon:"cancel"},on:{click:function(i){t.notification=null}}})],1):t._e(),t._v(" "),t.image?e("div",{staticClass:"k-dialog-body"},[t.spinner?e("div",{staticClass:"preload"},[t._m(0),t._v(" "),e("footer",{staticClass:"preload-dialog-footer"},[t._t("footer",[e("k-button-group",[e("k-button",{staticClass:"k-dialog-button-cancel",attrs:{icon:"cancel"},on:{click:t.cancel}},[t._v("\n "+t._s(t.$t("cancel"))+"\n ")])],1)])],2)]):t._e(),t._v(" "),e("img",{attrs:{src:t.image.url,id:"croppr"}})]):t._e(),t._v(" "),e("footer",{staticClass:"k-dialog-footer"},[t._t("footer",[e("k-button-group",[e("k-button",{staticClass:"k-dialog-button-cancel",attrs:{icon:"cancel"},on:{click:t.cancel}},[t._v("\n "+t._s(t.$t("cancel"))+"\n ")]),t._v(" "),e("k-button",{staticClass:"k-dialog-button-submit",attrs:{icon:t.icon,theme:t.theme},on:{click:t.submit}},[t._v("\n "+t._s(t.button||t.$t("confirm"))+"\n ")])],1)])],2)])]):t._e()},staticRenderFns:[function(){var t=this.$createElement,i=this._self._c||t;return i("div",{staticClass:"spinner"},[i("div",{staticClass:"bounce1"}),this._v(" "),i("div",{staticClass:"bounce2"}),this._v(" "),i("div",{staticClass:"bounce3"})])}]},void 0,{extends:"k-dialog",props:{image:{type:Object,default:null},clip:{type:Object,default:null}},data:function(){return{cropprFacade:null,dialog_width:null,spinner:!0,freezeDialog:!1,was_moved:!1}},watch:{isOpen:function(t,i){var e=this;!0===t?(this.setDialogWidth(),this.showSpinner(),this.$nextTick(function(){var t=document.getElementById("croppr");t.addEventListener("load",e.hideSpinner,!1),t.complete&&e.hideSpinner();try{e.cropprFacade=new c({el:t,original_dimensions:e.image.dimensions,clip:e.clip,saved:e.image.clip,events:{onCropStart:function(){e.freezeDialog=!0,e.was_moved=!0},onCropEnd:function(){setTimeout(function(){e.freezeDialog=!1},200)}}}),window.addEventListener("resize",e.showSpinner,!1),window.addEventListener("resize",e.resizeDialog,!1)}catch(t){e.cancel(),console.error(e.image.id+": "+t.message),e.$store.dispatch("notification/error",t.message)}})):(window.removeEventListener("resize",this.showSpinner,!1),window.removeEventListener("resize",this.resizeDialog,!1))}},methods:{cancel:function(){this.freezeDialog||(this.$emit("cancel"),this.close())},remToPx:function(){return(arguments.length>0&&void 0!==arguments[0]?arguments[0]:1)*parseInt(getComputedStyle(document.documentElement).fontSize)},submit:function(){this.was_moved&&(this.$emit("submit",{id:this.image.id,clip:this.cropprFacade.getCropArea()}),this.was_moved=!1),this.close()},setDialogWidth:function(){var t=window.innerWidth-this.remToPx(6),i=window.innerHeight-this.remToPx(12),e=d({srcWidth:this.image.dimensions.width,srcHeight:this.image.dimensions.height,maxWidth:t,maxHeight:i}),n=this.image.dimensions.width;(this.image.dimensions.width>t||this.image.dimensions.height>i)&&(n=e.width),this.dialog_width="width: "+n+"px;"},resizeDialog:function(t){var i,e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:100;return function(){for(var n=this,o=arguments.length,s=new Array(o),a=0;a1,text:i.text,link:i.link,info:i.info,image:i.image,icon:i.icon,id:i.id,resizable:i.resizable,disabled:i.disabled},on:{openclipdialog:t.openClipDialog}},[t.disabled?t._e():e("k-button",{attrs:{slot:"options",tooltip:t.$t("remove"),icon:"remove"},on:{click:function(i){return t.remove(n)}},slot:"options"})],1)}),1)]:e("k-empty",{attrs:{layout:t.layout,icon:"image","data-invalid":t.isInvalid},on:{click:t.open}},[t._v("\n "+t._s(t.empty||t.$t("field.files.empty"))+"\n ")]),t._v(" "),e("k-files-dialog",{ref:"selector",on:{submit:t.select}}),t._v(" "),e("k-upload",{ref:"fileUpload",on:{success:t.selectUpload}}),t._v(" "),e("k-clip-dialog",{ref:"clip",attrs:{size:"large",image:t.clip_image,clip:t.clip},on:{submit:t.clippedArea}})],2)},staticRenderFns:[]},void 0,{extends:"k-files-field",props:{clip:{type:Object,default:null}},data:function(){return{clip_image:{}}},computed:{elements:function(){var t={cards:{list:"k-cards",item:"k-clip-card"},list:{list:"k-list",item:"k-clip-list-item"}};return t[this.layout]?t[this.layout]:t.list}},methods:{openClipDialog:function(t){this.clip_image=this.value.find(function(i){return i.id===t}),this.$refs.clip.open()},clippedArea:function(t){this.clip_image.clip=t.clip,this.onInput(),this.getPreview(t.id,t.clip)},getPreview:function(t,i){var e=this;this.$api.post(this.endpoints.field+"/preview",{id:t,width:i.width,height:i.height,top:i.top,left:i.left}).then(function(i){if(!i.image)throw new Error("image clip: no image for preview received.");var n=e.name,o=e.$store.state.content.current,s=e.$store.getters["content/values"](o)[n];s?(s.find(function(i){return i.id===t}).image=i.image,e.$store.dispatch("content/update",[n,s,o])):e.selected.find(function(i){return i.id===t}).image=i.image}).catch(function(t){console.log(t)})}}},void 0,!1,void 0,void 0,void 0),e=t({render:function(){var t=this,i=t.$createElement,e=t._self._c||i;return e("figure",t._g({staticClass:"k-card"},t.$listeners),[t.sortable?e("k-sort-handle"):t._e(),t._v(" "),t.resizable&&!t.disabled?e("k-clip-handle",{on:{clicked:t.openClipDialog}}):t._e(),t._v(" "),e(t.wrapper,{tag:"component",attrs:{to:t.link,target:t.target}},[t.imageOptions?e("k-image",t._b({staticClass:"k-card-image"},"k-image",t.imageOptions,!1)):e("span",{staticClass:"k-card-icon",style:"padding-bottom:"+t.ratioPadding},[e("k-icon",t._b({},"k-icon",t.icon,!1))],1),t._v(" "),e("figcaption",{staticClass:"k-card-content"},[e("span",{staticClass:"k-card-text",attrs:{"data-noinfo":!t.info}},[t._v(t._s(t.text))]),t._v(" "),t.info?e("span",{staticClass:"k-card-info",domProps:{innerHTML:t._s(t.info)}}):t._e()])],1),t._v(" "),e("nav",{staticClass:"k-card-options"},[t.flag?e("k-button",t._b({staticClass:"k-card-options-button",on:{click:t.flag.click}},"k-button",t.flag,!1)):t._e(),t._v(" "),t._t("options",[t.options?e("k-button",{staticClass:"k-card-options-button",attrs:{tooltip:t.$t("options"),icon:"dots"},on:{click:function(i){return i.stopPropagation(),t.$refs.dropdown.toggle()}}}):t._e(),t._v(" "),e("k-dropdown-content",{ref:"dropdown",staticClass:"k-card-options-dropdown",attrs:{options:t.options,align:"right"},on:{action:function(i){return t.$emit("action",i)}}})])],2)],1)},staticRenderFns:[]},void 0,{extends:"k-card",props:{id:String,resizable:Boolean,disabled:Boolean},methods:{openClipDialog:function(){this.$emit("openclipdialog",this.id)}}},"data-v-290c02b0",!1,void 0,void 0,void 0),n="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgBAMAAAAQtmoLAAAAMFBMVEUAAAAzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzPzX0yTAAAAD3RSTlMAQIDAEPDQYLAgoFBwMJALzXfXAAAAsElEQVRYw+3TPQoCMRCG4RgXVEQwrVXwFhbilt7AQu+QvYl7BQ9h72XshUUtP+NPQImBDAq7Webtn2I+GMFxXG1JVAzaDjJlm+CivMrvoINQOhnwSPpHG2jarAsGDH4BOREs1zQwMpiRwB44HwhAwlaV0SDb4t5GiOEqCvTxbG5lEQO6eHUErtHAVVDBKU3Qm76lG/MPH2CnbHkIhBonAwbKy7ijY3OzMmg74Djuj90AekzAtvxv03QAAAAASUVORK5CYII=",o=t({render:function(){var t=this.$createElement,i=this._self._c||t;return i("span",{staticClass:"k-sort-handle clip",attrs:{"aria-hidden":"true"}},[i("img",{staticClass:"clipicon",attrs:{src:n,alt:"Clip"},on:{click:this.open}})])},staticRenderFns:[]},void 0,{extends:"k-sort-handle",methods:{open:function(){this.$emit("clicked")}}},"data-v-c59f6268",!1,void 0,void 0,void 0),s=t({render:function(){var t=this,i=t.$createElement,e=t._self._c||i;return e(t.element,t._g({tag:"component",staticClass:"k-list-item"},t.$listeners),[t.sortable?e("k-sort-handle"):t._e(),t._v(" "),e("k-link",{directives:[{name:"tab",rawName:"v-tab"}],staticClass:"k-list-item-content",attrs:{to:t.link,target:t.target}},[e("span",{staticClass:"k-list-item-image"},[t.imageOptions?e("k-image",t._b({},"k-image",t.imageOptions,!1)):e("k-icon",t._b({},"k-icon",t.icon,!1))],1),t._v(" "),e("span",{staticClass:"k-list-item-text"},[e("em",[t._v(t._s(t.text))]),t._v(" "),t.info?e("small",{domProps:{innerHTML:t._s(t.info)}}):t._e()])]),t._v(" "),e("nav",{staticClass:"k-list-item-options"},[t.resizable&&!t.disabled?e("k-clip-button",{on:{clicked:t.openClipDialog}}):t._e(),t._v(" "),t._t("options",[t.flag?e("k-button",t._b({on:{click:t.flag.click}},"k-button",t.flag,!1)):t._e(),t._v(" "),t.options?e("k-button",{staticClass:"k-list-item-toggle",attrs:{tooltip:t.$t("options"),icon:"dots",alt:"Options"},on:{click:function(i){return i.stopPropagation(),t.$refs.options.toggle()}}}):t._e(),t._v(" "),e("k-dropdown-content",{ref:"options",attrs:{options:t.options,align:"right"},on:{action:function(i){return t.$emit("action",i)}}})])],2)],1)},staticRenderFns:[]},void 0,{extends:"k-list-item",props:{id:String,resizable:Boolean,disabled:Boolean},methods:{openClipDialog:function(){this.$emit("openclipdialog",this.id)}}},"data-v-9cf224f4",!1,void 0,void 0,void 0),a=t({render:function(){var t=this.$createElement,i=this._self._c||t;return i("span",{staticClass:"k-button clip",attrs:{"aria-hidden":"true"}},[i("img",{staticClass:"clipicon",attrs:{src:n,alt:"Clip"},on:{click:this.open}})])},staticRenderFns:[]},void 0,{extends:"k-sort-handle",methods:{open:function(){this.$emit("clicked")}}},"data-v-7d15b97a",!1,void 0,void 0,void 0);function r(t,i){for(var e=0;e0&&void 0!==arguments[0]?arguments[0]:null,i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null,e=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null,n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:null;return this.x1=null==t?this.x1:t,this.y1=null==i?this.y1:i,this.x2=null==e?this.x2:e,this.y2=null==n?this.y2:n,this}},{key:"width",value:function(){return Math.abs(this.x2-this.x1)}},{key:"height",value:function(){return Math.abs(this.y2-this.y1)}},{key:"resize",value:function(t,i){var e=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[0,0],n=this.x1+this.width()*e[0],o=this.y1+this.height()*e[1];return this.x1=n-t*e[0],this.y1=o-i*e[1],this.x2=this.x1+t,this.y2=this.y1+i,this}},{key:"scale",value:function(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[0,0],e=this.width()*t,n=this.height()*t;return this.resize(e,n,i),this}},{key:"move",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null,i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null,e=this.width(),n=this.height();return t=null===t?this.x1:t,i=null===i?this.y1:i,this.x1=t,this.y1=i,this.x2=t+e,this.y2=i+n,this}},{key:"getRelativePoint",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:[0,0],i=this.width()*t[0],e=this.height()*t[1];return[i,e]}},{key:"getAbsolutePoint",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:[0,0],i=this.x1+this.width()*t[0],e=this.y1+this.height()*t[1];return[i,e]}},{key:"constrainToRatio",value:function(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[0,0],e=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"height";if(null!==t){switch(this.width(),this.height(),e){case"height":this.resize(this.width(),this.width()*t,i);break;case"width":this.resize(1*this.height()/t,this.height(),i);break;default:this.resize(this.width(),this.width()*t,i)}return this}}},{key:"constrainToBoundary",value:function(t,i){var e=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[0,0],n=this.getAbsolutePoint(e),s=o(n,2),a=s[0],r=s[1],h=a,l=r,d=t-a,c=i-r,u=-2*e[0]+1,p=-2*e[1]+1,v=null,m=null;switch(u){case-1:v=h;break;case 0:v=2*Math.min(h,d);break;case 1:v=d}switch(p){case-1:m=l;break;case 0:m=2*Math.min(l,c);break;case 1:m=c}if(this.width()>v){var g=v/this.width();this.scale(g,e)}if(this.height()>m){var f=m/this.height();this.scale(f,e)}return this}},{key:"constrainToSize",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null,i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null,e=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null,n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:null,o=arguments.length>4&&void 0!==arguments[4]?arguments[4]:[0,0],s=arguments.length>5&&void 0!==arguments[5]?arguments[5]:null;if(s&&(s>1?(t=1*i/s,n=e*s):s<1&&(i=t*s,e=1*n/s)),t&&this.width()>t){var a=t,r=null===s?this.height():i;this.resize(a,r,o)}if(i&&this.height()>i){var h=null===s?this.width():t,l=i;this.resize(h,l,o)}if(e&&this.width()2&&void 0!==arguments[2]&&arguments[2];return t(this,s),n(this,(s.__proto__||Object.getPrototypeOf(s)).call(this,i,e,o))}return function(t,i){if("function"!=typeof i&&null!==i)throw new TypeError("Super expression must either be null or a function, not "+typeof i);t.prototype=Object.create(i&&i.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),i&&(Object.setPrototypeOf?Object.setPrototypeOf(t,i):t.__proto__=i)}(s,o),i(s,[{key:"getValue",value:function(t){return e(s.prototype.__proto__||Object.getPrototypeOf(s.prototype),"getValue",this).call(this,t)}},{key:"setImage",value:function(t){return e(s.prototype.__proto__||Object.getPrototypeOf(s.prototype),"setImage",this).call(this,t)}},{key:"destroy",value:function(){return e(s.prototype.__proto__||Object.getPrototypeOf(s.prototype),"destroy",this).call(this)}},{key:"moveTo",value:function(t,i){return this.box.move(t,i),this.redraw(),null!==this.options.onCropEnd&&this.options.onCropEnd(this.getValue()),this}},{key:"resizeTo",value:function(t,i){var e=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[.5,.5];return this.box.resize(t,i,e),this.redraw(),null!==this.options.onCropEnd&&this.options.onCropEnd(this.getValue()),this}},{key:"scaleBy",value:function(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[.5,.5];return this.box.scale(t,i),this.redraw(),null!==this.options.onCropEnd&&this.options.onCropEnd(this.getValue()),this}},{key:"reset",value:function(){return this.box=this.initializeBox(this.options),this.redraw(),null!==this.options.onCropEnd&&this.options.onCropEnd(this.getValue()),this}}]),s}(function(){function e(i,n){var o=this,s=arguments.length>2&&void 0!==arguments[2]&&arguments[2];if(t(this,e),this.options=e.parseOptions(n||{}),!i.nodeName&&null==(i=document.querySelector(i)))throw"Unable to find element.";if(!i.getAttribute("src"))throw"Image src not provided.";this._initialized=!1,this._restore={parent:i.parentNode,element:i},s||(0===i.width||0===i.height?i.onload=function(){o.initialize(i)}:this.initialize(i))}return i(e,[{key:"initialize",value:function(t){this.createDOM(t),this.options.convertToPixels(this.cropperEl),this.attachHandlerEvents(),this.attachRegionEvents(),this.attachOverlayEvents(),this.box=this.initializeBox(this.options),this.redraw(),this._initialized=!0,null!==this.options.onInitialize&&this.options.onInitialize(this)}},{key:"createDOM",value:function(t){var i;this.containerEl=document.createElement("div"),this.containerEl.className="croppr-container",this.eventBus=this.containerEl,(i=this.containerEl).addEventListener("touchstart",r),i.addEventListener("touchend",r),i.addEventListener("touchmove",r),this.cropperEl=document.createElement("div"),this.cropperEl.className="croppr",this.imageEl=document.createElement("img"),this.imageEl.setAttribute("src",t.getAttribute("src")),this.imageEl.setAttribute("alt",t.getAttribute("alt")),this.imageEl.className="croppr-image",this.imageClippedEl=this.imageEl.cloneNode(),this.imageClippedEl.className="croppr-imageClipped",this.regionEl=document.createElement("div"),this.regionEl.className="croppr-region",this.overlayEl=document.createElement("div"),this.overlayEl.className="croppr-overlay";var e=document.createElement("div");e.className="croppr-handleContainer",this.handles=[];for(var n=0;n>31,l=r[1]-t.cropperEl.offsetHeight/2>>31,d=(h^l)+l+l+4,c=-2*d+8,u=0;uo.width&&(e=o.width),n<0?n=0:n>o.height&&(n=o.height);var s=this.activeHandle.originPoint.slice(),r=this.activeHandle.originX,h=this.activeHandle.originY,l=this.activeHandle.handle,d=1===l.constraints[0],c=1===l.constraints[1],u=1===l.constraints[2],p=1===l.constraints[3],v=(p||c)&&(d||u),m=p||c?r:this.box.x1,g=p||c?r:this.box.x2,f=d||u?h:this.box.y1,w=d||u?h:this.box.y2;m=p?e:m,g=c?e:g,f=d?n:f,w=u?n:w;var _=!1,b=!1;if((p||c)&&(_=p?e>r:eh:nx.y1+k*x.width()||nMath.ceil(o.width)||x.y2>Math.ceil(o.height)||(this.box=x,this.redraw(),null!==this.options.onCropMove&&this.options.onCropMove(this.getValue()))}},{key:"onHandleMoveEnd",value:function(t){null!==this.options.onCropEnd&&this.options.onCropEnd(this.getValue())}},{key:"onRegionMoveStart",value:function(t){var i=t.detail,e=i.mouseX,n=i.mouseY,o=this.cropperEl.getBoundingClientRect();e-=o.left,n-=o.top,this.currentMove={offsetX:e-this.box.x1,offsetY:n-this.box.y1},null!==this.options.onCropStart&&this.options.onCropStart(this.getValue())}},{key:"onRegionMoveMoving",value:function(t){var i=t.detail,e=i.mouseX,n=i.mouseY,o=this.currentMove,s=o.offsetX,a=o.offsetY,r=this.cropperEl.getBoundingClientRect();e-=r.left,n-=r.top,this.box.move(e-s,n-a),this.box.x1<0&&this.box.move(0,null),this.box.x2>r.width&&this.box.move(r.width-this.box.width(),null),this.box.y1<0&&this.box.move(null,0),this.box.y2>r.height&&this.box.move(null,r.height-this.box.height()),this.redraw(),null!==this.options.onCropMove&&this.options.onCropMove(this.getValue())}},{key:"onRegionMoveEnd",value:function(t){null!==this.options.onCropEnd&&this.options.onCropEnd(this.getValue())}},{key:"getValue",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null;if(null===t&&(t=this.options.returnMode),"real"==t){var i=this.imageEl.naturalWidth,e=this.imageEl.naturalHeight,n=this.imageEl.getBoundingClientRect(),o=n.width,s=n.height,a=i/o,r=e/s;return{x:Math.round(this.box.x1*a),y:Math.round(this.box.y1*r),width:Math.round(this.box.width()*a),height:Math.round(this.box.height()*r)}}if("ratio"==t){var h=this.imageEl.getBoundingClientRect(),d=h.width,c=h.height;return{x:l(this.box.x1/d,3),y:l(this.box.y1/c,3),width:l(this.box.width()/d,3),height:l(this.box.height()/c,3)}}if("raw"==t)return{x:Math.round(this.box.x1),y:Math.round(this.box.y1),width:Math.round(this.box.width()),height:Math.round(this.box.height())}}}],[{key:"parseOptions",value:function(t){var i={aspectRatio:null,maxSize:{width:null,height:null},minSize:{width:null,height:null},startSize:{width:100,height:100,unit:"%"},returnMode:"real",onInitialize:null,onCropStart:null,onCropMove:null,onCropEnd:null},e=null;void 0!==t.aspectRatio&&("number"==typeof t.aspectRatio?e=t.aspectRatio:t.aspectRatio instanceof Array&&(e=t.aspectRatio[1]/t.aspectRatio[0]));var n=null;void 0!==t.maxSize&&null!==t.maxSize&&(n={width:t.maxSize[0]||null,height:t.maxSize[1]||null,unit:t.maxSize[2]||"px"});var o=null;void 0!==t.minSize&&null!==t.minSize&&(o={width:t.minSize[0]||null,height:t.minSize[1]||null,unit:t.minSize[2]||"px"});var s=null;void 0!==t.startSize&&null!==t.startSize&&(s={width:t.startSize[0]||null,height:t.startSize[1]||null,unit:t.startSize[2]||"%"});var a=null;"function"==typeof t.onInitialize&&(a=t.onInitialize);var r=null;"function"==typeof t.onCropStart&&(r=t.onCropStart);var h=null;"function"==typeof t.onCropEnd&&(h=t.onCropEnd);var l=null;"function"==typeof t.onUpdate&&(console.warn("Croppr.js: `onUpdate` is deprecated and will be removed in the next major release. Please use `onCropMove` or `onCropEnd` instead."),l=t.onUpdate),"function"==typeof t.onCropMove&&(l=t.onCropMove);var d=null;if(void 0!==t.returnMode){var c=t.returnMode.toLowerCase();if(-1===["real","ratio","raw"].indexOf(c))throw"Invalid return mode.";d=c}var u=function(t,i){return null!==t?t:i};return{aspectRatio:u(e,i.aspectRatio),maxSize:u(n,i.maxSize),minSize:u(o,i.minSize),startSize:u(s,i.startSize),returnMode:u(d,i.returnMode),onInitialize:u(a,i.onInitialize),onCropStart:u(r,i.onCropStart),onCropMove:u(l,i.onCropMove),onCropEnd:u(h,i.onCropEnd),convertToPixels:function(t){for(var i=t.offsetWidth,e=t.offsetHeight,n=["maxSize","minSize","startSize"],o=0;o1&&void 0!==arguments[1]?arguments[1]:null;return i&&i-t>=-1&&i-t<=1?i:Math.round(t)}},{key:"adjustPosition",value:function(t,i,e){return t+i>e?e-i:Math.round(t)}}])&&r(i.prototype,e),n&&r(i,n),t}();var u=t({render:function(){var t=this,i=t.$createElement,e=t._self._c||i;return e("k-overlay",{ref:"overlay",attrs:{autofocus:t.autofocus,centered:!0},on:{ready:function(i){return t.$emit("ready")}}},[e("div",{ref:"dialog",staticClass:"k-dialog",class:t.$vnode.data.staticClass,style:t.dialog_width,attrs:{"data-size":t.size},on:{mousedown:function(t){t.stopPropagation()}}},[t.notification?e("div",{staticClass:"k-dialog-notification",attrs:{"data-theme":t.notification.type}},[e("p",[t._v(t._s(t.notification.message))]),t._v(" "),e("k-button",{attrs:{icon:"cancel"},on:{click:function(i){t.notification=null}}})],1):t._e(),t._v(" "),t.image?e("div",{staticClass:"k-dialog-body"},[t.spinner?e("div",{staticClass:"preload"},[e("div",{staticClass:"spinner"},[e("div",{staticClass:"bounce1"}),t._v(" "),e("div",{staticClass:"bounce2"}),t._v(" "),e("div",{staticClass:"bounce3"})]),t._v(" "),e("footer",{staticClass:"preload-dialog-footer"},[t._t("footer",[e("k-button-group",[e("k-button",{staticClass:"k-dialog-button-cancel",attrs:{icon:"cancel"},on:{click:t.cancel}},[t._v("\n "+t._s(t.$t("cancel"))+"\n ")])],1)])],2)]):t._e(),t._v(" "),e("img",{attrs:{src:t.image.url,id:"croppr"}})]):t._e(),t._v(" "),e("footer",{staticClass:"k-dialog-footer"},[t._t("footer",[e("k-button-group",[e("k-button",{staticClass:"k-dialog-button-cancel",attrs:{icon:"cancel"},on:{click:t.cancel}},[t._v("\n "+t._s(t.$t("cancel"))+"\n ")]),t._v(" "),e("k-button",{staticClass:"k-dialog-button-submit",attrs:{icon:t.icon,theme:t.theme},on:{click:t.submit}},[t._v("\n "+t._s(t.button||t.$t("confirm"))+"\n ")])],1)])],2)])])},staticRenderFns:[]},void 0,{extends:"k-dialog",props:{image:{type:Object,default:null},clip:{type:Object,default:null}},data:function(){return{cropprFacade:null,dialog_width:null,spinner:!0,freezeDialog:!1,was_moved:!1}},created:function(){this.$on("ready",this.isOpen,!1)},destroyed:function(){this.$off("ready",this.isClosed,!1)},methods:{isOpen:function(){var t=this;this.setDialogWidth(),this.showSpinner(),this.$nextTick(function(){var i=document.getElementById("croppr");i.addEventListener("load",t.hideSpinner,!1),i.complete&&t.hideSpinner();try{t.cropprFacade=new c({el:i,original_dimensions:t.image.dimensions,clip:t.clip,saved:t.image.clip,events:{onCropStart:function(){t.freezeDialog=!0,t.was_moved=!0},onCropEnd:function(){setTimeout(function(){t.freezeDialog=!1},200)}}}),window.addEventListener("resize",t.showSpinner,!1),window.addEventListener("resize",t.resizeDialog,!1)}catch(i){t.cancel(),console.error(t.image.id+": "+i.message),t.$store.dispatch("notification/error",i.message)}})},isClosed:function(){window.removeEventListener("resize",this.showSpinner,!1),window.removeEventListener("resize",this.resizeDialog,!1)},cancel:function(){this.freezeDialog||(this.$emit("cancel"),this.close())},remToPx:function(){return(arguments.length>0&&void 0!==arguments[0]?arguments[0]:1)*parseInt(getComputedStyle(document.documentElement).fontSize)},submit:function(){this.was_moved&&(this.$emit("submit",{id:this.image.id,clip:this.cropprFacade.getCropArea()}),this.was_moved=!1),this.close()},setDialogWidth:function(){var t=window.innerWidth-this.remToPx(6),i=window.innerHeight-this.remToPx(12),e=d({srcWidth:this.image.dimensions.width,srcHeight:this.image.dimensions.height,maxWidth:t,maxHeight:i}),n=this.image.dimensions.width;(this.image.dimensions.width>t||this.image.dimensions.height>i)&&(n=e.width),this.dialog_width="width: "+n+"px;"},resizeDialog:function(t){var i,e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:100;return function(){for(var n=this,o=arguments.length,s=new Array(o),a=0;a -
-
-
-

{{ notification.message }}

- -
-
+ +
-
- +
+

{{ notification.message }}

+ +
-
- - - - {{ $t("cancel") }} - - - -
-
+
+
+ - - -
-
- - - - {{ $t("cancel") }} - - - {{ button || $t("confirm") }} - - - -
+
+ + + + {{ $t('cancel') }} + + + +
+ + +
+ +
+ + + + {{ $t('cancel') }} + + + {{ button || $t('confirm') }} + + + +
+
+ \ No newline at end of file