aboutsummaryrefslogtreecommitdiff
path: root/static/js/pager.ts
blob: 68708ccea5d3da6e657fe4f1c569f7f47f34662a (plain)
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
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
(function () {
  const cookiesDisabled = !navigator.cookieEnabled;

  if (cookiesDisabled) {
    document.cookie = "disabled";
    document.cookie.indexOf("disabled");
    return console.log("Pager is disabled due to cookie restrictions.");
  }

  const settings = { pager: {} };

  const url = self.location.href.split("#")[0].split("?")[0];

  const scrollRestore = (settings, 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;
    }
    settings["pager"][url] = self.pageYOffset;
    localStorage["settings"] = JSON.stringify(settings);
  };

  const scrollTrack = (settings, url) => {
    const currentPosition = self.pageYOffset;
    settings["pager"][url] = currentPosition;
    localStorage["settings"] = JSON.stringify(settings);
  };

  const backTrack = (back, up, event) => {
    if (document.body.contains(up) && up.contains(event.target)) {
      event.preventDefault();
      window.scrollTo(0, 0);
    }
    if (document.body.contains(back) && back.contains(event.target)) {
      if (history.length < 2) return;
      event.preventDefault();
      history.go(-1);
    }
  };

  const fragmentClear = (entries) => {
    for (let entry = 0; entry < entries.length; entry++) {
      if (self.location.hash) {
        self.history.pushState(null, "", url);
      }
    }
  };

  const fragmentRelease = (fragmentCallback) => {
    try {
      const fragmentObserver = new IntersectionObserver(fragmentCallback, {
        threshold: 1.0,
      });
      const fragments = document.querySelectorAll("[id]");

      for (let fragment = 0; fragment < fragments.length; fragment++) {
        fragmentObserver.observe(fragments[fragment]);
      }
    } catch (error) {
      console.log("The intersection observer is not supported", error);
    }
  };

  self.addEventListener("DOMContentLoaded", function () {
    scrollRestore(settings, url);
    fragmentRelease(fragmentClear);
    self.addEventListener("click", function (event) {
      const up = document.getElementById("top");
      const back = document.getElementById("back");
      backTrack(back, up, event);
    });
  });

  self.addEventListener("scroll", function () {
    scrollTrack(settings, url);
  });
})();