52 lines
1.3 KiB
JavaScript
52 lines
1.3 KiB
JavaScript
|
import { Controller } from "@hotwired/stimulus"
|
||
|
|
||
|
export default class extends Controller {
|
||
|
static targets = [
|
||
|
"commandInput",
|
||
|
"commandSelect",
|
||
|
];
|
||
|
|
||
|
connect() {
|
||
|
this._options = Array.from(this.commandSelectTarget.options);
|
||
|
}
|
||
|
|
||
|
showCommands(ev) {
|
||
|
ev.preventDefault();
|
||
|
this.element.showModal();
|
||
|
|
||
|
this.commandInputTarget.setSelectionRange(0, this.commandInputTarget.value.length, "forward");
|
||
|
this.commandInputTarget.focus();
|
||
|
}
|
||
|
|
||
|
handleKeyup(ev) {
|
||
|
this._filterOptions(this.commandInputTarget.value);
|
||
|
}
|
||
|
|
||
|
dismissDialog(ev) {
|
||
|
ev.preventDefault();
|
||
|
this.element.close();
|
||
|
}
|
||
|
|
||
|
runCommand(ev) {
|
||
|
ev.preventDefault();
|
||
|
|
||
|
console.log("Do this: " + this.commandSelectTarget.value);
|
||
|
this.element.close();
|
||
|
}
|
||
|
|
||
|
_filterOptions(filterText) {
|
||
|
let inputText = filterText.toLowerCase();
|
||
|
|
||
|
let visibleOptions = [];
|
||
|
for (let opt of this._options) {
|
||
|
if ((inputText === "") || (opt.innerText.toLowerCase().includes(inputText))) {
|
||
|
visibleOptions.push(opt);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
this.commandSelectTarget.replaceChildren(...visibleOptions);
|
||
|
if (visibleOptions.length > 0) {
|
||
|
this.commandSelectTarget.selectedIndex = 0;
|
||
|
}
|
||
|
}
|
||
|
}
|