| | |
|---|
| | | const bufferPx = 150 |
|---|
| | | const observer = new IntersectionObserver(entries => { |
|---|
| | | const observer = new IntersectionObserver((entries) => { |
|---|
| | | for (const entry of entries) { |
|---|
| | | const slug = entry.target.id |
|---|
| | | const tocEntryElement = document.querySelector(`a[data-for="${slug}"]`) |
|---|
| | |
|---|
| | | function setupToc() { |
|---|
| | | const toc = document.getElementById("toc") |
|---|
| | | if (toc) { |
|---|
| | | const collapsed = toc.classList.contains("collapsed") |
|---|
| | | const content = toc.nextElementSibling as HTMLElement |
|---|
| | | content.style.maxHeight = content.scrollHeight + "px" |
|---|
| | | content.style.maxHeight = collapsed ? "0px" : content.scrollHeight + "px" |
|---|
| | | toc.removeEventListener("click", toggleToc) |
|---|
| | | toc.addEventListener("click", toggleToc) |
|---|
| | | } |
|---|
| | |
|---|
| | | // update toc entry highlighting |
|---|
| | | observer.disconnect() |
|---|
| | | const headers = document.querySelectorAll("h1[id], h2[id], h3[id], h4[id], h5[id], h6[id]") |
|---|
| | | headers.forEach(header => observer.observe(header)) |
|---|
| | | headers.forEach((header) => observer.observe(header)) |
|---|
| | | }) |
|---|
