yaro/inventory
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Refactor dropdown functionality to improve structure and remove unused code

Browse source
This commit is contained in:
Yaro Kasear 2025-08-18 10:26:44 -05:00
parent 431dda453b
commit 3d20462c71
1 changed files with 0 additions and 94 deletions
Download patch file Download diff file Expand all files Collapse all files

94
inventory/static/js/dropdown.js
View file

@ -1,97 +1,3 @@
const DropdownWidget = (() => {
function setButton(name, id, identifier) {
const button = document.getElementById(`${name}Button`);
const input = document.getElementById(`${name}`);
button.dataset.invValue = id;
button.textContent = identifier;
input.value = id;
}
function clear(name) {
const input = document.getElementById(name);
const button = document.getElementById(`${name}Button`);
const clearButton = document.getElementById(`${name}ClearButton`);
input.value = "";
button.dataset.invValue = "";
button.textContent = "-";
clearButton.classList.add("d-none");
button.classList.remove("rounded-end-0");
button.classList.remove("border-end-0");
button.classList.add("rounded-end");
};
document.querySelectorAll('.dropdown-button').forEach(button => {
button.addEventListener('shown.bs.dropdown', () => {
const name = button.id.replace('Button', '');
const dropdown = button.closest('.dropdown');
const dropdownMenu = dropdown.querySelector('.dropdown-menu.show');
const searchInput = dropdown.querySelector('.dropdown-search-input');
const dropdownContent = dropdown.querySelector(`#${name}DropdownContent`);
if (!dropdownMenu || !searchInput || !dropdownContent) return;
const menuHeight = dropdownMenu.clientHeight;
const inputHeight = searchInput.offsetHeight;
const availableHeight = menuHeight - inputHeight;
dropdownContent.style.maxHeight = `${availableHeight}px`;
setTimeout(() => {
searchInput.focus();
}, 1);
});
});
function handleDropdownClick(e, name) {
if (e.target.tagName === "A") {
const input = document.getElementById(name);
const button = document.getElementById(`${name}Button`);
const clearButton = document.getElementById(`${name}ClearButton`);
input.value = e.target.dataset.invValue;
button.textContent = e.target.textContent;
if (e.target.dataset.invValue) {
clearButton.classList.remove("d-none");
button.classList.add("rounded-end-0");
button.classList.add("border-end-0");
button.classList.remove("rounded-end");
} else {
clearButton.classList.add("d-none");
button.classList.remove("rounded-end-0");
button.classList.remove("border-end-0");
button.classList.add("rounded-end");
}
}
};
function searchDropdown(name) {
const searchInput = document.getElementById(`search${name}`);
const dropdown = document.getElementById(`menu${name}`);
const filter = searchInput.value.toLowerCase();
const items = dropdown.querySelectorAll("a.dropdown-item");
items.forEach(item => {
if (item.textContent.toLowerCase().includes(filter)) {
item.style.display = "";
} else {
item.style.display = "none";
}
});
};
return {
clear,
handleDropdownClick,
searchDropdown,
setButton
};
})();
function DropDown(cfg) {
return {
id: cfg.id,