Fix questions: applicable mappings are now calculated dynamically; charging station theme now only shows applicable plugs based on the allowed vehicle types

Docs/Tags_format.md

@@ -31,6 +31,8 @@ Strict not equals
 To check if a key does _not_ equal a certain value, use `key!=value`. This is converted behind the scenes
 to `key!~^value$`
 
+If `key` is not present or empty, this will match too.
+
 ### If key is present
 
 This implies that, to check if a key is present, `key!=` can be used. This will only match if the key is present and not

InitUiElements.ts

@@ -480,8 +480,11 @@ export class InitUiElements {
 
 
                         const bounds = State.state.currentBounds.data
-                        const tilebbox = BBox.fromTileIndex(source.tileIndex)
+                        if(bounds === undefined){
-                        if (!tilebbox.overlapsWith(bounds)) {
+                            // Map is not yet displayed
+                            return false;
+                        }
+                        if (!source.bbox.overlapsWith(bounds)) {
                             // Not within range
                             return false
                         }

Logic/FeatureSource/FeaturePipeline.ts

@@ -141,8 +141,10 @@ export default class FeaturePipeline {
 
             if (source.geojsonZoomLevel === undefined) {
                 // This is a 'load everything at once' geojson layer
-                // We split them up into tiles anyway
                 const src = new GeoJsonSource(filteredLayer)
+
+                if (source.isOsmCacheLayer) {
+                    // We split them up into tiles anyway as it is an OSM source
                     TiledFeatureSource.createHierarchy(src, {
                         layer: src.layer,
                         minZoomLevel: 14,
@@ -153,6 +155,11 @@ export default class FeaturePipeline {
                             tile.features.addCallbackAndRunD(_ => self.newDataLoadedSignal.setData(tile))
                         }
                     })
+                }else{
+                    new RegisteringAllFromFeatureSourceActor(src)
+                    perLayerHierarchy.get(id).registerTile(src)
+                    src.features.addCallbackAndRunD(_ => self.newDataLoadedSignal.setData(src))
+                }
             } else {
                 new DynamicGeoJsonTileSource(
                     filteredLayer,

Logic/UIEventSource.ts

@@ -68,6 +68,50 @@ export class UIEventSource<T> {
         return src
     }
 
+    /**
+     * Given a UIEVentSource with a list, returns a new UIEventSource which is only updated if the _contents_ of the list are different.
+     * E.g.
+     * const src = new UIEventSource([1,2,3])
+     * const stable = UIEventSource.ListStabilized(src)
+     * src.addCallback(_ => console.log("src pinged"))
+     * stable.addCallback(_ => console.log("stable pinged))
+     * src.setDate([...src.data])
+     * 
+     * This will only trigger 'src pinged'
+     * 
+     * @param src
+     * @constructor
+     */
+    public static ListStabilized<T>(src: UIEventSource<T[]>) : UIEventSource<T[]>{
+        
+        const stable = new UIEventSource<T[]>(src.data)
+        src.addCallback(list => {
+            if(list === undefined){
+                stable.setData(undefined)
+                return;
+            }
+            const oldList = stable.data
+            if(oldList === list){
+                return;
+            }
+            if(oldList.length !== list.length){
+                stable.setData(list);
+                return;
+            }
+
+            for (let i = 0; i < list.length; i++) {
+                if(oldList[i] !== list[i]){
+                    stable.setData(list);
+                    return;
+                }
+            }
+            
+            // No actual changes, so we don't do anything
+            return;
+        })
+        return stable
+    }
+    
     /**
      * Adds a callback
      *
@@ -88,7 +132,7 @@ export class UIEventSource<T> {
 
     public addCallbackAndRun(callback: ((latestData: T) => (boolean | void | any))): UIEventSource<T> {
         const doDeleteCallback = callback(this.data);
-        if (!doDeleteCallback) {
+        if (doDeleteCallback !== true) {
             this.addCallback(callback);
         }
         return this;

UI/Input/FixedInputElement.ts

@@ -11,11 +11,15 @@ export class FixedInputElement<T> extends InputElement<T> {
     private readonly _el: HTMLElement;
 
     constructor(rendering: BaseUIElement | string,
-                value: T,
+                value: T | UIEventSource<T>,
                 comparator: ((t0: T, t1: T) => boolean) = undefined) {
         super();
         this._comparator = comparator ?? ((t0, t1) => t0 == t1);
+        if(value instanceof UIEventSource){
+            this.value = value
+        }else{
             this.value = new UIEventSource<T>(value);
+        }
 
         const selected = this.IsSelected;
         this._el = document.createElement("span")

UI/Input/RadioButton.ts

@@ -179,26 +179,4 @@ export class RadioButton<T> extends InputElement<T> {
         return form;
     }
 
-    /*
-      public ShowValue(t: T): boolean {
-          if (t === undefined) {
-              return false;
-          }
-          if (!this.IsValid(t)) {
-              return false;
-          }
-          // We check that what is selected matches the previous rendering
-          for (let i = 0; i < this._elements.length; i++) {
-              const e = this._elements[i];
-              if (e.IsValid(t)) {
-                  this._selectedElementIndex.setData(i);
-                  e.GetValue().setData(t);
-                  const radio = document.getElementById(this.IdFor(i));
-                  // @ts-ignore
-                  radio?.checked = true;
-                  return;
-              }
-  
-          }
-      }*/
 }

UI/Popup/EditableTagRendering.ts

@@ -18,41 +18,53 @@ export default class EditableTagRendering extends Toggle {
                 units: Unit [],
                 editMode = new UIEventSource<boolean>(false)
     ) {
+
+        // The tagrendering is hidden if:
+        // The answer is unknown. The questionbox will then show the question
+        // There is a condition hiding the answer
+        const renderingIsShown = tags.map(tags =>
+            configuration.IsKnown(tags) &&
+            (configuration?.condition?.matchesProperties(tags) ?? true))
+        super(
+            new Lazy(() => EditableTagRendering.CreateRendering(tags, configuration, units, editMode)),
+            undefined,
+            renderingIsShown
+        )
+    }
+    
+    private static CreateRendering(tags: UIEventSource<any>, configuration: TagRenderingConfig, units: Unit[], editMode: UIEventSource<boolean>) : BaseUIElement{
         const answer: BaseUIElement = new TagRenderingAnswer(tags, configuration)
         answer.SetClass("w-full")
         let rendering = answer;
 
         if (configuration.question !== undefined && State.state?.featureSwitchUserbadge?.data) {
             // We have a question and editing is enabled
-            const editButton =
+            const answerWithEditButton = new Combine([answer,
-                new Combine([Svg.pencil_ui()]).SetClass("block relative h-10 w-10 p-2 float-right").SetStyle("border: 1px solid black; border-radius: 0.7em")
+                new Toggle(new Combine([Svg.pencil_ui()]).SetClass("block relative h-10 w-10 p-2 float-right").SetStyle("border: 1px solid black; border-radius: 0.7em")
                         .onClick(() => {
                             editMode.setData(true);
-                    });
+                        }),
-
-
-            const answerWithEditButton = new Combine([answer,
-                new Toggle(editButton, 
                     undefined,
                     State.state.osmConnection.isLoggedIn)
             ]).SetClass("flex justify-between w-full")
 
 
-            const cancelbutton =
+            const question = new Lazy(() => {
-                Translations.t.general.cancel.Clone()
+                return   new TagRenderingQuestion(tags, configuration,
+                    {
+                        units: units,
+                        cancelButton: Translations.t.general.cancel.Clone()
                             .SetClass("btn btn-secondary mr-3")
                             .onClick(() => {
                                 editMode.setData(false)
-                    });
+                            }),
-
-            const question = new Lazy(() => new TagRenderingQuestion(tags, configuration,
-                {
-                    units: units,
-                    cancelButton: cancelbutton,
                         afterSave: () => {
                             editMode.setData(false)
                         }
-                }))
+                    })
+
+
+            })
 
 
             rendering = new Toggle(
@@ -62,17 +74,7 @@ export default class EditableTagRendering extends Toggle {
             )
         }
         rendering.SetClass("block w-full break-word text-default m-1 p-1 border-b border-gray-200 mb-2 pb-2")
-        // The tagrendering is hidden if:
+        return rendering;
-        // The answer is unknown. The questionbox will then show the question
-        // There is a condition hiding the answer
-        const renderingIsShown = tags.map(tags =>
-            configuration.IsKnown(tags) &&
-            (configuration?.condition?.matchesProperties(tags) ?? true))
-        super(
-            rendering,
-            undefined,
-            renderingIsShown
-        )
     }
 
 }

UI/Popup/TagRenderingQuestion.ts

@@ -31,7 +31,7 @@ import {Unit} from "../../Models/Unit";
  * Shows the question element.
  * Note that the value _migh_ already be known, e.g. when selected or when changing the value
  */
-export default class TagRenderingQuestion extends Combine {
+export default class TagRenderingQuestion extends VariableUiElement {
 
     constructor(tags: UIEventSource<any>,
                 configuration: TagRenderingConfig,
@@ -43,6 +43,46 @@ export default class TagRenderingQuestion extends Combine {
                     bottomText?: (src: UIEventSource<TagsFilter>) => BaseUIElement
                 }
     ) {
+
+
+        const applicableMappings =
+            UIEventSource.ListStabilized(tags.map(tags => {
+                const applicableMappings : {if: TagsFilter, then: any, ifnot?: TagsFilter}[] = []
+                for (const mapping of configuration.mappings) {
+                    if (mapping.hideInAnswer === true) {
+                        continue
+                    }
+                    if (mapping.hideInAnswer === false || mapping.hideInAnswer === undefined) {
+                       applicableMappings.push(mapping)
+                        continue
+                    }
+                    const condition = <TagsFilter> mapping.hideInAnswer;
+                    const isShown = !condition.matchesProperties(tags)
+                    if(isShown){
+                        applicableMappings.push(mapping)
+                    }
+                }
+                return applicableMappings
+            }));
+
+        super(
+            applicableMappings.map(applicableMappings => {
+                return TagRenderingQuestion.GenerateFullQuestion(tags, applicableMappings, configuration, options)
+            })
+        )
+    }
+    
+    private static GenerateFullQuestion(tags: UIEventSource<any>,
+                                        applicableMappings:  {if: TagsFilter, then: any, ifnot?: TagsFilter}[],
+                                        configuration: TagRenderingConfig,
+                                        options?: {
+                                            units?: Unit[],
+                                            afterSave?: () => void,
+                                            cancelButton?: BaseUIElement,
+                                            saveButtonConstr?: (src: UIEventSource<TagsFilter>) => BaseUIElement,
+                                            bottomText?: (src: UIEventSource<TagsFilter>) => BaseUIElement
+                                        }
+    ) {
         if (configuration === undefined) {
             throw "A question is needed for a question visualization"
         }
@@ -52,7 +92,7 @@ export default class TagRenderingQuestion extends Combine {
             .SetClass("question-text");
 
 
-        const inputElement: InputElement<TagsFilter> = TagRenderingQuestion.GenerateInputElement(configuration, applicableUnit, tags)
+        const inputElement: InputElement<TagsFilter> = TagRenderingQuestion.GenerateInputElement(configuration, applicableMappings, applicableUnit, tags)
 
         if (inputElement === undefined) {
             console.error("MultiAnswer failed - probably not a single option was possible", configuration)
@@ -103,52 +143,77 @@ export default class TagRenderingQuestion extends Combine {
                 )
             ).SetClass("block break-all")
         }
-        super([
+        return new Combine([
             question,
             inputElement,
             options.cancelButton,
             saveButton,
             bottomTags]
-        )
+        ).SetClass("question")
-        this.SetClass("question")
 
     }
 
-    private static GenerateInputElement(configuration: TagRenderingConfig, applicableUnit: Unit, tagsSource: UIEventSource<any>): InputElement<TagsFilter> {
+    private static GenerateInputElement(configuration: TagRenderingConfig, 
+                                        applicableMappings: {if: TagsFilter, then: any, ifnot?: TagsFilter}[],
+                                        applicableUnit: Unit, tagsSource: UIEventSource<any>): InputElement<TagsFilter> {
         let inputEls: InputElement<TagsFilter>[];
 
-        const mappings = (configuration.mappings ?? [])
+
-            .filter(mapping => {
+        const ifNotsPresent = applicableMappings.some(mapping => mapping.ifnot !== undefined)
-                if (mapping.hideInAnswer === true) {
+
-                    return false;
+        function allIfNotsExcept(excludeIndex: number): UIEventSource<TagsFilter[]> {
+            if (configuration.mappings === undefined || configuration.mappings.length === 0) {
+                return undefined
             }
-                return !(typeof (mapping.hideInAnswer) !== "boolean" && mapping.hideInAnswer.matchesProperties(tagsSource.data));
+            if (!ifNotsPresent) {
-
+                return undefined
-            })
-
-
-        function allIfNotsExcept(excludeIndex: number): TagsFilter[] {
-            if (configuration.mappings === undefined) {
-                return []
             }
             if (configuration.multiAnswer) {
                 // The multianswer will do the ifnot configuration themself
-                return []
+                return undefined
             }
-            return Utils.NoNull(configuration.mappings?.map((m, i) => excludeIndex === i ? undefined : m.ifnot))
+            return tagsSource.map(currentTags => {
+                const negativeMappings = []
+
+                for (let i = 0; i < configuration.mappings.length; i++) {
+                    const mapping = configuration.mappings[i];
+                    if (i === excludeIndex || mapping.ifnot === undefined) {
+                        continue
+                    }
+
+                    const hidden = mapping.hideInAnswer
+                    if (hidden === undefined) {
+                        negativeMappings.push(mapping.ifnot)
+                        continue
+                    }
+                    if (hidden === true) {
+                        continue
+                    }
+
+                    if ((<TagsFilter>hidden).matchesProperties(currentTags)) {
+                        // This option is currently hidden
+                        continue
+                    }
+                    negativeMappings.push(mapping.ifnot)
+
+                }
+
+                return Utils.NoNull(negativeMappings)
+            })
+
         }
 
         const ff = TagRenderingQuestion.GenerateFreeform(configuration, applicableUnit, tagsSource);
-        const hasImages = mappings.filter(mapping => mapping.then.ExtractImages().length > 0).length > 0
+        const hasImages = applicableMappings.filter(mapping => mapping.then.ExtractImages().length > 0).length > 0
 
-        if (mappings.length < 8 || configuration.multiAnswer || hasImages) {
+        if (applicableMappings.length < 8 || configuration.multiAnswer || hasImages || ifNotsPresent) {
-            inputEls = (mappings ?? []).map((mapping, i) => TagRenderingQuestion.GenerateMappingElement(tagsSource, mapping, allIfNotsExcept(i)));
+            inputEls = (applicableMappings ?? []).map((mapping, i) => TagRenderingQuestion.GenerateMappingElement(tagsSource, mapping, allIfNotsExcept(i)));
             inputEls = Utils.NoNull(inputEls);
         } else {
             const dropdown: InputElement<TagsFilter> = new DropDown("",
-                mappings.map((mapping, i) => {
+                applicableMappings.map((mapping, i) => {
                     return {
-                        value: new And([mapping.if, ...allIfNotsExcept(i)]),
+                        value: new And([mapping.if, ...allIfNotsExcept(i).data]),
                         shown: Translations.WT(mapping.then).Clone()
                     }
                 })
@@ -178,6 +243,7 @@ export default class TagRenderingQuestion extends Combine {
 
     }
 
+
     private static GenerateMultiAnswer(
         configuration: TagRenderingConfig,
         elements: InputElement<TagsFilter>[], freeformField: InputElement<TagsFilter>, ifNotSelected: TagsFilter[]): InputElement<TagsFilter> {
@@ -278,17 +344,23 @@ export default class TagRenderingQuestion extends Combine {
         return inputEl;
     }
 
+
+    /**
+     * Generates a (Fixed) input element for this mapping.
+     * Note that the mapping might hide itself if the condition is not met anymore.
+     *
+     * Returns: [the element itself, the value to select if not selected. The contents of this UIEventSource might swap to undefined if the conditions to show the answer are unmet]
+     */
     private static GenerateMappingElement(
         tagsSource: UIEventSource<any>,
         mapping: {
             if: TagsFilter,
             then: Translation,
-            hideInAnswer: boolean | TagsFilter
+        }, ifNot?: UIEventSource<TagsFilter[]>): InputElement<TagsFilter> {
-        }, ifNot?: TagsFilter[]): InputElement<TagsFilter> {
 
-        let tagging = mapping.if;
+        let tagging: TagsFilter | UIEventSource<TagsFilter> = mapping.if;
-        if (ifNot.length > 0) {
+        if (ifNot !== undefined) {
-            tagging = new And([tagging, ...ifNot])
+            tagging = ifNot.map(ifNots => new And([mapping.if, ...ifNots]))
         }
 
         return new FixedInputElement(

assets/layers/charging_station/README.md

@@ -17,3 +17,19 @@ AT this point, most of the work should be done; feel free to send a PR. If you w
 - Run`npm run query:licenses` to get an interactive program to add the license of your artwork, followed by `npm run generate:licenses` 
 - Run `npm run generate:layeroverview` to generate the layer files
 - Run `npm run start` to run the instance
+
+The CSV File
+------------
+
+The columns in the CSV file are:
+
+- key: the key as described on the wiki, starts with `socket:`
+- image: The associated image (a .svg)
+- description:en A description in english
+- description:nl A description in english
+- countryWhiteList: Only show this plug type in these countries
+- countryBlackList: Don't show this plug type in these countries. NOt compatibel with the whiteList
+- commonVoltages, commonCurrents, commonOutputs: common values for these tags
+- associatedVehicleTypes and neverAssociatedWith: these work in tandem to hide options.
+  If every associated vehicle type is `no`, then the option is hidden
+  If at least one `neverAssociatedVehicleType` is `yes` and none of the associated types is yes, then the option is hidden too

assets/layers/charging_station/charging_station.json

@@ -215,17 +215,31 @@
             "nl": "<div class='flex'><img class='w-12 mx-4' src='./assets/layers/charging_station/Chademo_type4.svg'/> <span><b>Chademo</b></span></div>"
           },
           "hideInAnswer": {
+            "or": [
+              {
                 "and": [
-                            "car~*",
+                  "car=no",
+                  "motorcar=no",
+                  "hgv=no",
+                  "bus=no"
+                ]
+              },
+              {
+                "and": [
+                  {
+                    "or": [
+                      "bicycle=yes",
+                      "scooter=yes"
+                    ]
+                  },
                   "car!=yes",
-                            "motorcar~*",
                   "motorcar!=yes",
-                            "hgv~*",
                   "hgv!=yes",
-                            "bus~*",
                   "bus!=yes"
                 ]
               }
+            ]
+          }
         },
         {
           "if": {
@@ -248,17 +262,31 @@
             "nl": "<div class='flex'><img class='w-12 mx-4' src='./assets/layers/charging_station/Type1_J1772.svg'/> <span><b>Type 1 met kabel</b> (J1772)</span></div>"
           },
           "hideInAnswer": {
+            "or": [
+              {
                 "and": [
-                            "car~*",
+                  "car=no",
+                  "motorcar=no",
+                  "hgv=no",
+                  "bus=no"
+                ]
+              },
+              {
+                "and": [
+                  {
+                    "or": [
+                      "bicycle=yes",
+                      "scooter=yes"
+                    ]
+                  },
                   "car!=yes",
-                            "motorcar~*",
                   "motorcar!=yes",
-                            "hgv~*",
                   "hgv!=yes",
-                            "bus~*",
                   "bus!=yes"
                 ]
               }
+            ]
+          }
         },
         {
           "if": {
@@ -281,17 +309,31 @@
             "nl": "<div class='flex'><img class='w-12 mx-4' src='./assets/layers/charging_station/Type1_J1772.svg'/> <span><b>Type 1 <i>zonder</i> kabel</b> (J1772)</span></div>"
           },
           "hideInAnswer": {
+            "or": [
+              {
                 "and": [
-                            "car~*",
+                  "car=no",
+                  "motorcar=no",
+                  "hgv=no",
+                  "bus=no"
+                ]
+              },
+              {
+                "and": [
+                  {
+                    "or": [
+                      "bicycle=yes",
+                      "scooter=yes"
+                    ]
+                  },
                   "car!=yes",
-                            "motorcar~*",
                   "motorcar!=yes",
-                            "hgv~*",
                   "hgv!=yes",
-                            "bus~*",
                   "bus!=yes"
                 ]
               }
+            ]
+          }
         },
         {
           "if": {
@@ -314,17 +356,31 @@
             "nl": "<div class='flex'><img class='w-12 mx-4' src='./assets/layers/charging_station/Type1-ccs.svg'/> <span><b>Type 1 CCS</b> (ook gekend als Type 1 Combo)</span></div>"
           },
           "hideInAnswer": {
+            "or": [
+              {
                 "and": [
-                            "car~*",
+                  "car=no",
+                  "motorcar=no",
+                  "hgv=no",
+                  "bus=no"
+                ]
+              },
+              {
+                "and": [
+                  {
+                    "or": [
+                      "bicycle=yes",
+                      "scooter=yes"
+                    ]
+                  },
                   "car!=yes",
-                            "motorcar~*",
                   "motorcar!=yes",
-                            "hgv~*",
                   "hgv!=yes",
-                            "bus~*",
                   "bus!=yes"
                 ]
               }
+            ]
+          }
         },
         {
           "if": {
@@ -347,17 +403,31 @@
             "nl": "<div class='flex'><img class='w-12 mx-4' src='./assets/layers/charging_station/Tesla-hpwc-model-s.svg'/> <span><b>Tesla Supercharger</b></span></div>"
           },
           "hideInAnswer": {
+            "or": [
+              {
                 "and": [
-                            "car~*",
+                  "car=no",
+                  "motorcar=no",
+                  "hgv=no",
+                  "bus=no"
+                ]
+              },
+              {
+                "and": [
+                  {
+                    "or": [
+                      "bicycle=yes",
+                      "scooter=yes"
+                    ]
+                  },
                   "car!=yes",
-                            "motorcar~*",
                   "motorcar!=yes",
-                            "hgv~*",
                   "hgv!=yes",
-                            "bus~*",
                   "bus!=yes"
                 ]
               }
+            ]
+          }
         },
         {
           "if": {
@@ -380,17 +450,31 @@
             "nl": "<div class='flex'><img class='w-12 mx-4' src='./assets/layers/charging_station/Type2_socket.svg'/> <span><b>Type 2</b> (mennekes)</span></div>"
           },
           "hideInAnswer": {
+            "or": [
+              {
                 "and": [
-                            "car~*",
+                  "car=no",
+                  "motorcar=no",
+                  "hgv=no",
+                  "bus=no"
+                ]
+              },
+              {
+                "and": [
+                  {
+                    "or": [
+                      "bicycle=yes",
+                      "scooter=yes"
+                    ]
+                  },
                   "car!=yes",
-                            "motorcar~*",
                   "motorcar!=yes",
-                            "hgv~*",
                   "hgv!=yes",
-                            "bus~*",
                   "bus!=yes"
                 ]
               }
+            ]
+          }
         },
         {
           "if": {
@@ -413,17 +497,31 @@
             "nl": "<div class='flex'><img class='w-12 mx-4' src='./assets/layers/charging_station/Type2_CCS.svg'/> <span><b>Type 2 CCS</b> (mennekes)</span></div>"
           },
           "hideInAnswer": {
+            "or": [
+              {
                 "and": [
-                            "car~*",
+                  "car=no",
+                  "motorcar=no",
+                  "hgv=no",
+                  "bus=no"
+                ]
+              },
+              {
+                "and": [
+                  {
+                    "or": [
+                      "bicycle=yes",
+                      "scooter=yes"
+                    ]
+                  },
                   "car!=yes",
-                            "motorcar~*",
                   "motorcar!=yes",
-                            "hgv~*",
                   "hgv!=yes",
-                            "bus~*",
                   "bus!=yes"
                 ]
               }
+            ]
+          }
         },
         {
           "if": {
@@ -446,17 +544,31 @@
             "nl": "<div class='flex'><img class='w-12 mx-4' src='./assets/layers/charging_station/Type2_tethered.svg'/> <span><b>Type 2 met kabel</b> (J1772)</span></div>"
           },
           "hideInAnswer": {
+            "or": [
+              {
                 "and": [
-                            "car~*",
+                  "car=no",
+                  "motorcar=no",
+                  "hgv=no",
+                  "bus=no"
+                ]
+              },
+              {
+                "and": [
+                  {
+                    "or": [
+                      "bicycle=yes",
+                      "scooter=yes"
+                    ]
+                  },
                   "car!=yes",
-                            "motorcar~*",
                   "motorcar!=yes",
-                            "hgv~*",
                   "hgv!=yes",
-                            "bus~*",
                   "bus!=yes"
                 ]
               }
+            ]
+          }
         },
         {
           "if": {
@@ -479,17 +591,31 @@
             "nl": "<div class='flex'><img class='w-12 mx-4' src='./assets/layers/charging_station/Type2_CCS.svg'/> <span><b>Tesla Supercharger CCS</b> (een type2 CCS met Tesla-logo)</span></div>"
           },
           "hideInAnswer": {
+            "or": [
+              {
                 "and": [
-                            "car~*",
+                  "car=no",
+                  "motorcar=no",
+                  "hgv=no",
+                  "bus=no"
+                ]
+              },
+              {
+                "and": [
+                  {
+                    "or": [
+                      "bicycle=yes",
+                      "scooter=yes"
+                    ]
+                  },
                   "car!=yes",
-                            "motorcar~*",
                   "motorcar!=yes",
-                            "hgv~*",
                   "hgv!=yes",
-                            "bus~*",
                   "bus!=yes"
                 ]
               }
+            ]
+          }
         },
         {
           "if": {
@@ -514,21 +640,31 @@
           "hideInAnswer": {
             "or": [
               {
-                                "or": [
+                "and": [
-                                    "_country!=us"
+                  "car=no",
+                  "motorcar=no",
+                  "hgv=no",
+                  "bus=no"
                 ]
               },
               {
                 "and": [
-                                    "car~*",
+                  {
+                    "or": [
+                      "bicycle=yes",
+                      "scooter=yes"
+                    ]
+                  },
                   "car!=yes",
-                                    "motorcar~*",
                   "motorcar!=yes",
-                                    "hgv~*",
                   "hgv!=yes",
-                                    "bus~*",
                   "bus!=yes"
                 ]
+              },
+              {
+                "or": [
+                  "_country!=us"
+                ]
               }
             ]
           }
@@ -556,21 +692,31 @@
           "hideInAnswer": {
             "or": [
               {
-                                "or": [
+                "and": [
-                                    "_country=us"
+                  "car=no",
+                  "motorcar=no",
+                  "hgv=no",
+                  "bus=no"
                 ]
               },
               {
                 "and": [
-                                    "car~*",
+                  {
+                    "or": [
+                      "bicycle=yes",
+                      "scooter=yes"
+                    ]
+                  },
                   "car!=yes",
-                                    "motorcar~*",
                   "motorcar!=yes",
-                                    "hgv~*",
                   "hgv!=yes",
-                                    "bus~*",
                   "bus!=yes"
                 ]
+              },
+              {
+                "or": [
+                  "_country=us"
+                ]
               }
             ]
           }

assets/layers/charging_station/csvToJson.ts

@@ -18,7 +18,8 @@ function loadCsv(file): {
     commonVoltages?: number[],
     commonCurrents?: number[],
     commonOutputs?: string[],
-    associatedVehicleTypes?:string[]
+    associatedVehicleTypes?: string[],
+    neverAssociatedWith?: string[]
 }[] {
     const entries: string[] = Utils.NoNull(readFileSync(file, "utf8").split("\n").map(str => str.trim()))
     const header = entries.shift().split(",")
@@ -30,7 +31,7 @@ function loadCsv(file): {
         }
 
         const v = {}
-        const colonSeperated = ["commonVoltages", "commonOutputs", "commonCurrents", "countryWhiteList","countryBlackList","associatedVehicleTypes"]
+        const colonSeperated = ["commonVoltages", "commonOutputs", "commonCurrents", "countryWhiteList", "countryBlackList", "associatedVehicleTypes", "neverAssociatedWith"]
         const descriptionTranslations = new Map<string, string>()
         for (let j = 0; j < header.length; j++) {
             const key = header[j];
@@ -89,16 +90,31 @@ function run(file, protojson) {
             json["hideInAnswer"] = {or: countries}
         }
 
-        if(e.associatedVehicleTypes?.length > 0 && e.associatedVehicleTypes.indexOf("*") < 0){
+        if (e.associatedVehicleTypes?.length > 0 && e.associatedVehicleTypes.indexOf("*") < 0 && e.neverAssociatedWith?.length > 0) {
             // This plug only occurs if some vehicle specific vehicle type is present.
             // IF all of the needed vehicle types are explicitly NO, then we hide this type as well
-            let hideInAnswer : any = {and: [].concat(...e.associatedVehicleTypes.map(neededVehicle => [neededVehicle+"~*", neededVehicle+"!=yes"]))}
+            let associatedWith = {and: [].concat(...e.associatedVehicleTypes.map(neededVehicle => [neededVehicle + "=no"]))}
+
+            // We also hide if:
+            // - One of the neverAssociatedVehiclesTYpes is set to 'yes' AND none of the associated types are set/yes
+            let neverAssociatedIsSet = {
+                and: [{
+                    or: e.neverAssociatedWith.map(vehicleType => vehicleType + "=yes")
+                },
+                    ...e.associatedVehicleTypes.map(associated => associated + "!=yes")
+                ]
+            }
+
+            let conditions = [associatedWith, neverAssociatedIsSet]
             if (json["hideInAnswer"] !== undefined) {
-                hideInAnswer = {or: [json["hideInAnswer"], hideInAnswer]}
+                conditions.push(json["hideInAnswer"])
             }
-            json["hideInAnswer"] = hideInAnswer
+            json["hideInAnswer"] = {or: conditions}
+
         }
 
+
+
         overview_question_answers.push(json)
 
         // We add a second time for any amount to trigger a visualisation; but this is not an answer option
@@ -259,7 +275,6 @@ function run(file, protojson) {
     })
 
 
-
     const extraUnits = [
         {
             appliesToKey: entries.map(e => e.key + ":voltage"),

assets/layers/charging_station/types.csv

@@ -1,15 +1,15 @@
-key,image,description:en,countryWhiteList,countryBlackList,commonVoltages,commonCurrents,commonOutputs,description:nl,associatedVehicleTypes
+key,image,description:en,countryWhiteList,countryBlackList,commonVoltages,commonCurrents,commonOutputs,description:nl,associatedVehicleTypes,neverAssociatedWith
-socket:schuko,CEE7_4F.svg,<b>Schuko wall plug</b> without ground pin (CEE7/4 type F),be;fr;ma;tn;pl;cs;sk;mo,,230,16,3.6 kW,<b>Schuko stekker</b> zonder aardingspin (CEE7/4 type F),*
+socket:schuko,CEE7_4F.svg,<b>Schuko wall plug</b> without ground pin (CEE7/4 type F),be;fr;ma;tn;pl;cs;sk;mo,,230,16,3.6 kW,<b>Schuko stekker</b> zonder aardingspin (CEE7/4 type F),*,
-socket:typee,TypeE.svg,<b>European wall plug</b> with ground pin (CEE7/4 type E),,,230,16,3 kW;22 kW;,<b>Europese stekker</b> met aardingspin (CEE7/4 type E),*
+socket:typee,TypeE.svg,<b>European wall plug</b> with ground pin (CEE7/4 type E),,,230,16,3 kW;22 kW;,<b>Europese stekker</b> met aardingspin (CEE7/4 type E),*,
-socket:chademo,Chademo_type4.svg,<b>Chademo</b>,,,500,120,50 kW,<b>Chademo</b>,car;motorcar;hgv;bus
+socket:chademo,Chademo_type4.svg,<b>Chademo</b>,,,500,120,50 kW,<b>Chademo</b>,car;motorcar;hgv;bus,bicycle;scooter
-socket:type1_cable,Type1_J1772.svg,<b>Type 1 with cable</b> (J1772),,,200;240,32,3.7 kW;7 kW,<b>Type 1 met kabel</b> (J1772),car;motorcar;hgv;bus
+socket:type1_cable,Type1_J1772.svg,<b>Type 1 with cable</b> (J1772),,,200;240,32,3.7 kW;7 kW,<b>Type 1 met kabel</b> (J1772),car;motorcar;hgv;bus,bicycle;scooter
-socket:type1,Type1_J1772.svg,<b>Type 1 <i>without</i> cable</b> (J1772),,,200;240,32,3.7 kW;6.6 kW;7 kW;7.2 kW,<b>Type 1 <i>zonder</i> kabel</b> (J1772),car;motorcar;hgv;bus
+socket:type1,Type1_J1772.svg,<b>Type 1 <i>without</i> cable</b> (J1772),,,200;240,32,3.7 kW;6.6 kW;7 kW;7.2 kW,<b>Type 1 <i>zonder</i> kabel</b> (J1772),car;motorcar;hgv;bus,bicycle;scooter
-socket:type1_combo,Type1-ccs.svg,<b>Type 1 CCS</b> (aka Type 1 Combo),,,400;1000,50;125,50 kW;62.5 kW;150 kW;350 kW;,<b>Type 1 CCS</b> (ook gekend als Type 1 Combo),car;motorcar;hgv;bus
+socket:type1_combo,Type1-ccs.svg,<b>Type 1 CCS</b> (aka Type 1 Combo),,,400;1000,50;125,50 kW;62.5 kW;150 kW;350 kW;,<b>Type 1 CCS</b> (ook gekend als Type 1 Combo),car;motorcar;hgv;bus,bicycle;scooter
-socket:tesla_supercharger,Tesla-hpwc-model-s.svg,<b>Tesla Supercharger</b>,,,480,125;350,120 kW;150 kW;250 kW,<b>Tesla Supercharger</b>,car;motorcar;hgv;bus
+socket:tesla_supercharger,Tesla-hpwc-model-s.svg,<b>Tesla Supercharger</b>,,,480,125;350,120 kW;150 kW;250 kW,<b>Tesla Supercharger</b>,car;motorcar;hgv;bus,bicycle;scooter
-socket:type2,Type2_socket.svg,<b>Type 2</b> (mennekes),,,230;400,16;32,11 kW;22 kW,<b>Type 2</b> (mennekes),car;motorcar;hgv;bus
+socket:type2,Type2_socket.svg,<b>Type 2</b> (mennekes),,,230;400,16;32,11 kW;22 kW,<b>Type 2</b> (mennekes),car;motorcar;hgv;bus,bicycle;scooter
-socket:type2_combo,Type2_CCS.svg,<b>Type 2 CCS</b> (mennekes),,,500;920,125;350,50 kW,<b>Type 2 CCS</b> (mennekes),car;motorcar;hgv;bus
+socket:type2_combo,Type2_CCS.svg,<b>Type 2 CCS</b> (mennekes),,,500;920,125;350,50 kW,<b>Type 2 CCS</b> (mennekes),car;motorcar;hgv;bus,bicycle;scooter
-socket:type2_cable,Type2_tethered.svg,<b>Type 2 with cable</b> (mennekes),,,230;400,16;32,11 kW;22 kW,<b>Type 2 met kabel</b> (J1772),car;motorcar;hgv;bus
+socket:type2_cable,Type2_tethered.svg,<b>Type 2 with cable</b> (mennekes),,,230;400,16;32,11 kW;22 kW,<b>Type 2 met kabel</b> (J1772),car;motorcar;hgv;bus,bicycle;scooter
-socket:tesla_supercharger_ccs,Type2_CCS.svg,<b>Tesla Supercharger CCS</b> (a branded type2_css),,,500;920,125;350,50 kW,<b>Tesla Supercharger CCS</b> (een type2 CCS met Tesla-logo),car;motorcar;hgv;bus
+socket:tesla_supercharger_ccs,Type2_CCS.svg,<b>Tesla Supercharger CCS</b> (a branded type2_css),,,500;920,125;350,50 kW,<b>Tesla Supercharger CCS</b> (een type2 CCS met Tesla-logo),car;motorcar;hgv;bus,bicycle;scooter
-socket:tesla_destination,Tesla-hpwc-model-s.svg,<b>Tesla Supercharger (destination)</b>,us,,480,125;350,120 kW;150 kW;250 kW,<b>Tesla Supercharger (destination)</b>,car;motorcar;hgv;bus
+socket:tesla_destination,Tesla-hpwc-model-s.svg,<b>Tesla Supercharger (destination)</b>,us,,480,125;350,120 kW;150 kW;250 kW,<b>Tesla Supercharger (destination)</b>,car;motorcar;hgv;bus,bicycle;scooter
-socket:tesla_destination,Type2_tethered.svg,<b>Tesla supercharger (destination</b> (A Type 2 with cable branded as tesla),,us,230;400,16;32,11 kW;22 kW,<b>Tesla supercharger (destination</b> (Een Type 2 met kabel en Tesla-logo),car;motorcar;hgv;bus
+socket:tesla_destination,Type2_tethered.svg,<b>Tesla supercharger (destination</b> (A Type 2 with cable branded as tesla),,us,230;400,16;32,11 kW;22 kW,<b>Tesla supercharger (destination</b> (Een Type 2 met kabel en Tesla-logo),car;motorcar;hgv;bus,bicycle;scooter
-socket:USB-A,usb_port.svg,<b>USB</b> to charge phones and small electronics,,,5,1;2,5W;10W,<b>USB</b> om GSMs en kleine electronica op te laden,*
+socket:USB-A,usb_port.svg,<b>USB</b> to charge phones and small electronics,,,5,1;2,5W;10W,<b>USB</b> om GSMs en kleine electronica op te laden,*,

test.ts

@@ -1,2 +1,31 @@
 import {AllKnownLayouts} from "./Customizations/AllKnownLayouts";
-import {Translation} from "./UI/i18n/Translation";
+import TagRenderingQuestion from "./UI/Popup/TagRenderingQuestion";
+import {UIEventSource} from "./Logic/UIEventSource";
+import {VariableUiElement} from "./UI/Base/VariableUIElement";
+
+const theme = AllKnownLayouts.allKnownLayouts.get("charging_stations")
+
+const tagRendering = theme.layers[0].tagRenderings.filter(tr => tr.id === "Available_charging_stations (generated)")[0]
+const tag = new UIEventSource({
+    id: "node/42",
+    amenity:"charging_station",
+    bicycle:"yes",
+    car:"no",
+    "motorcar":"no",
+    "hgv":"no",
+    bus:"no"
+})
+window.tags = tag
+
+//const q =
+new VariableUiElement(tag.map(_ => new  TagRenderingQuestion(tag, tagRendering) ))
+   .SetStyle("width: 100px")
+    .AttachTo("maindiv")
+
+
+window.setTimeout(_ => {
+    tag.data.bicycle="no"
+    tag.data.car = "yes"
+    tag.ping()
+    console.log("Pinged")
+}, 2500)