From 4a7f4dc08884f43d08f1f6eb28e44e63a6c9ccab Mon Sep 17 00:00:00 2001
From: George Cushen <gcushen@users.noreply.github.com>
Date: Thu, 23 Jan 2020 22:36:42 +0000
Subject: [PATCH] fix: improve active link highlighting for edge cases

Attempt improvement by moving the scroll to anchor logic to the end of window load and adding 1 to elementOffset in case of navbar border.

Appears to solve any issues that could arise (such as when clicking Courses and then Publications, but Projects being highlighted instead) in local testing.

See https://github.com/gcushen/hugo-academic/issues/1199#issuecomment-577293818
See #1199
---
 assets/js/academic.js | 48 +++++++++++++++++++++----------------------
 1 file changed, 24 insertions(+), 24 deletions(-)

diff --git a/assets/js/academic.js b/assets/js/academic.js
index 414bd98a..48f78c06 100644
--- a/assets/js/academic.js
+++ b/assets/js/academic.js
@@ -35,7 +35,7 @@
       // Escape special chars from IDs, such as colons found in Markdown footnote links.
       target = '#' + $.escapeSelector(target.substring(1));  // Previously, `target = target.replace(/:/g, '\\:');`
 
-      let elementOffset = Math.ceil($(target).offset().top - getNavBarHeight());  // Round up to highlight right ID!
+      let elementOffset = Math.ceil($(target).offset().top - getNavBarHeight()) + 1;  // Round up to highlight right ID!
       $('body').addClass('scrolling');
       $('html, body').animate({
         scrollTop: elementOffset
@@ -475,29 +475,6 @@
    * --------------------------------------------------------------------------- */
 
   $(window).on('load', function() {
-    // Re-initialize Scrollspy with dynamic navbar height offset.
-    fixScrollspy();
-
-    if (window.location.hash) {
-      // When accessing homepage from another page and `#top` hash is set, show top of page (no hash).
-      if (window.location.hash == "#top") {
-        window.location.hash = ""
-      } else if (!$('.projects-container').length) {
-        // If URL contains a hash and there are no dynamically loaded images on the page,
-        // immediately scroll to target ID taking into account responsive offset.
-        // Otherwise, wait for `imagesLoaded()` to complete before scrolling to hash to prevent scrolling to wrong
-        // location.
-        scrollToAnchor();
-      }
-    }
-
-    // Call `fixScrollspy` when window is resized.
-    let resizeTimer;
-    $(window).resize(function() {
-      clearTimeout(resizeTimer);
-      resizeTimer = setTimeout(fixScrollspy, 200);
-    });
-
     // Filter projects.
     $('.projects-container').each(function(index, container) {
       let $container = $(container);
@@ -631,6 +608,29 @@
       dropdown[dropdown.is(':hover') ? 'addClass' : 'removeClass']('show');
       menu[dropdown.is(':hover') ? 'addClass' : 'removeClass']('show');
     }, 300);
+
+    // Re-initialize Scrollspy with dynamic navbar height offset.
+    fixScrollspy();
+
+    if (window.location.hash) {
+      // When accessing homepage from another page and `#top` hash is set, show top of page (no hash).
+      if (window.location.hash == "#top") {
+        window.location.hash = ""
+      } else if (!$('.projects-container').length) {
+        // If URL contains a hash and there are no dynamically loaded images on the page,
+        // immediately scroll to target ID taking into account responsive offset.
+        // Otherwise, wait for `imagesLoaded()` to complete before scrolling to hash to prevent scrolling to wrong
+        // location.
+        scrollToAnchor();
+      }
+    }
+
+    // Call `fixScrollspy` when window is resized.
+    let resizeTimer;
+    $(window).resize(function() {
+      clearTimeout(resizeTimer);
+      resizeTimer = setTimeout(fixScrollspy, 200);
+    });
   });
 
 })(jQuery);