more fix to the toc

apache · Jul 9, 2020 · 6e72aa8 · 6e72aa8
1 parent a6ade51
commit 6e72aa8
Show file tree

Hide file tree

Showing 5 changed files with 251 additions and 232 deletions.
diff --git a/docs/python_docs/themes/mx-theme/mxtheme/static/sphinx_materialdesign_theme.css b/docs/python_docs/themes/mx-theme/mxtheme/static/sphinx_materialdesign_theme.css
diff --git a/docs/python_docs/themes/mx-theme/mxtheme/static/sphinx_materialdesign_theme.css.map b/docs/python_docs/themes/mx-theme/mxtheme/static/sphinx_materialdesign_theme.css.map
diff --git a/docs/python_docs/themes/mx-theme/mxtheme/static/sphinx_materialdesign_theme.js b/docs/python_docs/themes/mx-theme/mxtheme/static/sphinx_materialdesign_theme.js
diff --git a/docs/python_docs/themes/mx-theme/mxtheme/static/sphinx_materialdesign_theme.js.map b/docs/python_docs/themes/mx-theme/mxtheme/static/sphinx_materialdesign_theme.js.map
diff --git a/docs/python_docs/themes/mx-theme/src/js/scrollspy.js b/docs/python_docs/themes/mx-theme/src/js/scrollspy.js
@@ -42,6 +42,21 @@ export default class ScrollSpy {
             }, 1);
         });
 
+        this.scrollElement.addEventListener("click", (e) => {
+            const target = e.target;
+            if (target.tagName !== "A") return;
+            window.onclickToc = true;
+            for (let i = 0, max = this.nav.length; i < max; i++) {
+                const navElement = this.nav[i];
+                if (navElement.href === target.href) {
+                    navElement.classList.add(this.className);
+                    navElement.classList.add('mdl-color-text--primary');
+                } else {
+                    navElement.classList.remove(this.className);
+                    navElement.classList.remove('mdl-color-text--primary');
+                }
+            }
+        });
     }
 
     getContents(contentSelector) {
@@ -72,15 +87,21 @@ export default class ScrollSpy {
 
     isView(element) {
         const scrollTop = this.scrollElement.scrollTop;
-        const calcBotom = scrollTop + this.offsetTop;
+        const subHeaderRect = document.querySelector(".mdl-layout__header-row").getBoundingClientRect();
+        const headerHeight = subHeaderRect.top + subHeaderRect.height;
+        const scrollBottom = scrollTop + window.innerHeight - headerHeight;
         const rect = element.getBoundingClientRect();
         const elementTop = rect.top + scrollTop;
         const elementBottom = elementTop + element.offsetHeight;
 
-        return elementTop <= calcBotom + this.offsetTop && elementBottom > scrollTop + this.offsetTop;
+        return elementTop < scrollBottom - 30 && elementBottom > scrollTop + headerHeight + 30;
     }
 
     toggleNavClass(elements) {
+        if (window.onclickToc) {
+            window.onclickToc = false;
+            return;
+          }
         let maxDepth = 0;
         let maxDepthElement = $();