Add auto-scrolling to selected navigation item on page load (#2575)

plugins/base/src/main/resources/dokka/scripts/navigation-loader.js

@@ -14,6 +14,8 @@ displayNavigationFromPage = () => {
         })
     }).then(() => {
         revealNavigationForCurrentPage()
+    }).then(() => {
+        scrollNavigationToSelectedElement()
     })
     document.querySelectorAll('.footer a[href^="#"]').forEach(anchor => {
         anchor.addEventListener('click', function (e) {
@@ -51,6 +53,28 @@ revealParents = (part) => {
     }
 };
 
+scrollNavigationToSelectedElement = () => {
+    let selectedElement = document.querySelector('div.sideMenuPart[data-active]')
+    if (selectedElement == null) { // nothing selected, probably just the main page opened
+        return
+    }
+
+    let isPackageElement = selectedElement.children.length > 1
+    if (isPackageElement) {
+        // if package is selected or linked, it makes sense to align it to top
+        // so that you can see all the members it contains
+        selectedElement.scrollIntoView(true)
+    } else {
+        // if a member within a package is linked, it makes sense to center it since it,
+        // this should make it easier to look at surrounding members
+        selectedElement.scrollIntoView({
+            behavior: 'auto',
+            block: 'center',
+            inline: 'center'
+        })
+    }
+}
+
 /*
     This is a work-around for safari being IE of our times.
     It doesn't fire a DOMContentLoaded, presumabely because eventListener is added after it wants to do it
@@ -61,4 +85,4 @@ if (document.readyState == 'loading') {
     })
 } else {
     displayNavigationFromPage()
-}
+}