ShaopengLin 4e933f1f03 Introduce KiwixWebChannelObject.{h, cpp}
Pass TOC title translation. More to come later
2024-09-27 20:21:31 -04:00

85 lines
2.7 KiB
JavaScript

/**
* Construct recurseData.str as a nested list of headers by recursively going
* through all children of elem that has header tags.
*
* References:
* https://stackoverflow.com/questions/187619/is-there-a-javascript-solution-to-generating-a-table-of-contents-for-a-page
* @param elem DOM element
* @param recurseData Object with fields: { int: level, int: count, str: toc }
*/
function recurseChild(elem, recurseData)
{
if (elem !== "undefined")
{
if(elem.nodeName.match(/^H\d+$/) && elem.textContent)
{
var headerText = elem.textContent;
var prevLevel = recurseData.level;
var level = elem.nodeName.substr(1);
var anchor = "kiwix-toc-" + recurseData.count;
recurseData.count += 1;
/* Wrap header content with something we can reference. */
elem.innerHTML = '<a href="#' + anchor + '" id="' + anchor + '">' + headerText + '</a>';
/* Start or end a list or item based on current and previous level */
if (level > prevLevel)
recurseData.toc += '<ul>';
else if (level < prevLevel)
recurseData.toc += '</li></ul>';
else
recurseData.toc += '</li>';
recurseData.level = parseInt(level);
recurseData.toc += '<li><a href="#' + anchor + '">' + headerText + '</a>';
}
var c = elem.children;
for (var i = 0; i < c.length; i++)
recurseChild(c[i], recurseData);
}
}
function tocHTMLStr()
{
/* level used to track current header level.
toc used to store constructed list.
count used to uniquely identify each list item in toc.
*/
var recurseData = { level: 0, toc: "", count: 0,};
recurseChild(document.body, recurseData);
/* End list when non-empty */
if (recurseData.level)
recurseData.toc += (new Array(recurseData.level + 1)).join('</ul>');
return recurseData.toc;
}
function setupTOC()
{
var toc = document.createElement('div');
toc.id = "kiwix-toc";
toc.innerHTML += tocHTMLStr();
var tocTitle = document.createElement('p');
tocTitle.id = "kiwix-toc-title";
var tocSideDiv = document.createElement('div');
tocSideDiv.id = "kiwix-toc-side";
tocSideDiv.append(tocTitle);
tocSideDiv.append(toc);
document.body.prepend(tocSideDiv);
}
new QWebChannel(qt.webChannelTransport, function(channel) {
var kiwixObj = channel.objects.kiwixChannelObj
document.body.style.marginLeft = "310px";
document.body.style.maxWidth = "calc(100vw - 310px)";
setupTOC();
document.getElementById("kiwix-toc-title").textContent = kiwixObj.tocTitle;
});