Added table of contents js functions

This commit is contained in:
Georgy Litvinov 2021-03-04 16:01:50 +01:00
parent 6b2761d1e7
commit 2c6a138503
2 changed files with 51 additions and 16 deletions

View file

@ -0,0 +1,34 @@
document.addEventListener('DOMContentLoaded', createTOC(), false);
function createTOC(){
var complexDocElement = document.getElementById("complexDocument");
var tocElement = document.getElementById("tocPlaceHolder");
if (complexDocElement === null || tocElement === null){
console.log("no complex document or no placeholder");
return;
}
addItemsToTOC(complexDocElement,tocElement)
}
function addItemsToTOC(docPart, tocElement){
var docPartChilds = docPart.childNodes;
for (var i = 0; i < docPartChilds.length; i++){
var docPartChild = docPartChilds[i];
if ( docPartChild.nodeType === Node.ELEMENT_NODE && docPartChild.classList.contains("documentPart")){
var tocElementChild = createTOCItem(docPartChild, tocElement);
addItemsToTOC(docPartChild,tocElementChild);
}
}
}
function createTOCItem(docPart, tocElement){
var newTOCElement = document.createElement("div");
var anchor = docPart.getAttribute('id');
var docPartButton = docPart.previousElementSibling;
var itemName = docPartButton.textContent;
var link = document.createElement("a");
link.setAttribute("href","#" + anchor);
link.innerText = itemName;
newTOCElement.appendChild(link);
tocElement.appendChild(newTOCElement);
return newTOCElement;
}

View file

@ -53,7 +53,7 @@
</#macro>
<#macro arrangeDocumentParts >
<div class="complexDocument articleParts" style="display:block;">
<div id="complexDocument" class="complexDocument articleParts" style="display:block;">
<#assign lastLevel = 0 >
<#list paths as order>
<#-- ${order.path} -->
@ -65,32 +65,33 @@
<#assign bibliographyCounter = excerptProperties.bibliographyCounter >
</#if>
</#list>
<@startDocumentPart order.level?number lastLevel/>
<@startDocumentPart order.level?number order.path lastLevel/>
<#if excerptText?? && excerptTextName?? && excerptTextName?has_content && excerptText?has_content>
<div class="htmlExcerpt" style="list-style:none;">
${excerptText}
<@arrangeSources works worksCounter?number order.elenphExcerpt />
<@arrangeLiterature bibliography bibliographyCounter?number order.elenphExcerpt />
</div>
<@arrangeSources works worksCounter?number order.path order.elenphExcerpt />
<@arrangeLiterature bibliography bibliographyCounter?number order.path order.elenphExcerpt />
</#if>
<#assign lastLevel = order.level?number >
</#list>
<@endDocumentPart lastLevel />
<@arrangeSources works works?size "anchor-all-sources" />
<@arrangeLiterature bibliography bibliography?size "anchor-all-literature" />
</div>
<@arrangeSources works works?size />
<@arrangeLiterature bibliography bibliography?size />
</#macro>
<#macro startDocumentPart newLevel lastLevel=0 >
<#macro startDocumentPart newLevel path lastLevel=0 >
<#assign depth = newLevel - lastLevel >
<#if depth == 0>
<@closeDocPart 1 />
<@openDocPart 1 />
<@openDocPart 1 path />
<#elseif depth &gt; 0>
<@openDocPart depth />
<@openDocPart depth path />
<#else >
<@closeDocPart -depth+1 />
<@openDocPart 1 />
<@openDocPart 1 path />
</#if>
</#macro>
@ -107,17 +108,17 @@
</#list>
</#macro>
<#macro openDocPart count>
<#macro openDocPart count path >
<#list 1..count as x>
<button type="button" style="border:none;padding: 18px;width: 100%; text-align:left;" class="collapsible">${excerptTextName}</button>
<div class = "documentPart autoExpand articleExcerpt" style="display:block;">
<div class="documentPart autoExpand articleExcerpt" id="anchor-${path}" style="display:block;">
</#list>
</#macro>
<#macro arrangeSources sources counter filter="none">
<#macro arrangeSources sources counter identifier filter="none">
<#if sources?? && sources?has_content && counter &gt; 0>
<button type="button" class="collapsible" style="border: none; color: #8B4513; padding: 18px;width: 100%;text-align:left; background-color: #ffffff; background-image: url(${urls.base}/themes/iph/images/book_icon.png); background-repeat: no-repeat; background-position: left center;">Источники</button>
<div class="autoExpand works" style="display:block;">
<div class="autoExpand documentPart works" id="anchor-${identifier}-sources" style="display:block;">
<#list sources as source>
<#if filter == "none" || source.excerpt == filter >
<div class="work" style="display:list-item;list-style-image:url(${urls.base}/themes/iph/images/bullet_icon.png); font-style: italic; font-family: PT Serif;">
@ -129,10 +130,10 @@
</#if>
</#macro>
<#macro arrangeLiterature literature counter filter="none">
<#macro arrangeLiterature literature counter identifier filter="none">
<#if literature?? && literature?has_content && counter &gt; 0>
<button type="button" class="collapsible" style="border:none; color: #8B4513; padding: 18px;width: 100%; text-align: left; background-color: #ffffff; background-image: url(${urls.base}/themes/iph/images/book_icon.png); background-repeat: no-repeat; background-position: left center;">Литература</button>
<div class="autoExpand bibliography" style="display:block;">
<div class="autoExpand documentPart bibliography" id="anchor-${identifier}-literature" style="display:block;">
<#list literature as literatureItem>
<#if filter == "none" || literatureItem.excerpt == filter >
<div class="bibliography_entry" style="display:list-item;list-style-image:url(${urls.base}/themes/iph/images/bullet_icon.png); font-style: italic; font-family: PT Serif;">