Small improvement to custom theme generator

This commit is contained in:
pietervdvn 2021-04-06 20:02:41 +02:00
parent 117c62e011
commit e1d7b256f9

View file

@ -21,15 +21,14 @@ import Constants from "../../Models/Constants";
export default class TagRenderingPanel extends InputElement<TagRenderingConfigJson> { export default class TagRenderingPanel extends InputElement<TagRenderingConfigJson> {
public IsImage = false;
public options: { title?: string; description?: string; disableQuestions?: boolean; isImage?: boolean; };
public readonly validText: UIElement;
IsSelected: UIEventSource<boolean> = new UIEventSource<boolean>(false);
private intro: UIElement; private intro: UIElement;
private settingsTable: UIElement; private settingsTable: UIElement;
public IsImage = false;
private readonly _value: UIEventSource<TagRenderingConfigJson>; private readonly _value: UIEventSource<TagRenderingConfigJson>;
public options: { title?: string; description?: string; disableQuestions?: boolean; isImage?: boolean; };
public readonly validText : UIElement;
constructor(languages: UIEventSource<string[]>, constructor(languages: UIEventSource<string[]>,
currentlySelected: UIEventSource<SingleSetting<any>>, currentlySelected: UIEventSource<SingleSetting<any>>,
userDetails: UserDetails, userDetails: UserDetails,
@ -47,11 +46,11 @@ export default class TagRenderingPanel extends InputElement<TagRenderingConfigJs
this.options = options ?? {}; this.options = options ?? {};
const questionsNotUnlocked = userDetails.csCount < Constants.userJourney.themeGeneratorFullUnlock; const questionsNotUnlocked = userDetails.csCount < Constants.userJourney.themeGeneratorFullUnlock;
this.options.disableQuestions = this.options.disableQuestions =
(this.options.disableQuestions ?? false) || (this.options.disableQuestions ?? false) ||
questionsNotUnlocked; questionsNotUnlocked;
this.intro = new Combine(["<h3>", options?.title ?? "TagRendering", "</h3>", this.intro = new Combine(["<h3>", options?.title ?? "TagRendering", "</h3>",
options?.description ?? "A tagrendering converts OSM-tags into a value on screen. Fill out the field 'render' with the text that should appear. Note that `{key}` will be replaced with the corresponding `value`, if present.<br/>For specific known tags (e.g. if `foo=bar`, make a mapping). "]) options?.description ?? "A tagrendering converts OSM-tags into a value on screen. Fill out the field 'render' with the text that should appear. Note that `{key}` will be replaced with the corresponding `value`, if present.<br/>For specific known tags (e.g. if `foo=bar`, make a mapping). "])
this.IsImage = options?.isImage ?? false; this.IsImage = options?.isImage ?? false;
@ -61,10 +60,20 @@ export default class TagRenderingPanel extends InputElement<TagRenderingConfigJs
function setting(input: InputElement<any>, id: string | string[], name: string, description: string | UIElement): SingleSetting<any> { function setting(input: InputElement<any>, id: string | string[], name: string, description: string | UIElement): SingleSetting<any> {
return new SingleSetting<any>(value, input, id, name, description); return new SingleSetting<any>(value, input, id, name, description);
} }
this._value.addCallback(value => { this._value.addCallback(value => {
if(value?.freeform?.key == ""){ let doPing = false;
if (value?.freeform?.key == "") {
value.freeform = undefined; value.freeform = undefined;
doPing = true;
}
if (value?.render == "") {
value.render = undefined;
doPing = true;
}
if (doPing) {
this._value.ping(); this._value.ping();
} }
}) })
@ -72,7 +81,7 @@ export default class TagRenderingPanel extends InputElement<TagRenderingConfigJs
const questionSettings = [ const questionSettings = [
setting(options?.noLanguage ? new TextField({placeholder:"question"}) : new MultiLingualTextFields(languages) setting(options?.noLanguage ? new TextField({placeholder: "question"}) : new MultiLingualTextFields(languages)
, "question", "Question", "If the key or mapping doesn't match, this question is asked"), , "question", "Question", "If the key or mapping doesn't match, this question is asked"),
"<h3>Freeform key</h3>", "<h3>Freeform key</h3>",
@ -90,11 +99,11 @@ export default class TagRenderingPanel extends InputElement<TagRenderingConfigJs
const settings: (string | SingleSetting<any>)[] = [ const settings: (string | SingleSetting<any>)[] = [
setting( setting(
options?.noLanguage ? new TextField({placeholder:"Rendering"}) : options?.noLanguage ? new TextField({placeholder: "Rendering"}) :
new MultiLingualTextFields(languages), "render", "Value to show", new MultiLingualTextFields(languages), "render", "Value to show",
"Renders this value. Note that <span class='literal-code'>{key}</span>-parts are substituted by the corresponding values of the element. If neither 'textFieldQuestion' nor 'mappings' are defined, this text is simply shown as default value." + "Renders this value. Note that <span class='literal-code'>{key}</span>-parts are substituted by the corresponding values of the element. If neither 'textFieldQuestion' nor 'mappings' are defined, this text is simply shown as default value." +
"<br/><br/>" + "<br/><br/>" +
"Furhtermore, some special functions are supported:"+SpecialVisualizations.HelpMessage.Render()), "Furhtermore, some special functions are supported:" + SpecialVisualizations.HelpMessage.Render()),
questionsNotUnlocked ? `You need at least ${Constants.userJourney.themeGeneratorFullUnlock} changesets to unlock the 'question'-field and to use your theme to edit OSM data` : "", questionsNotUnlocked ? `You need at least ${Constants.userJourney.themeGeneratorFullUnlock} changesets to unlock the 'question'-field and to use your theme to edit OSM data` : "",
...(options?.disableQuestions ? [] : questionSettings), ...(options?.disableQuestions ? [] : questionSettings),
@ -114,17 +123,17 @@ export default class TagRenderingPanel extends InputElement<TagRenderingConfigJs
]; ];
this.settingsTable = new SettingsTable(settings, currentlySelected); this.settingsTable = new SettingsTable(settings, currentlySelected);
this.validText = new VariableUiElement(value.map((json: TagRenderingConfigJson) => { this.validText = new VariableUiElement(value.map((json: TagRenderingConfigJson) => {
try{ try {
new TagRenderingConfig(json,undefined, options?.title ?? ""); new TagRenderingConfig(json, undefined, options?.title ?? "");
return ""; return "";
}catch(e){ } catch (e) {
return "<span class='alert'>"+e+"</span>" return "<span class='alert'>" + e + "</span>"
} }
})); }));
} }
InnerRender(): string { InnerRender(): string {
@ -138,8 +147,6 @@ export default class TagRenderingPanel extends InputElement<TagRenderingConfigJs
return this._value; return this._value;
} }
IsSelected: UIEventSource<boolean> = new UIEventSource<boolean>(false);
IsValid(t: TagRenderingConfigJson): boolean { IsValid(t: TagRenderingConfigJson): boolean {
return false; return false;
} }