ToC: Some HTML improvements and style fixes

The ToC generated broken HTML with unclosed `<li>` tags. This got fixed
as well as some minor optimisation and adding list elements for the
subentries so the elements appear in the ToC while scrolling.

Signed-off-by: Sheogorath <sheogorath@shivering-isles.com>
This commit is contained in:
Sheogorath 2018-07-04 21:08:57 +02:00
parent cf934a4e51
commit df05bff82a
No known key found for this signature in database
GPG key ID: 1F05CC3635CDDFFD
2 changed files with 20 additions and 6 deletions

View file

@ -93,6 +93,10 @@
color: #777;
}
.toc .invisable-node {
list-style-type: none;
}
.ui-toc {
position: fixed;
bottom: 20px;

View file

@ -52,18 +52,17 @@
titleNames = this._elTitlesNames
ulClass = this.ulClass
}
var titleElementsLen = titleElements.length
// No need to do anything for an empty ToC
if (!titleElementsLen) return
if (!titleElements.length) return
this.tocContent = ''
var content = '<ul'
if (ulClass) {
content += ' class="' + ulClass + '"'
}
content += '>'
content += '>\n'
var iterTag = titleNames[level]
var recurse = false
var openTag = false
for (var element; element = titleElements.shift();) {
var elementTag = element.tagName.toLowerCase()
@ -80,13 +79,21 @@
} else {
id = '#' + id
}
if (openTag) {
content += '</li>\n'
openTag = false
}
content += '<li><a href="' + id + '" title="'+ elementTitle +'">' + elementText + '</a>'
// Reset recursion. We need it for the next subsections
recurse = false
openTag = true
// Check if the current element has a lower level than ours, if so, we have to go down the rabbithole!
} else if (!recurse && titleNames.indexOf(elementTag.toLowerCase()) > level) {
recurse = true
if (!openTag) {
content += '<li class="invisable-node">'
openTag = true
}
// This element is for the lower lever, we have to re-add it before we send the list down there.
titleElements.unshift(element)
// Let's call ourself and get to the next level
@ -99,7 +106,10 @@
}
}
content += '</ul>'
if (openTag) {
content += '</li>\n'
}
content += '</ul>\n'
// Set ToC content of the level 0 everything else pass things to the upper level!
if (level === 0) {