static/js: Ensure correct width and height references

1 files changed, 48 insertions, 2 deletions

diff --git a/assets/js/index.js b/assets/js/index.js
index 8a47f5a..543b5a1 100644
--- a/assets/js/index.js
+++ b/assets/js/index.js
@@ -573,7 +573,7 @@
             }
         };
         const view = element.getBoundingClientRect();
-        return view.top >= -options.offset.top && view.left >= -options.offset.left && view.bottom <= (window.innerHeight || self.documentElement.clientHeight) + options.offset.bottom && view.right <= (window.innerWidth || self.documentElement.clientWidth) + options.offset.right;
+        return view.top >= -options.offset.top && view.left >= -options.offset.left && view.bottom <= (self.innerHeight || document.documentElement.clientHeight) + options.offset.bottom && view.right <= (self.innerWidth || document.documentElement.clientWidth) + options.offset.right;
     }
     [
         "scroll",
@@ -600,6 +600,52 @@
     });
 })();
 (function() {
+    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 = 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 i1 = 0; i1 < items.length; i1++){
+                        main.appendChild(items[i1]);
+                    }
+                    main.after(paginate);
+                    console.log("Fetch:", next.href, items);
+                });
+            }
+            console.log("r:", remaining, "t:", traversed, "j:", journey, "%:", ratio);
+        });
+    });
+})();
+(function() {
     const relative = new Intl.RelativeTimeFormat("en", {
         localeMatcher: "best fit",
         numeric: "always",
@@ -609,7 +655,7 @@
         offset: 100
     }) {
         const view = element.getBoundingClientRect();
-        return view.top >= -options.offset && view.left >= -options.offset && view.bottom <= (window.innerHeight || self.documentElement.clientHeight) + options.offset && view.right <= (window.innerWidth || self.documentElement.clientWidth) + options.offset;
+        return view.top >= -options.offset && view.left >= -options.offset && view.bottom <= (self.innerHeight || document.documentElement.clientHeight) + options.offset && view.right <= (self.innerWidth || document.documentElement.clientWidth) + options.offset;
     }
     const date = function(update) {
         const elements = document.querySelectorAll("time");