Fix image carousel bug
This commit is contained in:
parent
c226e15d99
commit
a19f3e61f9
7 changed files with 43 additions and 58 deletions
|
@ -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,
|
||||
)
|
||||
|
|
|
@ -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);
|
||||
|
@ -29,7 +29,7 @@ export class ImageCarousel extends UIElement{
|
|||
});
|
||||
|
||||
this.slideshow = new SlideShow(uiElements).HideOnEmpty(true);
|
||||
|
||||
|
||||
}
|
||||
|
||||
InnerRender(): string {
|
||||
|
|
|
@ -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) {
|
||||
|
|
|
@ -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;
|
||||
|
||||
|
|
|
@ -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();
|
||||
}
|
||||
|
||||
}
|
|
@ -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();
|
||||
|
@ -33,7 +32,7 @@ export class SubstitutedTranslation extends UIElement {
|
|||
InnerRender(): string {
|
||||
return new Combine(this.content).Render();
|
||||
}
|
||||
|
||||
|
||||
private CreateContent(): UIElement[] {
|
||||
let txt = this.translation?.txt;
|
||||
if (txt === undefined) {
|
||||
|
@ -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]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
46
test.ts
46
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")
|
||||
/*/
|
||||
|
||||
|
||||
|
|
Loading…
Reference in a new issue