{{/* 根据页面内容生成目录 */}}
{{ if and .TableOfContents (ne .TableOfContents "<nav id=\"TableOfContents\"></nav>") }}
<nav class="toc-nav">
    {{ .TableOfContents }}
</nav>

<script>
    // 为目录添加平滑滚动和当前位置高亮
    document.addEventListener('DOMContentLoaded', function () {
        const tocLinks = document.querySelectorAll('.toc-nav a');
        const headings = Array.from(tocLinks).map(link => {
            const id = link.getAttribute('href').replace('#', '');
            return document.getElementById(id);
        }).filter(h => h);

        // 平滑滚动
        tocLinks.forEach(link => {
            link.addEventListener('click', function (e) {
                e.preventDefault();
                const targetId = this.getAttribute('href').replace('#', '');
                const target = document.getElementById(targetId);
                if (target) {
                    target.scrollIntoView({
                        behavior: 'smooth',
                        block: 'start'
                    });

                    // 更新活动状态
                    tocLinks.forEach(l => l.classList.remove('active'));
                    this.classList.add('active');
                }
            });
        });

        // 滚动时更新当前位置
        function updateActiveLink() {
            const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
            const windowHeight = window.innerHeight;

            for (let i = headings.length - 1; i >= 0; i--) {
                const heading = headings[i];
                const rect = heading.getBoundingClientRect();

                if (rect.top <= 100) {
                    // 移除所有活动状态
                    tocLinks.forEach(link => link.classList.remove('active'));
                    
                    // 高亮当前标题
                    const activeLink = document.querySelector(`.toc-nav a[href="#${heading.id}"]`);
                    if (activeLink) {
                        activeLink.classList.add('active');
                        
                        // 高亮所有父级标题
                        let currentLi = activeLink.closest('li');
                        while (currentLi) {
                            const parentLi = currentLi.parentElement.closest('li');
                            if (parentLi) {
                                const parentLink = parentLi.querySelector('a');
                                if (parentLink) {
                                    parentLink.classList.add('active');
                                }
                                currentLi = parentLi;
                            } else {
                                break;
                            }
                        }
                    }
                    break;
                }
            }
        }

        // 节流函数
        let ticking = false;
        function throttleScroll() {
            if (!ticking) {
                requestAnimationFrame(function () {
                    updateActiveLink();
                    ticking = false;
                });
                ticking = true;
            }
        }

        window.addEventListener('scroll', throttleScroll);

        // 初始化时更新一次
        updateActiveLink();
    });
</script>
{{ end }}