Various small fixes, add indication of which tags are added for power users

Customizations/JSON/CustomLayoutFromJSON.ts

@@ -38,6 +38,7 @@ export interface LayerConfigJson {
     description: string;
     minzoom: number,
     color: TagRenderingConfigJson;
+    width: TagRenderingConfigJson;
     overpassTags: string | string[] | { k: string, v: string }[];
     wayHandling: number,
     presets: [
@@ -80,6 +81,10 @@ export class CustomLayoutFromJSON {
 
     public static TagRenderingFromJson(json: any): TagDependantUIElementConstructor {
 
+        if(json === undefined){
+            return undefined;
+        }
+        
         if (typeof (json) === "string") {
             return new FixedText(json);
         }
@@ -89,7 +94,6 @@ export class CustomLayoutFromJSON {
             const type = json.type ?? "text";
             let renderTemplate =  CustomLayoutFromJSON.MaybeTranslation(json.render);;
             const template = renderTemplate.replace("{" + json.key + "}", "$" + type + "$");
-
             if(type === "url"){
                 renderTemplate = json.render.replace("{" + json.key + "}", 
                     `<a href='{${json.key}}' target='_blank'>{${json.key}}</a>`
@@ -152,13 +156,19 @@ export class CustomLayoutFromJSON {
     }) {
         const iconRendering: TagDependantUIElementConstructor = CustomLayoutFromJSON.TagRenderingFromJson(layout.icon);
         const colourRendering = CustomLayoutFromJSON.TagRenderingFromJson(layout.color);
+        let thickness = CustomLayoutFromJSON.TagRenderingFromJson(layout.width);
+
 
         return (tags) => {
             const iconUrl = iconRendering.GetContent(tags);
             const stroke = colourRendering.GetContent(tags);
+            let weight = parseInt(thickness?.GetContent(tags)) ?? 10;
+            if(isNaN(weight)){
+                weight = 10;
+            }
             return {
                 color: stroke,
-                weight: 10,
+                weight: weight,
                 icon: {
                     iconUrl: iconUrl,
                     iconSize: [40, 40],

Customizations/TagRendering.ts

@@ -23,15 +23,15 @@ export class TagRendering extends UIElement implements TagDependantUIElement {
     private _priority: number;
 
 
-    private _question: Translation;
-    private _mapping: { k: TagsFilter, txt: string | Translation, priority?: number }[];
+    private _question: string | Translation;
+    private _mapping: { k: TagsFilter, txt: string | UIElement, priority?: number }[];
 
     private _tagsPreprocessor?: ((tags: any) => any);
     private _freeform: {
         key: string,
-        template: string | Translation,
+        template: string | UIElement,
         renderTemplate: string | Translation,
-        placeholder?: string | Translation,
+        placeholder?: string | UIElement,
         extraTags?: TagsFilter
     };
 
@@ -42,12 +42,15 @@ export class TagRendering extends UIElement implements TagDependantUIElement {
     private readonly _skipButton: UIElement;
     private readonly _editButton: UIElement;
 
+    private readonly _appliedTags: UIElement;
+
     private readonly _questionSkipped: UIEventSource<boolean> = new UIEventSource<boolean>(false);
 
     private readonly _editMode: UIEventSource<boolean> = new UIEventSource<boolean>(false);
 
 
-    private static injected = TagRendering.injectFunction(); 
+    private static injected = TagRendering.injectFunction();
+
     static injectFunction() {
         // This is a workaround as not to import tagrendering into TagREnderingOptions
         TagRenderingOptions.tagRendering = (tags, options) => new TagRendering(tags, options);
@@ -91,7 +94,7 @@ export class TagRendering extends UIElement implements TagDependantUIElement {
         };
 
         if (options.question !== undefined) {
-            this._question = this.ApplyTemplate(options.question);
+            this._question = options.question;
         }
         
         this._mapping = [];
@@ -109,7 +112,7 @@ export class TagRendering extends UIElement implements TagDependantUIElement {
                 const newTags = this._tagsPreprocessor(this._source.data);
                 choiceSubbed = {
                     k: choice.k.substituteValues(newTags),
-                    txt: this.ApplyTemplate(choice.txt),
+                    txt: choice.txt,
                     priority: choice.priority
                 }
             }
@@ -133,6 +136,21 @@ export class TagRendering extends UIElement implements TagDependantUIElement {
             self._editMode.setData(false);
         }
 
+        this._appliedTags = new VariableUiElement(
+            self._questionElement.GetValue().map(
+                (tags: TagsFilter) => {
+                    if (tags === undefined) {
+                        return "";
+                    }
+                    if ((State.state?.osmConnection?.userDetails?.data?.csCount ?? 0) < 200) {
+                        return "";
+                    }
+                    return tags.asHumanString()
+                }
+            )
+        );
+        this._appliedTags.clss = "subtle";
+
         const cancel = () => {
             self._questionSkipped.setData(true);
             self._editMode.setData(false);
@@ -201,7 +219,6 @@ export class TagRendering extends UIElement implements TagDependantUIElement {
 
 
         if (elements.length == 0) {
-            console.warn("WARNING: no tagrendering with following options:", options);
             return new FixedInputElement("This should not happen: no tag renderings defined", undefined);
         }
         if (elements.length == 1) {
@@ -213,8 +230,8 @@ export class TagRendering extends UIElement implements TagDependantUIElement {
     }
 
 
-    private InputElementForMapping(mapping: { k: TagsFilter, txt: string | UIElement }) {
-        return new FixedInputElement(mapping.txt, mapping.k);
+    private InputElementForMapping(mapping: { k: TagsFilter, txt: string | Translation }) {
+        return new FixedInputElement(this.ApplyTemplate(mapping.txt), mapping.k);
     }
 
 
@@ -372,10 +389,11 @@ export class TagRendering extends UIElement implements TagDependantUIElement {
 
             return "<div class='question'>" +
                 "<span class='question-text'>" + question + "</span>" +
-                (this._question.IsEmpty() ? "" : "<br/>") +
+                (question !== "" ? "" : "<br/>") +
                 "<div>" + this._questionElement.Render() + "</div>" +
                 this._skipButton.Render() +
                 this._saveButton.Render() +
+                this._appliedTags.Render() +
                 "</div>"
         }
 
@@ -406,18 +424,20 @@ export class TagRendering extends UIElement implements TagDependantUIElement {
         return this._priority;
     }
 
-    private ApplyTemplate(template: string | Translation): Translation {
+    private ApplyTemplate(template: string | Translation): UIElement {
         if (template === undefined || template === null) {
             throw "Trying to apply a template, but the template is null/undefined"
         }
-
+        const self = this;
+        const tags = this._source.map(tags => self._tagsPreprocessor(self._source.data));
+        let transl : Translation;
         if (typeof (template) === "string") {
-            const tags = this._tagsPreprocessor(this._source.data);
-            return new Translation ({en:TagUtils.ApplyTemplate(template, tags)});
+            transl = new Translation({en: TagUtils.ApplyTemplate(template, tags)});
+        }else{
+            transl = template;
         }
-        const tags = this._tagsPreprocessor(this._source.data);
-
-        return template.Subs(tags);
+        
+        return new VariableUiElement(tags.map(tags => transl.Subs(tags).InnerRender()));
     }