vue-lazyload.js 28 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965
  1. /*!
  2. * Vue-Lazyload.js v1.3.3
  3. * (c) 2020 Awe <hilongjw@gmail.com>
  4. * Released under the MIT License.
  5. */
  6. ! function(t, e) {
  7. "object" == typeof exports && "undefined" != typeof module ? module.exports = e(require("axios")) : "function" == typeof define && define.amd ? define(["axios"], e) : t.VueLazyload = e(t.axios)
  8. }(this, function(t) {
  9. "use strict";
  10. function e(t) {
  11. return t.constructor && "function" == typeof t.constructor.isBuffer && t.constructor.isBuffer(t)
  12. }
  13. function n(t) {
  14. t = t || {};
  15. var e = arguments.length,
  16. n = 0;
  17. if(1 === e) return t;
  18. for(; ++n < e;) {
  19. var o = arguments[n];
  20. w(t) && (t = o), i(o) && r(t, o)
  21. }
  22. return t
  23. }
  24. function r(t, e) {
  25. L(t, e);
  26. for(var r in e)
  27. if(s(r) && o(e, r)) {
  28. var a = e[r];
  29. i(a) ? ("undefined" === E(t[r]) && "function" === E(a) && (t[r] = a), t[r] = n(t[r] || {}, a)) : t[r] = a
  30. }
  31. return t
  32. }
  33. function i(t) {
  34. return "object" === E(t) || "function" === E(t)
  35. }
  36. function o(t, e) {
  37. return Object.prototype.hasOwnProperty.call(t, e)
  38. }
  39. function s(t) {
  40. return "__proto__" !== t && "constructor" !== t && "prototype" !== t
  41. }
  42. function a(t, e) {
  43. if(t.length) {
  44. var n = t.indexOf(e);
  45. return n > -1 ? t.splice(n, 1) : void 0
  46. }
  47. }
  48. function u(t, e) {
  49. for(var n = !1, r = 0, i = t.length; r < i; r++)
  50. if(e(t[r])) {
  51. n = !0;
  52. break
  53. }
  54. return n
  55. }
  56. function d(t, e) {
  57. if("IMG" === t.tagName && t.getAttribute("data-srcset")) {
  58. var n = t.getAttribute("data-srcset"),
  59. r = [],
  60. i = t.parentNode,
  61. o = i.offsetWidth * e,
  62. s = void 0,
  63. a = void 0,
  64. u = void 0;
  65. n = n.trim().split(","), n.map(function(t) {
  66. t = t.trim(), s = t.lastIndexOf(" "), -1 === s ? (a = t, u = 999998) : (a = t.substr(0, s), u = parseInt(t.substr(s + 1, t.length - s - 2), 10)), r.push([u, a])
  67. }), r.sort(function(t, e) {
  68. if(t[0] < e[0]) return 1;
  69. if(t[0] > e[0]) return -1;
  70. if(t[0] === e[0]) {
  71. if(-1 !== e[1].indexOf(".webp", e[1].length - 5)) return 1;
  72. if(-1 !== t[1].indexOf(".webp", t[1].length - 5)) return -1
  73. }
  74. return 0
  75. });
  76. for(var d = "", c = void 0, l = 0; l < r.length; l++) {
  77. c = r[l], d = c[1];
  78. var h = r[l + 1];
  79. if(h && h[0] < o) {
  80. d = c[1];
  81. break
  82. }
  83. if(!h) {
  84. d = c[1];
  85. break
  86. }
  87. }
  88. return d
  89. }
  90. }
  91. function c(t, e) {
  92. for(var n = void 0, r = 0, i = t.length; r < i; r++)
  93. if(e(t[r])) {
  94. n = t[r];
  95. break
  96. }
  97. return n
  98. }
  99. function l() {
  100. if(!A) return !1;
  101. var t = !0,
  102. e = document;
  103. try {
  104. var n = e.createElement("object");
  105. n.type = "image/webp", n.style.visibility = "hidden", n.innerHTML = "!", e.body.appendChild(n), t = !n.offsetWidth, e.body.removeChild(n)
  106. } catch(e) {
  107. t = !1
  108. }
  109. return t
  110. }
  111. function h(t, e) {
  112. var n = null,
  113. r = 0;
  114. return function() {
  115. if(!n) {
  116. var i = Date.now() - r,
  117. o = this,
  118. s = arguments,
  119. a = function() {
  120. r = Date.now(), n = !1, t.apply(o, s)
  121. };
  122. i >= e ? a() : n = setTimeout(a, e)
  123. }
  124. }
  125. }
  126. function f(t) {
  127. return null !== t && "object" === (void 0 === t ? "undefined" : b(t))
  128. }
  129. function v(t) {
  130. if(!(t instanceof Object)) return [];
  131. if(Object.keys) return Object.keys(t);
  132. var e = [];
  133. for(var n in t) t.hasOwnProperty(n) && e.push(n);
  134. return e
  135. }
  136. function p(t) {
  137. for(var e = t.length, n = [], r = 0; r < e; r++) n.push(t[r]);
  138. return n
  139. }
  140. function y() {}
  141. t = t && t.hasOwnProperty("default") ? t.default : t;
  142. var b = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(t) {
  143. return typeof t
  144. } : function(t) {
  145. return t && "function" == typeof Symbol && t.constructor === Symbol && t !== Symbol.prototype ? "symbol" : typeof t
  146. },
  147. g = function(t, e) {
  148. if(!(t instanceof e)) throw new TypeError("Cannot call a class as a function")
  149. },
  150. m = function() {
  151. function t(t, e) {
  152. for(var n = 0; n < e.length; n++) {
  153. var r = e[n];
  154. r.enumerable = r.enumerable || !1, r.configurable = !0, "value" in r && (r.writable = !0), Object.defineProperty(t, r.key, r)
  155. }
  156. }
  157. return function(e, n, r) {
  158. return n && t(e.prototype, n), r && t(e, r), e
  159. }
  160. }(),
  161. w = function(t) {
  162. return null == t || "function" != typeof t && "object" !== (void 0 === t ? "undefined" : b(t))
  163. },
  164. L = function(t, e) {
  165. if(null === t || void 0 === t) throw new TypeError("expected first argument to be an object.");
  166. if(void 0 === e || "undefined" == typeof Symbol) return t;
  167. if("function" != typeof Object.getOwnPropertySymbols) return t;
  168. for(var n = Object.prototype.propertyIsEnumerable, r = Object(t), i = arguments.length, o = 0; ++o < i;)
  169. for(var s = Object(arguments[o]), a = Object.getOwnPropertySymbols(s), u = 0; u < a.length; u++) {
  170. var d = a[u];
  171. n.call(s, d) && (r[d] = s[d])
  172. }
  173. return r
  174. },
  175. _ = Object.prototype.toString,
  176. E = function(t) {
  177. var n = void 0 === t ? "undefined" : b(t);
  178. return "undefined" === n ? "undefined" : null === t ? "null" : !0 === t || !1 === t || t instanceof Boolean ? "boolean" : "string" === n || t instanceof String ? "string" : "number" === n || t instanceof Number ? "number" : "function" === n || t instanceof Function ? void 0 !== t.constructor.name && "Generator" === t.constructor.name.slice(0, 9) ? "generatorfunction" : "function" : void 0 !== Array.isArray && Array.isArray(t) ? "array" : t instanceof RegExp ? "regexp" : t instanceof Date ? "date" : (n = _.call(t), "[object RegExp]" === n ? "regexp" : "[object Date]" === n ? "date" : "[object Arguments]" === n ? "arguments" : "[object Error]" === n ? "error" : "[object Promise]" === n ? "promise" : e(t) ? "buffer" : "[object Set]" === n ? "set" : "[object WeakSet]" === n ? "weakset" : "[object Map]" === n ? "map" : "[object WeakMap]" === n ? "weakmap" : "[object Symbol]" === n ? "symbol" : "[object Map Iterator]" === n ? "mapiterator" : "[object Set Iterator]" === n ? "setiterator" : "[object String Iterator]" === n ? "stringiterator" : "[object Array Iterator]" === n ? "arrayiterator" : "[object Int8Array]" === n ? "int8array" : "[object Uint8Array]" === n ? "uint8array" : "[object Uint8ClampedArray]" === n ? "uint8clampedarray" : "[object Int16Array]" === n ? "int16array" : "[object Uint16Array]" === n ? "uint16array" : "[object Int32Array]" === n ? "int32array" : "[object Uint32Array]" === n ? "uint32array" : "[object Float32Array]" === n ? "float32array" : "[object Float64Array]" === n ? "float64array" : "object")
  179. },
  180. k = n,
  181. A = "undefined" != typeof window && null !== window,
  182. z = function() {
  183. return !!(A && "IntersectionObserver" in window && "IntersectionObserverEntry" in window && "intersectionRatio" in window.IntersectionObserverEntry.prototype) && ("isIntersecting" in window.IntersectionObserverEntry.prototype || Object.defineProperty(window.IntersectionObserverEntry.prototype, "isIntersecting", {
  184. get: function() {
  185. return this.intersectionRatio > 0
  186. }
  187. }), !0)
  188. }(),
  189. j = {
  190. event: "event",
  191. observer: "observer"
  192. },
  193. O = function() {
  194. function t(t, e) {
  195. e = e || {
  196. bubbles: !1,
  197. cancelable: !1,
  198. detail: void 0
  199. };
  200. var n = document.createEvent("CustomEvent");
  201. return n.initCustomEvent(t, e.bubbles, e.cancelable, e.detail), n
  202. }
  203. if(A) return "function" == typeof window.CustomEvent ? window.CustomEvent : (t.prototype = window.Event.prototype, t)
  204. }(),
  205. I = function() {
  206. var t = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : 1;
  207. return A ? window.devicePixelRatio || t : t
  208. },
  209. T = function() {
  210. if(A) {
  211. var t = !1;
  212. try {
  213. var e = Object.defineProperty({}, "passive", {
  214. get: function() {
  215. t = !0
  216. }
  217. });
  218. window.addEventListener("test", null, e)
  219. } catch(t) {}
  220. return t
  221. }
  222. }(),
  223. x = {
  224. on: function(t, e, n) {
  225. var r = arguments.length > 3 && void 0 !== arguments[3] && arguments[3];
  226. T ? t.addEventListener(e, n, {
  227. capture: r,
  228. passive: !0
  229. }) : t.addEventListener(e, n, r)
  230. },
  231. off: function(t, e, n) {
  232. var r = arguments.length > 3 && void 0 !== arguments[3] && arguments[3];
  233. t.removeEventListener(e, n, r)
  234. }
  235. },
  236. S = function(e, n, r) {
  237. if(!t) throw new Error("[vue-lazyload] cannot locate Axios");
  238. if(!e || !e.src) {
  239. var i = new Error("image src is required");
  240. return r(i)
  241. }
  242. var o = new Image;
  243. e.cors && (o.crossOrigin = e.cors), o.onload = function() {
  244. n({
  245. naturalHeight: o.naturalHeight,
  246. naturalWidth: o.naturalWidth,
  247. src: o.src
  248. })
  249. }, o.onerror = function(t) {
  250. r(t)
  251. }, t({
  252. method: "get",
  253. url: e.src,
  254. responseType: "arraybuffer"
  255. }).then(function(t) {
  256. var e = t.headers["content-type"].toLowerCase(),
  257. n = new Buffer(t.data, "binary").toString("base64");
  258. o.src = "data:" + e + ";base64," + n
  259. }).catch(function(t) {
  260. r(t)
  261. })
  262. },
  263. $ = function(t, e) {
  264. return "undefined" != typeof getComputedStyle ? getComputedStyle(t, null).getPropertyValue(e) : t.style[e]
  265. },
  266. C = function(t) {
  267. return $(t, "overflow") + $(t, "overflow-y") + $(t, "overflow-x")
  268. },
  269. H = function(t) {
  270. if(A) {
  271. if(!(t instanceof HTMLElement)) return window;
  272. for(var e = t; e && e !== document.body && e !== document.documentElement && e.parentNode;) {
  273. if(/(scroll|auto)/.test(C(e))) return e;
  274. e = e.parentNode
  275. }
  276. return window
  277. }
  278. },
  279. Q = function() {
  280. function t(e) {
  281. var n = e.max;
  282. g(this, t), this.options = {
  283. max: n || 100
  284. }, this._caches = []
  285. }
  286. return m(t, [{
  287. key: "has",
  288. value: function(t) {
  289. return this._caches.indexOf(t) > -1
  290. }
  291. }, {
  292. key: "add",
  293. value: function(t) {
  294. this.has(t) || (this._caches.push(t), this._caches.length > this.options.max && this.free())
  295. }
  296. }, {
  297. key: "free",
  298. value: function() {
  299. this._caches.shift()
  300. }
  301. }]), t
  302. }(),
  303. R = function() {
  304. function t(e) {
  305. var n = e.el,
  306. r = e.src,
  307. i = e.error,
  308. o = e.loading,
  309. s = e.bindType,
  310. a = e.$parent,
  311. u = e.options,
  312. d = e.cors,
  313. c = e.elRenderer,
  314. l = e.imageCache;
  315. g(this, t), this.el = n, this.src = r, this.error = i, this.loading = o, this.bindType = s, this.attempt = 0, this.cors = d, this.naturalHeight = 0, this.naturalWidth = 0, this.options = u, this.rect = null, this.$parent = a, this.elRenderer = c, this._imageCache = l, this.performanceData = {
  316. init: Date.now(),
  317. loadStart: 0,
  318. loadEnd: 0
  319. }, this.filter(), this.initState(), this.render("loading", !1)
  320. }
  321. return m(t, [{
  322. key: "initState",
  323. value: function() {
  324. "dataset" in this.el ? this.el.dataset.src = this.src : this.el.setAttribute("data-src", this.src), this.state = {
  325. loading: !1,
  326. error: !1,
  327. loaded: !1,
  328. rendered: !1
  329. }
  330. }
  331. }, {
  332. key: "record",
  333. value: function(t) {
  334. this.performanceData[t] = Date.now()
  335. }
  336. }, {
  337. key: "update",
  338. value: function(t) {
  339. var e = t.src,
  340. n = t.loading,
  341. r = t.error,
  342. i = this.src;
  343. this.src = e, this.loading = n, this.error = r, this.filter(), i !== this.src && (this.attempt = 0, this.initState())
  344. }
  345. }, {
  346. key: "getRect",
  347. value: function() {
  348. this.rect = this.el.getBoundingClientRect()
  349. }
  350. }, {
  351. key: "checkInView",
  352. value: function() {
  353. return this.getRect(), this.rect.top < window.innerHeight * this.options.preLoad && this.rect.bottom > this.options.preLoadTop && this.rect.left < window.innerWidth * this.options.preLoad && this.rect.right > 0
  354. }
  355. }, {
  356. key: "filter",
  357. value: function() {
  358. var t = this;
  359. v(this.options.filter).map(function(e) {
  360. t.options.filter[e](t, t.options)
  361. })
  362. }
  363. }, {
  364. key: "renderLoading",
  365. value: function(t) {
  366. var e = this;
  367. this.state.loading = !0, S({
  368. src: this.loading,
  369. cors: this.cors
  370. }, function(n) {
  371. e.render("loading", !1), e.state.loading = !1, t()
  372. }, function() {
  373. t(), e.state.loading = !1, e.options.silent || console.warn("VueLazyload log: load failed with loading image(" + e.loading + ")")
  374. })
  375. }
  376. }, {
  377. key: "load",
  378. value: function() {
  379. var t = this,
  380. e = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : y;
  381. return this.attempt > this.options.attempt - 1 && this.state.error ? (this.options.silent || console.log("VueLazyload log: " + this.src + " tried too more than " + this.options.attempt + " times"), void e()) : this.state.rendered && this.state.loaded ? void 0 : this._imageCache.has(this.src) ? (this.state.loaded = !0, this.render("loaded", !0), this.state.rendered = !0, e()) : void this.renderLoading(function() {
  382. t.attempt++, t.options.adapter.beforeLoad && t.options.adapter.beforeLoad(t, t.options), t.record("loadStart"), S({
  383. src: t.src,
  384. cors: t.cors
  385. }, function(n) {
  386. t.naturalHeight = n.naturalHeight, t.naturalWidth = n.naturalWidth, t.state.loaded = !0, t.state.error = !1, t.record("loadEnd"), t.render("loaded", !1), t.state.rendered = !0, t._imageCache.add(t.src), e()
  387. }, function(e) {
  388. !t.options.silent && console.error(e), t.state.error = !0, t.state.loaded = !1, t.render("error", !1)
  389. })
  390. })
  391. }
  392. }, {
  393. key: "render",
  394. value: function(t, e) {
  395. this.elRenderer(this, t, e)
  396. }
  397. }, {
  398. key: "performance",
  399. value: function() {
  400. var t = "loading",
  401. e = 0;
  402. return this.state.loaded && (t = "loaded", e = (this.performanceData.loadEnd - this.performanceData.loadStart) / 1e3), this.state.error && (t = "error"), {
  403. src: this.src,
  404. state: t,
  405. time: e
  406. }
  407. }
  408. }, {
  409. key: "$destroy",
  410. value: function() {
  411. this.el = null, this.src = null, this.error = null, this.loading = null, this.bindType = null, this.attempt = 0
  412. }
  413. }]), t
  414. }(),
  415. B = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",
  416. W = ["scroll", "wheel", "mousewheel", "resize", "animationend", "transitionend", "touchmove"],
  417. D = {
  418. rootMargin: "0px",
  419. threshold: 0
  420. },
  421. V = function(t) {
  422. return function() {
  423. function e(t) {
  424. var n = t.preLoad,
  425. r = t.error,
  426. i = t.throttleWait,
  427. o = t.preLoadTop,
  428. s = t.dispatchEvent,
  429. a = t.loading,
  430. u = t.attempt,
  431. d = t.silent,
  432. c = void 0 === d || d,
  433. f = t.scale,
  434. v = t.listenEvents,
  435. p = (t.hasbind, t.filter),
  436. y = t.adapter,
  437. b = t.observer,
  438. m = t.observerOptions;
  439. g(this, e), this.version = "1.3.3", this.mode = j.event, this.ListenerQueue = [], this.TargetIndex = 0, this.TargetQueue = [], this.options = {
  440. silent: c,
  441. dispatchEvent: !!s,
  442. throttleWait: i || 200,
  443. preLoad: n || 1.3,
  444. preLoadTop: o || 0,
  445. error: r || B,
  446. loading: a || B,
  447. attempt: u || 3,
  448. scale: f || I(f),
  449. ListenEvents: v || W,
  450. hasbind: !1,
  451. supportWebp: l(),
  452. filter: p || {},
  453. adapter: y || {},
  454. observer: !!b,
  455. observerOptions: m || D
  456. }, this._initEvent(), this._imageCache = new Q({
  457. max: 200
  458. }), this.lazyLoadHandler = h(this._lazyLoadHandler.bind(this), this.options.throttleWait), this.setMode(this.options.observer ? j.observer : j.event)
  459. }
  460. return m(e, [{
  461. key: "config",
  462. value: function() {
  463. var t = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : {};
  464. k(this.options, t)
  465. }
  466. }, {
  467. key: "performance",
  468. value: function() {
  469. var t = [];
  470. return this.ListenerQueue.map(function(e) {
  471. t.push(e.performance())
  472. }), t
  473. }
  474. }, {
  475. key: "addLazyBox",
  476. value: function(t) {
  477. this.ListenerQueue.push(t), A && (this._addListenerTarget(window), this._observer && this._observer.observe(t.el), t.$el && t.$el.parentNode && this._addListenerTarget(t.$el.parentNode))
  478. }
  479. }, {
  480. key: "add",
  481. value: function(e, n, r) {
  482. var i = this;
  483. if(u(this.ListenerQueue, function(t) {
  484. return t.el === e
  485. })) return this.update(e, n), t.nextTick(this.lazyLoadHandler);
  486. var o = this._valueFormatter(n.value),
  487. s = o.src,
  488. a = o.loading,
  489. c = o.error,
  490. l = o.cors;
  491. t.nextTick(function() {
  492. s = d(e, i.options.scale) || s, i._observer && i._observer.observe(e);
  493. var o = Object.keys(n.modifiers)[0],
  494. u = void 0;
  495. o && (u = r.context.$refs[o], u = u ? u.$el || u : document.getElementById(o)), u || (u = H(e));
  496. var h = new R({
  497. bindType: n.arg,
  498. $parent: u,
  499. el: e,
  500. loading: a,
  501. error: c,
  502. src: s,
  503. cors: l,
  504. elRenderer: i._elRenderer.bind(i),
  505. options: i.options,
  506. imageCache: i._imageCache
  507. });
  508. i.ListenerQueue.push(h), A && (i._addListenerTarget(window), i._addListenerTarget(u)), i.lazyLoadHandler(), t.nextTick(function() {
  509. return i.lazyLoadHandler()
  510. })
  511. })
  512. }
  513. }, {
  514. key: "update",
  515. value: function(e, n, r) {
  516. var i = this,
  517. o = this._valueFormatter(n.value),
  518. s = o.src,
  519. a = o.loading,
  520. u = o.error;
  521. s = d(e, this.options.scale) || s;
  522. var l = c(this.ListenerQueue, function(t) {
  523. return t.el === e
  524. });
  525. l ? l.update({
  526. src: s,
  527. loading: a,
  528. error: u
  529. }) : this.add(e, n, r), this._observer && (this._observer.unobserve(e), this._observer.observe(e)), this.lazyLoadHandler(), t.nextTick(function() {
  530. return i.lazyLoadHandler()
  531. })
  532. }
  533. }, {
  534. key: "remove",
  535. value: function(t) {
  536. if(t) {
  537. this._observer && this._observer.unobserve(t);
  538. var e = c(this.ListenerQueue, function(e) {
  539. return e.el === t
  540. });
  541. e && (this._removeListenerTarget(e.$parent), this._removeListenerTarget(window), a(this.ListenerQueue, e), e.$destroy())
  542. }
  543. }
  544. }, {
  545. key: "removeComponent",
  546. value: function(t) {
  547. t && (a(this.ListenerQueue, t), this._observer && this._observer.unobserve(t.el), t.$parent && t.$el.parentNode && this._removeListenerTarget(t.$el.parentNode), this._removeListenerTarget(window))
  548. }
  549. }, {
  550. key: "setMode",
  551. value: function(t) {
  552. var e = this;
  553. z || t !== j.observer || (t = j.event), this.mode = t, t === j.event ? (this._observer && (this.ListenerQueue.forEach(function(t) {
  554. e._observer.unobserve(t.el)
  555. }), this._observer = null), this.TargetQueue.forEach(function(t) {
  556. e._initListen(t.el, !0)
  557. })) : (this.TargetQueue.forEach(function(t) {
  558. e._initListen(t.el, !1)
  559. }), this._initIntersectionObserver())
  560. }
  561. }, {
  562. key: "_addListenerTarget",
  563. value: function(t) {
  564. if(t) {
  565. var e = c(this.TargetQueue, function(e) {
  566. return e.el === t
  567. });
  568. return e ? e.childrenCount++ : (e = {
  569. el: t,
  570. id: ++this.TargetIndex,
  571. childrenCount: 1,
  572. listened: !0
  573. }, this.mode === j.event && this._initListen(e.el, !0), this.TargetQueue.push(e)), this.TargetIndex
  574. }
  575. }
  576. }, {
  577. key: "_removeListenerTarget",
  578. value: function(t) {
  579. var e = this;
  580. this.TargetQueue.forEach(function(n, r) {
  581. n.el === t && (--n.childrenCount || (e._initListen(n.el, !1), e.TargetQueue.splice(r, 1), n = null))
  582. })
  583. }
  584. }, {
  585. key: "_initListen",
  586. value: function(t, e) {
  587. var n = this;
  588. this.options.ListenEvents.forEach(function(r) {
  589. return x[e ? "on" : "off"](t, r, n.lazyLoadHandler)
  590. })
  591. }
  592. }, {
  593. key: "_initEvent",
  594. value: function() {
  595. var t = this;
  596. this.Event = {
  597. listeners: {
  598. loading: [],
  599. loaded: [],
  600. error: []
  601. }
  602. }, this.$on = function(e, n) {
  603. t.Event.listeners[e] || (t.Event.listeners[e] = []), t.Event.listeners[e].push(n)
  604. }, this.$once = function(e, n) {
  605. function r() {
  606. i.$off(e, r), n.apply(i, arguments)
  607. }
  608. var i = t;
  609. t.$on(e, r)
  610. }, this.$off = function(e, n) {
  611. if(!n) {
  612. if(!t.Event.listeners[e]) return;
  613. return void(t.Event.listeners[e].length = 0)
  614. }
  615. a(t.Event.listeners[e], n)
  616. }, this.$emit = function(e, n, r) {
  617. t.Event.listeners[e] && t.Event.listeners[e].forEach(function(t) {
  618. return t(n, r)
  619. })
  620. }
  621. }
  622. }, {
  623. key: "_lazyLoadHandler",
  624. value: function() {
  625. var t = this,
  626. e = [];
  627. this.ListenerQueue.forEach(function(t, n) {
  628. t.el && t.el.parentNode || e.push(t), t.checkInView() && t.load()
  629. }), e.forEach(function(e) {
  630. a(t.ListenerQueue, e), e.$destroy()
  631. })
  632. }
  633. }, {
  634. key: "_initIntersectionObserver",
  635. value: function() {
  636. var t = this;
  637. z && (this._observer = new IntersectionObserver(this._observerHandler.bind(this), this.options.observerOptions), this.ListenerQueue.length && this.ListenerQueue.forEach(function(e) {
  638. t._observer.observe(e.el)
  639. }))
  640. }
  641. }, {
  642. key: "_observerHandler",
  643. value: function(t, e) {
  644. var n = this;
  645. t.forEach(function(t) {
  646. t.isIntersecting && n.ListenerQueue.forEach(function(e) {
  647. if(e.el === t.target) {
  648. if(e.state.loaded) return n._observer.unobserve(e.el);
  649. e.load()
  650. }
  651. })
  652. })
  653. }
  654. }, {
  655. key: "_elRenderer",
  656. value: function(t, e, n) {
  657. if(t.el) {
  658. var r = t.el,
  659. i = t.bindType,
  660. o = void 0;
  661. switch(e) {
  662. case "loading":
  663. o = t.loading;
  664. break;
  665. case "error":
  666. o = t.error;
  667. break;
  668. default:
  669. o = t.src
  670. }
  671. if(i ? r.style[i] = 'url("' + o + '")' : r.getAttribute("src") !== o && r.setAttribute("src", o), r.setAttribute("lazy", e), this.$emit(e, t, n), this.options.adapter[e] && this.options.adapter[e](t, this.options), this.options.dispatchEvent) {
  672. var s = new O(e, {
  673. detail: t
  674. });
  675. r.dispatchEvent(s)
  676. }
  677. }
  678. }
  679. }, {
  680. key: "_valueFormatter",
  681. value: function(t) {
  682. var e = t,
  683. n = this.options.loading,
  684. r = this.options.error;
  685. return f(t) && (t.src || this.options.silent || console.error("Vue Lazyload warning: miss src with " + t), e = t.src, n = t.loading || this.options.loading, r = t.error || this.options.error), {
  686. src: e,
  687. loading: n,
  688. error: r
  689. }
  690. }
  691. }]), e
  692. }()
  693. },
  694. P = function(t) {
  695. return {
  696. props: {
  697. tag: {
  698. type: String,
  699. default: "div"
  700. }
  701. },
  702. render: function(t) {
  703. return !1 === this.show ? t(this.tag) : t(this.tag, null, this.$slots.default)
  704. },
  705. data: function() {
  706. return {
  707. el: null,
  708. state: {
  709. loaded: !1
  710. },
  711. rect: {},
  712. show: !1
  713. }
  714. },
  715. mounted: function() {
  716. this.el = this.$el, t.addLazyBox(this), t.lazyLoadHandler()
  717. },
  718. beforeDestroy: function() {
  719. t.removeComponent(this)
  720. },
  721. methods: {
  722. getRect: function() {
  723. this.rect = this.$el.getBoundingClientRect()
  724. },
  725. checkInView: function() {
  726. return this.getRect(), A && this.rect.top < window.innerHeight * t.options.preLoad && this.rect.bottom > 0 && this.rect.left < window.innerWidth * t.options.preLoad && this.rect.right > 0
  727. },
  728. load: function() {
  729. this.show = !0, this.state.loaded = !0, this.$emit("show", this)
  730. },
  731. destroy: function() {
  732. return this.$destroy
  733. }
  734. }
  735. }
  736. },
  737. N = function() {
  738. function t(e) {
  739. var n = e.lazy;
  740. g(this, t), this.lazy = n, n.lazyContainerMananger = this, this._queue = []
  741. }
  742. return m(t, [{
  743. key: "bind",
  744. value: function(t, e, n) {
  745. var r = new q({
  746. el: t,
  747. binding: e,
  748. vnode: n,
  749. lazy: this.lazy
  750. });
  751. this._queue.push(r)
  752. }
  753. }, {
  754. key: "update",
  755. value: function(t, e, n) {
  756. var r = c(this._queue, function(e) {
  757. return e.el === t
  758. });
  759. r && r.update({
  760. el: t,
  761. binding: e,
  762. vnode: n
  763. })
  764. }
  765. }, {
  766. key: "unbind",
  767. value: function(t, e, n) {
  768. var r = c(this._queue, function(e) {
  769. return e.el === t
  770. });
  771. r && (r.clear(), a(this._queue, r))
  772. }
  773. }]), t
  774. }(),
  775. M = {
  776. selector: "img"
  777. },
  778. q = function() {
  779. function t(e) {
  780. var n = e.el,
  781. r = e.binding,
  782. i = e.vnode,
  783. o = e.lazy;
  784. g(this, t), this.el = null, this.vnode = i, this.binding = r, this.options = {}, this.lazy = o, this._queue = [], this.update({
  785. el: n,
  786. binding: r
  787. })
  788. }
  789. return m(t, [{
  790. key: "update",
  791. value: function(t) {
  792. var e = this,
  793. n = t.el,
  794. r = t.binding;
  795. this.el = n, this.options = k({}, M, r.value), this.getImgs().forEach(function(t) {
  796. e.lazy.add(t, k({}, e.binding, {
  797. value: {
  798. src: "dataset" in t ? t.dataset.src : t.getAttribute("data-src"),
  799. error: ("dataset" in t ? t.dataset.error : t.getAttribute("data-error")) || e.options.error,
  800. loading: ("dataset" in t ? t.dataset.loading : t.getAttribute("data-loading")) || e.options.loading
  801. }
  802. }), e.vnode)
  803. })
  804. }
  805. }, {
  806. key: "getImgs",
  807. value: function() {
  808. return p(this.el.querySelectorAll(this.options.selector))
  809. }
  810. }, {
  811. key: "clear",
  812. value: function() {
  813. var t = this;
  814. this.getImgs().forEach(function(e) {
  815. return t.lazy.remove(e)
  816. }), this.vnode = null, this.binding = null, this.lazy = null
  817. }
  818. }]), t
  819. }(),
  820. F = function(t) {
  821. return {
  822. props: {
  823. src: [String, Object],
  824. tag: {
  825. type: String,
  826. default: "img"
  827. }
  828. },
  829. render: function(t) {
  830. return t(this.tag, {
  831. attrs: {
  832. src: this.renderSrc
  833. }
  834. }, this.$slots.default)
  835. },
  836. data: function() {
  837. return {
  838. el: null,
  839. options: {
  840. src: "",
  841. error: "",
  842. loading: "",
  843. attempt: t.options.attempt
  844. },
  845. state: {
  846. loaded: !1,
  847. error: !1,
  848. attempt: 0
  849. },
  850. rect: {},
  851. renderSrc: ""
  852. }
  853. },
  854. watch: {
  855. src: function() {
  856. this.init(), t.addLazyBox(this), t.lazyLoadHandler()
  857. }
  858. },
  859. created: function() {
  860. this.init(), this.renderSrc = this.options.loading
  861. },
  862. mounted: function() {
  863. this.el = this.$el, t.addLazyBox(this), t.lazyLoadHandler()
  864. },
  865. beforeDestroy: function() {
  866. t.removeComponent(this)
  867. },
  868. methods: {
  869. init: function() {
  870. var e = t._valueFormatter(this.src),
  871. n = e.src,
  872. r = e.loading,
  873. i = e.error;
  874. this.state.loaded = !1, this.options.src = n, this.options.error = i, this.options.loading = r, this.renderSrc = this.options.loading
  875. },
  876. getRect: function() {
  877. this.rect = this.$el.getBoundingClientRect()
  878. },
  879. checkInView: function() {
  880. return this.getRect(), A && this.rect.top < window.innerHeight * t.options.preLoad && this.rect.bottom > 0 && this.rect.left < window.innerWidth * t.options.preLoad && this.rect.right > 0
  881. },
  882. load: function() {
  883. var e = this,
  884. n = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : y;
  885. if(this.state.attempt > this.options.attempt - 1 && this.state.error) return t.options.silent || console.log("VueLazyload log: " + this.options.src + " tried too more than " + this.options.attempt + " times"), void n();
  886. var r = this.options.src;
  887. S({
  888. src: r
  889. }, function(t) {
  890. var n = t.src;
  891. e.renderSrc = n, e.state.loaded = !0
  892. }, function(t) {
  893. e.state.attempt++, e.renderSrc = e.options.error, e.state.error = !0
  894. })
  895. }
  896. }
  897. }
  898. };
  899. return {
  900. install: function(t) {
  901. var e = arguments.length > 1 && void 0 !== arguments[1] ? arguments[1] : {},
  902. n = V(t),
  903. r = new n(e),
  904. i = new N({
  905. lazy: r
  906. }),
  907. o = "2" === t.version.split(".")[0];
  908. t.prototype.$Lazyload = r, e.lazyComponent && t.component("lazy-component", P(r)), e.lazyImage && t.component("lazy-image", F(r)), o ? (t.directive("lazy", {
  909. bind: r.add.bind(r),
  910. update: r.update.bind(r),
  911. componentUpdated: r.lazyLoadHandler.bind(r),
  912. unbind: r.remove.bind(r)
  913. }), t.directive("lazy-container", {
  914. bind: i.bind.bind(i),
  915. componentUpdated: i.update.bind(i),
  916. unbind: i.unbind.bind(i)
  917. })) : (t.directive("lazy", {
  918. bind: r.lazyLoadHandler.bind(r),
  919. update: function(t, e) {
  920. k(this.vm.$refs, this.vm.$els), r.add(this.el, {
  921. modifiers: this.modifiers || {},
  922. arg: this.arg,
  923. value: t,
  924. oldValue: e
  925. }, {
  926. context: this.vm
  927. })
  928. },
  929. unbind: function() {
  930. r.remove(this.el)
  931. }
  932. }), t.directive("lazy-container", {
  933. update: function(t, e) {
  934. i.update(this.el, {
  935. modifiers: this.modifiers || {},
  936. arg: this.arg,
  937. value: t,
  938. oldValue: e
  939. }, {
  940. context: this.vm
  941. })
  942. },
  943. unbind: function() {
  944. i.unbind(this.el)
  945. }
  946. }))
  947. }
  948. }
  949. });