cropper.min.js 33 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861
  1. /*!
  2. * Cropper v0.9.2
  3. * https://github.com/fengyuanchen/cropper
  4. *
  5. * Copyright (c) 2014-2015 Fengyuan Chen and contributors
  6. * Released under the MIT license
  7. *
  8. * Date: 2015-04-18T04:35:01.500Z
  9. */
  10. !
  11. function(a) {
  12. "function" == typeof define && define.amd ? define(["jquery"], a) : a("object" == typeof exports ? require("jquery") : jQuery)
  13. } (function(a) {
  14. "use strict";
  15. function b(a) {
  16. return "number" == typeof a
  17. }
  18. function c(a) {
  19. return "undefined" == typeof a
  20. }
  21. function d(a, c) {
  22. var d = [];
  23. return b(c) && d.push(c),
  24. d.slice.apply(a, d)
  25. }
  26. function e(a, b) {
  27. var c = d(arguments, 2);
  28. return function() {
  29. return a.apply(b, c.concat(d(arguments)))
  30. }
  31. }
  32. function f(a) {
  33. var b = a.match(/^(https?:)\/\/([^\:\/\?#]+):?(\d*)/i);
  34. return b && (b[1] !== o.protocol || b[2] !== o.hostname || b[3] !== o.port)
  35. }
  36. function g(a) {
  37. var b = "timestamp=" + (new Date).getTime();
  38. return a + ( - 1 === a.indexOf("?") ? "?": "&") + b
  39. }
  40. function h(a, b) {
  41. return b.left < 0 && a.width < b.left + b.width && b.top < 0 && a.height < b.top + b.height
  42. }
  43. function i(a) {
  44. return a ? "rotate(" + a + "deg)": "none"
  45. }
  46. function j(a, b) {
  47. var c, d, e = R(a.degree) % 180,
  48. f = (e > 90 ? 180 - e: e) * Math.PI / 180,
  49. g = S(f),
  50. h = T(f),
  51. i = a.width,
  52. j = a.height,
  53. k = a.aspectRatio;
  54. return b ? (c = i / (h + g / k), d = c / k) : (c = i * h + j * g, d = i * g + j * h),
  55. {
  56. width: c,
  57. height: d
  58. }
  59. }
  60. function k(b, c) {
  61. var d = a("<canvas>")[0],
  62. e = d.getContext("2d"),
  63. f = c.naturalWidth,
  64. g = c.naturalHeight,
  65. h = c.rotate,
  66. i = j({
  67. width: f,
  68. height: g,
  69. degree: h
  70. });
  71. return h ? (d.width = i.width, d.height = i.height, e.save(), e.translate(i.width / 2, i.height / 2), e.rotate(h * Math.PI / 180), e.drawImage(b, -f / 2, -g / 2, f, g), e.restore()) : (d.width = f, d.height = g, e.drawImage(b, 0, 0, f, g)),
  72. d
  73. }
  74. function l(b, c) {
  75. this.$element = a(b),
  76. this.options = a.extend({},
  77. l.DEFAULTS, a.isPlainObject(c) && c),
  78. this.ready = !1,
  79. this.built = !1,
  80. this.rotated = !1,
  81. this.cropped = !1,
  82. this.disabled = !1,
  83. this.canvas = null,
  84. this.cropBox = null,
  85. this.load()
  86. }
  87. var m = a(window),
  88. n = a(document),
  89. o = window.location,
  90. p = ".cropper",
  91. q = "preview" + p,
  92. r = /^(e|n|w|s|ne|nw|sw|se|all|crop|move|zoom)$/,
  93. s = "cropper-modal",
  94. t = "cropper-hide",
  95. u = "cropper-hidden",
  96. v = "cropper-invisible",
  97. w = "cropper-move",
  98. x = "cropper-crop",
  99. y = "cropper-disabled",
  100. z = "cropper-bg",
  101. A = "mousedown touchstart",
  102. B = "mousemove touchmove",
  103. C = "mouseup mouseleave touchend touchleave touchcancel",
  104. D = "wheel mousewheel DOMMouseScroll",
  105. E = "dblclick",
  106. F = "resize" + p,
  107. G = "build" + p,
  108. H = "built" + p,
  109. I = "dragstart" + p,
  110. J = "dragmove" + p,
  111. K = "dragend" + p,
  112. L = "zoomin" + p,
  113. M = "zoomout" + p,
  114. N = a.isFunction(a("<canvas>")[0].getContext),
  115. O = Math.sqrt,
  116. P = Math.min,
  117. Q = Math.max,
  118. R = Math.abs,
  119. S = Math.sin,
  120. T = Math.cos,
  121. U = parseFloat,
  122. V = {};
  123. V.load = function(b) {
  124. var c, d, e, h, i = this.options,
  125. j = this.$element;
  126. if (!b) if (j.is("img")) {
  127. if (!j.attr("src")) return;
  128. b = j.prop("src")
  129. } else j.is("canvas") && N && (b = j[0].toDataURL());
  130. b && (e = a.Event(G), j.one(G, i.build).trigger(e), e.isDefaultPrevented() || (i.checkImageOrigin && f(b) && (c = "anonymous", j.prop("crossOrigin") || (d = g(b))), this.$clone = h = a("<img>"), h.one("load", a.proxy(function() {
  131. var a = h.prop("naturalWidth") || h.width(),
  132. c = h.prop("naturalHeight") || h.height();
  133. this.image = {
  134. naturalWidth: a,
  135. naturalHeight: c,
  136. aspectRatio: a / c,
  137. rotate: 0
  138. },
  139. this.url = b,
  140. this.ready = !0,
  141. this.build()
  142. },
  143. this)).one("error",
  144. function() {
  145. h.remove()
  146. }).attr({
  147. src: d || b,
  148. crossOrigin: c
  149. }), h.addClass(t).insertAfter(j)))
  150. },
  151. V.build = function() {
  152. var b, c, d = this.$element,
  153. e = this.$clone,
  154. f = this.options;
  155. this.ready && (this.built && this.unbuild(), this.$cropper = b = a(l.TEMPLATE), d.addClass(u), e.removeClass(t), this.$container = d.parent().append(b), this.$canvas = b.find(".cropper-canvas").append(e), this.$dragBox = b.find(".cropper-drag-box"), this.$cropBox = c = b.find(".cropper-crop-box"), this.$viewBox = b.find(".cropper-view-box"), this.addListeners(), this.initPreview(), f.aspectRatio = U(f.aspectRatio) || 0 / 0, f.autoCrop ? (this.cropped = !0, f.modal && this.$dragBox.addClass(s)) : c.addClass(u), f.background && b.addClass(z), f.highlight || c.find(".cropper-face").addClass(v), f.guides || c.find(".cropper-dashed").addClass(u), f.movable || c.find(".cropper-face").data("drag", "move"), f.resizable || c.find(".cropper-line, .cropper-point").addClass(u), this.setDragMode(f.dragCrop ? "crop": "move"), this.built = !0, this.render(), d.one(H, f.built).trigger(H))
  156. },
  157. V.unbuild = function() {
  158. this.built && (this.built = !1, this.container = null, this.canvas = null, this.cropBox = null, this.removeListeners(), this.resetPreview(), this.$preview = null, this.$viewBox = null, this.$cropBox = null, this.$dragBox = null, this.$canvas = null, this.$container = null, this.$cropper.remove(), this.$cropper = null)
  159. },
  160. a.extend(V, {
  161. render: function() {
  162. this.initContainer(),
  163. this.initCanvas(),
  164. this.initCropBox(),
  165. this.renderCanvas(),
  166. this.cropped && this.renderCropBox()
  167. },
  168. initContainer: function() {
  169. var a = this.$element,
  170. b = this.$container,
  171. c = this.$cropper,
  172. d = this.options;
  173. c.addClass(u),
  174. a.removeClass(u),
  175. c.css(this.container = {
  176. width: Q(b.width(), U(d.minContainerWidth) || 200),
  177. height: Q(b.height(), U(d.minContainerHeight) || 100)
  178. }),
  179. a.addClass(u),
  180. c.removeClass(u)
  181. },
  182. initCanvas: function() {
  183. var b = this.container,
  184. c = b.width,
  185. d = b.height,
  186. e = this.image,
  187. f = e.aspectRatio,
  188. g = {
  189. aspectRatio: f,
  190. width: c,
  191. height: d
  192. };
  193. d * f > c ? g.height = c / f: g.width = d * f,
  194. g.oldLeft = g.left = (c - g.width) / 2,
  195. g.oldTop = g.top = (d - g.height) / 2,
  196. this.canvas = g,
  197. this.limitCanvas(!0, !0),
  198. this.initialImage = a.extend({},
  199. e),
  200. this.initialCanvas = a.extend({},
  201. g)
  202. },
  203. limitCanvas: function(b, c) {
  204. var d, e, f = this.options,
  205. g = f.strict,
  206. h = this.container,
  207. i = h.width,
  208. j = h.height,
  209. k = this.canvas,
  210. l = k.aspectRatio,
  211. m = this.cropBox,
  212. n = this.cropped && m;
  213. b && (d = U(f.minCanvasWidth) || 0, e = U(f.minCanvasHeight) || 0, d ? (g && (d = Q(n ? m.width: i, d)), e = d / l) : e ? (g && (e = Q(n ? m.height: j, e)), d = e * l) : g && (n ? (d = m.width, e = m.height, e * l > d ? d = e * l: e = d / l) : (d = i, e = j, e * l > d ? e = d / l: d = e * l)), a.extend(k, {
  214. minWidth: d,
  215. minHeight: e,
  216. maxWidth: 1 / 0,
  217. maxHeight: 1 / 0
  218. })),
  219. c && (g ? n ? (k.minLeft = P(m.left, m.left + m.width - k.width), k.minTop = P(m.top, m.top + m.height - k.height), k.maxLeft = m.left, k.maxTop = m.top) : (k.minLeft = P(0, i - k.width), k.minTop = P(0, j - k.height), k.maxLeft = Q(0, i - k.width), k.maxTop = Q(0, j - k.height)) : (k.minLeft = -k.width, k.minTop = -k.height, k.maxLeft = i, k.maxTop = j))
  220. },
  221. renderCanvas: function(a) {
  222. var b, c, d = this.options,
  223. e = this.canvas,
  224. f = this.image;
  225. this.rotated && (this.rotated = !1, c = j({
  226. width: f.width,
  227. height: f.height,
  228. degree: f.rotate
  229. }), b = c.width / c.height, b !== e.aspectRatio && (e.left -= (c.width - e.width) / 2, e.top -= (c.height - e.height) / 2, e.width = c.width, e.height = c.height, e.aspectRatio = b, this.limitCanvas(!0, !1))),
  230. (e.width > e.maxWidth || e.width < e.minWidth) && (e.left = e.oldLeft),
  231. (e.height > e.maxHeight || e.height < e.minHeight) && (e.top = e.oldTop),
  232. e.width = P(Q(e.width, e.minWidth), e.maxWidth),
  233. e.height = P(Q(e.height, e.minHeight), e.maxHeight),
  234. this.limitCanvas(!1, !0),
  235. e.oldLeft = e.left = P(Q(e.left, e.minLeft), e.maxLeft),
  236. e.oldTop = e.top = P(Q(e.top, e.minTop), e.maxTop),
  237. this.$canvas.css({
  238. width: e.width,
  239. height: e.height,
  240. left: e.left,
  241. top: e.top
  242. }),
  243. this.renderImage(),
  244. this.cropped && d.strict && !h(this.container, e) && this.limitCropBox(!0, !0),
  245. a && this.output()
  246. },
  247. renderImage: function() {
  248. var b, c = this.canvas,
  249. d = this.image;
  250. d.rotate && (b = j({
  251. width: c.width,
  252. height: c.height,
  253. degree: d.rotate,
  254. aspectRatio: d.aspectRatio
  255. },
  256. !0)),
  257. a.extend(d, b ? {
  258. width: b.width,
  259. height: b.height,
  260. left: (c.width - b.width) / 2,
  261. top: (c.height - b.height) / 2
  262. }: {
  263. width: c.width,
  264. height: c.height,
  265. left: 0,
  266. top: 0
  267. }),
  268. this.$clone.css({
  269. width: d.width,
  270. height: d.height,
  271. marginLeft: d.left,
  272. marginTop: d.top,
  273. transform: i(d.rotate)
  274. })
  275. },
  276. initCropBox: function() {
  277. var b = this.options,
  278. c = this.canvas,
  279. d = b.aspectRatio,
  280. e = U(b.autoCropArea) || .8,
  281. f = {
  282. width: c.width,
  283. height: c.height
  284. };
  285. d && (c.height * d > c.width ? f.height = f.width / d: f.width = f.height * d),
  286. this.cropBox = f,
  287. this.limitCropBox(!0, !0),
  288. f.width = P(Q(f.width, f.minWidth), f.maxWidth),
  289. f.height = P(Q(f.height, f.minHeight), f.maxHeight),
  290. f.width = Q(f.minWidth, f.width * e),
  291. f.height = Q(f.minHeight, f.height * e),
  292. f.oldLeft = f.left = c.left + (c.width - f.width) / 2,
  293. f.oldTop = f.top = c.top + (c.height - f.height) / 2,
  294. this.initialCropBox = a.extend({},
  295. f)
  296. },
  297. limitCropBox: function(a, b) {
  298. var c, d, e = this.options,
  299. f = e.strict,
  300. g = this.container,
  301. h = g.width,
  302. i = g.height,
  303. j = this.canvas,
  304. k = this.cropBox,
  305. l = e.aspectRatio;
  306. a && (c = U(e.minCropBoxWidth) || 0, d = U(e.minCropBoxHeight) || 0, k.minWidth = P(h, c), k.minHeight = P(i, d), k.maxWidth = P(h, f ? j.width: h), k.maxHeight = P(i, f ? j.height: i), l && (k.maxHeight * l > k.maxWidth ? (k.minHeight = k.minWidth / l, k.maxHeight = k.maxWidth / l) : (k.minWidth = k.minHeight * l, k.maxWidth = k.maxHeight * l)), k.minWidth = P(k.maxWidth, k.minWidth), k.minHeight = P(k.maxHeight, k.minHeight)),
  307. b && (f ? (k.minLeft = Q(0, j.left), k.minTop = Q(0, j.top), k.maxLeft = P(h, j.left + j.width) - k.width, k.maxTop = P(i, j.top + j.height) - k.height) : (k.minLeft = 0, k.minTop = 0, k.maxLeft = h - k.width, k.maxTop = i - k.height))
  308. },
  309. renderCropBox: function() {
  310. var a = this.options,
  311. b = this.container,
  312. c = b.width,
  313. d = b.height,
  314. e = this.$cropBox,
  315. f = this.cropBox; (f.width > f.maxWidth || f.width < f.minWidth) && (f.left = f.oldLeft),
  316. (f.height > f.maxHeight || f.height < f.minHeight) && (f.top = f.oldTop),
  317. f.width = P(Q(f.width, f.minWidth), f.maxWidth),
  318. f.height = P(Q(f.height, f.minHeight), f.maxHeight),
  319. this.limitCropBox(!1, !0),
  320. f.oldLeft = f.left = P(Q(f.left, f.minLeft), f.maxLeft),
  321. f.oldTop = f.top = P(Q(f.top, f.minTop), f.maxTop),
  322. a.movable && e.find(".cropper-face").data("drag", f.width === c && f.height === d ? "move": "all"),
  323. e.css({
  324. width: f.width,
  325. height: f.height,
  326. left: f.left,
  327. top: f.top
  328. }),
  329. this.cropped && a.strict && !h(b, this.canvas) && this.limitCanvas(!0, !0),
  330. this.disabled || this.output()
  331. },
  332. output: function() {
  333. var a = this.options;
  334. this.preview(),
  335. a.crop && a.crop.call(this.$element, this.getData())
  336. }
  337. }),
  338. V.initPreview = function() {
  339. var b = this.url;
  340. this.$preview = a(this.options.preview),
  341. this.$viewBox.html('<img src="' + b + '">'),
  342. this.$preview.each(function() {
  343. var c = a(this);
  344. c.data(q, {
  345. width: c.width(),
  346. height: c.height(),
  347. original: c.html()
  348. }).html('<img src="' + b + '" style="display:block;width:100%;min-width:0!important;min-height:0!important;max-width:none!important;max-height:none!important;image-orientation: 0deg!important">')
  349. })
  350. },
  351. V.resetPreview = function() {
  352. this.$preview.each(function() {
  353. var b = a(this);
  354. b.html(b.data(q).original).removeData(q)
  355. })
  356. },
  357. V.preview = function() {
  358. var b = this.image,
  359. c = this.canvas,
  360. d = this.cropBox,
  361. e = b.width,
  362. f = b.height,
  363. g = d.left - c.left - b.left,
  364. h = d.top - c.top - b.top,
  365. j = b.rotate;
  366. this.cropped && !this.disabled && (this.$viewBox.find("img").css({
  367. width: e,
  368. height: f,
  369. marginLeft: -g,
  370. marginTop: -h,
  371. transform: i(j)
  372. }), this.$preview.each(function() {
  373. var b = a(this),
  374. c = b.data(q),
  375. k = c.width / d.width,
  376. l = c.width,
  377. m = d.height * k;
  378. m > c.height && (k = c.height / d.height, l = d.width * k, m = c.height),
  379. b.width(l).height(m).find("img").css({
  380. width: e * k,
  381. height: f * k,
  382. marginLeft: -g * k,
  383. marginTop: -h * k,
  384. transform: i(j)
  385. })
  386. }))
  387. },
  388. V.addListeners = function() {
  389. var b = this.options;
  390. this.$element.on(I, b.dragstart).on(J, b.dragmove).on(K, b.dragend).on(L, b.zoomin).on(M, b.zoomout),
  391. this.$cropper.on(A, a.proxy(this.dragstart, this)).on(E, a.proxy(this.dblclick, this)),
  392. b.zoomable && b.mouseWheelZoom && this.$cropper.on(D, a.proxy(this.wheel, this)),
  393. n.on(B, this._dragmove = e(this.dragmove, this)).on(C, this._dragend = e(this.dragend, this)),
  394. b.responsive && m.on(F, this._resize = e(this.resize, this))
  395. },
  396. V.removeListeners = function() {
  397. var a = this.options;
  398. this.$element.off(I, a.dragstart).off(J, a.dragmove).off(K, a.dragend).off(L, a.zoomin).off(M, a.zoomout),
  399. this.$cropper.off(A, this.dragstart).off(E, this.dblclick),
  400. a.zoomable && a.mouseWheelZoom && this.$cropper.off(D, this.wheel),
  401. n.off(B, this._dragmove).off(C, this._dragend),
  402. a.responsive && m.off(F, this._resize)
  403. },
  404. a.extend(V, {
  405. resize: function() {
  406. var b, c, d, e = this.$container,
  407. f = this.container;
  408. this.disabled || (d = e.width() / f.width, (1 !== d || e.height() !== f.height) && (b = this.getCanvasData(), c = this.getCropBoxData(), this.render(), this.setCanvasData(a.each(b,
  409. function(a, c) {
  410. b[a] = c * d
  411. })), this.setCropBoxData(a.each(c,
  412. function(a, b) {
  413. c[a] = b * d
  414. }))))
  415. },
  416. dblclick: function() {
  417. this.disabled || this.setDragMode(this.$dragBox.hasClass(x) ? "move": "crop")
  418. },
  419. wheel: function(a) {
  420. var b = a.originalEvent,
  421. c = 1;
  422. this.disabled || (a.preventDefault(), b.deltaY ? c = b.deltaY > 0 ? 1 : -1 : b.wheelDelta ? c = -b.wheelDelta / 120 : b.detail && (c = b.detail > 0 ? 1 : -1), this.zoom(.1 * -c))
  423. },
  424. dragstart: function(b) {
  425. var c, d, e, f = this.options,
  426. g = b.originalEvent,
  427. h = g && g.touches,
  428. i = b;
  429. if (!this.disabled) {
  430. if (h) {
  431. if (e = h.length, e > 1) {
  432. if (!f.zoomable || !f.touchDragZoom || 2 !== e) return;
  433. i = h[1],
  434. this.startX2 = i.pageX,
  435. this.startY2 = i.pageY,
  436. c = "zoom"
  437. }
  438. i = h[0]
  439. }
  440. if (c = c || a(i.target).data("drag"), r.test(c)) {
  441. if (b.preventDefault(), d = a.Event(I, {
  442. originalEvent: g,
  443. dragType: c
  444. }), this.$element.trigger(d), d.isDefaultPrevented()) return;
  445. this.dragType = c,
  446. this.cropping = !1,
  447. this.startX = i.pageX,
  448. this.startY = i.pageY,
  449. "crop" === c && (this.cropping = !0, this.$dragBox.addClass(s))
  450. }
  451. }
  452. },
  453. dragmove: function(b) {
  454. var c, d, e = this.options,
  455. f = b.originalEvent,
  456. g = f && f.touches,
  457. h = b,
  458. i = this.dragType;
  459. if (!this.disabled) {
  460. if (g) {
  461. if (d = g.length, d > 1) {
  462. if (!e.zoomable || !e.touchDragZoom || 2 !== d) return;
  463. h = g[1],
  464. this.endX2 = h.pageX,
  465. this.endY2 = h.pageY
  466. }
  467. h = g[0]
  468. }
  469. if (i) {
  470. if (b.preventDefault(), c = a.Event(J, {
  471. originalEvent: f,
  472. dragType: i
  473. }), this.$element.trigger(c), c.isDefaultPrevented()) return;
  474. this.endX = h.pageX,
  475. this.endY = h.pageY,
  476. this.change()
  477. }
  478. }
  479. },
  480. dragend: function(b) {
  481. var c, d = this.dragType;
  482. if (!this.disabled && d) {
  483. if (b.preventDefault(), c = a.Event(K, {
  484. originalEvent: b.originalEvent,
  485. dragType: d
  486. }), this.$element.trigger(c), c.isDefaultPrevented()) return;
  487. this.cropping && (this.cropping = !1, this.$dragBox.toggleClass(s, this.cropped && this.options.modal)),
  488. this.dragType = ""
  489. }
  490. }
  491. }),
  492. a.extend(V, {
  493. reset: function() {
  494. this.built && !this.disabled && (this.image = a.extend({},
  495. this.initialImage), this.canvas = a.extend({},
  496. this.initialCanvas), this.renderCanvas(), this.cropped && (this.cropBox = a.extend({},
  497. this.initialCropBox), this.renderCropBox()))
  498. },
  499. clear: function() {
  500. this.cropped && !this.disabled && (a.extend(this.cropBox, {
  501. left: 0,
  502. top: 0,
  503. width: 0,
  504. height: 0
  505. }), this.cropped = !1, this.renderCropBox(), this.limitCanvas(), this.renderCanvas(), this.$dragBox.removeClass(s), this.$cropBox.addClass(u))
  506. },
  507. destroy: function() {
  508. var a = this.$element;
  509. this.ready ? (this.unbuild(), a.removeClass(u)) : this.$clone.off("load").remove(),
  510. a.removeData("cropper")
  511. },
  512. replace: function(a) { ! this.disabled && a && this.load(a)
  513. },
  514. enable: function() {
  515. this.built && (this.disabled = !1, this.$cropper.removeClass(y))
  516. },
  517. disable: function() {
  518. this.built && (this.disabled = !0, this.$cropper.addClass(y))
  519. },
  520. move: function(a, c) {
  521. var d = this.canvas;
  522. this.built && !this.disabled && b(a) && b(c) && (d.left += a, d.top += c, this.renderCanvas(!0))
  523. },
  524. zoom: function(b) {
  525. var c, d, e, f = this.canvas;
  526. if (b = U(b), b && this.built && !this.disabled && this.options.zoomable) {
  527. if (c = a.Event(b > 0 ? L: M), this.$element.trigger(c), c.isDefaultPrevented()) return;
  528. b = -1 >= b ? 1 / (1 - b) : 1 >= b ? 1 + b: b,
  529. d = f.width * b,
  530. e = f.height * b,
  531. f.left -= (d - f.width) / 2,
  532. f.top -= (e - f.height) / 2,
  533. f.width = d,
  534. f.height = e,
  535. this.renderCanvas(!0),
  536. this.setDragMode("move")
  537. }
  538. },
  539. rotate: function(a) {
  540. var b = this.image;
  541. a = U(a),
  542. a && this.built && !this.disabled && this.options.rotatable && (b.rotate = (b.rotate + a) % 360, this.rotated = !0, this.renderCanvas(!0))
  543. },
  544. getData: function() {
  545. var b, c, d = this.cropBox,
  546. e = this.canvas,
  547. f = this.image;
  548. return this.built && this.cropped ? (c = {
  549. x: d.left - e.left,
  550. y: d.top - e.top,
  551. width: d.width,
  552. height: d.height
  553. },
  554. b = f.width / f.naturalWidth, a.each(c,
  555. function(a, d) {
  556. d /= b,
  557. c[a] = d
  558. })) : c = {
  559. x: 0,
  560. y: 0,
  561. width: 0,
  562. height: 0
  563. },
  564. c.rotate = f.rotate,
  565. c
  566. },
  567. getContainerData: function() {
  568. return this.built ? this.container: {}
  569. },
  570. getImageData: function() {
  571. return this.ready ? this.image: {}
  572. },
  573. getCanvasData: function() {
  574. var a, b = this.canvas;
  575. return this.built && (a = {
  576. left: b.left,
  577. top: b.top,
  578. width: b.width,
  579. height: b.height
  580. }),
  581. a || {}
  582. },
  583. setCanvasData: function(c) {
  584. var d = this.canvas,
  585. e = d.aspectRatio;
  586. this.built && !this.disabled && a.isPlainObject(c) && (b(c.left) && (d.left = c.left), b(c.top) && (d.top = c.top), b(c.width) ? (d.width = c.width, d.height = c.width / e) : b(c.height) && (d.height = c.height, d.width = c.height * e), this.renderCanvas(!0))
  587. },
  588. getCropBoxData: function() {
  589. var a, b = this.cropBox;
  590. return this.built && this.cropped && (a = {
  591. left: b.left,
  592. top: b.top,
  593. width: b.width,
  594. height: b.height
  595. }),
  596. a || {}
  597. },
  598. setCropBoxData: function(c) {
  599. var d = this.cropBox,
  600. e = this.options.aspectRatio;
  601. this.built && this.cropped && !this.disabled && a.isPlainObject(c) && (b(c.left) && (d.left = c.left), b(c.top) && (d.top = c.top), e ? b(c.width) ? (d.width = c.width, d.height = d.width / e) : b(c.height) && (d.height = c.height, d.width = d.height * e) : (b(c.width) && (d.width = c.width), b(c.height) && (d.height = c.height)), this.renderCropBox())
  602. },
  603. getCroppedCanvas: function(b) {
  604. var c, d, e, f, g, h, i, j, l, m, n;
  605. if (this.built && this.cropped && N) return a.isPlainObject(b) || (b = {}),
  606. n = this.getData(),
  607. c = n.width,
  608. d = n.height,
  609. j = c / d,
  610. a.isPlainObject(b) && (g = b.width, h = b.height, g ? (h = g / j, i = g / c) : h && (g = h * j, i = h / d)),
  611. e = g || c,
  612. f = h || d,
  613. l = a("<canvas>")[0],
  614. l.width = e,
  615. l.height = f,
  616. m = l.getContext("2d"),
  617. b.fillColor && (m.fillStyle = b.fillColor, m.fillRect(0, 0, e, f)),
  618. m.drawImage.apply(m,
  619. function() {
  620. var a, b, e, f, g, h, j = k(this.$clone[0], this.image),
  621. l = j.width,
  622. m = j.height,
  623. o = [j],
  624. p = n.x,
  625. q = n.y;
  626. return - c >= p || p > l ? p = a = e = g = 0 : 0 >= p ? (e = -p, p = 0, a = g = P(l, c + p)) : l >= p && (e = 0, a = g = P(c, l - p)),
  627. 0 >= a || -d >= q || q > m ? q = b = f = h = 0 : 0 >= q ? (f = -q, q = 0, b = h = P(m, d + q)) : m >= q && (f = 0, b = h = P(d, m - q)),
  628. o.push(p, q, a, b),
  629. i && (e *= i, f *= i, g *= i, h *= i),
  630. g > 0 && h > 0 && o.push(e, f, g, h),
  631. o
  632. }.call(this)),
  633. l
  634. },
  635. setAspectRatio: function(a) {
  636. var b = this.options;
  637. this.disabled || c(a) || (b.aspectRatio = U(a) || 0 / 0, this.built && (this.initCropBox(), this.cropped && this.renderCropBox()))
  638. },
  639. setDragMode: function(a) {
  640. var b = this.$dragBox,
  641. c = !1,
  642. d = !1;
  643. if (this.ready && !this.disabled) {
  644. switch (a) {
  645. case "crop":
  646. this.options.dragCrop ? (c = !0, b.data("drag", a)) : d = !0;
  647. break;
  648. case "move":
  649. d = !0,
  650. b.data("drag", a);
  651. break;
  652. default:
  653. b.removeData("drag")
  654. }
  655. b.toggleClass(x, c).toggleClass(w, d)
  656. }
  657. }
  658. }),
  659. V.change = function() {
  660. var a, b = this.dragType,
  661. c = this.options,
  662. d = this.canvas,
  663. e = this.container,
  664. f = this.cropBox,
  665. g = f.width,
  666. h = f.height,
  667. i = f.left,
  668. j = f.top,
  669. k = i + g,
  670. l = j + h,
  671. m = 0,
  672. n = 0,
  673. o = e.width,
  674. p = e.height,
  675. q = !0,
  676. r = c.aspectRatio,
  677. s = {
  678. x: this.endX - this.startX,
  679. y: this.endY - this.startY
  680. };
  681. switch (c.strict && (m = f.minLeft, n = f.minTop, o = m + P(e.width, d.width), p = n + P(e.height, d.height)), r && (s.X = s.y * r, s.Y = s.x / r), b) {
  682. case "all":
  683. i += s.x,
  684. j += s.y;
  685. break;
  686. case "e":
  687. if (s.x >= 0 && (k >= o || r && (n >= j || l >= p))) {
  688. q = !1;
  689. break
  690. }
  691. g += s.x,
  692. r && (h = g / r, j -= s.Y / 2),
  693. 0 > g && (b = "w", g = 0);
  694. break;
  695. case "n":
  696. if (s.y <= 0 && (n >= j || r && (m >= i || k >= o))) {
  697. q = !1;
  698. break
  699. }
  700. h -= s.y,
  701. j += s.y,
  702. r && (g = h * r, i += s.X / 2),
  703. 0 > h && (b = "s", h = 0);
  704. break;
  705. case "w":
  706. if (s.x <= 0 && (m >= i || r && (n >= j || l >= p))) {
  707. q = !1;
  708. break
  709. }
  710. g -= s.x,
  711. i += s.x,
  712. r && (h = g / r, j += s.Y / 2),
  713. 0 > g && (b = "e", g = 0);
  714. break;
  715. case "s":
  716. if (s.y >= 0 && (l >= p || r && (m >= i || k >= o))) {
  717. q = !1;
  718. break
  719. }
  720. h += s.y,
  721. r && (g = h * r, i -= s.X / 2),
  722. 0 > h && (b = "n", h = 0);
  723. break;
  724. case "ne":
  725. if (r) {
  726. if (s.y <= 0 && (n >= j || k >= o)) {
  727. q = !1;
  728. break
  729. }
  730. h -= s.y,
  731. j += s.y,
  732. g = h * r
  733. } else s.x >= 0 ? o > k ? g += s.x: s.y <= 0 && n >= j && (q = !1) : g += s.x,
  734. s.y <= 0 ? j > 0 && (h -= s.y, j += s.y) : (h -= s.y, j += s.y);
  735. 0 > g && 0 > h ? (b = "sw", h = 0, g = 0) : 0 > g ? (b = "nw", g = 0) : 0 > h && (b = "se", h = 0);
  736. break;
  737. case "nw":
  738. if (r) {
  739. if (s.y <= 0 && (n >= j || m >= i)) {
  740. q = !1;
  741. break
  742. }
  743. h -= s.y,
  744. j += s.y,
  745. g = h * r,
  746. i += s.X
  747. } else s.x <= 0 ? i > 0 ? (g -= s.x, i += s.x) : s.y <= 0 && n >= j && (q = !1) : (g -= s.x, i += s.x),
  748. s.y <= 0 ? j > 0 && (h -= s.y, j += s.y) : (h -= s.y, j += s.y);
  749. 0 > g && 0 > h ? (b = "se", h = 0, g = 0) : 0 > g ? (b = "ne", g = 0) : 0 > h && (b = "sw", h = 0);
  750. break;
  751. case "sw":
  752. if (r) {
  753. if (s.x <= 0 && (m >= i || l >= p)) {
  754. q = !1;
  755. break
  756. }
  757. g -= s.x,
  758. i += s.x,
  759. h = g / r
  760. } else s.x <= 0 ? i > 0 ? (g -= s.x, i += s.x) : s.y >= 0 && l >= p && (q = !1) : (g -= s.x, i += s.x),
  761. s.y >= 0 ? p > l && (h += s.y) : h += s.y;
  762. 0 > g && 0 > h ? (b = "ne", h = 0, g = 0) : 0 > g ? (b = "se", g = 0) : 0 > h && (b = "nw", h = 0);
  763. break;
  764. case "se":
  765. if (r) {
  766. if (s.x >= 0 && (k >= o || l >= p)) {
  767. q = !1;
  768. break
  769. }
  770. g += s.x,
  771. h = g / r
  772. } else s.x >= 0 ? o > k ? g += s.x: s.y >= 0 && l >= p && (q = !1) : g += s.x,
  773. s.y >= 0 ? p > l && (h += s.y) : h += s.y;
  774. 0 > g && 0 > h ? (b = "nw", h = 0, g = 0) : 0 > g ? (b = "sw", g = 0) : 0 > h && (b = "ne", h = 0);
  775. break;
  776. case "move":
  777. d.left += s.x,
  778. d.top += s.y,
  779. this.renderCanvas(!0),
  780. q = !1;
  781. break;
  782. case "zoom":
  783. this.zoom(function(a, b, c, d) {
  784. var e = O(a * a + b * b),
  785. f = O(c * c + d * d);
  786. return (f - e) / e
  787. } (R(this.startX - this.startX2), R(this.startY - this.startY2), R(this.endX - this.endX2), R(this.endY - this.endY2))),
  788. this.startX2 = this.endX2,
  789. this.startY2 = this.endY2,
  790. q = !1;
  791. break;
  792. case "crop":
  793. s.x && s.y && (a = this.$cropper.offset(), i = this.startX - a.left, j = this.startY - a.top, g = f.minWidth, h = f.minHeight, s.x > 0 ? s.y > 0 ? b = "se": (b = "ne", j -= h) : s.y > 0 ? (b = "sw", i -= g) : (b = "nw", i -= g, j -= h), this.cropped || (this.cropped = !0, this.$cropBox.removeClass(u)))
  794. }
  795. q && (f.width = g, f.height = h, f.left = i, f.top = j, this.dragType = b, this.renderCropBox()),
  796. this.startX = this.endX,
  797. this.startY = this.endY
  798. },
  799. a.extend(l.prototype, V),
  800. l.DEFAULTS = {
  801. aspectRatio: 0 / 0,
  802. autoCropArea: .8,
  803. crop: null,
  804. preview: "",
  805. strict: !0,
  806. responsive: !0,
  807. checkImageOrigin: !0,
  808. modal: !0,
  809. guides: !0,
  810. highlight: !0,
  811. background: !0,
  812. autoCrop: !0,
  813. dragCrop: !0,
  814. movable: !0,
  815. resizable: !0,
  816. rotatable: !0,
  817. zoomable: !0,
  818. touchDragZoom: !0,
  819. mouseWheelZoom: !0,
  820. minCanvasWidth: 0,
  821. minCanvasHeight: 0,
  822. minCropBoxWidth: 0,
  823. minCropBoxHeight: 0,
  824. minContainerWidth: 200,
  825. minContainerHeight: 100,
  826. build: null,
  827. built: null,
  828. dragstart: null,
  829. dragmove: null,
  830. dragend: null,
  831. zoomin: null,
  832. zoomout: null
  833. },
  834. l.setDefaults = function(b) {
  835. a.extend(l.DEFAULTS, b)
  836. },
  837. l.TEMPLATE = function(a, b) {
  838. return b = b.split(","),
  839. a.replace(/\d+/g,
  840. function(a) {
  841. return b[a]
  842. })
  843. } ('<0 6="5-container"><0 6="5-canvas"></0><0 6="5-2-9" 3-2="move"></0><0 6="5-crop-9"><1 6="5-view-9"></1><1 6="5-8 8-h"></1><1 6="5-8 8-v"></1><1 6="5-face" 3-2="all"></1><1 6="5-7 7-e" 3-2="e"></1><1 6="5-7 7-n" 3-2="n"></1><1 6="5-7 7-w" 3-2="w"></1><1 6="5-7 7-s" 3-2="s"></1><1 6="5-4 4-e" 3-2="e"></1><1 6="5-4 4-n" 3-2="n"></1><1 6="5-4 4-w" 3-2="w"></1><1 6="5-4 4-s" 3-2="s"></1><1 6="5-4 4-ne" 3-2="ne"></1><1 6="5-4 4-nw" 3-2="nw"></1><1 6="5-4 4-sw" 3-2="sw"></1><1 6="5-4 4-se" 3-2="se"></1></0></0>', "div,span,drag,data,point,cropper,class,line,dashed,box"),
  844. l.other = a.fn.cropper,
  845. a.fn.cropper = function(b) {
  846. var e, f = d(arguments, 1);
  847. return this.each(function() {
  848. var c, d = a(this),
  849. g = d.data("cropper");
  850. g || d.data("cropper", g = new l(this, b)),
  851. "string" == typeof b && a.isFunction(c = g[b]) && (e = c.apply(g, f))
  852. }),
  853. c(e) ? this: e
  854. },
  855. a.fn.cropper.Constructor = l,
  856. a.fn.cropper.setDefaults = l.setDefaults,
  857. a.fn.cropper.noConflict = function() {
  858. return a.fn.cropper = l.other,
  859. this
  860. }
  861. });