116 lines
No EOL
3.7 KiB
JavaScript
116 lines
No EOL
3.7 KiB
JavaScript
// ------------------ TABLE OF CONTENTS --------------
|
||
class toc extends Paged.Handler {
|
||
constructor(chunker, polisher, caller) {
|
||
super(chunker, polisher, caller);
|
||
}
|
||
|
||
beforeParsed(content){
|
||
const toc = content.querySelector('#table-of-contents');
|
||
let elements = ['.chapter h2'];
|
||
|
||
createToc({
|
||
content: content,
|
||
container: '#table-of-contents',
|
||
titleElements: elements,
|
||
});
|
||
}
|
||
|
||
}
|
||
Paged.registerHandlers(toc);
|
||
|
||
|
||
function createToc(config) {
|
||
|
||
const content = config.content;
|
||
const tocElement = config.container;
|
||
const titleElements = config.titleElements;
|
||
|
||
let tocElementDiv = content.querySelector(tocElement)
|
||
if(!tocElementDiv) return console.warn('couldn’t start the toc')
|
||
tocElementDiv.innerHTML = ''
|
||
let tocUl = document.createElement('ul')
|
||
tocUl.id = 'list-toc-generated'
|
||
|
||
|
||
if(config.before){
|
||
tocUl.style.setProperty('--before-page', '"' + config.before + '"');
|
||
}
|
||
|
||
|
||
tocElementDiv.appendChild(tocUl)
|
||
|
||
// add class to all title elements
|
||
let tocElementNbr = 0
|
||
for (var i = 0; i < titleElements.length; i++) {
|
||
let titleHierarchy = i + 1
|
||
let titleElement = content.querySelectorAll(titleElements[i])
|
||
|
||
titleElement.forEach(function (element) {
|
||
// check if shouldbe shown
|
||
if (
|
||
!element.classList.contains('toc-ignore') ||
|
||
!element.classList.contains('toc-ignore')
|
||
) {
|
||
// add classes to the element
|
||
element.classList.add('title-element')
|
||
element.setAttribute('data-title-level', titleHierarchy)
|
||
|
||
// add an id if doesn't exist
|
||
tocElementNbr++
|
||
|
||
if (element.id == '') {
|
||
element.id = 'title-element-' + tocElementNbr
|
||
}
|
||
let newIdElement = element.id
|
||
}
|
||
})
|
||
}
|
||
|
||
// create toc list
|
||
let tocElements = content.querySelectorAll('.title-element')
|
||
|
||
for (var i = 0; i < tocElements.length; i++) {
|
||
let tocElement = tocElements[i]
|
||
|
||
let tocNewLi = document.createElement('li')
|
||
|
||
// Add class for the hierarcy of toc
|
||
tocNewLi.classList.add('toc-element')
|
||
tocNewLi.classList.add('toc-element-level-' + tocElement.dataset.titleLevel)
|
||
|
||
let classes = [
|
||
...(tocElement.className ? tocElement.className.split(' ') : []),
|
||
...(tocElement.closest('section')?.className ? tocElement.closest('section')?.className.split(' ') : []),
|
||
];
|
||
|
||
classes.forEach((meta) => {
|
||
if (!meta || meta === 'title-element') return;
|
||
tocNewLi.classList.add(`toc-${meta}`);
|
||
});
|
||
|
||
//get the exisiting class
|
||
// Keep class of title elements
|
||
let classTocElement = tocElement.classList
|
||
for (var n = 0; n < classTocElement.length; n++) {
|
||
if (classTocElement[n] != 'title-element') {
|
||
tocNewLi.classList.add(classTocElement[n])
|
||
}
|
||
}
|
||
|
||
const chapter = tocElement.closest('.chapter');
|
||
const author = chapter?.querySelector('.nav-author')?.textContent || '';
|
||
const chapterType = chapter?.dataset.chapter || '';
|
||
tocNewLi.dataset.author = author;
|
||
if (chapterType) tocNewLi.classList.add('toc-' + chapterType);
|
||
const typeSymbols = { entretien: '@', portfolio: '+', essai: '*' };
|
||
const symbol = typeSymbols[chapterType] || '';
|
||
tocNewLi.innerHTML =
|
||
'<a class="toc-link" href="#' + tocElement.id + '">' +
|
||
(chapterType ? '<span class="toc-type" data-toc-chapter="' + chapterType + '">' + (symbol ? '<span class="toc-type-symbole_before">' + symbol + '</span>' : '') + '<span class="text">' + chapterType + ' </span>' + (symbol ? '<span class="toc-type-symbole_after">' + symbol + '</span>' : '') + '</span>' : '') +
|
||
'<span class="toc-title">' + tocElement.innerHTML + '</span>' +
|
||
(author ? '<span class="toc-author">' + author + '</span>' : '') +
|
||
'</a>';
|
||
|
||
tocUl.appendChild(tocNewLi)
|
||
}
|
||
} |