midgard/mapcomplete
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Improvements to units: move the unit handling into the validated text field, fix 'isValid' and typing of partial denominations

Browse source
This commit is contained in:
pietervdvn 2021-06-25 20:38:12 +02:00
parent 89c5c78f41
commit 37dab7a9a2
3 changed files with 43 additions and 35 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
UI/Input/TextField.ts
View file

@ -65,8 +65,8 @@ export class TextField extends InputElement<string> {
this.value.addCallbackAndRun(value => {
if (!(value !== undefined && value !== null)) {
field["value"] = "";
if (value === undefined || value === null) {
// We leave the textfield as is - make sure we do not erase it!
return;
}
field["value"] = value;

40
UI/Input/ValidatedTextField.ts
View file

@ -12,6 +12,7 @@ import DirectionInput from "./DirectionInput";
import ColorPicker from "./ColorPicker";
import {Utils} from "../../Utils";
import Loc from "../../Models/Loc";
import {Unit} from "../../Customizations/JSON/Denomination";
interface TextFieldDef {
name: string,
@ -231,7 +232,8 @@ export default class ValidatedTextField {
isValid?: ((s: string, country: () => string) => boolean),
country?: () => string,
location?: [number /*lat*/, number /*lon*/],
mapBackgroundLayer?: UIEventSource<any>
mapBackgroundLayer?: UIEventSource<any>,
unit?: Unit
}): InputElement<string> {
options = options ?? {};
options.placeholder = options.placeholder ?? type;
@ -245,6 +247,9 @@ export default class ValidatedTextField {
if (str === undefined) {
return false;
}
if(options.unit) {
str = options.unit.stripUnitParts(str)
}
return isValidTp(str, country ?? options.country) && optValid(str, country ?? options.country);
}
} else {
@ -263,6 +268,39 @@ export default class ValidatedTextField {
})
}
if(options.unit) {
// We need to apply a unit.
// This implies:
// We have to create a dropdown with applicable denominations, and fuse those values
const unit = options.unit
const unitDropDown = new DropDown("",
unit.denominations.map(denom => {
return {
shown: denom.human,
value: denom
}
})
)
unitDropDown.GetValue().setData(unit.defaultDenom)
unitDropDown.SetStyle("width: min-content")
input = new CombinedInputElement(
input,
unitDropDown,
(text, denom) => {
console.log("text:", text, "denom:", denom, "canon: ", denom?.canonicalValue(text, true))
return denom?.canonicalValue(text, true) ?? undefined;
},
(valueWithDenom: string) => {
console.log("ToSplit: ", valueWithDenom, "becomes", unit.findDenomination(valueWithDenom))
const [text, denom] = unit.findDenomination(valueWithDenom) ?? [valueWithDenom, undefined];
if(text === undefined){
return [valueWithDenom, undefined]
}
return [text, denom]
}
).SetClass("flex")
}
if (tp.inputHelper) {
const helper = tp.inputHelper(input.GetValue(), {
location: options.location,

34
UI/Popup/TagRenderingQuestion.ts
View file

@ -332,40 +332,10 @@ export default class TagRenderingQuestion extends UIElement {
isValid: (str) => (str.length <= 255),
country: () => this._tags.data._country,
location: [this._tags.data._lat, this._tags.data._lon],
mapBackgroundLayer: State.state.backgroundLayer
mapBackgroundLayer: State.state.backgroundLayer,
unit: this._applicableUnit
});
if (this._applicableUnit) {
// We need to apply a unit.
// This implies:
// We have to create a dropdown with applicable denominations, and fuse those values
const unit = this._applicableUnit
const unitDropDown = new DropDown("",
unit.denominations.map(denom => {
return {
shown: denom.human,
value: denom
}
})
)
unitDropDown.GetValue().setData(this._applicableUnit.defaultDenom)
unitDropDown.SetStyle("width: min-content")
input = new CombinedInputElement(
input,
unitDropDown,
(text, denom) => {
console.log("text:", text, "denom:", denom, "canon: ",denom?.canonicalValue(text, true))
return denom?.canonicalValue(text, true) ?? text;
},
(valueWithDenom: string) => {
console.log("ToSplit: ", valueWithDenom, "becomes", unit.findDenomination(valueWithDenom))
return unit.findDenomination(valueWithDenom) ?? [valueWithDenom, undefined];
}
).SetClass("flex")
}
input.GetValue().setData(this._tags.data[this._configuration.freeform.key]);
return new InputElementMap(