124 lines
6.1 KiB
JavaScript
124 lines
6.1 KiB
JavaScript
/*! lozad.js - v1.16.0 - 2020-09-06
|
|
* https://github.com/ApoorvSaxena/lozad.js
|
|
* Copyright (c) 2020 Apoorv Saxena; Licensed MIT */
|
|
!function (t, e) {
|
|
"object" == typeof exports && "undefined" != typeof module ? module.exports = e() : "function" == typeof define && define.amd ? define(e) : t.lozad = e()
|
|
}(this, function () {
|
|
"use strict";
|
|
/**
|
|
* Detect IE browser
|
|
* @const {boolean}
|
|
* @private
|
|
*/
|
|
var g = "undefined" != typeof document && document.documentMode,
|
|
f = {
|
|
rootMargin: "0px",
|
|
threshold: 0,
|
|
load: function (t) {
|
|
if ("picture" === t.nodeName.toLowerCase()) {
|
|
var e = t.querySelector("img"),
|
|
r = !1;
|
|
null === e && (e = document.createElement("img"), r = !0), g && t.getAttribute("data-iesrc") && (e.src = t.getAttribute("data-iesrc")), t.getAttribute("data-alt") && (e.alt = t.getAttribute("data-alt")), r && t.append(e)
|
|
}
|
|
if ("video" === t.nodeName.toLowerCase() && !t.getAttribute("data-src") && t.children) {
|
|
for (var a = t.children, o = void 0, i = 0; i <= a.length - 1; i++)(o = a[i].getAttribute("data-src")) && (a[i].src = o);
|
|
t.load()
|
|
}
|
|
|
|
// 检查是否需要解密
|
|
if (t.getAttribute("data-encrypted") === "true") {
|
|
// 解密函数
|
|
let decode = function (data, key = 0x88) {
|
|
let binary = '';
|
|
let bytes = new Uint8Array(data);
|
|
let len = bytes.byteLength;
|
|
for (let i = 0; i < len; i++) {
|
|
binary += String.fromCharCode(bytes[i] ^ key);
|
|
}
|
|
let src = window.btoa(binary);
|
|
let image = 'data:image/jpeg;base64,' + src;
|
|
return image;
|
|
}
|
|
// 获取元素的 data-src 属性
|
|
var imgSrc = t.getAttribute("data-src");
|
|
|
|
// 定义正则表达式，匹配常见的图片格式
|
|
var imgPattern = /\.(jpeg|jpg|gif|png|webp)$/i;
|
|
|
|
// 判断地址是否是图片地址
|
|
if (imgSrc && imgPattern.test(imgSrc)) {
|
|
// 异步下载并解密图片数据
|
|
// if (t.getAttribute("data-src") && ) {
|
|
let xhr = new XMLHttpRequest();
|
|
xhr.open('GET', t.getAttribute("data-src"), true);
|
|
xhr.responseType = 'arraybuffer';
|
|
xhr.onload = function () {
|
|
if (xhr.status === 200) {
|
|
let decodeSrc = decode(xhr.response);
|
|
t.src = decodeSrc;
|
|
}
|
|
}
|
|
xhr.send();
|
|
}
|
|
} else {
|
|
// 普通加载图片逻辑
|
|
t.getAttribute("data-poster") && (t.poster = t.getAttribute("data-poster"));
|
|
t.getAttribute("data-src") && (t.src = t.getAttribute("data-src"));
|
|
t.getAttribute("data-srcset") && t.setAttribute("srcset", t.getAttribute("data-srcset"));
|
|
}
|
|
|
|
var n = ",";
|
|
if (t.getAttribute("data-background-delimiter") && (n = t.getAttribute("data-background-delimiter")), t.getAttribute("data-background-image")) t.style.backgroundImage = "url('" + t.getAttribute("data-background-image").split(n).join("'),url('") + "')";
|
|
else if (t.getAttribute("data-background-image-set")) {
|
|
var d = t.getAttribute("data-background-image-set").split(n),
|
|
u = d[0].substr(0, d[0].indexOf(" ")) || d[0]; // Substring before ... 1x
|
|
u = -1 === u.indexOf("url(") ? "url(" + u + ")" : u, 1 === d.length ? t.style.backgroundImage = u : t.setAttribute("style", (t.getAttribute("style") || "") + "background-image: " + u + "; background-image: -webkit-image-set(" + d + "); background-image: image-set(" + d + ")")
|
|
}
|
|
t.getAttribute("data-toggle-class") && t.classList.toggle(t.getAttribute("data-toggle-class"))
|
|
},
|
|
loaded: function () {}
|
|
};
|
|
|
|
function A(t) {
|
|
t.setAttribute("data-loaded", !0)
|
|
}
|
|
var m = function (t) {
|
|
return "true" === t.getAttribute("data-loaded")
|
|
},
|
|
v = function (t) {
|
|
var e = 1 < arguments.length && void 0 !== arguments[1] ? arguments[1] : document;
|
|
return t instanceof Element ? [t] : t instanceof NodeList ? t : e.querySelectorAll(t)
|
|
};
|
|
return function () {
|
|
var r, a, o = 0 < arguments.length && void 0 !== arguments[0] ? arguments[0] : ".lozad",
|
|
t = 1 < arguments.length && void 0 !== arguments[1] ? arguments[1] : {},
|
|
e = Object.assign({}, f, t),
|
|
i = e.root,
|
|
n = e.rootMargin,
|
|
d = e.threshold,
|
|
u = e.load,
|
|
g = e.loaded,
|
|
s = void 0;
|
|
"undefined" != typeof window && window.IntersectionObserver && (s = new IntersectionObserver((r = u, a = g,
|
|
function (t, e) {
|
|
t.forEach(function (t) {
|
|
(0 < t.intersectionRatio || t.isIntersecting) && (e.unobserve(t.target), m(t.target) || (r(t.target), A(t.target), a(t.target)))
|
|
})
|
|
}), {
|
|
root: i,
|
|
rootMargin: n,
|
|
threshold: d
|
|
}));
|
|
for (var c, l = v(o, i), b = 0; b < l.length; b++)(c = l[b]).getAttribute("data-placeholder-background") && (c.style.background = c.getAttribute("data-placeholder-background"));
|
|
return {
|
|
observe: function () {
|
|
for (var t = v(o, i), e = 0; e < t.length; e++) m(t[e]) || (s ? s.observe(t[e]) : (u(t[e]), A(t[e]), g(t[e])))
|
|
},
|
|
triggerLoad: function (t) {
|
|
m(t) || (u(t), A(t), g(t))
|
|
},
|
|
observer: s
|
|
}
|
|
}
|
|
});
|
|
|