diff --git a/src/gui/quicklinks.js b/src/gui/quicklinks.js index a7cc8614f1e564621f65483b4352bc5dd1d79531..610df61948ffd0aacbecb094048a39e12dec0aab 100644 --- a/src/gui/quicklinks.js +++ b/src/gui/quicklinks.js @@ -94,29 +94,34 @@ App.UI.quickMenu = (function() { } } - function generateMenu() { - if (!jumpFrom.includes(State.passage)) { - hotkeysEnabled = false; - return ""; - } - - const fragment = document.createDocumentFragment(); - - // go back link + /** + * @param {HTMLDivElement} container + */ + function addBackLink(container) { if (history.length > 0) { const div = document.createElement("div"); + div.classList.add("menu-link"); const a = document.createElement("a"); a.append("Back"); a.onclick = goBack; - div.append(a, " ", App.UI.DOM.makeElement("span", "[delete]", "hotkey")); - fragment.append(div); + div.append(a, " ", App.UI.DOM.makeElement("span", "[backspace]", "hotkey")); + // insert at second position + container.insertBefore(div, container.firstChild.nextSibling); + } + } + + function generateMenu() { + if (!jumpFrom.includes(State.passage)) { + hotkeysEnabled = false; + return ""; } - // quick menu const div = document.createElement("div"); div.classList.add("quick-links"); + + // quick menu div.append(generateLinkList(layout)); - fragment.append(div); + addBackLink(div); // traverse from current passage up to uncollapse. if (currentPassageDOM !== null) { @@ -127,7 +132,7 @@ App.UI.quickMenu = (function() { } hotkeysEnabled = true; - return fragment; + return div; } function generateLinkList(group) { @@ -150,7 +155,7 @@ App.UI.quickMenu = (function() { content.classList.add("content"); content.append(generateLinkList(group)); - // wrap everything in one div, so we can control it by changing only one class + // wrap everything in one div, so we can control collapsing by changing only one class const wrapper = document.createElement("div"); wrapper.classList.add("collapsed"); toggle.onclick = () => {