midgard/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Trying to get the checkboxlogic right

Browse source
This commit is contained in:
Pieter Vander Vennet 2020-09-10 21:06:56 +02:00
parent c944156d87
commit e0f2f70c2e
7 changed files with 113 additions and 97 deletions
Download patch file Download diff file Expand all files Collapse all files

70
UI/Input/Checkboxes.ts
View file

@ -1,52 +1,36 @@
import {InputElement} from "./InputElement";
import {UIEventSource} from "../../Logic/UIEventSource";
import {Utils} from "../../Utils";
import {UIElement} from "../UIElement";
/**
* Supports multi-input
*/
export class CheckBoxes<T> extends InputElement<T[]> {
export class CheckBoxes extends InputElement<number[]> {
IsSelected: UIEventSource<boolean> = new UIEventSource<boolean>(false);
private readonly _selectedElementIndex: UIEventSource<number>
= new UIEventSource<number>(null);
private readonly value: UIEventSource<T[]>;
private readonly _elements: InputElement<T>[]
private readonly value: UIEventSource<number[]>;
private readonly _elements: UIElement[]
constructor(elements: InputElement<T>[]) {
constructor(elements: UIElement[]) {
super(undefined);
this._elements = Utils.NoNull(elements);
this.dumbMode = false;
this.value = new UIEventSource<T[]>([])
this.value = new UIEventSource<number[]>([])
this.ListenTo(this.value);
this.value.addCallback(latest => console.log("Latest is ", latest))
}
IsValid(ts: T[]): boolean {
IsValid(ts: number[]): boolean {
if (ts === undefined) {
return false;
}
for (const t of ts) {
let matchFound = false;
for (const element of this._elements) {
if (element.IsValid(t)) {
element.GetValue().setData(t);
matchFound = true;
break
}
}
if (!matchFound) {
return false;
}
}
return true;
}
GetValue(): UIEventSource<T[]> {
GetValue(): UIEventSource<number[]> {
return this.value;
}
@ -72,37 +56,23 @@ export class CheckBoxes<T> extends InputElement<T[]> {
super.InnerUpdate(htmlElement);
const self = this;
for (let i = 0; i < this._elements.length; i++) {
const el = document.getElementById(this.IdFor(i));
const inputEl = this._elements[i];
for (const t of this.value.data ?? []) {
if(t === undefined){
continue;
}
let isValid = inputEl.IsValid(t);
if(this.value.data.indexOf(i) >= 0){
// @ts-ignore
el.checked = isValid;
if(isValid){
break;
}
el.checked = true;
}
el.onchange = e => {
const v = inputEl.GetValue().data;
const index = self.value.data.indexOf(v);
el.onchange = () => {
const index = self.value.data.indexOf(i);
// @ts-ignore
if (el.checked) {
if (index < 0) {
self.value.data.push(v);
self.value.ping();
}
} else {
if (index >= 0) {
self.value.data.splice(index, 1);
self.value.ping();
}
if(el.checked && index < 0){
self.value.data.push(i);
self.value.ping();
}else if(index >= 0){
self.value.data.splice(index,1);
self.value.ping();
}
}