mirror of
https://github.com/vector-im/hydrogen-web.git
synced 2024-12-23 03:25:12 +01:00
show number of matches in logviewer and don't hide expanded sibling
fixes https://github.com/vector-im/hydrogen-web/issues/378
This commit is contained in:
parent
5562e7cd74
commit
711b5be07f
@ -193,11 +193,14 @@
|
|||||||
<body>
|
<body>
|
||||||
<nav>
|
<nav>
|
||||||
<button id="openFile">Open log file</button>
|
<button id="openFile">Open log file</button>
|
||||||
<form id="highlightForm"><input type="text" id="highlight" placeholder="Highlight a search term"></form>
|
|
||||||
<button id="collapseAll">Collapse all</button>
|
<button id="collapseAll">Collapse all</button>
|
||||||
<button id="hideCollapsed">Hide collapsed root items</button>
|
<button id="hideCollapsed">Hide collapsed root items</button>
|
||||||
<button id="hideHighlightedSiblings">Hide siblings of highlighted</button>
|
<button id="hideHighlightedSiblings" title="Hide collapsed siblings of highlighted">Hide non-highlighted</button>
|
||||||
<button id="showAll">Show all</button>
|
<button id="showAll">Show all</button>
|
||||||
|
<form id="highlightForm">
|
||||||
|
<input type="text" id="highlight" name="highlight" placeholder="Highlight a search term" autocomplete="on">
|
||||||
|
<output id="highlightMatches"></output>
|
||||||
|
</form>
|
||||||
</nav>
|
</nav>
|
||||||
<main></main>
|
<main></main>
|
||||||
<aside></aside>
|
<aside></aside>
|
||||||
|
@ -303,11 +303,15 @@ const highlightForm = document.getElementById("highlightForm");
|
|||||||
|
|
||||||
highlightForm.addEventListener("submit", evt => {
|
highlightForm.addEventListener("submit", evt => {
|
||||||
evt.preventDefault();
|
evt.preventDefault();
|
||||||
|
const matchesOutput = document.getElementById("highlightMatches");
|
||||||
const query = document.getElementById("highlight").value;
|
const query = document.getElementById("highlight").value;
|
||||||
if (query) {
|
if (query) {
|
||||||
|
matchesOutput.innerText = "Searching…";
|
||||||
|
let matches = 0;
|
||||||
processRecursively(rootItem, item => {
|
processRecursively(rootItem, item => {
|
||||||
let domNode = document.getElementById(item.id);
|
let domNode = document.getElementById(item.id);
|
||||||
if (itemMatchesFilter(item, query)) {
|
if (itemMatchesFilter(item, query)) {
|
||||||
|
matches += 1;
|
||||||
domNode.classList.add("highlighted");
|
domNode.classList.add("highlighted");
|
||||||
domNode = domNode.parentElement;
|
domNode = domNode.parentElement;
|
||||||
while (domNode.nodeName !== "SECTION") {
|
while (domNode.nodeName !== "SECTION") {
|
||||||
@ -320,10 +324,12 @@ highlightForm.addEventListener("submit", evt => {
|
|||||||
domNode.classList.remove("highlighted");
|
domNode.classList.remove("highlighted");
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
matchesOutput.innerText = `${matches} matches`;
|
||||||
} else {
|
} else {
|
||||||
for (const node of document.querySelectorAll(".highlighted")) {
|
for (const node of document.querySelectorAll(".highlighted")) {
|
||||||
node.classList.remove("highlighted");
|
node.classList.remove("highlighted");
|
||||||
}
|
}
|
||||||
|
matchesOutput.innerText = "";
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -379,9 +385,11 @@ document.getElementById("hideHighlightedSiblings").addEventListener("click", ()
|
|||||||
const list = node.closest("ol");
|
const list = node.closest("ol");
|
||||||
const siblings = Array.from(list.querySelectorAll("li > div > a:not(.highlighted)")).map(n => n.closest("li"));
|
const siblings = Array.from(list.querySelectorAll("li > div > a:not(.highlighted)")).map(n => n.closest("li"));
|
||||||
for (const sibling of siblings) {
|
for (const sibling of siblings) {
|
||||||
|
if (!sibling.classList.contains("expanded")) {
|
||||||
sibling.classList.add("hidden");
|
sibling.classList.add("hidden");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
});
|
});
|
||||||
document.getElementById("showAll").addEventListener("click", () => {
|
document.getElementById("showAll").addEventListener("click", () => {
|
||||||
for (const node of document.querySelectorAll(".hidden")) {
|
for (const node of document.querySelectorAll(".hidden")) {
|
||||||
|
Loading…
Reference in New Issue
Block a user