サイドバーの目次をハイライト

var varHtagElements = null;
var varHtagPosition = null;
var varSideBarItem = null;

window.addEventListener('load', function () {
    setTimeout(function(){fnAfterContents();}, 10);
});

function fnAfterContents() {
    // H2、H3 を全て取得する（位置を計算する）
    varHtagElements = document.querySelectorAll('h2, h3');
    var varHtagArray = Array.from(varHtagElements);
    var varHtagPosition = varHtagArray.map(item => item.getBoundingClientRect().top);
    var varHtagPositionWithScroll = varHtagPosition.map(top => Math.floor(top + window.scrollY));
	
    // サイドバーの目次のリストを取得する
    varSideBarItem = document.querySelectorAll('#sidebar .p-toc__link');
  
    if (varSideBarItem == null || varSideBarItem.length == 0) {
        // 目次が無ければ終了
        return;
    }

    // 個数を取得
    const countHtag = varHtagElements.length;
    const countSideBarItem = varSideBarItem.length;
    const iMaxLoop = countHtag > countSideBarItem ? countSideBarItem : countHtag;

    window.addEventListener('scroll', () => {
        // 計算する位置
        const currentPosition = window.scrollY + 300;

        for (let iCount = 0; iCount < iMaxLoop; iCount++) {
            // 現在位置の表示を消す
            varSideBarItem[iCount].classList.remove('currentTocPosition');
            if (iCount >= iMaxLoop - 1 ) {
                // 要素の最後は、次の要素が無いので範囲外のみ判定
                if (currentPosition >= varHtagPositionWithScroll[iCount]) {
                    varSideBarItem[iCount].classList.add('currentTocPosition');
                }
            } else {
                // 要素の途中は、範囲内かどうかを判定
                if (currentPosition >= varHtagPositionWithScroll[iCount] && currentPosition < varHtagPositionWithScroll[iCount + 1]) {
                    varSideBarItem[iCount].classList.add('currentTocPosition');
                } 
            }
        }
    });
}

/*====================
サイドバー
====================*/
.p-toc__link.currentTocPosition {
	background-color: #FADCE9 !important;
}