vue-cropper-next
Version:
[Cropperjs](https://github.com/fengyuanchen/cropperjs) as Vue3 component
1,204 lines • 56.9 kB
JavaScript
import { defineComponent as mi, onMounted as vi, onUnmounted as wi, ref as kt, openBlock as bi, createElementBlock as yi, createElementVNode as xi } from "vue";
/*!
* Cropper.js v1.5.13
* https://fengyuanchen.github.io/cropperjs
*
* Copyright 2015-present Chen Fengyuan
* Released under the MIT license
*
* Date: 2022-11-20T05:30:46.114Z
*/
function Pt(a, t) {
var e = Object.keys(a);
if (Object.getOwnPropertySymbols) {
var i = Object.getOwnPropertySymbols(a);
t && (i = i.filter(function(n) {
return Object.getOwnPropertyDescriptor(a, n).enumerable;
})), e.push.apply(e, i);
}
return e;
}
function Jt(a) {
for (var t = 1; t < arguments.length; t++) {
var e = arguments[t] != null ? arguments[t] : {};
t % 2 ? Pt(Object(e), !0).forEach(function(i) {
Mi(a, i, e[i]);
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(a, Object.getOwnPropertyDescriptors(e)) : Pt(Object(e)).forEach(function(i) {
Object.defineProperty(a, i, Object.getOwnPropertyDescriptor(e, i));
});
}
return a;
}
function vt(a) {
return vt = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(t) {
return typeof t;
} : function(t) {
return t && typeof Symbol == "function" && t.constructor === Symbol && t !== Symbol.prototype ? "symbol" : typeof t;
}, vt(a);
}
function Di(a, t) {
if (!(a instanceof t))
throw new TypeError("Cannot call a class as a function");
}
function Yt(a, t) {
for (var e = 0; e < t.length; e++) {
var i = t[e];
i.enumerable = i.enumerable || !1, i.configurable = !0, "value" in i && (i.writable = !0), Object.defineProperty(a, i.key, i);
}
}
function Ei(a, t, e) {
return t && Yt(a.prototype, t), e && Yt(a, e), Object.defineProperty(a, "prototype", {
writable: !1
}), a;
}
function Mi(a, t, e) {
return t in a ? Object.defineProperty(a, t, {
value: e,
enumerable: !0,
configurable: !0,
writable: !0
}) : a[t] = e, a;
}
function ti(a) {
return Ti(a) || Ci(a) || Oi(a) || Ni();
}
function Ti(a) {
if (Array.isArray(a))
return wt(a);
}
function Ci(a) {
if (typeof Symbol < "u" && a[Symbol.iterator] != null || a["@@iterator"] != null)
return Array.from(a);
}
function Oi(a, t) {
if (a) {
if (typeof a == "string")
return wt(a, t);
var e = Object.prototype.toString.call(a).slice(8, -1);
if (e === "Object" && a.constructor && (e = a.constructor.name), e === "Map" || e === "Set")
return Array.from(a);
if (e === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e))
return wt(a, t);
}
}
function wt(a, t) {
(t == null || t > a.length) && (t = a.length);
for (var e = 0, i = new Array(t); e < t; e++)
i[e] = a[e];
return i;
}
function Ni() {
throw new TypeError(`Invalid attempt to spread non-iterable instance.
In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`);
}
var dt = typeof window < "u" && typeof window.document < "u", P = dt ? window : {}, Ot = dt && P.document.documentElement ? "ontouchstart" in P.document.documentElement : !1, Nt = dt ? "PointerEvent" in P : !1, y = "cropper", At = "all", ii = "crop", ei = "move", ai = "zoom", $ = "e", q = "w", Q = "s", H = "n", it = "ne", et = "nw", at = "se", rt = "sw", bt = "".concat(y, "-crop"), Xt = "".concat(y, "-disabled"), R = "".concat(y, "-hidden"), zt = "".concat(y, "-hide"), Ai = "".concat(y, "-invisible"), ft = "".concat(y, "-modal"), yt = "".concat(y, "-move"), ot = "".concat(y, "Action"), ct = "".concat(y, "Preview"), Rt = "crop", ri = "move", ni = "none", xt = "crop", Dt = "cropend", Et = "cropmove", Mt = "cropstart", Ht = "dblclick", Ri = Ot ? "touchstart" : "mousedown", Si = Ot ? "touchmove" : "mousemove", Ii = Ot ? "touchend touchcancel" : "mouseup", Wt = Nt ? "pointerdown" : Ri, Ut = Nt ? "pointermove" : Si, Vt = Nt ? "pointerup pointercancel" : Ii, jt = "ready", Gt = "resize", $t = "wheel", Tt = "zoom", qt = "image/jpeg", _i = /^e|w|s|n|se|sw|ne|nw|all|crop|move|zoom$/, Bi = /^data:/, Li = /^data:image\/jpeg;base64,/, ki = /^img|canvas$/i, oi = 200, si = 100, Ft = {
// Define the view mode of the cropper
viewMode: 0,
// 0, 1, 2, 3
// Define the dragging mode of the cropper
dragMode: Rt,
// 'crop', 'move' or 'none'
// Define the initial aspect ratio of the crop box
initialAspectRatio: NaN,
// Define the aspect ratio of the crop box
aspectRatio: NaN,
// An object with the previous cropping result data
data: null,
// A selector for adding extra containers to preview
preview: "",
// Re-render the cropper when resize the window
responsive: !0,
// Restore the cropped area after resize the window
restore: !0,
// Check if the current image is a cross-origin image
checkCrossOrigin: !0,
// Check the current image's Exif Orientation information
checkOrientation: !0,
// Show the black modal
modal: !0,
// Show the dashed lines for guiding
guides: !0,
// Show the center indicator for guiding
center: !0,
// Show the white modal to highlight the crop box
highlight: !0,
// Show the grid background
background: !0,
// Enable to crop the image automatically when initialize
autoCrop: !0,
// Define the percentage of automatic cropping area when initializes
autoCropArea: 0.8,
// Enable to move the image
movable: !0,
// Enable to rotate the image
rotatable: !0,
// Enable to scale the image
scalable: !0,
// Enable to zoom the image
zoomable: !0,
// Enable to zoom the image by dragging touch
zoomOnTouch: !0,
// Enable to zoom the image by wheeling mouse
zoomOnWheel: !0,
// Define zoom ratio when zoom the image by wheeling mouse
wheelZoomRatio: 0.1,
// Enable to move the crop box
cropBoxMovable: !0,
// Enable to resize the crop box
cropBoxResizable: !0,
// Toggle drag mode between "crop" and "move" when click twice on the cropper
toggleDragModeOnDblclick: !0,
// Size limitation
minCanvasWidth: 0,
minCanvasHeight: 0,
minCropBoxWidth: 0,
minCropBoxHeight: 0,
minContainerWidth: oi,
minContainerHeight: si,
// Shortcuts of events
ready: null,
cropstart: null,
cropmove: null,
cropend: null,
crop: null,
zoom: null
}, Pi = '<div class="cropper-container" touch-action="none"><div class="cropper-wrap-box"><div class="cropper-canvas"></div></div><div class="cropper-drag-box"></div><div class="cropper-crop-box"><span class="cropper-view-box"></span><span class="cropper-dashed dashed-h"></span><span class="cropper-dashed dashed-v"></span><span class="cropper-center"></span><span class="cropper-face"></span><span class="cropper-line line-e" data-cropper-action="e"></span><span class="cropper-line line-n" data-cropper-action="n"></span><span class="cropper-line line-w" data-cropper-action="w"></span><span class="cropper-line line-s" data-cropper-action="s"></span><span class="cropper-point point-e" data-cropper-action="e"></span><span class="cropper-point point-n" data-cropper-action="n"></span><span class="cropper-point point-w" data-cropper-action="w"></span><span class="cropper-point point-s" data-cropper-action="s"></span><span class="cropper-point point-ne" data-cropper-action="ne"></span><span class="cropper-point point-nw" data-cropper-action="nw"></span><span class="cropper-point point-sw" data-cropper-action="sw"></span><span class="cropper-point point-se" data-cropper-action="se"></span></div></div>', Yi = Number.isNaN || P.isNaN;
function u(a) {
return typeof a == "number" && !Yi(a);
}
var Qt = function(t) {
return t > 0 && t < 1 / 0;
};
function gt(a) {
return typeof a > "u";
}
function F(a) {
return vt(a) === "object" && a !== null;
}
var Xi = Object.prototype.hasOwnProperty;
function Z(a) {
if (!F(a))
return !1;
try {
var t = a.constructor, e = t.prototype;
return t && e && Xi.call(e, "isPrototypeOf");
} catch {
return !1;
}
}
function A(a) {
return typeof a == "function";
}
var zi = Array.prototype.slice;
function hi(a) {
return Array.from ? Array.from(a) : zi.call(a);
}
function E(a, t) {
return a && A(t) && (Array.isArray(a) || u(a.length) ? hi(a).forEach(function(e, i) {
t.call(a, e, i, a);
}) : F(a) && Object.keys(a).forEach(function(e) {
t.call(a, a[e], e, a);
})), a;
}
var x = Object.assign || function(t) {
for (var e = arguments.length, i = new Array(e > 1 ? e - 1 : 0), n = 1; n < e; n++)
i[n - 1] = arguments[n];
return F(t) && i.length > 0 && i.forEach(function(r) {
F(r) && Object.keys(r).forEach(function(o) {
t[o] = r[o];
});
}), t;
}, Hi = /\.\d*(?:0|9){12}\d*$/;
function J(a) {
var t = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 1e11;
return Hi.test(a) ? Math.round(a * t) / t : a;
}
var Wi = /^width|height|left|top|marginLeft|marginTop$/;
function W(a, t) {
var e = a.style;
E(t, function(i, n) {
Wi.test(n) && u(i) && (i = "".concat(i, "px")), e[n] = i;
});
}
function Ui(a, t) {
return a.classList ? a.classList.contains(t) : a.className.indexOf(t) > -1;
}
function O(a, t) {
if (t) {
if (u(a.length)) {
E(a, function(i) {
O(i, t);
});
return;
}
if (a.classList) {
a.classList.add(t);
return;
}
var e = a.className.trim();
e ? e.indexOf(t) < 0 && (a.className = "".concat(e, " ").concat(t)) : a.className = t;
}
}
function k(a, t) {
if (t) {
if (u(a.length)) {
E(a, function(e) {
k(e, t);
});
return;
}
if (a.classList) {
a.classList.remove(t);
return;
}
a.className.indexOf(t) >= 0 && (a.className = a.className.replace(t, ""));
}
}
function K(a, t, e) {
if (t) {
if (u(a.length)) {
E(a, function(i) {
K(i, t, e);
});
return;
}
e ? O(a, t) : k(a, t);
}
}
var Vi = /([a-z\d])([A-Z])/g;
function St(a) {
return a.replace(Vi, "$1-$2").toLowerCase();
}
function Ct(a, t) {
return F(a[t]) ? a[t] : a.dataset ? a.dataset[t] : a.getAttribute("data-".concat(St(t)));
}
function st(a, t, e) {
F(e) ? a[t] = e : a.dataset ? a.dataset[t] = e : a.setAttribute("data-".concat(St(t)), e);
}
function ji(a, t) {
if (F(a[t]))
try {
delete a[t];
} catch {
a[t] = void 0;
}
else if (a.dataset)
try {
delete a.dataset[t];
} catch {
a.dataset[t] = void 0;
}
else
a.removeAttribute("data-".concat(St(t)));
}
var ci = /\s\s*/, li = function() {
var a = !1;
if (dt) {
var t = !1, e = function() {
}, i = Object.defineProperty({}, "once", {
get: function() {
return a = !0, t;
},
/**
* This setter can fix a `TypeError` in strict mode
* {@link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors/Getter_only}
* @param {boolean} value - The value to set
*/
set: function(r) {
t = r;
}
});
P.addEventListener("test", e, i), P.removeEventListener("test", e, i);
}
return a;
}();
function B(a, t, e) {
var i = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : {}, n = e;
t.trim().split(ci).forEach(function(r) {
if (!li) {
var o = a.listeners;
o && o[r] && o[r][e] && (n = o[r][e], delete o[r][e], Object.keys(o[r]).length === 0 && delete o[r], Object.keys(o).length === 0 && delete a.listeners);
}
a.removeEventListener(r, n, i);
});
}
function _(a, t, e) {
var i = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : {}, n = e;
t.trim().split(ci).forEach(function(r) {
if (i.once && !li) {
var o = a.listeners, s = o === void 0 ? {} : o;
n = function() {
delete s[r][e], a.removeEventListener(r, n, i);
for (var l = arguments.length, h = new Array(l), c = 0; c < l; c++)
h[c] = arguments[c];
e.apply(a, h);
}, s[r] || (s[r] = {}), s[r][e] && a.removeEventListener(r, s[r][e], i), s[r][e] = n, a.listeners = s;
}
a.addEventListener(r, n, i);
});
}
function tt(a, t, e) {
var i;
return A(Event) && A(CustomEvent) ? i = new CustomEvent(t, {
detail: e,
bubbles: !0,
cancelable: !0
}) : (i = document.createEvent("CustomEvent"), i.initCustomEvent(t, !0, !0, e)), a.dispatchEvent(i);
}
function fi(a) {
var t = a.getBoundingClientRect();
return {
left: t.left + (window.pageXOffset - document.documentElement.clientLeft),
top: t.top + (window.pageYOffset - document.documentElement.clientTop)
};
}
var mt = P.location, Gi = /^(\w+:)\/\/([^:/?#]*):?(\d*)/i;
function Zt(a) {
var t = a.match(Gi);
return t !== null && (t[1] !== mt.protocol || t[2] !== mt.hostname || t[3] !== mt.port);
}
function Kt(a) {
var t = "timestamp=".concat(new Date().getTime());
return a + (a.indexOf("?") === -1 ? "?" : "&") + t;
}
function nt(a) {
var t = a.rotate, e = a.scaleX, i = a.scaleY, n = a.translateX, r = a.translateY, o = [];
u(n) && n !== 0 && o.push("translateX(".concat(n, "px)")), u(r) && r !== 0 && o.push("translateY(".concat(r, "px)")), u(t) && t !== 0 && o.push("rotate(".concat(t, "deg)")), u(e) && e !== 1 && o.push("scaleX(".concat(e, ")")), u(i) && i !== 1 && o.push("scaleY(".concat(i, ")"));
var s = o.length ? o.join(" ") : "none";
return {
WebkitTransform: s,
msTransform: s,
transform: s
};
}
function $i(a) {
var t = Jt({}, a), e = 0;
return E(a, function(i, n) {
delete t[n], E(t, function(r) {
var o = Math.abs(i.startX - r.startX), s = Math.abs(i.startY - r.startY), d = Math.abs(i.endX - r.endX), l = Math.abs(i.endY - r.endY), h = Math.sqrt(o * o + s * s), c = Math.sqrt(d * d + l * l), f = (c - h) / h;
Math.abs(f) > Math.abs(e) && (e = f);
});
}), e;
}
function lt(a, t) {
var e = a.pageX, i = a.pageY, n = {
endX: e,
endY: i
};
return t ? n : Jt({
startX: e,
startY: i
}, n);
}
function qi(a) {
var t = 0, e = 0, i = 0;
return E(a, function(n) {
var r = n.startX, o = n.startY;
t += r, e += o, i += 1;
}), t /= i, e /= i, {
pageX: t,
pageY: e
};
}
function U(a) {
var t = a.aspectRatio, e = a.height, i = a.width, n = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "contain", r = Qt(i), o = Qt(e);
if (r && o) {
var s = e * t;
n === "contain" && s > i || n === "cover" && s < i ? e = i / t : i = e * t;
} else
r ? e = i / t : o && (i = e * t);
return {
width: i,
height: e
};
}
function Fi(a) {
var t = a.width, e = a.height, i = a.degree;
if (i = Math.abs(i) % 180, i === 90)
return {
width: e,
height: t
};
var n = i % 90 * Math.PI / 180, r = Math.sin(n), o = Math.cos(n), s = t * o + e * r, d = t * r + e * o;
return i > 90 ? {
width: d,
height: s
} : {
width: s,
height: d
};
}
function Qi(a, t, e, i) {
var n = t.aspectRatio, r = t.naturalWidth, o = t.naturalHeight, s = t.rotate, d = s === void 0 ? 0 : s, l = t.scaleX, h = l === void 0 ? 1 : l, c = t.scaleY, f = c === void 0 ? 1 : c, m = e.aspectRatio, g = e.naturalWidth, b = e.naturalHeight, v = i.fillColor, M = v === void 0 ? "transparent" : v, C = i.imageSmoothingEnabled, D = C === void 0 ? !0 : C, Y = i.imageSmoothingQuality, S = Y === void 0 ? "low" : Y, p = i.maxWidth, w = p === void 0 ? 1 / 0 : p, T = i.maxHeight, I = T === void 0 ? 1 / 0 : T, X = i.minWidth, V = X === void 0 ? 0 : X, j = i.minHeight, z = j === void 0 ? 0 : j, L = document.createElement("canvas"), N = L.getContext("2d"), G = U({
aspectRatio: m,
width: w,
height: I
}), ht = U({
aspectRatio: m,
width: V,
height: z
}, "cover"), pt = Math.min(G.width, Math.max(ht.width, g)), ut = Math.min(G.height, Math.max(ht.height, b)), It = U({
aspectRatio: n,
width: w,
height: I
}), _t = U({
aspectRatio: n,
width: V,
height: z
}, "cover"), Bt = Math.min(It.width, Math.max(_t.width, r)), Lt = Math.min(It.height, Math.max(_t.height, o)), ui = [-Bt / 2, -Lt / 2, Bt, Lt];
return L.width = J(pt), L.height = J(ut), N.fillStyle = M, N.fillRect(0, 0, pt, ut), N.save(), N.translate(pt / 2, ut / 2), N.rotate(d * Math.PI / 180), N.scale(h, f), N.imageSmoothingEnabled = D, N.imageSmoothingQuality = S, N.drawImage.apply(N, [a].concat(ti(ui.map(function(gi) {
return Math.floor(J(gi));
})))), N.restore(), L;
}
var di = String.fromCharCode;
function Zi(a, t, e) {
var i = "";
e += t;
for (var n = t; n < e; n += 1)
i += di(a.getUint8(n));
return i;
}
var Ki = /^data:.*,/;
function Ji(a) {
var t = a.replace(Ki, ""), e = atob(t), i = new ArrayBuffer(e.length), n = new Uint8Array(i);
return E(n, function(r, o) {
n[o] = e.charCodeAt(o);
}), i;
}
function te(a, t) {
for (var e = [], i = 8192, n = new Uint8Array(a); n.length > 0; )
e.push(di.apply(null, hi(n.subarray(0, i)))), n = n.subarray(i);
return "data:".concat(t, ";base64,").concat(btoa(e.join("")));
}
function ie(a) {
var t = new DataView(a), e;
try {
var i, n, r;
if (t.getUint8(0) === 255 && t.getUint8(1) === 216)
for (var o = t.byteLength, s = 2; s + 1 < o; ) {
if (t.getUint8(s) === 255 && t.getUint8(s + 1) === 225) {
n = s;
break;
}
s += 1;
}
if (n) {
var d = n + 4, l = n + 10;
if (Zi(t, d, 4) === "Exif") {
var h = t.getUint16(l);
if (i = h === 18761, (i || h === 19789) && t.getUint16(l + 2, i) === 42) {
var c = t.getUint32(l + 4, i);
c >= 8 && (r = l + c);
}
}
}
if (r) {
var f = t.getUint16(r, i), m, g;
for (g = 0; g < f; g += 1)
if (m = r + g * 12 + 2, t.getUint16(m, i) === 274) {
m += 8, e = t.getUint16(m, i), t.setUint16(m, 1, i);
break;
}
}
} catch {
e = 1;
}
return e;
}
function ee(a) {
var t = 0, e = 1, i = 1;
switch (a) {
case 2:
e = -1;
break;
case 3:
t = -180;
break;
case 4:
i = -1;
break;
case 5:
t = 90, i = -1;
break;
case 6:
t = 90;
break;
case 7:
t = 90, e = -1;
break;
case 8:
t = -90;
break;
}
return {
rotate: t,
scaleX: e,
scaleY: i
};
}
var ae = {
render: function() {
this.initContainer(), this.initCanvas(), this.initCropBox(), this.renderCanvas(), this.cropped && this.renderCropBox();
},
initContainer: function() {
var t = this.element, e = this.options, i = this.container, n = this.cropper, r = Number(e.minContainerWidth), o = Number(e.minContainerHeight);
O(n, R), k(t, R);
var s = {
width: Math.max(i.offsetWidth, r >= 0 ? r : oi),
height: Math.max(i.offsetHeight, o >= 0 ? o : si)
};
this.containerData = s, W(n, {
width: s.width,
height: s.height
}), O(t, R), k(n, R);
},
// Canvas (image wrapper)
initCanvas: function() {
var t = this.containerData, e = this.imageData, i = this.options.viewMode, n = Math.abs(e.rotate) % 180 === 90, r = n ? e.naturalHeight : e.naturalWidth, o = n ? e.naturalWidth : e.naturalHeight, s = r / o, d = t.width, l = t.height;
t.height * s > t.width ? i === 3 ? d = t.height * s : l = t.width / s : i === 3 ? l = t.width / s : d = t.height * s;
var h = {
aspectRatio: s,
naturalWidth: r,
naturalHeight: o,
width: d,
height: l
};
this.canvasData = h, this.limited = i === 1 || i === 2, this.limitCanvas(!0, !0), h.width = Math.min(Math.max(h.width, h.minWidth), h.maxWidth), h.height = Math.min(Math.max(h.height, h.minHeight), h.maxHeight), h.left = (t.width - h.width) / 2, h.top = (t.height - h.height) / 2, h.oldLeft = h.left, h.oldTop = h.top, this.initialCanvasData = x({}, h);
},
limitCanvas: function(t, e) {
var i = this.options, n = this.containerData, r = this.canvasData, o = this.cropBoxData, s = i.viewMode, d = r.aspectRatio, l = this.cropped && o;
if (t) {
var h = Number(i.minCanvasWidth) || 0, c = Number(i.minCanvasHeight) || 0;
s > 1 ? (h = Math.max(h, n.width), c = Math.max(c, n.height), s === 3 && (c * d > h ? h = c * d : c = h / d)) : s > 0 && (h ? h = Math.max(h, l ? o.width : 0) : c ? c = Math.max(c, l ? o.height : 0) : l && (h = o.width, c = o.height, c * d > h ? h = c * d : c = h / d));
var f = U({
aspectRatio: d,
width: h,
height: c
});
h = f.width, c = f.height, r.minWidth = h, r.minHeight = c, r.maxWidth = 1 / 0, r.maxHeight = 1 / 0;
}
if (e)
if (s > (l ? 0 : 1)) {
var m = n.width - r.width, g = n.height - r.height;
r.minLeft = Math.min(0, m), r.minTop = Math.min(0, g), r.maxLeft = Math.max(0, m), r.maxTop = Math.max(0, g), l && this.limited && (r.minLeft = Math.min(o.left, o.left + (o.width - r.width)), r.minTop = Math.min(o.top, o.top + (o.height - r.height)), r.maxLeft = o.left, r.maxTop = o.top, s === 2 && (r.width >= n.width && (r.minLeft = Math.min(0, m), r.maxLeft = Math.max(0, m)), r.height >= n.height && (r.minTop = Math.min(0, g), r.maxTop = Math.max(0, g))));
} else
r.minLeft = -r.width, r.minTop = -r.height, r.maxLeft = n.width, r.maxTop = n.height;
},
renderCanvas: function(t, e) {
var i = this.canvasData, n = this.imageData;
if (e) {
var r = Fi({
width: n.naturalWidth * Math.abs(n.scaleX || 1),
height: n.naturalHeight * Math.abs(n.scaleY || 1),
degree: n.rotate || 0
}), o = r.width, s = r.height, d = i.width * (o / i.naturalWidth), l = i.height * (s / i.naturalHeight);
i.left -= (d - i.width) / 2, i.top -= (l - i.height) / 2, i.width = d, i.height = l, i.aspectRatio = o / s, i.naturalWidth = o, i.naturalHeight = s, this.limitCanvas(!0, !1);
}
(i.width > i.maxWidth || i.width < i.minWidth) && (i.left = i.oldLeft), (i.height > i.maxHeight || i.height < i.minHeight) && (i.top = i.oldTop), i.width = Math.min(Math.max(i.width, i.minWidth), i.maxWidth), i.height = Math.min(Math.max(i.height, i.minHeight), i.maxHeight), this.limitCanvas(!1, !0), i.left = Math.min(Math.max(i.left, i.minLeft), i.maxLeft), i.top = Math.min(Math.max(i.top, i.minTop), i.maxTop), i.oldLeft = i.left, i.oldTop = i.top, W(this.canvas, x({
width: i.width,
height: i.height
}, nt({
translateX: i.left,
translateY: i.top
}))), this.renderImage(t), this.cropped && this.limited && this.limitCropBox(!0, !0);
},
renderImage: function(t) {
var e = this.canvasData, i = this.imageData, n = i.naturalWidth * (e.width / e.naturalWidth), r = i.naturalHeight * (e.height / e.naturalHeight);
x(i, {
width: n,
height: r,
left: (e.width - n) / 2,
top: (e.height - r) / 2
}), W(this.image, x({
width: i.width,
height: i.height
}, nt(x({
translateX: i.left,
translateY: i.top
}, i)))), t && this.output();
},
initCropBox: function() {
var t = this.options, e = this.canvasData, i = t.aspectRatio || t.initialAspectRatio, n = Number(t.autoCropArea) || 0.8, r = {
width: e.width,
height: e.height
};
i && (e.height * i > e.width ? r.height = r.width / i : r.width = r.height * i), this.cropBoxData = r, this.limitCropBox(!0, !0), r.width = Math.min(Math.max(r.width, r.minWidth), r.maxWidth), r.height = Math.min(Math.max(r.height, r.minHeight), r.maxHeight), r.width = Math.max(r.minWidth, r.width * n), r.height = Math.max(r.minHeight, r.height * n), r.left = e.left + (e.width - r.width) / 2, r.top = e.top + (e.height - r.height) / 2, r.oldLeft = r.left, r.oldTop = r.top, this.initialCropBoxData = x({}, r);
},
limitCropBox: function(t, e) {
var i = this.options, n = this.containerData, r = this.canvasData, o = this.cropBoxData, s = this.limited, d = i.aspectRatio;
if (t) {
var l = Number(i.minCropBoxWidth) || 0, h = Number(i.minCropBoxHeight) || 0, c = s ? Math.min(n.width, r.width, r.width + r.left, n.width - r.left) : n.width, f = s ? Math.min(n.height, r.height, r.height + r.top, n.height - r.top) : n.height;
l = Math.min(l, n.width), h = Math.min(h, n.height), d && (l && h ? h * d > l ? h = l / d : l = h * d : l ? h = l / d : h && (l = h * d), f * d > c ? f = c / d : c = f * d), o.minWidth = Math.min(l, c), o.minHeight = Math.min(h, f), o.maxWidth = c, o.maxHeight = f;
}
e && (s ? (o.minLeft = Math.max(0, r.left), o.minTop = Math.max(0, r.top), o.maxLeft = Math.min(n.width, r.left + r.width) - o.width, o.maxTop = Math.min(n.height, r.top + r.height) - o.height) : (o.minLeft = 0, o.minTop = 0, o.maxLeft = n.width - o.width, o.maxTop = n.height - o.height));
},
renderCropBox: function() {
var t = this.options, e = this.containerData, i = this.cropBoxData;
(i.width > i.maxWidth || i.width < i.minWidth) && (i.left = i.oldLeft), (i.height > i.maxHeight || i.height < i.minHeight) && (i.top = i.oldTop), i.width = Math.min(Math.max(i.width, i.minWidth), i.maxWidth), i.height = Math.min(Math.max(i.height, i.minHeight), i.maxHeight), this.limitCropBox(!1, !0), i.left = Math.min(Math.max(i.left, i.minLeft), i.maxLeft), i.top = Math.min(Math.max(i.top, i.minTop), i.maxTop), i.oldLeft = i.left, i.oldTop = i.top, t.movable && t.cropBoxMovable && st(this.face, ot, i.width >= e.width && i.height >= e.height ? ei : At), W(this.cropBox, x({
width: i.width,
height: i.height
}, nt({
translateX: i.left,
translateY: i.top
}))), this.cropped && this.limited && this.limitCanvas(!0, !0), this.disabled || this.output();
},
output: function() {
this.preview(), tt(this.element, xt, this.getData());
}
}, re = {
initPreview: function() {
var t = this.element, e = this.crossOrigin, i = this.options.preview, n = e ? this.crossOriginUrl : this.url, r = t.alt || "The image to preview", o = document.createElement("img");
if (e && (o.crossOrigin = e), o.src = n, o.alt = r, this.viewBox.appendChild(o), this.viewBoxImage = o, !!i) {
var s = i;
typeof i == "string" ? s = t.ownerDocument.querySelectorAll(i) : i.querySelector && (s = [i]), this.previews = s, E(s, function(d) {
var l = document.createElement("img");
st(d, ct, {
width: d.offsetWidth,
height: d.offsetHeight,
html: d.innerHTML
}), e && (l.crossOrigin = e), l.src = n, l.alt = r, l.style.cssText = 'display:block;width:100%;height:auto;min-width:0!important;min-height:0!important;max-width:none!important;max-height:none!important;image-orientation:0deg!important;"', d.innerHTML = "", d.appendChild(l);
});
}
},
resetPreview: function() {
E(this.previews, function(t) {
var e = Ct(t, ct);
W(t, {
width: e.width,
height: e.height
}), t.innerHTML = e.html, ji(t, ct);
});
},
preview: function() {
var t = this.imageData, e = this.canvasData, i = this.cropBoxData, n = i.width, r = i.height, o = t.width, s = t.height, d = i.left - e.left - t.left, l = i.top - e.top - t.top;
!this.cropped || this.disabled || (W(this.viewBoxImage, x({
width: o,
height: s
}, nt(x({
translateX: -d,
translateY: -l
}, t)))), E(this.previews, function(h) {
var c = Ct(h, ct), f = c.width, m = c.height, g = f, b = m, v = 1;
n && (v = f / n, b = r * v), r && b > m && (v = m / r, g = n * v, b = m), W(h, {
width: g,
height: b
}), W(h.getElementsByTagName("img")[0], x({
width: o * v,
height: s * v
}, nt(x({
translateX: -d * v,
translateY: -l * v
}, t))));
}));
}
}, ne = {
bind: function() {
var t = this.element, e = this.options, i = this.cropper;
A(e.cropstart) && _(t, Mt, e.cropstart), A(e.cropmove) && _(t, Et, e.cropmove), A(e.cropend) && _(t, Dt, e.cropend), A(e.crop) && _(t, xt, e.crop), A(e.zoom) && _(t, Tt, e.zoom), _(i, Wt, this.onCropStart = this.cropStart.bind(this)), e.zoomable && e.zoomOnWheel && _(i, $t, this.onWheel = this.wheel.bind(this), {
passive: !1,
capture: !0
}), e.toggleDragModeOnDblclick && _(i, Ht, this.onDblclick = this.dblclick.bind(this)), _(t.ownerDocument, Ut, this.onCropMove = this.cropMove.bind(this)), _(t.ownerDocument, Vt, this.onCropEnd = this.cropEnd.bind(this)), e.responsive && _(window, Gt, this.onResize = this.resize.bind(this));
},
unbind: function() {
var t = this.element, e = this.options, i = this.cropper;
A(e.cropstart) && B(t, Mt, e.cropstart), A(e.cropmove) && B(t, Et, e.cropmove), A(e.cropend) && B(t, Dt, e.cropend), A(e.crop) && B(t, xt, e.crop), A(e.zoom) && B(t, Tt, e.zoom), B(i, Wt, this.onCropStart), e.zoomable && e.zoomOnWheel && B(i, $t, this.onWheel, {
passive: !1,
capture: !0
}), e.toggleDragModeOnDblclick && B(i, Ht, this.onDblclick), B(t.ownerDocument, Ut, this.onCropMove), B(t.ownerDocument, Vt, this.onCropEnd), e.responsive && B(window, Gt, this.onResize);
}
}, oe = {
resize: function() {
if (!this.disabled) {
var t = this.options, e = this.container, i = this.containerData, n = e.offsetWidth / i.width, r = e.offsetHeight / i.height, o = Math.abs(n - 1) > Math.abs(r - 1) ? n : r;
if (o !== 1) {
var s, d;
t.restore && (s = this.getCanvasData(), d = this.getCropBoxData()), this.render(), t.restore && (this.setCanvasData(E(s, function(l, h) {
s[h] = l * o;
})), this.setCropBoxData(E(d, function(l, h) {
d[h] = l * o;
})));
}
}
},
dblclick: function() {
this.disabled || this.options.dragMode === ni || this.setDragMode(Ui(this.dragBox, bt) ? ri : Rt);
},
wheel: function(t) {
var e = this, i = Number(this.options.wheelZoomRatio) || 0.1, n = 1;
this.disabled || (t.preventDefault(), !this.wheeling && (this.wheeling = !0, setTimeout(function() {
e.wheeling = !1;
}, 50), t.deltaY ? n = t.deltaY > 0 ? 1 : -1 : t.wheelDelta ? n = -t.wheelDelta / 120 : t.detail && (n = t.detail > 0 ? 1 : -1), this.zoom(-n * i, t)));
},
cropStart: function(t) {
var e = t.buttons, i = t.button;
if (!(this.disabled || (t.type === "mousedown" || t.type === "pointerdown" && t.pointerType === "mouse") && // No primary button (Usually the left button)
(u(e) && e !== 1 || u(i) && i !== 0 || t.ctrlKey))) {
var n = this.options, r = this.pointers, o;
t.changedTouches ? E(t.changedTouches, function(s) {
r[s.identifier] = lt(s);
}) : r[t.pointerId || 0] = lt(t), Object.keys(r).length > 1 && n.zoomable && n.zoomOnTouch ? o = ai : o = Ct(t.target, ot), _i.test(o) && tt(this.element, Mt, {
originalEvent: t,
action: o
}) !== !1 && (t.preventDefault(), this.action = o, this.cropping = !1, o === ii && (this.cropping = !0, O(this.dragBox, ft)));
}
},
cropMove: function(t) {
var e = this.action;
if (!(this.disabled || !e)) {
var i = this.pointers;
t.preventDefault(), tt(this.element, Et, {
originalEvent: t,
action: e
}) !== !1 && (t.changedTouches ? E(t.changedTouches, function(n) {
x(i[n.identifier] || {}, lt(n, !0));
}) : x(i[t.pointerId || 0] || {}, lt(t, !0)), this.change(t));
}
},
cropEnd: function(t) {
if (!this.disabled) {
var e = this.action, i = this.pointers;
t.changedTouches ? E(t.changedTouches, function(n) {
delete i[n.identifier];
}) : delete i[t.pointerId || 0], e && (t.preventDefault(), Object.keys(i).length || (this.action = ""), this.cropping && (this.cropping = !1, K(this.dragBox, ft, this.cropped && this.options.modal)), tt(this.element, Dt, {
originalEvent: t,
action: e
}));
}
}
}, se = {
change: function(t) {
var e = this.options, i = this.canvasData, n = this.containerData, r = this.cropBoxData, o = this.pointers, s = this.action, d = e.aspectRatio, l = r.left, h = r.top, c = r.width, f = r.height, m = l + c, g = h + f, b = 0, v = 0, M = n.width, C = n.height, D = !0, Y;
!d && t.shiftKey && (d = c && f ? c / f : 1), this.limited && (b = r.minLeft, v = r.minTop, M = b + Math.min(n.width, i.width, i.left + i.width), C = v + Math.min(n.height, i.height, i.top + i.height));
var S = o[Object.keys(o)[0]], p = {
x: S.endX - S.startX,
y: S.endY - S.startY
}, w = function(I) {
switch (I) {
case $:
m + p.x > M && (p.x = M - m);
break;
case q:
l + p.x < b && (p.x = b - l);
break;
case H:
h + p.y < v && (p.y = v - h);
break;
case Q:
g + p.y > C && (p.y = C - g);
break;
}
};
switch (s) {
case At:
l += p.x, h += p.y;
break;
case $:
if (p.x >= 0 && (m >= M || d && (h <= v || g >= C))) {
D = !1;
break;
}
w($), c += p.x, c < 0 && (s = q, c = -c, l -= c), d && (f = c / d, h += (r.height - f) / 2);
break;
case H:
if (p.y <= 0 && (h <= v || d && (l <= b || m >= M))) {
D = !1;
break;
}
w(H), f -= p.y, h += p.y, f < 0 && (s = Q, f = -f, h -= f), d && (c = f * d, l += (r.width - c) / 2);
break;
case q:
if (p.x <= 0 && (l <= b || d && (h <= v || g >= C))) {
D = !1;
break;
}
w(q), c -= p.x, l += p.x, c < 0 && (s = $, c = -c, l -= c), d && (f = c / d, h += (r.height - f) / 2);
break;
case Q:
if (p.y >= 0 && (g >= C || d && (l <= b || m >= M))) {
D = !1;
break;
}
w(Q), f += p.y, f < 0 && (s = H, f = -f, h -= f), d && (c = f * d, l += (r.width - c) / 2);
break;
case it:
if (d) {
if (p.y <= 0 && (h <= v || m >= M)) {
D = !1;
break;
}
w(H), f -= p.y, h += p.y, c = f * d;
} else
w(H), w($), p.x >= 0 ? m < M ? c += p.x : p.y <= 0 && h <= v && (D = !1) : c += p.x, p.y <= 0 ? h > v && (f -= p.y, h += p.y) : (f -= p.y, h += p.y);
c < 0 && f < 0 ? (s = rt, f = -f, c = -c, h -= f, l -= c) : c < 0 ? (s = et, c = -c, l -= c) : f < 0 && (s = at, f = -f, h -= f);
break;
case et:
if (d) {
if (p.y <= 0 && (h <= v || l <= b)) {
D = !1;
break;
}
w(H), f -= p.y, h += p.y, c = f * d, l += r.width - c;
} else
w(H), w(q), p.x <= 0 ? l > b ? (c -= p.x, l += p.x) : p.y <= 0 && h <= v && (D = !1) : (c -= p.x, l += p.x), p.y <= 0 ? h > v && (f -= p.y, h += p.y) : (f -= p.y, h += p.y);
c < 0 && f < 0 ? (s = at, f = -f, c = -c, h -= f, l -= c) : c < 0 ? (s = it, c = -c, l -= c) : f < 0 && (s = rt, f = -f, h -= f);
break;
case rt:
if (d) {
if (p.x <= 0 && (l <= b || g >= C)) {
D = !1;
break;
}
w(q), c -= p.x, l += p.x, f = c / d;
} else
w(Q), w(q), p.x <= 0 ? l > b ? (c -= p.x, l += p.x) : p.y >= 0 && g >= C && (D = !1) : (c -= p.x, l += p.x), p.y >= 0 ? g < C && (f += p.y) : f += p.y;
c < 0 && f < 0 ? (s = it, f = -f, c = -c, h -= f, l -= c) : c < 0 ? (s = at, c = -c, l -= c) : f < 0 && (s = et, f = -f, h -= f);
break;
case at:
if (d) {
if (p.x >= 0 && (m >= M || g >= C)) {
D = !1;
break;
}
w($), c += p.x, f = c / d;
} else
w(Q), w($), p.x >= 0 ? m < M ? c += p.x : p.y >= 0 && g >= C && (D = !1) : c += p.x, p.y >= 0 ? g < C && (f += p.y) : f += p.y;
c < 0 && f < 0 ? (s = et, f = -f, c = -c, h -= f, l -= c) : c < 0 ? (s = rt, c = -c, l -= c) : f < 0 && (s = it, f = -f, h -= f);
break;
case ei:
this.move(p.x, p.y), D = !1;
break;
case ai:
this.zoom($i(o), t), D = !1;
break;
case ii:
if (!p.x || !p.y) {
D = !1;
break;
}
Y = fi(this.cropper), l = S.startX - Y.left, h = S.startY - Y.top, c = r.minWidth, f = r.minHeight, p.x > 0 ? s = p.y > 0 ? at : it : p.x < 0 && (l -= c, s = p.y > 0 ? rt : et), p.y < 0 && (h -= f), this.cropped || (k(this.cropBox, R), this.cropped = !0, this.limited && this.limitCropBox(!0, !0));
break;
}
D && (r.width = c, r.height = f, r.left = l, r.top = h, this.action = s, this.renderCropBox()), E(o, function(T) {
T.startX = T.endX, T.startY = T.endY;
});
}
}, he = {
// Show the crop box manually
crop: function() {
return this.ready && !this.cropped && !this.disabled && (this.cropped = !0, this.limitCropBox(!0, !0), this.options.modal && O(this.dragBox, ft), k(this.cropBox, R), this.setCropBoxData(this.initialCropBoxData)), this;
},
// Reset the image and crop box to their initial states
reset: function() {
return this.ready && !this.disabled && (this.imageData = x({}, this.initialImageData), this.canvasData = x({}, this.initialCanvasData), this.cropBoxData = x({}, this.initialCropBoxData), this.renderCanvas(), this.cropped && this.renderCropBox()), this;
},
// Clear the crop box
clear: function() {
return this.cropped && !this.disabled && (x(this.cropBoxData, {
left: 0,
top: 0,
width: 0,
height: 0
}), this.cropped = !1, this.renderCropBox(), this.limitCanvas(!0, !0), this.renderCanvas(), k(this.dragBox, ft), O(this.cropBox, R)), this;
},
/**
* Replace the image's src and rebuild the cropper
* @param {string} url - The new URL.
* @param {boolean} [hasSameSize] - Indicate if the new image has the same size as the old one.
* @returns {Cropper} this
*/
replace: function(t) {
var e = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !1;
return !this.disabled && t && (this.isImg && (this.element.src = t), e ? (this.url = t, this.image.src = t, this.ready && (this.viewBoxImage.src = t, E(this.previews, function(i) {
i.getElementsByTagName("img")[0].src = t;
}))) : (this.isImg && (this.replaced = !0), this.options.data = null, this.uncreate(), this.load(t))), this;
},
// Enable (unfreeze) the cropper
enable: function() {
return this.ready && this.disabled && (this.disabled = !1, k(this.cropper, Xt)), this;
},
// Disable (freeze) the cropper
disable: function() {
return this.ready && !this.disabled && (this.disabled = !0, O(this.cropper, Xt)), this;
},
/**
* Destroy the cropper and remove the instance from the image
* @returns {Cropper} this
*/
destroy: function() {
var t = this.element;
return t[y] ? (t[y] = void 0, this.isImg && this.replaced && (t.src = this.originalUrl), this.uncreate(), this) : this;
},
/**
* Move the canvas with relative offsets
* @param {number} offsetX - The relative offset distance on the x-axis.
* @param {number} [offsetY=offsetX] - The relative offset distance on the y-axis.
* @returns {Cropper} this
*/
move: function(t) {
var e = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : t, i = this.canvasData, n = i.left, r = i.top;
return this.moveTo(gt(t) ? t : n + Number(t), gt(e) ? e : r + Number(e));
},
/**
* Move the canvas to an absolute point
* @param {number} x - The x-axis coordinate.
* @param {number} [y=x] - The y-axis coordinate.
* @returns {Cropper} this
*/
moveTo: function(t) {
var e = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : t, i = this.canvasData, n = !1;
return t = Number(t), e = Number(e), this.ready && !this.disabled && this.options.movable && (u(t) && (i.left = t, n = !0), u(e) && (i.top = e, n = !0), n && this.renderCanvas(!0)), this;
},
/**
* Zoom the canvas with a relative ratio
* @param {number} ratio - The target ratio.
* @param {Event} _originalEvent - The original event if any.
* @returns {Cropper} this
*/
zoom: function(t, e) {
var i = this.canvasData;
return t = Number(t), t < 0 ? t = 1 / (1 - t) : t = 1 + t, this.zoomTo(i.width * t / i.naturalWidth, null, e);
},
/**
* Zoom the canvas to an absolute ratio
* @param {number} ratio - The target ratio.
* @param {Object} pivot - The zoom pivot point coordinate.
* @param {Event} _originalEvent - The original event if any.
* @returns {Cropper} this
*/
zoomTo: function(t, e, i) {
var n = this.options, r = this.canvasData, o = r.width, s = r.height, d = r.naturalWidth, l = r.naturalHeight;
if (t = Number(t), t >= 0 && this.ready && !this.disabled && n.zoomable) {
var h = d * t, c = l * t;
if (tt(this.element, Tt, {
ratio: t,
oldRatio: o / d,
originalEvent: i
}) === !1)
return this;
if (i) {
var f = this.pointers, m = fi(this.cropper), g = f && Object.keys(f).length ? qi(f) : {
pageX: i.pageX,
pageY: i.pageY
};
r.left -= (h - o) * ((g.pageX - m.left - r.left) / o), r.top -= (c - s) * ((g.pageY - m.top - r.top) / s);
} else
Z(e) && u(e.x) && u(e.y) ? (r.left -= (h - o) * ((e.x - r.left) / o), r.top -= (c - s) * ((e.y - r.top) / s)) : (r.left -= (h - o) / 2, r.top -= (c - s) / 2);
r.width = h, r.height = c, this.renderCanvas(!0);
}
return this;
},
/**
* Rotate the canvas with a relative degree
* @param {number} degree - The rotate degree.
* @returns {Cropper} this
*/
rotate: function(t) {
return this.rotateTo((this.imageData.rotate || 0) + Number(t));
},
/**
* Rotate the canvas to an absolute degree
* @param {number} degree - The rotate degree.
* @returns {Cropper} this
*/
rotateTo: function(t) {
return t = Number(t), u(t) && this.ready && !this.disabled && this.options.rotatable && (this.imageData.rotate = t % 360, this.renderCanvas(!0, !0)), this;
},
/**
* Scale the image on the x-axis.
* @param {number} scaleX - The scale ratio on the x-axis.
* @returns {Cropper} this
*/
scaleX: function(t) {
var e = this.imageData.scaleY;
return this.scale(t, u(e) ? e : 1);
},
/**
* Scale the image on the y-axis.
* @param {number} scaleY - The scale ratio on the y-axis.
* @returns {Cropper} this
*/
scaleY: function(t) {
var e = this.imageData.scaleX;
return this.scale(u(e) ? e : 1, t);
},
/**
* Scale the image
* @param {number} scaleX - The scale ratio on the x-axis.
* @param {number} [scaleY=scaleX] - The scale ratio on the y-axis.
* @returns {Cropper} this
*/
scale: function(t) {
var e = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : t, i = this.imageData, n = !1;
return t = Number(t), e = Number(e), this.ready && !this.disabled && this.options.scalable && (u(t) && (i.scaleX = t, n = !0), u(e) && (i.scaleY = e, n = !0), n && this.renderCanvas(!0, !0)), this;
},
/**
* Get the cropped area position and size data (base on the original image)
* @param {boolean} [rounded=false] - Indicate if round the data values or not.
* @returns {Object} The result cropped data.
*/
getData: function() {
var t = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : !1, e = this.options, i = this.imageData, n = this.canvasData, r = this.cropBoxData, o;
if (this.ready && this.cropped) {
o = {
x: r.left - n.left,
y: r.top - n.top,
width: r.width,
height: r.height
};
var s = i.width / i.naturalWidth;
if (E(o, function(h, c) {
o[c] = h / s;
}), t) {
var d = Math.round(o.y + o.height), l = Math.round(o.x + o.width);
o.x = Math.round(o.x), o.y = Math.round(o.y), o.width = l - o.x, o.height = d - o.y;
}
} else
o = {
x: 0,
y: 0,
width: 0,
height: 0
};
return e.rotatable && (o.rotate = i.rotate || 0), e.scalable && (o.scaleX = i.scaleX || 1, o.scaleY = i.scaleY || 1), o;
},
/**
* Set the cropped area position and size with new data
* @param {Object} data - The new data.
* @returns {Cropper} this
*/
setData: function(t) {
var e = this.options, i = this.imageData, n = this.canvasData, r = {};
if (this.ready && !this.disabled && Z(t)) {
var o = !1;
e.rotatable && u(t.rotate) && t.rotate !== i.rotate && (i.rotate = t.rotate, o = !0), e.scalable && (u(t.scaleX) && t.scaleX !== i.scaleX && (i.scaleX = t.scaleX, o = !0), u(t.scaleY) && t.scaleY !== i.scaleY && (i.scaleY = t.scaleY, o = !0)), o && this.renderCanvas(!0, !0);
var s = i.width / i.naturalWidth;
u(t.x) && (r.left = t.x * s + n.left), u(t.y) && (r.top = t.y * s + n.top), u(t.width) && (r.width = t.width * s), u(t.height) && (r.height = t.height * s), this.setCropBoxData(r);
}
return this;
},
/**
* Get the container size data.
* @returns {Object} The result container data.
*/
getContainerData: function() {
return this.ready ? x({}, this.containerData) : {};
},
/**
* Get the image position and size data.
* @returns {Object} The result image data.
*/
getImageData: function() {
return this.sized ? x({}, this.imageData) : {};
},
/**
* Get the canvas position and size data.
* @returns {Object} The result canvas data.
*/
getCanvasData: function() {
var t = this.canvasData, e = {};
return this.ready && E(["left", "top", "width", "height", "naturalWidth", "naturalHeight"], function(i) {
e[i] = t[i];
}), e;
},
/**
* Set the canvas position and size with new data.
* @param {Object} data - The new canvas data.
* @returns {Cropper} this
*/
setCanvasData: function(t) {
var e = this.canvasData, i = e.aspectRatio;
return this.ready && !this.disabled && Z(t) && (u(t.left) && (e.left = t.left), u(t.top) && (e.top = t.top), u(t.width) ? (e.width = t.width, e.height = t.width / i) : u(t.height) && (e.height = t.height, e.width = t.height * i), this.renderCanvas(!0)), this;
},
/**
* Get the crop box position and size data.
* @returns {Object} The result crop box data.
*/
getCropBoxData: function() {
var t = this.cropBoxData, e;
return this.ready && this.cropped && (e = {
left: t.left,
top: t.top,
width: t.width,
height: t.height
}), e || {};
},
/**
* Set the crop box position and size with new data.
* @param {Object} data - The new crop box data.
* @returns {Cropper} this
*/
setCropBoxData: function(t) {
var e = this.cropBoxData, i = this.options.aspectRatio, n, r;
return this.ready && this.cropped && !this.disabled && Z(t) && (u(t.left) && (e.left = t.left), u(t.top) && (e.top = t.top), u(t.width) && t.width !== e.width && (n = !0, e.width = t.width), u(t.height) && t.height !== e.height && (r = !0, e.height = t.height), i && (n ? e.height = e.width / i : r && (e.width = e.height * i)), this.renderCropBox()), this;
},
/**
* Get a canvas drawn the cropped image.
* @param {Object} [options={}] - The config options.
* @returns {HTMLCanvasElement} - The result canvas.
*/
getCroppedCanvas: function() {
var t = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
if (!this.ready || !window.HTMLCanvasElement)
return null;
var e = this.canvasData, i = Qi(this.image, this.imageData, e, t);
if (!this.cropped)
return i;
var n = this.getData(), r = n.x, o = n.y, s = n.width, d = n.height, l = i.width / Math.floor(e.naturalWidth);
l !== 1 && (r *= l, o *= l, s *= l, d *= l);
var h = s / d, c = U({
aspectRatio: h,
width: t.maxWidth || 1 / 0,
height: t.maxHeight || 1 / 0
}), f = U({
aspectRatio: h,
width: t.minWidth || 0,
height: t.minHeight || 0
}, "cover"), m = U({
aspectRatio: h,
width: t.width || (l !== 1 ? i.width : s),
height: t.height || (l !== 1 ? i.height : d)
}), g = m.width, b = m.height;
g = Math.min(c.width, Math.max(f.width, g)), b = Math.min(c.height, Math.max(f.height, b));
var v = document.createElement("canvas"), M = v.getContext("2d");
v.width = J(g), v.height = J(b), M.fillStyle = t.fillColor || "transparent", M.fillRect(0, 0, g, b);
var C = t.imageSmoothingEnabled, D = C === void 0 ? !0 : C, Y = t.imageSmoothingQuality;
M.imageSmoothingEnabled = D, Y && (M.imageSmoothingQuality = Y);
var S = i.width, p = i.height, w = r, T = o, I, X, V, j, z, L;
w <= -s || w > S ? (w = 0, I = 0, V = 0, z = 0) : w <= 0 ? (V = -w, w = 0, I = Math.min(S, s + w), z = I) : w <= S && (V = 0, I = Math.min(s, S - w), z = I), I <= 0 || T <= -d || T > p ? (T = 0, X = 0, j = 0, L = 0) : T <= 0 ? (j = -T, T = 0, X = Math.min(p, d + T), L = X) : T <= p && (j = 0, X = Math.min(d, p - T), L = X);
var N = [w, T, I, X];
if (z > 0 && L > 0) {
var G = g / s;
N.push(V * G, j * G, z * G, L * G);
}
return M.drawImage.apply(M, [i].concat(ti(N.map(function(ht) {
return Math.floor(J(ht));
})))), v;
},
/**
* Change the aspect ratio of the crop box.
* @param {number} aspectRatio - The new aspect ratio.
* @returns {Cropper} this
*/
setAspectRatio: function(t) {
var e = this.options;
return !this.disabled && !gt(t) && (e.aspectRatio = Math.max(0, t) || NaN, this.ready && (this.initCropBox(), this.cropped && this.renderCropBox())), this;
},
/**
* Change the drag mode.
* @param {string} mode - The new drag mode.
* @returns {Cropper} this
*/
setDragMode: function(t) {
var e = this.options, i = this.dragBox, n = this.face;
if (this.ready && !this.disabled) {
var r = t === Rt, o = e.movable && t === ri;
t = r || o ? t : ni, e.dragMode = t, st(i, ot, t), K(i, bt, r), K(i, yt, o), e.cropBoxMovable || (st(n, ot, t), K(n, bt, r), K(n, yt, o));
}
return this;
}
}, ce = P.Cropper, pi = /* @__PURE__ */ function() {
function a(t) {
var e = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
if (Di(this, a), !t || !ki.test(t.tagName))
throw new Error("The first argument is required and must be an <img> or <canvas> element.");
this.element = t