Intermediary refactoring
This commit is contained in:
parent
dcf5d24002
commit
93db813cfc
15 changed files with 280 additions and 178 deletions
|
@ -1,61 +0,0 @@
|
|||
import {UIEventSource} from "../UIEventSource";
|
||||
import {UIElement} from "../UIElement";
|
||||
|
||||
export class DropDownUI extends UIElement {
|
||||
|
||||
selectedElement: UIEventSource<string>
|
||||
private _label: string;
|
||||
private _values: { value: string; shown: string }[];
|
||||
|
||||
constructor(label: string, values: { value: string, shown: string }[],
|
||||
selectedElement: UIEventSource<string> = undefined) {
|
||||
super(undefined);
|
||||
this._label = label;
|
||||
this._values = values;
|
||||
this.selectedElement = selectedElement ?? new UIEventSource<string>(values[0].value);
|
||||
if(selectedElement.data === undefined){
|
||||
this.selectedElement.setData(values[0].value)
|
||||
}
|
||||
const self = this;
|
||||
this.selectedElement.addCallback(() => {
|
||||
self.InnerUpdate();
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
protected InnerRender(): string {
|
||||
|
||||
let options = "";
|
||||
for (const value of this._values) {
|
||||
options += "<option value='" + value.value + "'>" + value.shown + "</option>"
|
||||
}
|
||||
|
||||
return "<form>" +
|
||||
"<label for='dropdown-" + this.id + "'>" + this._label + "</label>" +
|
||||
"<select name='dropdown-" + this.id + "' id='dropdown-" + this.id + "'>" +
|
||||
options +
|
||||
"</select>" +
|
||||
"</form>";
|
||||
}
|
||||
|
||||
InnerUpdate() {
|
||||
const self = this;
|
||||
const e = document.getElementById("dropdown-" + this.id);
|
||||
if(e === null){
|
||||
return;
|
||||
}
|
||||
// @ts-ignore
|
||||
if (this.selectedElement.data !== e.value) {
|
||||
// @ts-ignore
|
||||
e.value = this.selectedElement.data;
|
||||
}
|
||||
e.onchange = function () {
|
||||
// @ts-ignore
|
||||
const selectedValue = e.options[e.selectedIndex].value;
|
||||
console.log("Putting data", selectedValue)
|
||||
self.selectedElement.setData(selectedValue);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue