From d050f7f1f748ba0fea5ac63717cc79cd405af810 Mon Sep 17 00:00:00 2001 From: Eric Date: Tue, 27 Jun 2023 17:56:03 -0500 Subject: [PATCH] Website: Update documentation scroll event handler (#12547) Changes: - Updated the event handler for the sticky right-side navigation and the "Back to the top" button on docs pages only to run if those elements exist, and disabled the event handler on the documentation landing page. --- .../js/pages/docs/basic-documentation.page.js | 18 +++++++++++------- 1 file changed, 11 insertions(+), 7 deletions(-) diff --git a/website/assets/js/pages/docs/basic-documentation.page.js b/website/assets/js/pages/docs/basic-documentation.page.js index 2233d4d0d7..bc74ec7481 100644 --- a/website/assets/js/pages/docs/basic-documentation.page.js +++ b/website/assets/js/pages/docs/basic-documentation.page.js @@ -77,7 +77,9 @@ parasails.registerPage('basic-documentation', { return pagesBySectionSlug; })(); // Adding a scroll event listener for scrolling sidebars and showing the back to top button. - window.addEventListener('scroll', this.handleScrollingInDocumentation); + if(!this.isDocsLandingPage){ + window.addEventListener('scroll', this.handleScrollingInDocumentation); + } }, mounted: async function() { @@ -269,7 +271,7 @@ parasails.registerPage('basic-documentation', { let backToTopButton = document.querySelector('div[purpose="back-to-top-button"]'); let scrollTop = window.pageYOffset; let windowHeight = window.innerHeight; - + // If the right nav bar exists, add and remove a class based on the current scroll position. if (rightNavBar) { if (scrollTop > this.scrollDistance && scrollTop > windowHeight * 1.5) { rightNavBar.classList.add('header-hidden', 'scrolled'); @@ -279,12 +281,14 @@ parasails.registerPage('basic-documentation', { rightNavBar.classList.remove('header-hidden'); } } - if (backToTopButton && scrollTop > 2500) { - backToTopButton.classList.add('show'); - } else if (scrollTop === 0) { - backToTopButton.classList.remove('show'); + // If back to top button exists, add and remove a class based on the current scroll position. + if (backToTopButton){ + if (scrollTop > 2500) { + backToTopButton.classList.add('show'); + } else if (scrollTop === 0) { + backToTopButton.classList.remove('show'); + } } - this.scrollDistance = scrollTop; }, clickScrollToTop: function() {