feat(scroll): Save scroll position

book/_static/scroll.js

+// Keep track of the scroll position
+const NAVIGATION_ELEMENT_CLASS = "bd-sidebar-primary";
+
+document.addEventListener("DOMContentLoaded", () => {
+    addEventListener("beforeunload", () => {
+        let elements = document.getElementsByClassName(NAVIGATION_ELEMENT_CLASS);
+
+        if (elements.length === 0) {
+            console.warn("No sidebar found, cannot save scroll position");
+            return;
+        }
+
+        localStorage.setItem("navigationScrollPosition", elements[0].scrollTop);
+    });
+
+    let elements = document.getElementsByClassName(NAVIGATION_ELEMENT_CLASS);
+
+    if (elements.length === 0) {
+        console.warn("No sidebar found, cannot restore scroll position");
+        return;
+    }
+
+    let scrollPosition = localStorage.getItem("navigationScrollPosition");
+    if (scrollPosition == null) {
+        return;
+    }
+
+    // Convert scroll position into a positive number and apply it
+    let parsedPosition = Math.abs(scrollPosition);
+    console.debug(`Restoring scroll position to ${parsedPosition}`);
+    elements[0].scrollTop = isNaN(parsedPosition) ? 0 : parsedPosition;
+});

thebe_lite/_static/sphinx-thebe.js

@@ -175,8 +175,8 @@ var configureThebe = () => {
 
     updateThebeButtonStatus(
       `<span class='launch_msg'>Launching Pyodide kernel: </span><span class='status'>` +
-        data.status +
-        "</span>"
+      data.status +
+      "</span>"
     );
 
     if (data.status === "attached") {
@@ -301,7 +301,7 @@ function override_pyodide_lookup(fs, server_path) {
       currentDirectory += directory + "/";
       try {
         fs.mkdir(currentDirectory);
-      } catch {}
+      } catch { }
     }
   }
 
@@ -430,9 +430,8 @@ var initThebe = async () => {
   // 4. Execute the override_pyodide_lookup function in JS, and bake in the relative path from root in the book (the home)
   // NOTE: All functions used in override_pyodide_lookup should be nested inside it, since the web worker cannot access functions in this script
   thebelab.session.kernel.requestExecute({
-    code: `import js; import pyodide_js; js.fs = pyodide_js.FS; js.eval("""${override_pyodide_lookup.toString()}"""); js.eval(f"override_pyodide_lookup(fs, '${
-      location.pathname.split("/").slice(0, -1).join("/") + "/"
-    }')")`,
+    code: `import js; import pyodide_js; js.fs = pyodide_js.FS; js.eval("""${override_pyodide_lookup.toString()}"""); js.eval(f"override_pyodide_lookup(fs, '${location.pathname.split("/").slice(0, -1).join("/") + "/"
+      }')")`,
   });
 
   const request = new XMLHttpRequest();

[Tom van Woudenberg]

This is awesome! Maybe share it with the jupyterbookcommunity aswell @rstular ? https://github.com/executablebooks/jupyter-book

[Rok Štular]

As soon as I find the time to do so, I will