1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
|
(function () {
type percent = number;
function fetch(url, method, callback) {
const http = new XMLHttpRequest();
http.onreadystatechange = function () {
if (callback && http.readyState === 4 && http.status === 200) {
callback(http);
}
};
http.open(method, url);
http.send();
return http;
}
["scroll", "DOMContentLoaded"].forEach(function (event) {
self.addEventListener(event, function () {
const remaining = Math.abs(
document.documentElement.scrollHeight
- document.documentElement.clientHeight
- document.documentElement.scrollTop
);
const traversed = self.pageYOffset;
const journey = remaining + traversed;
const ratio: percent = traversed / journey * 100;
const threshold = ratio >= 50;
const pagination = document.querySelector('[data-type="pagination"]');
if (!pagination) return;
const main = document.querySelector("main");
const next = pagination.querySelector('[rel="next"]');
const end = pagination.querySelector('[rel="last"]').title === "hidden";
const asynchronous = document.querySelectorAll("[data-type='pagination']").length !== 1;
if (end || asynchronous) return pagination.remove();
if (threshold) {
pagination.remove();
fetch(next.href, "GET", function (http) {
const page = (new DOMParser()).parseFromString(http.responseText, "text/html");
const items = page.querySelector("main").childNodes;
const paginate = page.querySelector('[data-type="pagination"]');
for (let i = 0; i < items.length; i++) {
main.appendChild(items[i]);
}
main.after(paginate);
console.log("Fetch:", next.href, items);
});
}
console.log("r:", remaining, "t:", traversed, "j:", journey, "%:", ratio);
});
});
})();
|
