use requestAnimationFrame for search
This commit is contained in:
parent
bf13da9178
commit
9b6d75b560
1 changed files with 27 additions and 23 deletions
|
@ -92,31 +92,35 @@ const deepestNodeOpened = (path, options) => {
|
|||
};
|
||||
|
||||
const searchFiles = (query, parent, currentFile) => {
|
||||
const children = parent.querySelectorAll("li");
|
||||
// Prevent blocking the main thread
|
||||
requestAnimationFrame(() => {
|
||||
const children = parent.querySelectorAll("li");
|
||||
|
||||
if (query === "") {
|
||||
children.forEach((item) => {
|
||||
item.style.display = "";
|
||||
if (
|
||||
item.classList.contains("directory") &&
|
||||
!item.classList.contains("collapsed")
|
||||
) {
|
||||
item.classList.add("collapsed");
|
||||
}
|
||||
});
|
||||
|
||||
uncollapse(currentFile);
|
||||
return;
|
||||
}
|
||||
|
||||
for (const item of children) {
|
||||
if (item.innerText.toLowerCase().includes(query.toLowerCase())) {
|
||||
item.style.display = "";
|
||||
uncollapse(item);
|
||||
continue;
|
||||
const normalizedQuery = query.toLowerCase().trim();
|
||||
if (normalizedQuery === "") {
|
||||
children.forEach((item) => {
|
||||
item.style.display = "";
|
||||
if (
|
||||
item.classList.contains("directory") &&
|
||||
!item.classList.contains("collapsed")
|
||||
) {
|
||||
item.classList.add("collapsed");
|
||||
}
|
||||
});
|
||||
uncollapse(currentFile);
|
||||
return;
|
||||
}
|
||||
item.style.display = "none";
|
||||
}
|
||||
|
||||
for (const item of children) {
|
||||
const matches = item.innerText.toLowerCase().includes(normalizedQuery);
|
||||
if (matches) {
|
||||
item.style.display = "";
|
||||
uncollapse(item);
|
||||
continue;
|
||||
}
|
||||
item.style.display = "none";
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
window.addEventListener("load", () => {
|
||||
|
|
Loading…
Reference in a new issue