From cdcf25bf8cf37b6d917e86f7087b1413709df531 Mon Sep 17 00:00:00 2001
From: Jan Calanog <jan.calanog@elastic.co>
Date: Thu, 16 Jan 2025 15:01:47 +0100
Subject: [PATCH] Keep navigation position when clicking through the
 documentation

---
 src/Elastic.Markdown/_static/shibuya.js | 63 +++++++++++++++++--------
 1 file changed, 43 insertions(+), 20 deletions(-)

diff --git a/src/Elastic.Markdown/_static/shibuya.js b/src/Elastic.Markdown/_static/shibuya.js
index b2dc6de01..90b625378 100644
--- a/src/Elastic.Markdown/_static/shibuya.js
+++ b/src/Elastic.Markdown/_static/shibuya.js
@@ -15,27 +15,50 @@ iconify-icon/dist/iconify-icon.mjs:
   *)
 */
 
-/**
- * Expands all collapsed parent sections in the navigation tree that contain the current page link.
- * This ensures the current page is visible in the navigation by opening all ancestor collapsible sections.
- * The function works by:
- * 1. Finding the navigation link matching the current page URL
- * 2. Walking up the DOM tree from that link
- * 3. Expanding any collapsed parent sections by toggling their CSS classes
- */
-function expandCurrentPage() {
-  const currentPathname = window.location.pathname;
-  const currentLink = document.querySelector(`a[href="${currentPathname}"]`);
-  if (currentLink) {
-    let parent = currentLink.parentElement;
-    while (parent) {
-      if (parent.classList && parent.classList.contains('_collapse')) {
-        parent.classList.remove('_collapse');
-        parent.classList.add('_expand');
+(function() {
+  /**
+   * Keep the navigation scroll position when navigating between pages.
+   * This function saves the scroll position in the session storage when
+   * the page is unloaded and restores it when the page is loaded.
+   * This ensures the navigation scroll position is maintained when navigating
+   * between pages in the documentation.
+   */
+  function keepNavPosition() {
+    const nav = document.querySelector('.sy-scrollbar:has(> .globaltoc)');
+    const scrollPosition = sessionStorage.getItem('navScrollPosition');
+    if (scrollPosition) {
+      nav.scrollTop = scrollPosition;
+    }
+    window.addEventListener('beforeunload', () => {
+      sessionStorage.setItem('navScrollPosition', nav.scrollTop);
+    });
+  }
+
+  /**
+   * Expands all collapsed parent sections in the navigation tree that contain the current page link.
+   * This ensures the current page is visible in the navigation by opening all ancestor collapsible sections.
+   * The function works by:
+   * 1. Finding the navigation link matching the current page URL
+   * 2. Walking up the DOM tree from that link
+   * 3. Expanding any collapsed parent sections by toggling their CSS classes
+   */
+  function expandCurrentPage() {
+    const currentPathname = window.location.pathname;
+    const currentLink = document.querySelector(`a[href="${currentPathname}"]`);
+    if (currentLink) {
+      let parent = currentLink.parentElement;
+      while (parent) {
+        if (parent.classList && parent.classList.contains('_collapse')) {
+          parent.classList.remove('_collapse');
+          parent.classList.add('_expand');
+        }
+        parent = parent.parentElement;
       }
-      parent = parent.parentElement;
     }
   }
-}
 
-expandCurrentPage();
+  expandCurrentPage();
+  keepNavPosition();
+})();
+
+