Org: html, check for TOC before JS assumes exists

This commit is contained in:
TEC 2021-04-24 02:06:22 +08:00
parent 29a66d3173
commit 3c555f0ab9
Signed by: tec
GPG Key ID: 779591AFDB81F06C
2 changed files with 54 additions and 56 deletions

View File

@ -1,31 +1,30 @@
window.addEventListener('DOMContentLoaded', () => {
const sections = document.querySelectorAll('h1[id],h2[id],h3[id],h4[id],h5[id],h6[id]');
const activate = (entry) => {
entry.classList.add('active');
if (["LI", "UL"].includes(entry.parentElement.tagName)) {
activate(entry.parentElement);
}
};
const activateLast = () => {
document.querySelectorAll('#text-table-of-contents li.active, #text-table-of-contents ul.active').forEach(a => {
a.classList.remove('active')
});
let mostRecent = { section: sections[0], bottom: -Infinity };
const windowHeight = window.innerHeight;
sections.forEach((section) => {
const bounds = section.getBoundingClientRect()
if ( bounds.bottom > mostRecent.bottom && bounds.top < windowHeight ) {
mostRecent = { section, bottom: bounds.bottom };
if (document.getElementById("text-table-of-contents")) {
const sections = document.querySelectorAll('h1[id],h2[id],h3[id],h4[id],h5[id],h6[id]');
const activate = (entry) => {
entry.classList.add('active');
if (["LI", "UL"].includes(entry.parentElement.tagName)) {
activate(entry.parentElement);
}
})
activate(document.querySelector(`#text-table-of-contents li a[href="#${mostRecent.section.getAttribute('id')}"]`).parentElement);
}
const observer = new IntersectionObserver(entries => {
activateLast();
});
sections.forEach((section) => {
observer.observe(section);
});
};
const activateLast = () => {
document.querySelectorAll('#text-table-of-contents li.active, #text-table-of-contents ul.active').forEach(a => {
a.classList.remove('active')
});
let mostRecent = { section: sections[0], bottom: -Infinity };
const windowHeight = window.innerHeight;
sections.forEach((section) => {
const bounds = section.getBoundingClientRect()
if ( bounds.bottom > mostRecent.bottom && bounds.top < windowHeight ) {
mostRecent = { section, bottom: bounds.bottom };
}
})
activate(document.querySelector(`#text-table-of-contents li a[href="#${mostRecent.section.getAttribute('id')}"]`).parentElement);
}
const observer = new IntersectionObserver(entries => {
activateLast();
});
sections.forEach((section) => {
observer.observe(section);
});}
});

View File

@ -9,34 +9,33 @@ function copyPreToClipbord(btn) {
window.getSelection().removeRange(range);
}
window.addEventListener('DOMContentLoaded', () => {
const sections = document.querySelectorAll('h1[id],h2[id],h3[id],h4[id],h5[id],h6[id]');
const activate = (entry) => {
entry.classList.add('active');
if (["LI", "UL"].includes(entry.parentElement.tagName)) {
activate(entry.parentElement);
}
};
const activateLast = () => {
document.querySelectorAll('#text-table-of-contents li.active, #text-table-of-contents ul.active').forEach(a => {
a.classList.remove('active')
});
let mostRecent = { section: sections[0], bottom: -Infinity };
const windowHeight = window.innerHeight;
sections.forEach((section) => {
const bounds = section.getBoundingClientRect()
if ( bounds.bottom > mostRecent.bottom && bounds.top < windowHeight ) {
mostRecent = { section, bottom: bounds.bottom };
if (document.getElementById("text-table-of-contents")) {
const sections = document.querySelectorAll('h1[id],h2[id],h3[id],h4[id],h5[id],h6[id]');
const activate = (entry) => {
entry.classList.add('active');
if (["LI", "UL"].includes(entry.parentElement.tagName)) {
activate(entry.parentElement);
}
})
activate(document.querySelector(`#text-table-of-contents li a[href="#${mostRecent.section.getAttribute('id')}"]`).parentElement);
}
const observer = new IntersectionObserver(entries => {
activateLast();
});
sections.forEach((section) => {
observer.observe(section);
});
};
const activateLast = () => {
document.querySelectorAll('#text-table-of-contents li.active, #text-table-of-contents ul.active').forEach(a => {
a.classList.remove('active')
});
let mostRecent = { section: sections[0], bottom: -Infinity };
const windowHeight = window.innerHeight;
sections.forEach((section) => {
const bounds = section.getBoundingClientRect()
if ( bounds.bottom > mostRecent.bottom && bounds.top < windowHeight ) {
mostRecent = { section, bottom: bounds.bottom };
}
})
activate(document.querySelector(`#text-table-of-contents li a[href="#${mostRecent.section.getAttribute('id')}"]`).parentElement);
}
const observer = new IntersectionObserver(entries => {
activateLast();
});
sections.forEach((section) => {
observer.observe(section);
});}
});
// @license-end