44 lines
1.2 KiB
JavaScript
44 lines
1.2 KiB
JavaScript
// Dual Listbox Initializations
|
|
const dlb1 = new DualListbox(".select1");
|
|
|
|
const dlb2 = new DualListbox(".select2", {
|
|
availableTitle: "Available numbers",
|
|
selectedTitle: "Selected numbers",
|
|
addButtonText: ">",
|
|
removeButtonText: "<",
|
|
addAllButtonText: ">>",
|
|
removeAllButtonText: "<<",
|
|
searchPlaceholder: "search numbers",
|
|
enableDoubleClick: false,
|
|
});
|
|
|
|
dlb2.addEventListener("added", (event) => {
|
|
document.querySelector(".changed-element").innerHTML = event.addedElement.outerHTML;
|
|
});
|
|
|
|
dlb2.addEventListener("removed", (event) => {
|
|
document.querySelector(".changed-element").innerHTML = event.removedElement.outerHTML;
|
|
});
|
|
|
|
const dlb3 = new DualListbox(".select3", {
|
|
showAddButton: false,
|
|
showAddAllButton: false,
|
|
showRemoveButton: false,
|
|
showRemoveAllButton: false,
|
|
});
|
|
|
|
const dlb4 = new DualListbox(".select4", {
|
|
showSortButtons: true,
|
|
});
|
|
|
|
// Toggle Source Code Blocks
|
|
const sources = document.querySelectorAll(".source");
|
|
sources.forEach((sourceEl) => {
|
|
sourceEl.addEventListener("click", (event) => {
|
|
const code = document.querySelector("." + event.currentTarget.dataset.source);
|
|
if (code) {
|
|
code.classList.toggle("open");
|
|
}
|
|
});
|
|
});
|