document.addEventListener('DOMContentLoaded', () => {
// --- 1. 處理捲動時,目錄項目高亮顯示的邏輯 ---
const sections = document.querySelectorAll('h2[id], h3[id], h4[id], h5[id]');
const tocLinks = document.querySelectorAll('#toc-sidebar a');
const observer = new IntersectionObserver((entries) => {
let latestIntersectingEntry = null;
entries.forEach(entry => {
if (entry.isIntersecting) {
if (!latestIntersectingEntry || entry.boundingClientRect.top < latestIntersectingEntry.boundingClientRect.top) {
latestIntersectingEntry = entry;
}
}
});
if (latestIntersectingEntry) {
const activeId = latestIntersectingEntry.target.getAttribute('id');
tocLinks.forEach(link => {
link.classList.remove('active');
const linkHref = link.getAttribute('href').substring(1);
if (linkHref === activeId) {
link.classList.add('active');
const parentSubmenu = link.closest('.submenu');
if (parentSubmenu && !parentSubmenu.parentElement.classList.contains('open')) {
parentSubmenu.parentElement.classList.add('open');
}
}
});
}
}, {
rootMargin: '0px 0px -80% 0px'
});
sections.forEach(section => {
observer.observe(section);
});
// --- 2. 處理點擊時,目錄展開/收合的邏輯 ---
const toc = document.querySelector('#toc-sidebar');
toc.addEventListener('click', function(event) {
const targetLink = event.target.closest('a');
if (!targetLink) return;
if (targetLink.classList.contains('has-submenu')) {
event.preventDefault();
targetLink.parentElement.classList.toggle('open');
}
});
/* --- ★★★ 關鍵修正 #2 ★★★ (行動版漢堡選單功能) --- */
const body = document.body;
const menuToggle = document.getElementById('menu-toggle');
const sidebar = document.getElementById('toc-sidebar');
// 開關選單的邏輯改為直接在 body 上切換 class
menuToggle.addEventListener('click', (event) => {
event.stopPropagation();
body.classList.toggle('mobile-menu-open');
});
// 點擊遮罩層或側邊欄裡的「最終連結」時,關閉選單
document.addEventListener('click', (event) => {
// 如果 body 是開啟狀態,且點擊的不是側邊欄本身或漢堡按鈕
if (body.classList.contains('mobile-menu-open') && !sidebar.contains(event.target) && !menuToggle.contains(event.target)) {
body.classList.remove('mobile-menu-open');
}
// 如果點擊的是側邊欄裡的最終連結 (不是 has-submenu 的那種)
if (event.target.closest('a') && !event.target.closest('a').classList.contains('has-submenu') && sidebar.contains(event.target)) {
body.classList.remove('mobile-menu-open');
}
});
});