${no_results_for} "${escapeHTML(searchString)}"
`;
el.innerHTML = notFoundContent;
});
} else {
searchIcon && (searchIcon.style.display = "initial");
searchIconReset && (searchIconReset.style.display = "none");
emptySearchResult.forEach((el) => {
el.innerHTML = empty_search_results_placeholder;
});
}
let filteredJSON = includeSectionsInSearch.map((section) => {
const data = jsonData.filter(
(item) => slugify(item.section) === slugify(section),
);
const sectionName = section.replace(/[-_]/g, " ");
return {
section: capitalizeFirstLetter(sectionName),
data,
};
});
let searchItem = filteredJSON.filter((item) => {
if (searchString === "") {
return false;
}
return item.data.some((el) => {
const regex = new RegExp(searchString, "gi");
return (
el.title.toLowerCase().match(regex) ||
el.description?.toLowerCase().match(regex) ||
el.searchKeyword.toLowerCase().match(regex) ||
el.content.toLowerCase().match(regex) ||
el.tags?.toLowerCase().match(regex) ||
el.categories?.toLowerCase().match(regex)
);
});
});
displayResult(searchItem, searchString);
// Navigate with arrow keys
if (searchModal && searchString != "") {
let resItems;
resItems = searchResult[0].querySelectorAll(".search-result-item");
let selectedIndex = -1;
const selectItem = (index) => {
if (index >= 0 && index < resItems.length) {
for (let i = 0; i < resItems.length; i++) {
resItems[i].classList.toggle("search-item-selected", i === index);
}
selectedIndex = index;
resItems[index].scrollIntoView({
behavior: "auto",
block: "nearest",
});
}
};
const handleKeyDown = (event) => {
if (searchItem.length !== 0) {
if (event.key === "ArrowUp" || event.key === "ArrowDown") {
event.preventDefault();
if (event.key === "ArrowUp") {
selectedIndex =
selectedIndex > 0 ? selectedIndex - 1 : resItems.length - 1;
} else if (event.key === "ArrowDown") {
selectedIndex =
selectedIndex < resItems.length - 1 ? selectedIndex + 1 : 0;
}
selectItem(selectedIndex !== -1 ? selectedIndex : -1);
} else if (event.key === "Enter") {
event.preventDefault();
if (selectedIndex !== -1) {
let selectedLink = resItems[selectedIndex]
.getElementsByClassName("search-result-item-title")[0]
.getAttribute("href");
window.location.href = selectedLink;
}
}
}
};
searchInput.forEach((el) => {
el.addEventListener("keydown", handleKeyDown);
});
selectItem(-1);
}
};
const displayResult = (searchItems, searchString) => {
const generateSearchResultHTML = (item) => {
const highlightResult = (content) => {
const regex = new RegExp(searchString, "i");
return content.replace(regex, (match) => `