75 lines
2.7 KiB
JavaScript
75 lines
2.7 KiB
JavaScript
async function itemsDialog() {
|
|
let div = $(`
|
|
<div class="modal fade" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" role="dialog" style="z-index: 1070;">
|
|
<div class="modal-dialog modal-dialog-centered" role="document">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">${getLocalizedText("menu:items_dialog:title")}</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="input-group">
|
|
<span class="input-group-text">${getLocalizedText("menu:items_dialog:search_item")}</span>
|
|
<input type="text" class="form-control item-search">
|
|
</div>
|
|
|
|
<ul class="list-group mt-2 items-list scrollbar" style="overflow: auto; max-height: 70vh">
|
|
<li class="list-group-item list-group-item-action clickable text-warning" style="display:none;"></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`)
|
|
|
|
const placeholderDiv = div.find(".items-list .text-warning");
|
|
|
|
// delete the div when the modal is closed
|
|
div.on("hidden.bs.modal", function() {
|
|
div.remove();
|
|
});
|
|
|
|
div.modal("show");
|
|
|
|
div.find(".item-search").val("").on("keyup", function() {
|
|
const rawVal = $(this).val();
|
|
const lowercaseText = rawVal.toLowerCase();
|
|
|
|
if (rawVal) {
|
|
placeholderDiv.text(rawVal).data("itemName", rawVal).show();
|
|
} else {
|
|
placeholderDiv.hide();
|
|
}
|
|
|
|
div.find(".items-list li").not(placeholderDiv).filter(function() {
|
|
$(this).toggle($(this).text().toLowerCase().indexOf(lowercaseText) > -1);
|
|
});
|
|
});
|
|
|
|
const items = await $.post(`https://${resName}/getAllItems`)
|
|
let itemsListDiv = div.find(".items-list");
|
|
|
|
items.forEach(item => {
|
|
let itemDiv = $(`
|
|
<li class="list-group-item list-group-item-action clickable" data-item-name=${item.name}>${item.label}</li>
|
|
`);
|
|
|
|
itemsListDiv.prepend(itemDiv);
|
|
});
|
|
|
|
return new Promise((resolve) => {
|
|
div.find(".list-group-item").click(function() {
|
|
let itemName = $(this).data("itemName");
|
|
div.modal("hide");
|
|
resolve(itemName);
|
|
});
|
|
|
|
div.find(".item-search").keydown(function(e) {
|
|
if (e.keyCode != 13) return;
|
|
|
|
let searchContent = $(this).val();
|
|
div.modal("hide");
|
|
resolve(searchContent);
|
|
});
|
|
});
|
|
} |