Robin-van-der-Linde/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Refactoring: improve special components

Browse source
This commit is contained in:
Pieter Vander Vennet 2023-04-24 03:36:02 +02:00
parent fcc49766d4
commit 94635337e6
4 changed files with 16 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
UI/InputElement/InputHelpers.ts
View file

@ -76,7 +76,7 @@ export default class InputHelpers {
mapProperties = { ...mapProperties, location } mapProperties = { ...mapProperties, location }
} }
let zoom = 17 let zoom = 17
if (properties.args[0]) { if (properties?.args?.[0] !== undefined) {
zoom = Number(properties.args[0]) zoom = Number(properties.args[0])
if (isNaN(zoom)) { if (isNaN(zoom)) {
throw "Invalid zoom level for argument at 'length'-input" throw "Invalid zoom level for argument at 'length'-input"

8
UI/InputElement/ValidatedInput.svelte
View file

@ -10,7 +10,7 @@
export let value: UIEventSource<string>; export let value: UIEventSource<string>;
// Internal state, only copied to 'value' so that no invalid values leak outside // Internal state, only copied to 'value' so that no invalid values leak outside
let _value = new UIEventSource(value.data ?? ""); let _value = new UIEventSource(value.data ?? "");
onDestroy(value.addCallbackAndRun(v => _value.setData(v ?? ""))); onDestroy(value.addCallbackAndRunD(v => _value.setData(v ?? "")));
export let type: ValidatorType; export let type: ValidatorType;
let validator = Validators.get(type); let validator = Validators.get(type);
export let feedback: UIEventSource<Translation> | undefined = undefined; export let feedback: UIEventSource<Translation> | undefined = undefined;
@ -34,12 +34,8 @@
let dispatch = createEventDispatcher<{ selected }>(); let dispatch = createEventDispatcher<{ selected }>();
$: { $: {
console.log(htmlElem);
if (htmlElem !== undefined) { if (htmlElem !== undefined) {
htmlElem.onfocus = () => { htmlElem.onfocus = () => dispatch("selected");
console.log("Dispatching selected event");
return dispatch("selected");
};
} }
} }
</script> </script>

5
UI/InputElement/Validators/DateValidator.ts
View file

@ -10,6 +10,11 @@ export default class DateValidator extends Validator {
} }
reformat(str: string) { reformat(str: string) {
console.log("Reformatting", str)
if (!this.isValid(str)) {
// The date is invalid - we return the string as is
return str
}
const d = new Date(str) const d = new Date(str)
let month = "" + (d.getMonth() + 1) let month = "" + (d.getMonth() + 1)
let day = "" + d.getDate() let day = "" + d.getDate()

24
test.ts
View file

@ -9,12 +9,8 @@ import { UIEventSource } from "./Logic/UIEventSource"
import { VariableUiElement } from "./UI/Base/VariableUIElement" import { VariableUiElement } from "./UI/Base/VariableUIElement"
import { FixedUiElement } from "./UI/Base/FixedUiElement" import { FixedUiElement } from "./UI/Base/FixedUiElement"
import Title from "./UI/Base/Title" import Title from "./UI/Base/Title"
import { WikipediaBoxOptions } from "./UI/Wikipedia/WikipediaBoxOptions"
import Wikipedia from "./Logic/Web/Wikipedia"
import WikipediaPanel from "./UI/Wikipedia/WikipediaPanel.svelte"
import SvelteUIElement from "./UI/Base/SvelteUIElement" import SvelteUIElement from "./UI/Base/SvelteUIElement"
import LanguagePicker from "./UI/LanguagePicker" import ValidatedInput from "./UI/InputElement/ValidatedInput.svelte"
import { Utils } from "./Utils"
function testspecial() { function testspecial() {
const layout = new LayoutConfig(<any>theme, true) // qp.data === "" ? : new AllKnownLayoutsLazy().get(qp.data) const layout = new LayoutConfig(<any>theme, true) // qp.data === "" ? : new AllKnownLayoutsLazy().get(qp.data)
@ -37,10 +33,13 @@ function testinput() {
}, },
}) })
const feedback: UIEventSource<any> = new UIEventSource<any>(undefined)
els.push( els.push(
new Combine([ new Combine([
new Title(key), new Title(key),
new SvelteUIElement(ValidatedInput, { value, type: key, feedback }),
helper, helper,
new VariableUiElement(feedback),
new VariableUiElement(value.map((v) => new FixedUiElement(v))), new VariableUiElement(value.map((v) => new FixedUiElement(v))),
]).SetClass("flex flex-col p-1 border-3 border-gray-500") ]).SetClass("flex flex-col p-1 border-3 border-gray-500")
) )
@ -48,14 +47,7 @@ function testinput() {
new Combine(els).SetClass("flex flex-col").AttachTo("maindiv") new Combine(els).SetClass("flex flex-col").AttachTo("maindiv")
} }
async function testWaySplit() { testinput()
const ids = new UIEventSource(["Q42", "Q1"]) /*/
new SvelteUIElement(WikipediaPanel, { wikiIds: ids, addEntry: true }).AttachTo("maindiv") testspecial()
new LanguagePicker(["en", "nl"]).AttachTo("extradiv") //*/
await Utils.waitFor(5000)
ids.data.push("Q430")
ids.ping()
}
testWaySplit().then((_) => console.log("inited"))
//testinput()
// testspecial()