static/js/pager: Avoid stacking load listeners

1 files changed, 32 insertions, 29 deletions

diff --git a/static/js/pager.ts b/static/js/pager.ts
index 0c512ce..6b03270 100644
--- a/static/js/pager.ts
+++ b/static/js/pager.ts
@@ -15,26 +15,26 @@
 
   if (!localStorage[key]) localStorage[key] = JSON.stringify(pager);
 
-  const link = function () {
-    url = self.location.href.split("#")[0].split("?")[0];
+  const link = function () { url = self.location.href.split("#")[0].split("?")[0]; };
+
+  const scrollHash = function (url, load = false) {
+    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;
+      if (load) fragment.scrollIntoView();
+    }
+    return hashed;
   };
 
   const scrollRestore = function (url) {
     if (history.scrollRestoration) history.scrollRestoration = "manual";
+    if (scrollHash(url)) return;
     pager = JSON.parse(localStorage[key]);
-    const hash = self.location.hash;
-    const fragment = hash.slice(1) && document.getElementById(hash.slice(1));
-    const fragmentInURL = hash.length > 0;
-    if (fragmentInURL && document.body.contains(fragment)) {
-      pager[url] = self.pageYOffset;
-      localStorage[key] = JSON.stringify(pager);
-      fragment.scrollIntoView();
-      return self.addEventListener("DOMContentLoaded", function () {
-        fragment.scrollIntoView();
-      });
-    }
     if (pager[url] > 0) {
-      clearInterval(seek)
+      clearInterval(seek);
       self.scrollTo(0, pager[url]);
       let i = 0; return seek = setInterval(function (position) {
         i++; if (i > 100) clearInterval(seek);
@@ -66,22 +66,25 @@
     }
   };
 
-  self.addEventListener("DOMContentLoaded", function () {
-    self.addEventListener("click", function (event) {
-      const up = document.getElementById("top");
-      const back = document.getElementById("back");
-      scrollReverse(back, up, event);
-    });
-  });
+  self.addEventListener("load", function () { link(); scrollHash(url, true); });
 
-  ["DOMContentLoaded", "pageshow", "hashchange", "URLChangedCustomEvent"].forEach(function (event) {
-    self.addEventListener(event, function (event) {
-      if (event.type === "pageshow") {
-        return event.persisted && self.scrollTo(0, pager[url]);
-      }
-      link(); scrollRestore(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);
+          });
+        }
+        link(); scrollRestore(url);
+      });
+    },
+  );
 
   ["click", "touchstart", "scroll"].forEach(function (event) {
     self.addEventListener(event, function () {