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

Fix: rendering of 'inline' was not dynamic

Browse source
This commit is contained in:
Pieter Vander Vennet 2023-06-11 01:59:47 +02:00
parent 2b05d79dbb
commit 60d825de3c
2 changed files with 50 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

10
UI/Popup/TagRendering/FreeformInput.svelte
View file

@ -17,11 +17,15 @@
export let unit: Unit | undefined
let placeholder = config.freeform?.placeholder
let inline = config.freeform?.inline
$: {
console.log("Config is", config)
placeholder = config.freeform?.placeholder
inline = false
inline = config.freeform?.inline
}
let inline = config.freeform.inline
console.log("Inline is", inline )
export let feedback: UIEventSource<Translation> = new UIEventSource<Translation>(undefined);
let dispatch = createEventDispatcher<{ "selected" }>();
@ -36,7 +40,7 @@
<div class="inline-flex flex-col">
{#if config.freeform.inline}
{#if inline}
<Inline key={config.freeform.key} {tags} template={config.render}>
<ValidatedInput {feedback} {getCountry} {unit} on:selected={() => dispatch("selected")}
type={config.freeform.type} {placeholder} {value}></ValidatedInput>
@ -46,6 +50,6 @@
type={config.freeform.type} {placeholder} {value}></ValidatedInput>
{/if}
<InputHelper args={config.freeform.helperArgs} {feature} type={config.freeform.type} {value}/>
</div>

62
UI/Popup/TagRendering/Inline.svelte
View file

@ -1,27 +1,51 @@
<script lang="ts">
import { Utils } from "../../../Utils.js";
import { UIEventSource } from "../../../Logic/UIEventSource";
import { onDestroy } from "svelte";
import { Translation } from "../../i18n/Translation";
import Locale from "../../i18n/Locale";
import FromHtml from "../../Base/FromHtml.svelte";
import {Utils} from "../../../Utils.js";
import {UIEventSource} from "../../../Logic/UIEventSource";
import {onDestroy} from "svelte";
import {Translation} from "../../i18n/Translation";
import Locale from "../../i18n/Locale";
import FromHtml from "../../Base/FromHtml.svelte";
export let template: Translation;
let _template: string
onDestroy(Locale.language.addCallbackAndRunD(l => {
_template = template.textFor(l)
}))
export let key: string;
export let tags: UIEventSource<Record<string, string>>;
let _tags = tags.data;
onDestroy(tags.addCallbackAndRunD(tags => {
_tags = tags;
}));
let [before, after] = _template.split("{" + key + "}");
export let key: string;
export let tags: UIEventSource<Record<string, string>>;
let _tags = tags.data;
onDestroy(tags.addCallbackAndRunD(tags => {
_tags = tags;
}));
export let template: Translation;
let _template: string
let before: string
let after: string
onDestroy(Locale.language.addCallbackAndRunD(l => {
_template = template.textFor(l)
if (_template) {
const splt = _template.split("{" + key + "}")
before = splt[0]
after = splt[1]
console.log("Updating template to", _template, before, after)
}
}))
$: {
_template = template.textFor(Locale.language.data)
if (_template) {
const splt = _template.split("{" + key + "}")
before = splt[0]
after = splt[1]
console.log("Updating template to", _template, before, after)
}
}
$: {
console.log("B/A:", before, after)
}
</script>
<span>
<FromHtml src={Utils.SubstituteKeys(before, _tags)}/>
<slot />
<slot/>
<FromHtml src={Utils.SubstituteKeys(after, _tags)}/>
</span>