Add ability to open and close major headings by clicking on them

Former-commit-id: 13c75e59b6489e0dfe52baa7bb6dea73f3734fd7 [formerly 43eb7358f51e594d6581b07676fbb3ea8e6b6894]
Former-commit-id: f2cf4bb735610cdd16f399a2afdd315150352d5d
This commit is contained in:
Jaifroid 2018-04-08 19:07:53 +01:00
parent 8e84b5d517
commit 2f457e4dad

View File

@ -2114,6 +2114,76 @@ define(['jquery', 'zimArchiveLoader', 'util', 'uiUtil', 'cookies', 'q', 'module'
removePageMaxWidth();
setupTableOfContents();
// Attach listeners to headers to open-close following sections
var eles = ["H2", "H3"];
for (var i = 0; i < eles.length; i++) {
// Process headers
var collection = articleContent.getElementsByTagName(eles[i]);
for (var j = 0; j < collection.length; j++) {
collection[j].classList.add("open-block");
collection[j].addEventListener("click", function () {
var topTag = this.tagName;
this.classList.toggle("open-block");
var nextElement = this.nextElementSibling;
if (!nextElement) nextElement = this.parentNode.nextElementSibling;
if (!nextElement) return;
// Decide toggle direction based on first sibling element
var toggleDirection = nextElement.style.display == "none" ? "block" : "none";
var k = 0;
do {
if (nextElement) {
nextElement.style.display = toggleDirection;
if (!k) { //Only add or remove br for first element
if (nextElement.style.display == "none") {
this.innerHTML += "<br />";
} else {
this.innerHTML = this.innerHTML.replace(/<br\s*\/?>$/i, "");
}
}
nextElement = nextElement.nextElementSibling;
}
k++;
}
while (nextElement && !~nextElement.tagName.indexOf(topTag) && !~nextElement.tagName.indexOf("H1"));
});
}
}
// Process endnote references (so they open the reference block if closed)
function getClosest(el, fn) {
return el && (fn(el) ? el : getClosest(el.previousElementSibling, fn)) ||
el && (fn(el) ? el : getClosest(el.parentNode, fn));
}
var refs = articleContent.getElementsByClassName("mw-reflink-text");
if (refs) {
for (var l = 0; l < refs.length; l++) {
var reference = refs[l].parentElement;
if (reference) {
reference.addEventListener("click", function (obj) {
var refID = obj.target.hash || obj.target.parentNode.hash;
if (!refID) return;
refID = refID.replace(/#/, "");
var refLocation = articleContent.getElementById(refID);
var refHead = getClosest(refLocation, function (el) {
return el.tagName == "H2";
});
if (refHead) {
refHead.classList.add("open-block");
refHead.innerHTML = refHead.innerHTML.replace(/<br\s*\/?>$/i, "");
var refNext = refHead.nextElementSibling;
do {
if (refNext) {
refNext.style.display = "block";
refNext = refNext.nextElementSibling;
}
}
while (refNext && refNext.style.display == "none");
}
});
}
}
}
//Hide top-level scrolling -- gets rid of interfering useless scroll bar, but re-enable for Config and About pages
document.getElementById('search-article').scrollTop = 0;
document.getElementById('search-article').style.overflow = "hidden";