saulteafarmer/Stirling-PDF
1
0
Fork 0
mirror of https://github.com/Stirling-Tools/Stirling-PDF.git synced 2025-06-06 18:30:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix: Expand and de-clutter menus for matching search results in homepage #2264 (#2277)

Browse Source 
* Hide empty menus that don't match search criteria

- Hide empty menus (accordions/feature groups) that don't match search criteria.

* Expand menus automatically for matching search results

- Fix a bug where menus (accordions/feature groups) did not automatically expand on the homepage when search results matched.

---------

Co-authored-by: Anthony Stirling <77850077+Frooodle@users.noreply.github.com>
This commit is contained in:
Omar Ahmed Hassan 2024-11-21 16:24:45 +02:00 committed by GitHub
parent 68349c4426
commit aeca2b23d9
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 45 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
src/main/resources/static/js/homecard.js
View File

@ -1,24 +1,56 @@
function filterCards() { function filterCards() {
var input = document.getElementById("searchBar"); var input = document.getElementById("searchBar");
var filter = input.value.toUpperCase(); var filter = input.value.toUpperCase();
var cards = document.querySelectorAll(".feature-card");
for (var i = 0; i < cards.length; i++) { let featureGroups = document.querySelectorAll(".feature-group");
var card = cards[i]; const collapsedGroups = getCollapsedGroups();
var title = card.querySelector("h5.card-title").innerText;
var text = card.querySelector("p.card-text").innerText;
// Get the navbar tags associated with the card for (const featureGroup of featureGroups) {
var navbarItem = document.querySelector(`a.dropdown-item[href="${card.id}"]`); var cards = featureGroup.querySelectorAll(".feature-card");
var navbarTags = navbarItem ? navbarItem.getAttribute("data-bs-tags") : "";
var content = title + " " + text + " " + navbarTags; let groupMatchesFilter = false;
for (var i = 0; i < cards.length; i++) {
var card = cards[i];
var title = card.querySelector("h5.card-title").innerText;
var text = card.querySelector("p.card-text").innerText;
if (content.toUpperCase().indexOf(filter) > -1) { // Get the navbar tags associated with the card
card.style.display = ""; var navbarItem = document.querySelector(`a.dropdown-item[href="${card.id}"]`);
} else { var navbarTags = navbarItem ? navbarItem.getAttribute("data-bs-tags") : "";
card.style.display = "none";
var content = title + " " + text + " " + navbarTags;
if (content.toUpperCase().indexOf(filter) > -1) {
card.style.display = "";
groupMatchesFilter = true;
} else {
card.style.display = "none";
}
} }
if (!groupMatchesFilter) {
featureGroup.style.display = "none";
} else {
featureGroup.style.display = "";
resetOrTemporarilyExpandGroup(featureGroup, filter, collapsedGroups);
}
}
}
function getCollapsedGroups() {
return localStorage.getItem("collapsedGroups") ? JSON.parse(localStorage.getItem("collapsedGroups")) : [];
}
function resetOrTemporarilyExpandGroup(featureGroup, filterKeywords = "", collapsedGroups = []) {
const shouldResetCollapse = filterKeywords.trim() === "";
if (shouldResetCollapse) {
// Resetting the group's expand/collapse to its original state (as in collapsed groups)
const isCollapsed = collapsedGroups.indexOf(featureGroup.id) != -1;
expandCollapseToggle(featureGroup, !isCollapsed);
} else {
// Temporarily expands feature group without affecting the actual/stored collapsed groups
featureGroup.classList.remove("collapsed");
featureGroup.querySelector(".header-expand-button").classList.remove("collapsed");
} }
} }