https://starsyi.github.io/js/src/post-details.js?v=5.0.1

1/* global NexT: true */
2
3$(document).ready(function () {
4
5  initScrollSpy();
6  NexT.utils.needAffix() && initAffix();
7  initTOCDimension();
8
9  function initScrollSpy () {
10    var tocSelector = '.post-toc';
11    var $tocElement = $(tocSelector);
12    var activeCurrentSelector = '.active-current';
13
14    $tocElement
15      .on('activate.bs.scrollspy', function () {
16        var $currentActiveElement = $(tocSelector + ' .active').last();
17
18        removeCurrentActiveClass();
19        $currentActiveElement.addClass('active-current');
20      })
21      .on('clear.bs.scrollspy', removeCurrentActiveClass);
22
23    $('body').scrollspy({ target: tocSelector });
24
25    function removeCurrentActiveClass () {
26      $(tocSelector + ' ' + activeCurrentSelector)
27        .removeClass(activeCurrentSelector.substring(1));
28    }
29  }
30
31  function initAffix () {
32    var headerHeight = $('.header-inner').height();
33    var footerOffset = parseInt($('.main').css('padding-bottom'), 10);
34    var sidebarTop = headerHeight + 10;
35
36    $('.sidebar-inner').affix({
37      offset: {
38        top: sidebarTop,
39        bottom: footerOffset
40      }
41    });
42
43    $(document)
44      .on('affixed.bs.affix', function () {
45        updateTOCHeight(document.body.clientHeight - 100);
46      });
47  }
48
49  function initTOCDimension () {
50    var updateTOCHeightTimer;
51
52    $(window).on('resize', function () {
53      updateTOCHeightTimer && clearTimeout(updateTOCHeightTimer);
54
55      updateTOCHeightTimer = setTimeout(function () {
56        var tocWrapperHeight = document.body.clientHeight - 100;
57
58        updateTOCHeight(tocWrapperHeight);
59      }, 0);
60    });
61
62    // Initialize TOC Height.
63    updateTOCHeight(document.body.clientHeight - 100);
64
65    // Initialize TOC Width.
66    var scrollbarWidth = NexT.utils.getScrollbarWidth();
67    $('.post-toc').css('width', 'calc(100% + ' + scrollbarWidth + 'px)');
68  }
69
70  function updateTOCHeight (height) {
71    height = height || 'auto';
72    $('.post-toc').css('max-height', height);
73  }
74
75});
76
77$(document).ready(function () {
78  var html = $('html');
79  var TAB_ANIMATE_DURATION = 200;
80  var hasVelocity = $.isFunction(html.velocity);
81
82  $('.sidebar-nav li').on('click', function () {
83    var item = $(this);
84    var activeTabClassName = 'sidebar-nav-active';
85    var activePanelClassName = 'sidebar-panel-active';
86    if (item.hasClass(activeTabClassName)) {
87      return;
88    }
89
90    var currentTarget = $('.' + activePanelClassName);
91    var target = $('.' + item.data('target'));
92
93    hasVelocity ?
94      currentTarget.velocity('transition.slideUpOut', TAB_ANIMATE_DURATION, function () {
95        target
96          .velocity('stop')
97          .velocity('transition.slideDownIn', TAB_ANIMATE_DURATION)
98          .addClass(activePanelClassName);
99      }) :
100      currentTarget.animate({ opacity: 0 }, TAB_ANIMATE_DURATION, function () {
101        currentTarget.hide();
102        target
103          .stop()
104          .css({'opacity': 0, 'display': 'block'})
105          .animate({ opacity: 1 }, TAB_ANIMATE_DURATION, function () {
106            currentTarget.removeClass(activePanelClassName);
107            target.addClass(activePanelClassName);
108          });
109      });
110
111    item.siblings().removeClass(activeTabClassName);
112    item.addClass(activeTabClassName);
113  });
114
115  $('.post-toc a').on('click', function (e) {
116    e.preventDefault();
117    var targetSelector = NexT.utils.escapeSelector(this.getAttribute('href'));
118    var offset = $(targetSelector).offset().top;
119
120    hasVelocity ?
121      html.velocity('stop').velocity('scroll', {
122        offset: offset  + 'px',
123        mobileHA: false
124      }) :
125      $('html, body').stop().animate({
126        scrollTop: offset
127      }, 500);
128  });
129
130  // Expand sidebar on post detail page by default, when post has a toc.
131  NexT.motion.middleWares.sidebar = function () {
132    var $tocContent = $('.post-toc-content');
133
134    if (CONFIG.sidebar.display === 'post' || CONFIG.sidebar.display === 'always') {
135      if ($tocContent.length > 0 && $tocContent.html().trim().length > 0) {
136        NexT.utils.displaySidebar();
137      }
138    }
139  };
140});