1 files changed, 29 insertions, 1 deletions
diff --git a/public/js/index.js b/public/js/index.js
index 16857d0d..b3fc372f 100644
--- a/public/js/index.js
+++ b/public/js/index.js
@@ -470,7 +470,8 @@ function windowResizeInner() {
             clearMap();
             syncScrollToView();
             editor.setOption('viewportMargin', viewportMargin);
-        }, windowResizeDelay);
+            updateScrollspy();
+        }, 100);
     }
 }
 
@@ -803,6 +804,32 @@ function generateScrollspy() {
     ui.area.view.scroll();
 }
 
+function updateScrollspy() {
+    var headers = ui.area.markdown.find('h1, h2, h3').toArray();
+    var headerMap = [];
+    for (var i = 0; i < headers.length; i++) {
+        headerMap.push($(headers[i]).offset().top - parseInt($(headers[i]).css('margin-top')));
+    }
+    applyScrollspyActive($(window).scrollTop(), headerMap, headers, 
+    $('.scrollspy-body'), 0);
+    var offset = ui.area.view.scrollTop() - ui.area.view.offset().top;
+    applyScrollspyActive(ui.area.view.scrollTop(), headerMap, headers, 
+    $('.scrollspy-view'), offset - 10);
+}
+
+function applyScrollspyActive(top, headerMap, headers, target, offset) {
+    var index = 0;
+    for(var i = headerMap.length - 1; i >= 0; i--) {
+        if(top >= (headerMap[i] + offset) && headerMap[i + 1] && top < (headerMap[i + 1] + offset)) {
+            index = i;
+            break;
+        }
+    }
+    var header = $(headers[index]);
+    var active = target.find('a[href="#' + header.attr('id') + '"]');
+    active.closest('li').addClass('active').parent().closest('li').addClass('active').parent().closest('li').addClass('active');
+}
+
 //fix for wrong autofocus
 $('#clipboardModal').on('shown.bs.modal', function () {
     $('#clipboardModal').blur();
@@ -1736,6 +1763,7 @@ function updateViewInner() {
     generateToc('toc');
     generateToc('toc-affix');
     generateScrollspy();
+    updateScrollspy();
     smoothHashScroll();
     isDirty = false;
     clearMap();