viewer-jquery.min.js 26 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476
  1. /*!
  2. * Viewer v0.5.0
  3. * https://github.com/fengyuanchen/viewer
  4. *
  5. * Copyright (c) 2015-2016 Fengyuan Chen
  6. * Released under the MIT license
  7. *
  8. * Date: 2016-01-21T09:59:52.834Z
  9. */
  10. !function (i) {
  11. "function" == typeof define && define.amd ? define("viewer", ["jquery"], i) : i("object" == typeof exports ? require("jquery") : jQuery)
  12. }(function (i) {
  13. "use strict";
  14. function t(i) {
  15. return "string" == typeof i
  16. }
  17. function e(i) {
  18. return "number" == typeof i && !isNaN(i)
  19. }
  20. function s(i) {
  21. return "undefined" == typeof i
  22. }
  23. function n(i, t) {
  24. var s = [];
  25. return e(t) && s.push(t), s.slice.apply(i, s)
  26. }
  27. function o(i, t) {
  28. var e = n(arguments, 2);
  29. return function () {
  30. return i.apply(t, e.concat(n(arguments)))
  31. }
  32. }
  33. function a(i) {
  34. var t = [], s = i.rotate, n = i.scaleX, o = i.scaleY;
  35. return e(s) && t.push("rotate(" + s + "deg)"), e(n) && e(o) && t.push("scale(" + n + "," + o + ")"), t.length ? t.join(" ") : "none"
  36. }
  37. function h(i) {
  38. return i.offsetWidth
  39. }
  40. function r(i) {
  41. return t(i) ? i.replace(/^.*\//, "").replace(/[\?&#].*$/, "") : ""
  42. }
  43. function l(i, t) {
  44. var e;
  45. return i.naturalWidth ? t(i.naturalWidth, i.naturalHeight) : (e = document.createElement("img"), e.onload = function () {
  46. t(this.width, this.height)
  47. }, void(e.src = i.src))
  48. }
  49. function d(t) {
  50. var e = t.length, s = 0, n = 0;
  51. return e && (i.each(t, function (i, t) {
  52. s += t.pageX, n += t.pageY
  53. }), s /= e, n /= e), {pageX: s, pageY: n}
  54. }
  55. function c(i) {
  56. switch (i) {
  57. case 2:
  58. return x;
  59. case 3:
  60. return $;
  61. case 4:
  62. return C
  63. }
  64. }
  65. function u(t, e) {
  66. this.$element = i(t), this.options = i.extend({}, u.DEFAULTS, i.isPlainObject(e) && e), this.isImg = !1, this.isBuilt = !1, this.isShown = !1, this.isViewed = !1, this.isFulled = !1, this.isPlayed = !1, this.wheeling = !1, this.playing = !1, this.fading = !1, this.tooltiping = !1, this.transitioning = !1, this.action = !1, this.target = !1, this.timeout = !1, this.index = 0, this.length = 0, this.init()
  67. }
  68. var m = i(window), v = i(document), f = "viewer", g = document.createElement(f), w = "viewer-fixed",
  69. p = "viewer-open", b = "viewer-show", y = "viewer-hide", x = "viewer-hide-xs-down", $ = "viewer-hide-sm-down",
  70. C = "viewer-hide-md-down", z = "viewer-fade", F = "viewer-in", Y = "viewer-move", k = "viewer-active",
  71. I = "viewer-invisible", X = "viewer-transition", P = "viewer-fullscreen", T = "viewer-fullscreen-exit",
  72. V = "viewer-close", E = "img", S = "mousedown touchstart pointerdown MSPointerDown",
  73. D = "mousemove touchmove pointermove MSPointerMove",
  74. L = "mouseup touchend touchcancel pointerup pointercancel MSPointerUp MSPointerCancel",
  75. q = "wheel mousewheel DOMMouseScroll", R = "transitionend", M = "load." + f, W = "keydown." + f, _ = "click." + f,
  76. j = "resize." + f, A = "build." + f, B = "built." + f, H = "show." + f, U = "shown." + f, N = "hide." + f,
  77. O = "hidden." + f, Z = "view." + f, K = "viewed." + f, Q = "undefined" != typeof g.style.transition, G = Math.round,
  78. J = Math.sqrt, ii = Math.abs, ti = Math.min, ei = Math.max, si = Number;
  79. u.prototype = {
  80. constructor: u, init: function () {
  81. var t = this.options, e = this.$element, s = e.is(E), n = s ? e : e.find(E), o = n.length,
  82. a = i.proxy(this.ready, this);
  83. o && (i.isFunction(t.build) && e.one(A, t.build), this.trigger(A).isDefaultPrevented() || (Q || (t.transition = !1), this.isImg = s, this.length = o, this.count = 0, this.$images = n, this.$body = i("body"), t.inline ? (e.one(B, i.proxy(function () {
  84. this.view()
  85. }, this)), n.each(function () {
  86. this.complete ? a() : i(this).one(M, a)
  87. })) : e.on(_, i.proxy(this.start, this))))
  88. }, ready: function () {
  89. this.count++, this.count === this.length && this.build()
  90. }, build: function () {
  91. var t, e, s, n, o, a, h = this.options, r = this.$element;
  92. this.isBuilt || (this.$parent = t = r.parent(), this.$viewer = e = i(u.TEMPLATE), this.$canvas = e.find(".viewer-canvas"), this.$footer = e.find(".viewer-footer"), this.$title = s = e.find(".viewer-title"), this.$toolbar = n = e.find(".viewer-toolbar"), this.$navbar = o = e.find(".viewer-navbar"), this.$button = a = e.find(".viewer-button"), this.$tooltip = e.find(".viewer-tooltip"), this.$player = e.find(".viewer-player"), this.$list = e.find(".viewer-list"), s.addClass(h.title ? c(h.title) : y), n.addClass(h.toolbar ? c(h.toolbar) : y), n.find("li[class*=zoom]").toggleClass(I, !h.zoomable), n.find("li[class*=flip]").toggleClass(I, !h.scalable), h.rotatable || n.find("li[class*=rotate]").addClass(I).appendTo(n), o.addClass(h.navbar ? c(h.navbar) : y), h.inline ? (a.addClass(P), e.css("z-index", h.zIndexInline), "static" === t.css("position") && t.css("position", "relative")) : (a.addClass(V), e.css("z-index", h.zIndex).addClass([w, z, y].join(" "))), r.after(e), h.inline && (this.render(), this.bind(), this.isShown = !0), this.isBuilt = !0, i.isFunction(h.built) && r.one(B, h.built), this.trigger(B))
  93. }, unbuild: function () {
  94. var i = this.options, t = this.$element;
  95. this.isBuilt && (i.inline && t.removeClass(y), this.$viewer.remove())
  96. }, bind: function () {
  97. var t = this.options, e = this.$element;
  98. i.isFunction(t.view) && e.on(Z, t.view), i.isFunction(t.viewed) && e.on(K, t.viewed), this.$viewer.on(_, i.proxy(this.click, this)).on(q, i.proxy(this.wheel, this)), this.$canvas.on(S, i.proxy(this.mousedown, this)), v.on(D, this._mousemove = o(this.mousemove, this)).on(L, this._mouseup = o(this.mouseup, this)).on(W, this._keydown = o(this.keydown, this)), m.on(j, this._resize = o(this.resize, this))
  99. }, unbind: function () {
  100. var t = this.options, e = this.$element;
  101. i.isFunction(t.view) && e.off(Z, t.view), i.isFunction(t.viewed) && e.off(K, t.viewed), this.$viewer.off(_, this.click).off(q, this.wheel), this.$canvas.off(S, this.mousedown), v.off(D, this._mousemove).off(L, this._mouseup).off(W, this._keydown), m.off(j, this._resize)
  102. }, render: function () {
  103. this.initContainer(), this.initViewer(), this.initList(), this.renderViewer()
  104. }, initContainer: function () {
  105. this.container = {width: m.innerWidth(), height: m.innerHeight()}
  106. }, initViewer: function () {
  107. var t, e = this.options, s = this.$parent;
  108. e.inline && (this.parent = t = {
  109. width: ei(s.width(), e.minWidth),
  110. height: ei(s.height(), e.minHeight)
  111. }), (this.isFulled || !t) && (t = this.container), this.viewer = i.extend({}, t)
  112. }, renderViewer: function () {
  113. this.options.inline && !this.isFulled && this.$viewer.css(this.viewer)
  114. }, initList: function () {
  115. var e = this.options, s = this.$element, n = this.$list, o = [];
  116. this.$images.each(function (s) {
  117. var n = this.src, a = this.alt || r(n), h = e.url;
  118. n && (t(h) ? h = this.getAttribute(h) : i.isFunction(h) && (h = h.call(this, this)), o.push('<li><img src="' + n + '" data-action="view" data-index="' + s + '" data-original-url="' + (h || n) + '" alt="' + a + '"></li>'))
  119. }), n.html(o.join("")).find(E).one(M, {filled: !0}, i.proxy(this.loadImage, this)), this.$items = n.children(), e.transition && s.one(K, function () {
  120. n.addClass(X)
  121. })
  122. }, renderList: function (i) {
  123. var t = i || this.index, e = this.$items.eq(t).width(), s = e + 1;
  124. this.$list.css({width: s * this.length, marginLeft: (this.viewer.width - e) / 2 - s * t})
  125. }, resetList: function () {
  126. this.$list.empty().removeClass(X).css("margin-left", 0)
  127. }, initImage: function (t) {
  128. var e = this.options, s = this.$image, n = this.viewer, o = this.$footer.height(), a = n.width,
  129. h = ei(n.height - o, o), r = this.image || {};
  130. l(s[0], i.proxy(function (s, n) {
  131. var o, l, d = s / n, c = a, u = h;
  132. h * d > a ? u = a / d : c = h * d, c = ti(.9 * c, s), u = ti(.9 * u, n), l = {
  133. naturalWidth: s,
  134. naturalHeight: n,
  135. aspectRatio: d,
  136. ratio: c / s,
  137. width: c,
  138. height: u,
  139. left: (a - c) / 2,
  140. top: (h - u) / 2
  141. }, o = i.extend({}, l), e.rotatable && (l.rotate = r.rotate || 0, o.rotate = 0), e.scalable && (l.scaleX = r.scaleX || 1, l.scaleY = r.scaleY || 1, o.scaleX = 1, o.scaleY = 1), this.image = l, this.initialImage = o, i.isFunction(t) && t()
  142. }, this))
  143. }, renderImage: function (t) {
  144. var e = this.image, s = this.$image;
  145. s.css({
  146. width: e.width,
  147. height: e.height,
  148. marginLeft: e.left,
  149. marginTop: e.top,
  150. transform: a(e)
  151. }), i.isFunction(t) && (this.transitioning ? s.one(R, t) : t())
  152. }, resetImage: function () {
  153. this.$image.remove(), this.$image = null
  154. }, start: function (t) {
  155. var e = t.target;
  156. i(e).is("img") && (this.target = e, this.show())
  157. }, click: function (t) {
  158. var e = i(t.target), s = e.data("action"), n = this.image;
  159. switch (s) {
  160. case"mix":
  161. this.isPlayed ? this.stop() : this.options.inline ? this.isFulled ? this.exit() : this.full() : this.hide();
  162. break;
  163. case"view":
  164. this.view(e.data("index"));
  165. break;
  166. case"zoom-in":
  167. this.zoom(.1, !0);
  168. break;
  169. case"zoom-out":
  170. this.zoom(-.1, !0);
  171. break;
  172. case"one-to-one":
  173. this.toggle();
  174. break;
  175. case"reset":
  176. this.reset();
  177. break;
  178. case"prev":
  179. this.prev();
  180. break;
  181. case"play":
  182. this.play();
  183. break;
  184. case"next":
  185. this.next();
  186. break;
  187. case"rotate-left":
  188. this.rotate(-90);
  189. break;
  190. case"rotate-right":
  191. this.rotate(90);
  192. break;
  193. case"flip-horizontal":
  194. this.scaleX(-n.scaleX || -1);
  195. break;
  196. case"flip-vertical":
  197. this.scaleY(-n.scaleY || -1);
  198. break;
  199. default:
  200. this.isPlayed && this.stop()
  201. }
  202. }, load: function () {
  203. var t = this.options, e = this.viewer, s = this.$image;
  204. this.timeout && (clearTimeout(this.timeout), this.timeout = !1), s.removeClass(I).css("cssText", "width:0;height:0;margin-left:" + e.width / 2 + "px;margin-top:" + e.height / 2 + "px;max-width:none!important;visibility:visible;"), this.initImage(i.proxy(function () {
  205. s.toggleClass(X, t.transition).toggleClass(Y, t.movable), this.renderImage(i.proxy(function () {
  206. this.isViewed = !0, this.trigger(K)
  207. }, this))
  208. }, this))
  209. }, loadImage: function (t) {
  210. var e = t.target, s = i(e), n = s.parent(), o = n.width(), a = n.height(), h = t.data && t.data.filled;
  211. l(e, function (i, t) {
  212. var e = i / t, n = o, r = a;
  213. a * e > o ? h ? n = a * e : r = o / e : h ? r = o / e : n = a * e, s.css({
  214. width: n,
  215. height: r,
  216. marginLeft: (o - n) / 2,
  217. marginTop: (a - r) / 2
  218. })
  219. })
  220. }, resize: function () {
  221. this.initContainer(), this.initViewer(), this.renderViewer(), this.renderList(), this.initImage(i.proxy(function () {
  222. this.renderImage()
  223. }, this)), this.isPlayed && this.$player.find(E).one(M, i.proxy(this.loadImage, this)).trigger(M)
  224. }, wheel: function (t) {
  225. var e = t.originalEvent || t, s = si(this.options.zoomRatio) || .1, n = 1;
  226. this.isViewed && (t.preventDefault(), this.wheeling || (this.wheeling = !0, setTimeout(i.proxy(function () {
  227. this.wheeling = !1
  228. }, this), 50), e.deltaY ? n = e.deltaY > 0 ? 1 : -1 : e.wheelDelta ? n = -e.wheelDelta / 120 : e.detail && (n = e.detail > 0 ? 1 : -1), this.zoom(-n * s, !0, t)))
  229. }, keydown: function (i) {
  230. var t = this.options, e = i.which;
  231. if (this.isFulled && t.keyboard) switch (e) {
  232. case 27:
  233. this.isPlayed ? this.stop() : t.inline ? this.isFulled && this.exit() : this.hide();
  234. break;
  235. case 32:
  236. this.isPlayed && this.stop();
  237. break;
  238. case 37:
  239. this.prev();
  240. break;
  241. case 38:
  242. i.preventDefault(), this.zoom(t.zoomRatio, !0);
  243. break;
  244. case 39:
  245. this.next();
  246. break;
  247. case 40:
  248. i.preventDefault(), this.zoom(-t.zoomRatio, !0);
  249. break;
  250. case 48:
  251. case 49:
  252. (i.ctrlKey || i.shiftKey) && (i.preventDefault(), this.toggle())
  253. }
  254. }, mousedown: function (i) {
  255. var t, e = this.options, s = i.originalEvent, n = s && s.touches, o = i, a = e.movable ? "move" : !1;
  256. if (this.isViewed) {
  257. if (n) {
  258. if (t = n.length, t > 1) {
  259. if (!e.zoomable || 2 !== t) return;
  260. o = n[1], this.startX2 = o.pageX, this.startY2 = o.pageY, a = "zoom"
  261. } else this.isSwitchable() && (a = "switch");
  262. o = n[0]
  263. }
  264. a && (i.preventDefault(), this.action = a, this.startX = o.pageX || s && s.pageX, this.startY = o.pageY || s && s.pageY)
  265. }
  266. }, mousemove: function (i) {
  267. var t, e = this.options, s = this.action, n = this.$image, o = i.originalEvent, a = o && o.touches, h = i;
  268. if (this.isViewed) {
  269. if (a) {
  270. if (t = a.length, t > 1) {
  271. if (!e.zoomable || 2 !== t) return;
  272. h = a[1], this.endX2 = h.pageX, this.endY2 = h.pageY
  273. }
  274. h = a[0]
  275. }
  276. s && (i.preventDefault(), "move" === s && e.transition && n.hasClass(X) && n.removeClass(X), this.endX = h.pageX || o && o.pageX, this.endY = h.pageY || o && o.pageY, this.change(i))
  277. }
  278. }, mouseup: function (i) {
  279. var t = this.action;
  280. t && (i.preventDefault(), "move" === t && this.options.transition && this.$image.addClass(X), this.action = !1)
  281. }, show: function () {
  282. var t, e = this.options;
  283. e.inline || this.transitioning || (this.isBuilt || this.build(), i.isFunction(e.show) && this.$element.one(H, e.show), this.trigger(H).isDefaultPrevented() || (this.$body.addClass(p), t = this.$viewer.removeClass(y), this.$element.one(U, i.proxy(function () {
  284. this.view(this.target ? this.$images.index(this.target) : this.index), this.target = !1
  285. }, this)), e.transition ? (this.transitioning = !0, t.addClass(X), h(t[0]), t.one(R, i.proxy(this.shown, this)).addClass(F)) : (t.addClass(F), this.shown())))
  286. }, hide: function () {
  287. var t = this.options, e = this.$viewer;
  288. t.inline || this.transitioning || !this.isShown || (i.isFunction(t.hide) && this.$element.one(N, t.hide), this.trigger(N).isDefaultPrevented() || (this.isViewed && t.transition ? (this.transitioning = !0, this.$image.one(R, i.proxy(function () {
  289. e.one(R, i.proxy(this.hidden, this)).removeClass(F)
  290. }, this)), this.zoomTo(0, !1, !1, !0)) : (e.removeClass(F), this.hidden())))
  291. }, view: function (t) {
  292. var e, s, n, o, a, h = this.$title;
  293. t = Number(t) || 0, !this.isShown || this.isPlayed || 0 > t || t >= this.length || this.isViewed && t === this.index || this.trigger(Z).isDefaultPrevented() || (s = this.$items.eq(t), n = s.find(E), o = n.data("originalUrl"), a = n.attr("alt"), this.$image = e = i('<img id="234" src="' + o + '" alt="' + a + '">'), this.isViewed && this.$items.eq(this.index).removeClass(k), s.addClass(k), this.isViewed = !1, this.index = t, this.image = null, this.$canvas.html(e.addClass(I)), this.renderList(), h.empty(), this.$element.one(K, i.proxy(function () {
  294. var i = this.image, t = i.naturalWidth, e = i.naturalHeight;
  295. h.html(a + " (" + t + " &times; " + e + ")")
  296. }, this)), e[0].complete ? this.load() : (e.one(M, i.proxy(this.load, this)), this.timeout && clearTimeout(this.timeout), this.timeout = setTimeout(i.proxy(function () {
  297. e.removeClass(I), this.timeout = !1
  298. }, this), 1e3)))
  299. }, prev: function () {
  300. this.view(ei(this.index - 1, 0))
  301. }, next: function () {
  302. this.view(ti(this.index + 1, this.length - 1))
  303. }, move: function (i, t) {
  304. var e = this.image;
  305. this.moveTo(s(i) ? i : e.left + si(i), s(t) ? t : e.top + si(t))
  306. }, moveTo: function (i, t) {
  307. var n = this.image, o = !1;
  308. s(t) && (t = i), i = si(i), t = si(t), this.isViewed && !this.isPlayed && this.options.movable && (e(i) && (n.left = i, o = !0), e(t) && (n.top = t, o = !0), o && this.renderImage())
  309. }, zoom: function (i, t, e) {
  310. var s = this.image;
  311. i = si(i), i = 0 > i ? 1 / (1 - i) : 1 + i, this.zoomTo(s.width * i / s.naturalWidth, t, e)
  312. }, zoomTo: function (i, t, s, n) {
  313. var o, a, h, r, l, c = this.options, u = .01, m = 100, v = this.image, f = v.width, g = v.height;
  314. i = ei(0, i), e(i) && this.isViewed && !this.isPlayed && (n || c.zoomable) && (n || (u = ei(u, c.minZoomRatio), m = ti(m, c.maxZoomRatio), i = ti(ei(i, u), m)), i > .95 && 1.05 > i && (i = 1), a = v.naturalWidth * i, h = v.naturalHeight * i, s && (o = s.originalEvent) ? (r = this.$viewer.offset(), l = o.touches ? d(o.touches) : {
  315. pageX: s.pageX || o.pageX || 0,
  316. pageY: s.pageY || o.pageY || 0
  317. }, v.left -= (a - f) * ((l.pageX - r.left - v.left) / f), v.top -= (h - g) * ((l.pageY - r.top - v.top) / g)) : (v.left -= (a - f) / 2, v.top -= (h - g) / 2), v.width = a, v.height = h, v.ratio = i, this.renderImage(), t && this.tooltip())
  318. }, rotate: function (i) {
  319. this.rotateTo((this.image.rotate || 0) + si(i))
  320. }, rotateTo: function (i) {
  321. var t = this.image;
  322. i = si(i), e(i) && this.isViewed && !this.isPlayed && this.options.rotatable && (t.rotate = i, this.renderImage())
  323. }, scale: function (i, t) {
  324. var n = this.image, o = !1;
  325. s(t) && (t = i), i = si(i), t = si(t), this.isViewed && !this.isPlayed && this.options.scalable && (e(i) && (n.scaleX = i, o = !0), e(t) && (n.scaleY = t, o = !0), o && this.renderImage())
  326. }, scaleX: function (i) {
  327. this.scale(i, this.image.scaleY)
  328. }, scaleY: function (i) {
  329. this.scale(this.image.scaleX, i)
  330. }, play: function () {
  331. var t, s = this.options, n = this.$player, o = i.proxy(this.loadImage, this), a = [], h = 0, r = 0;
  332. this.isShown && !this.isPlayed && (s.fullscreen && this.requestFullscreen(), this.isPlayed = !0, n.addClass(b), this.$items.each(function (t) {
  333. var e = i(this), l = e.find(E), d = i('<img id="232" src="' + l.data("originalUrl") + '" alt="' + l.attr("alt") + '">');
  334. h++, d.addClass(z).toggleClass(X, s.transition), e.hasClass(k) && (d.addClass(F), r = t), a.push(d), d.one(M, {filled: !1}, o), n.append(d)
  335. }), e(s.interval) && s.interval > 0 && (t = i.proxy(function () {
  336. this.playing = setTimeout(function () {
  337. a[r].removeClass(F), r++, r = h > r ? r : 0, a[r].addClass(F), t()
  338. }, s.interval)
  339. }, this), h > 1 && t()))
  340. }, stop: function () {
  341. this.isPlayed && (this.options.fullscreen && this.exitFullscreen(), this.isPlayed = !1, clearTimeout(this.playing), this.$player.removeClass(b).empty())
  342. }, full: function () {
  343. var t = this.options, e = this.$image, s = this.$list;
  344. this.isShown && !this.isPlayed && !this.isFulled && t.inline && (this.isFulled = !0, this.$body.addClass(p), this.$button.addClass(T), t.transition && (e.removeClass(X), s.removeClass(X)), this.$viewer.addClass(w).removeAttr("style").css("z-index", t.zIndex), this.initContainer(), this.viewer = i.extend({}, this.container), this.renderList(), this.initImage(i.proxy(function () {
  345. this.renderImage(function () {
  346. t.transition && setTimeout(function () {
  347. e.addClass(X), s.addClass(X)
  348. }, 0)
  349. })
  350. }, this)))
  351. }, exit: function () {
  352. var t = this.options, e = this.$image, s = this.$list;
  353. this.isFulled && (this.isFulled = !1, this.$body.removeClass(p), this.$button.removeClass(T), t.transition && (e.removeClass(X), s.removeClass(X)), this.$viewer.removeClass(w).css("z-index", t.zIndexInline), this.viewer = i.extend({}, this.parent), this.renderViewer(), this.renderList(), this.initImage(i.proxy(function () {
  354. this.renderImage(function () {
  355. t.transition && setTimeout(function () {
  356. e.addClass(X), s.addClass(X)
  357. }, 0)
  358. })
  359. }, this)))
  360. }, tooltip: function () {
  361. var t = this.options, e = this.$tooltip, s = this.image, n = [b, z, X].join(" ");
  362. this.isViewed && !this.isPlayed && t.tooltip && (e.text(G(100 * s.ratio) + "%"), this.tooltiping ? clearTimeout(this.tooltiping) : t.transition ? (this.fading && e.trigger(R), e.addClass(n), h(e[0]), e.addClass(F)) : e.addClass(b), this.tooltiping = setTimeout(i.proxy(function () {
  363. t.transition ? (e.one(R, i.proxy(function () {
  364. e.removeClass(n), this.fading = !1
  365. }, this)).removeClass(F), this.fading = !0) : e.removeClass(b), this.tooltiping = !1
  366. }, this), 1e3))
  367. }, toggle: function () {
  368. 1 === this.image.ratio ? this.zoomTo(this.initialImage.ratio, !0) : this.zoomTo(1, !0)
  369. }, reset: function () {
  370. this.isViewed && !this.isPlayed && (this.image = i.extend({}, this.initialImage), this.renderImage())
  371. }, update: function () {
  372. var t, e = this.$element, s = this.$images, n = [];
  373. if (this.isImg) {
  374. if (!e.parent().length) return this.destroy()
  375. } else this.$images = s = e.find(E), this.length = s.length;
  376. this.isBuilt && (i.each(this.$items, function (t) {
  377. var e = i(this).find("img")[0], o = s[t];
  378. o ? o.src !== e.src && n.push(t) : n.push(t)
  379. }), this.$list.width("auto"), this.initList(), this.isShown && (this.length ? this.isViewed && (t = i.inArray(this.index, n), t >= 0 ? (this.isViewed = !1, this.view(ei(this.index - (t + 1), 0))) : this.$items.eq(this.index).addClass(k)) : (this.$image = null, this.isViewed = !1, this.index = 0, this.image = null, this.$canvas.empty(), this.$title.empty())))
  380. }, destroy: function () {
  381. var i = this.$element;
  382. this.options.inline ? this.unbind() : (this.isShown && this.unbind(), i.off(_, this.start)), this.unbuild(), i.removeData(f)
  383. }, trigger: function (t, e) {
  384. var s = i.Event(t, e);
  385. return this.$element.trigger(s), s
  386. }, shown: function () {
  387. var t = this.options;
  388. this.transitioning = !1, this.isFulled = !0, this.isShown = !0, this.isVisible = !0, this.render(), this.bind(), i.isFunction(t.shown) && this.$element.one(U, t.shown), this.trigger(U)
  389. }, hidden: function () {
  390. var t = this.options;
  391. this.transitioning = !1, this.isViewed = !1, this.isFulled = !1, this.isShown = !1, this.isVisible = !1, this.unbind(), this.$body.removeClass(p), this.$viewer.addClass(y), this.resetList(), this.resetImage(), i.isFunction(t.hidden) && this.$element.one(O, t.hidden), this.trigger(O)
  392. }, requestFullscreen: function () {
  393. var i = document.documentElement;
  394. !this.isFulled || document.fullscreenElement || document.mozFullScreenElement || document.webkitFullscreenElement || document.msFullscreenElement || (i.requestFullscreen ? i.requestFullscreen() : i.msRequestFullscreen ? i.msRequestFullscreen() : i.mozRequestFullScreen ? i.mozRequestFullScreen() : i.webkitRequestFullscreen && i.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT))
  395. }, exitFullscreen: function () {
  396. this.isFulled && (document.exitFullscreen ? document.exitFullscreen() : document.msExitFullscreen ? document.msExitFullscreen() : document.mozCancelFullScreen ? document.mozCancelFullScreen() : document.webkitExitFullscreen && document.webkitExitFullscreen())
  397. }, change: function (i) {
  398. var t = this.endX - this.startX, e = this.endY - this.startY;
  399. switch (this.action) {
  400. case"move":
  401. this.move(t, e);
  402. break;
  403. case"zoom":
  404. this.zoom(function (i, t, e, s) {
  405. var n = J(i * i + t * t), o = J(e * e + s * s);
  406. return (o - n) / n
  407. }(ii(this.startX - this.startX2), ii(this.startY - this.startY2), ii(this.endX - this.endX2), ii(this.endY - this.endY2)), !1, i), this.startX2 = this.endX2, this.startY2 = this.endY2;
  408. break;
  409. case"switch":
  410. this.action = "switched", ii(t) > ii(e) && (t > 1 ? this.prev() : -1 > t && this.next())
  411. }
  412. this.startX = this.endX, this.startY = this.endY
  413. }, isSwitchable: function () {
  414. var i = this.image, t = this.viewer;
  415. return i.left >= 0 && i.top >= 0 && i.width <= t.width && i.height <= t.height
  416. }
  417. }, u.DEFAULTS = {
  418. inline: !1,
  419. button: !0,
  420. navbar: !0,
  421. title: !0,
  422. toolbar: !0,
  423. tooltip: !0,
  424. movable: !0,
  425. zoomable: !0,
  426. rotatable: !0,
  427. scalable: !0,
  428. transition: !0,
  429. fullscreen: !0,
  430. keyboard: !0,
  431. interval: 5e3,
  432. minWidth: 200,
  433. minHeight: 100,
  434. zoomRatio: .1,
  435. minZoomRatio: .01,
  436. maxZoomRatio: 100,
  437. zIndex: 2015,
  438. zIndexInline: 0,
  439. url: "src",
  440. build: null,
  441. built: null,
  442. show: null,
  443. shown: null,
  444. hide: null,
  445. hidden: null,
  446. view: null,
  447. viewed: null
  448. }, u.TEMPLATE = '<div id="viewer-container" class="viewer-container"><div class="viewer-canvas"></div><div class="viewer-footer"><div class="viewer-title"></div><ul class="viewer-toolbar"><li class="viewer-zoom-in" data-action="zoom-in"></li><li class="viewer-zoom-out" data-action="zoom-out"></li><li class="viewer-one-to-one" data-action="one-to-one"></li><li class="viewer-reset" data-action="reset"></li><li class="viewer-prev" data-action="prev"></li><li class="viewer-play" data-action="play"></li><li class="viewer-next" data-action="next"></li><li class="viewer-rotate-left" data-action="rotate-left"></li><li class="viewer-rotate-right" data-action="rotate-right"></li><li class="viewer-flip-horizontal" data-action="flip-horizontal"></li><li class="viewer-flip-vertical" data-action="flip-vertical"></li></ul><div class="viewer-navbar"><ul class="viewer-list"></ul></div></div><div class="viewer-tooltip"></div><div class="viewer-button" data-action="mix"></div><div class="viewer-player"></div></div>',
  449. u.other = i.fn.viewer, i.fn.viewer = function (e) {
  450. var o, a = n(arguments, 1);
  451. return this.each(function () {
  452. var s, n = i(this), h = n.data(f);
  453. if (!h) {
  454. if (/destroy|hide|exit|stop|reset/.test(e)) return;
  455. n.data(f, h = new u(this, e))
  456. }
  457. t(e) && i.isFunction(s = h[e]) && (o = s.apply(h, a))
  458. }), s(o) ? this : o
  459. }, i.fn.viewer.Constructor = u, i.fn.viewer.setDefaults = u.setDefaults, i.fn.viewer.noConflict = function () {
  460. return i.fn.viewer = u.other, this
  461. }
  462. });