Fix image carousel bug

InitUiElements.ts

@@ -30,7 +30,6 @@ import {FullScreenMessageBox} from "./UI/FullScreenMessageBoxHandler";
 import {GeoLocationHandler} from "./Logic/Leaflet/GeoLocationHandler";
 import {Layout} from "./Customizations/Layout";
 import {LocalStorageSource} from "./Logic/Web/LocalStorageSource";
-import {FromJSON} from "./Customizations/JSON/FromJSON";
 import {Utils} from "./Utils";
 import BackgroundSelector from "./UI/BackgroundSelector";
 import AvailableBaseLayers from "./Logic/AvailableBaseLayers";
@@ -166,7 +165,6 @@ export class InitUiElements {
                         // This layer is the layer that gives the questions
 
                         const featureBox = new FeatureInfoBox(
-                            feature.feature,
                             State.state.allElements.getElement(data.id),
                             layer
                         );
@@ -477,7 +475,6 @@ export class InitUiElements {
             const generateInfo = (tagsES, feature) => {
 
                 return new FeatureInfoBox(
-                    feature,
                     tagsES,
                     layer,
                 )

UI/Image/ImageCarousel.ts

@@ -8,7 +8,7 @@ import DeleteImage from "./DeleteImage";
 
 export class ImageCarousel extends UIElement{
 
-    public readonly slideshow: SlideShow;
+    public readonly slideshow: UIElement;
 
     constructor(tags: UIEventSource<any>, imagePrefix: string = "image", loadSpecial: boolean =true) {
         super(tags);

UI/Image/SlideShow.ts

@@ -1,6 +1,7 @@
 import {UIEventSource} from "../../Logic/UIEventSource";
 import {UIElement} from "../UIElement";
 import {FixedUiElement} from "../Base/FixedUiElement";
+import Combine from "../Base/Combine";
 
 export class SlideShow extends UIElement {
 
@@ -22,6 +23,7 @@ export class SlideShow extends UIElement {
                 this._currentSlide.setData(this._embeddedElements.data.length - 1);
             });
 
+        this.dumbMode = false;
         const self = this;
         this._prev = new FixedUiElement("<div class='prev-button'>" +
             "<div class='vspan'></div>" +
@@ -43,6 +45,7 @@ export class SlideShow extends UIElement {
     }
 
     InnerRender(): string {
+        console.log("Inner rendering")
         if (this._embeddedElements.data.length == 0) {
             return "";
         }
@@ -63,11 +66,11 @@ export class SlideShow extends UIElement {
             }
             slides += "      <div class=\"slide " + state + "\">" + embeddedElement.Render() + "</div>\n";
         }
-        return "<div class='image-slideshow'>"
-            + this._prev.Render()
-            + "<div class='slides'>" + slides + "</div>"
-            + this._next.Render()
-            + "</div>";
+        return new Combine(["<div class='image-slideshow'>"
+            , this._prev
+            , "<div class='slides'>", slides, "</div>"
+            , this._next
+            , "</div>"]).Render();
     }
 
     public MoveTo(index: number) {

UI/Popup/FeatureInfoBox.ts

@@ -16,11 +16,13 @@ export class FeatureInfoBox extends UIElement {
     private _questionBox : UIElement;
 
     constructor(
-        feature: any,
         tags: UIEventSource<any>,
         layerConfig: LayerConfig
     ) {
         super();
+        if(layerConfig === undefined){
+            throw "Undefined layerconfig"
+        }
         this._tags = tags;
         this._layerConfig = layerConfig;
 

UI/Popup/TagRenderingAnswer.ts

@@ -9,25 +9,37 @@ import {SubstitutedTranslation} from "../SpecialVisualizations";
 export default class TagRenderingAnswer extends UIElement {
     private _tags: UIEventSource<any>;
     private _configuration: TagRenderingConfig;
+    private _content: UIElement;
 
-    constructor(tags: UIEventSource<any>,
-                configuration: TagRenderingConfig) {
+    constructor(tags: UIEventSource<any>, configuration: TagRenderingConfig) {
         super(tags);
         this._tags = tags;
         this._configuration = configuration;
+        const self = this;
+        tags.addCallbackAndRun(tags => {
+            if (tags === undefined) {
+                self._content = undefined
+                return;
+            }
+            const tr = this._configuration.GetRenderValue(tags);
+            if (tr === undefined) {
+                self._content = undefined
+                return
+            }
+            self._content = new SubstitutedTranslation(tr, self._tags)
+        })
     }
 
     InnerRender(): string {
-        if(this._configuration.condition !== undefined){
-            if(!this._configuration.condition.matchesProperties(this._tags.data)){
+        if (this._configuration.condition !== undefined) {
+            if (!this._configuration.condition.matchesProperties(this._tags.data)) {
                 return "";
             }
         }
-        const tr = this._configuration.GetRenderValue(this._tags.data);
-        if(tr === undefined){
+        if(this._content === undefined){
             return "";
         }
-        return new SubstitutedTranslation(tr, this._tags).Render();
+        return this._content.Render();
     }
 
 }

UI/SpecialVisualizations.ts

@@ -22,7 +22,6 @@ export class SubstitutedTranslation extends UIElement {
         this.translation = translation;
         this.tags = tags;
         const self = this;
-        this.dumbMode = false;
         Locale.language.addCallbackAndRun(() => {
             self.content = self.CreateContent();
             self.Update();
@@ -78,7 +77,7 @@ export class SubstitutedTranslation extends UIElement {
                     return [...partBefore, element, ...partAfter]
                 } catch (e) {
                     console.error(e);
-                    return [...partBefore, ...partAfter]
+                    return [...partBefore,new FixedUiElement(`Failed loading ${knownSpecial.funcName}(${matched[2]}): ${e}`) ,  ...partAfter]
                 }
             }
         }

test.ts

@@ -2,47 +2,19 @@
 
 
 import {UIEventSource} from "./Logic/UIEventSource";
-import {TagRenderingConfigJson} from "./Customizations/JSON/TagRenderingConfigJson";
-import TagRenderingConfig from "./Customizations/JSON/TagRenderingConfig";
-import Locale from "./UI/i18n/Locale";
-import EditableTagRendering from "./UI/Popup/EditableTagRendering";
-import TagRenderingQuestion from "./UI/Popup/TagRenderingQuestion";
+import {FeatureInfoBox} from "./UI/Popup/FeatureInfoBox";
+import SharedLayers from "./Customizations/SharedLayers";
 
-const tagRendering: TagRenderingConfigJson = {
-    question: {"en": "What is the name of?", nl: "Wat is de naam van?", fr: "C'est quoi le nom"},
-    mappings: [
-        {
-            if: "valves=A",
-            then: "A"
-        },
-        {
-            if: "valves=B",
-            then: "B"
-        },
-        {
-            if: "valves=C",
-            then: "C"
-        }, {
-            if: "valves:special=A",
-            then: "SPecial"
-        }
-    ],
-    render: "Valves: {valves}",
-    multiAnswer: true,
-    freeform: {
-        key: "valves",
-        type: "string",
-        addExtraTags: ["fixme=valves"]
-    }
+const tags = {
+    mapillary: "wweALGY5g8_T8UjGkcWCfw",
+    wikimedia_commons: "File:Boekenkast Sint-Lodewijks.jpg"
 }
+const src = new UIEventSource(tags);
 
-const config = new TagRenderingConfig(tagRendering)
+new FeatureInfoBox(src, SharedLayers.sharedLayers["ghost_bike"]).AttachTo('maindiv');
 
-const tags = new UIEventSource({id: "node/-1", "amenity": "bench", name: "pietervdvn"})
-
- new TagRenderingQuestion(tags, config).AttachTo("maindiv")
-// new EditableTagRendering(tags, config).AttachTo('maindiv')
-Locale.CreateLanguagePicker(["nl", "en", "fr"]).AttachTo("extradiv")
+//const subs = new SubstitutedTranslation(new Translation({"nl":"NL {image_carousel()} {image_upload()}"}), src)
+//subs.AttachTo("maindiv")
 /*/