2024-05-18 13:43:00 +01:00
|
|
|
|
2024-02-16 22:49:06 +01:00
|
|
|
window.onload = function () {
|
|
|
|
var items = document.querySelectorAll(".dropdown-item, .nav-link");
|
|
|
|
var dummyContainer = document.createElement("div");
|
|
|
|
dummyContainer.style.position = "absolute";
|
|
|
|
dummyContainer.style.visibility = "hidden";
|
|
|
|
dummyContainer.style.whiteSpace = "nowrap"; // Ensure we measure full width
|
|
|
|
document.body.appendChild(dummyContainer);
|
2024-02-11 11:47:00 -05:00
|
|
|
|
2024-02-16 22:49:06 +01:00
|
|
|
var maxWidth = 0;
|
2024-02-11 11:47:00 -05:00
|
|
|
|
2024-02-16 22:49:06 +01:00
|
|
|
items.forEach(function (item) {
|
|
|
|
var clone = item.cloneNode(true);
|
|
|
|
dummyContainer.appendChild(clone);
|
|
|
|
var width = clone.offsetWidth;
|
|
|
|
if (width > maxWidth) {
|
|
|
|
maxWidth = width;
|
|
|
|
}
|
|
|
|
dummyContainer.removeChild(clone);
|
|
|
|
});
|
2024-02-11 11:47:00 -05:00
|
|
|
|
2024-02-16 22:49:06 +01:00
|
|
|
document.body.removeChild(dummyContainer);
|
2024-02-11 11:47:00 -05:00
|
|
|
|
2024-02-16 22:49:06 +01:00
|
|
|
// Store max width for later use
|
|
|
|
window.navItemMaxWidth = maxWidth;
|
2024-02-11 11:47:00 -05:00
|
|
|
};
|
|
|
|
|
2024-02-16 22:49:06 +01:00
|
|
|
document.querySelector("#navbarSearchInput").addEventListener("input", function (e) {
|
2025-03-20 20:56:02 +13:00
|
|
|
var searchText = e.target.value.trim().toLowerCase();
|
|
|
|
var items = document.querySelectorAll("a.dropdown-item[data-bs-tags]");
|
2024-02-16 22:49:06 +01:00
|
|
|
var resultsBox = document.querySelector("#searchResults");
|
2024-02-11 11:47:00 -05:00
|
|
|
|
2024-02-16 22:49:06 +01:00
|
|
|
resultsBox.innerHTML = "";
|
2025-03-20 20:56:02 +13:00
|
|
|
|
2024-05-12 14:07:43 +03:00
|
|
|
if (searchText !== "") {
|
2025-03-20 20:56:02 +13:00
|
|
|
var addedResults = new Set();
|
|
|
|
|
|
|
|
items.forEach(function (item) {
|
|
|
|
var titleElement = item.querySelector(".icon-text");
|
|
|
|
var iconElement = item.querySelector(".material-symbols-rounded, .icon");
|
|
|
|
var itemHref = item.getAttribute("href");
|
|
|
|
var tags = item.getAttribute("data-bs-tags") || "";
|
2024-02-11 11:47:00 -05:00
|
|
|
|
2024-05-12 14:07:43 +03:00
|
|
|
if (titleElement && iconElement && itemHref !== "#") {
|
2025-03-20 20:56:02 +13:00
|
|
|
var title = titleElement.innerText.trim();
|
|
|
|
|
2024-05-12 14:07:43 +03:00
|
|
|
if (
|
2025-03-20 20:56:02 +13:00
|
|
|
(title.toLowerCase().includes(searchText) || tags.toLowerCase().includes(searchText)) &&
|
|
|
|
!addedResults.has(itemHref)
|
2024-05-12 14:07:43 +03:00
|
|
|
) {
|
2025-03-20 20:56:02 +13:00
|
|
|
var dropdownItem = document.createElement("div");
|
|
|
|
dropdownItem.className = "dropdown-item d-flex justify-content-between align-items-center";
|
|
|
|
|
|
|
|
var contentWrapper = document.createElement("div");
|
|
|
|
contentWrapper.className = "d-flex align-items-center flex-grow-1";
|
|
|
|
contentWrapper.style.textDecoration = "none";
|
|
|
|
contentWrapper.style.color = "inherit";
|
|
|
|
|
|
|
|
var originalContent = item.querySelector("div").cloneNode(true);
|
|
|
|
contentWrapper.appendChild(originalContent);
|
|
|
|
|
|
|
|
contentWrapper.onclick = function () {
|
|
|
|
window.location.href = itemHref;
|
|
|
|
};
|
2024-02-11 11:47:00 -05:00
|
|
|
|
2025-03-20 20:56:02 +13:00
|
|
|
dropdownItem.appendChild(contentWrapper);
|
|
|
|
resultsBox.appendChild(dropdownItem);
|
|
|
|
addedResults.add(itemHref);
|
2024-05-12 14:07:43 +03:00
|
|
|
}
|
2024-02-16 22:49:06 +01:00
|
|
|
}
|
2024-05-12 14:07:43 +03:00
|
|
|
});
|
|
|
|
}
|
2024-02-11 11:47:00 -05:00
|
|
|
|
2024-02-16 22:49:06 +01:00
|
|
|
resultsBox.style.width = window.navItemMaxWidth + "px";
|
2024-02-11 11:47:00 -05:00
|
|
|
});
|
2024-05-18 13:43:00 +01:00
|
|
|
|
2025-03-20 20:56:02 +13:00
|
|
|
|
2024-11-07 21:50:47 +00:00
|
|
|
const searchDropdown = document.getElementById('searchDropdown');
|
|
|
|
const searchInput = document.getElementById('navbarSearchInput');
|
|
|
|
const dropdownMenu = searchDropdown.querySelector('.dropdown-menu');
|
|
|
|
|
|
|
|
// Handle dropdown shown event
|
|
|
|
searchDropdown.addEventListener('shown.bs.dropdown', function () {
|
|
|
|
searchInput.focus();
|
|
|
|
});
|
|
|
|
|
|
|
|
// Handle hover opening
|
|
|
|
searchDropdown.addEventListener('mouseenter', function () {
|
|
|
|
const dropdownInstance = new bootstrap.Dropdown(searchDropdown);
|
|
|
|
dropdownInstance.show();
|
2024-11-23 12:37:13 +01:00
|
|
|
|
2024-11-07 21:50:47 +00:00
|
|
|
setTimeout(() => {
|
|
|
|
searchInput.focus();
|
|
|
|
}, 100);
|
|
|
|
});
|
|
|
|
|
|
|
|
// Handle mouse leave
|
|
|
|
searchDropdown.addEventListener('mouseleave', function () {
|
|
|
|
// Check if current value is empty (including if user typed and then deleted)
|
|
|
|
if (searchInput.value.trim().length === 0) {
|
|
|
|
searchInput.blur();
|
|
|
|
const dropdownInstance = new bootstrap.Dropdown(searchDropdown);
|
|
|
|
dropdownInstance.hide();
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
searchDropdown.addEventListener('hidden.bs.dropdown', function () {
|
|
|
|
if (searchInput.value.trim().length === 0) {
|
|
|
|
searchInput.blur();
|
|
|
|
}
|
|
|
|
});
|