1 files changed, 65 insertions, 42 deletions

diff --git a/static/js/pager.ts b/static/js/pager.ts
index 01d40d7..ebaf67a 100644
--- a/static/js/pager.ts
+++ b/static/js/pager.ts
@@ -4,44 +4,60 @@
   if (cookiesDisabled) {
     document.cookie = "disabled";
     document.cookie.indexOf("disabled");
-    return console.log("Pager is disabled due to cookie restrictions.");
+    return console.warn("WARNING: Pager disabled due to cookie restrictions");
   }
 
-  let settings = { pager: {} };
+  let seek;
+  let pager = {};
 
-  const url = self.location.href.split("#")[0].split("?")[0];
+  const state = "on";
+  const key = "config.scroll.pager.urls";
 
-  const scrollRestore = (url) => {
-    if (history.scrollRestoration) history.scrollRestoration = "manual";
-    if (localStorage["settings"]) {
-      settings = JSON.parse(localStorage["settings"]);
-    }
-    const fragment = document.getElementById(location.hash.slice(1));
-    const fragmentInURL = self.location.hash.length > 0;
-    if (fragmentInURL && document.body.contains(fragment)) {
-      settings["pager"][url] = self.pageYOffset;
-      localStorage["settings"] = JSON.stringify(settings);
-      fragment.scrollIntoView();
-      self.addEventListener("load", function () {
-        fragment.scrollIntoView();
-      });
-      return;
-    }
-    if (settings["pager"][url] > 0) {
-      self.scrollTo(0, settings["pager"][url]);
-      return;
+  if (!localStorage[key]) localStorage[key] = JSON.stringify(pager);
+
+  let url = function () { return self.location.href.split("#")[0].split("?")[0]; };
+
+  const scrollHash = function (url) {
+    const hash = self.location.hash;
+    const fragment = hash.slice(1) && document.getElementById(hash.slice(1));
+    const fragmented = hash.length > 0;
+    const hashed = fragmented && document.body.contains(fragment);
+    if (hashed) {
+      self.location.hash = hash;
+      self.location.href = hash;
+      if ("scroll-margin-top" in document.body.style === false && fragment.textContent !== "") {
+        self.scrollBy(0, -6 * parseFloat(getComputedStyle(document.documentElement).fontSize));
+      }
     }
-    settings["pager"][url] = self.pageYOffset;
-    localStorage["settings"] = JSON.stringify(settings);
+    return hashed;
   };
 
-  const scrollTrack = (url) => {
+  const scrollRestore = function (url) {
+    if (history.scrollRestoration) history.scrollRestoration = "manual";
+    if (scrollHash(url)) return;
+    pager = JSON.parse(localStorage[key]);
+    if (pager[url] > 0) {
+      clearInterval(seek);
+      self.scrollTo(0, pager[url]);
+      let i = 0; return seek = setInterval(function (position) {
+        i++; if (i > 100) clearInterval(seek);
+        if (document.documentElement.scrollHeight >= position + document.documentElement.clientHeight) {
+          clearInterval(seek); self.scrollTo(0, position);
+        }
+      }, 4, pager[url]);
+    } else self.scrollTo(0, 0);
+    pager[url] = self.pageYOffset;
+    localStorage[key] = JSON.stringify(pager);
+  };
+
+  const scrollTrack = function (url) {
     const currentPosition = self.pageYOffset;
-    settings["pager"][url] = currentPosition;
-    localStorage["settings"] = JSON.stringify(settings);
+    pager = JSON.parse(localStorage[key]);
+    pager[url] = currentPosition;
+    localStorage[key] = JSON.stringify(pager);
   };
 
-  const backTrack = (back, up, event) => {
+  const scrollReverse = function (back, up, event) {
     if (document.body.contains(up) && up.contains(event.target)) {
       event.preventDefault();
       window.scrollTo(0, 0);
@@ -53,20 +69,27 @@
     }
   };
 
-  self.addEventListener("DOMContentLoaded", function () {
-    scrollRestore(url);
-    self.addEventListener("click", function (event) {
-      const up = document.getElementById("top");
-      const back = document.getElementById("back");
-      backTrack(back, up, event);
-    });
-  });
-
-  self.addEventListener("scroll", function () {
-    scrollTrack(url);
-  });
+  ["DOMContentLoaded", "pageshow", "hashchange", "URLChangedCustomEvent"].forEach(
+    function (event) {
+      self.addEventListener(event, function (event) {
+        if (event.type === "pageshow") {
+          return event.persisted && self.scrollTo(0, pager[url()]);
+        }
+        if (event.type === "DOMContentLoaded") {
+          self.addEventListener("click", function (event) {
+            const up = document.getElementById("top");
+            const back = document.getElementById("back");
+            scrollReverse(back, up, event);
+          });
+        }
+        scrollRestore(url());
+      });
+    },
+  );
 
-  self.addEventListener("hashchange", function () {
-    scrollRestore(url);
+  ["click", "touchstart", "scroll"].forEach(function (event) {
+    self.addEventListener(event, function () {
+      scrollTrack(url());
+    });
   });
 })();