forked from MapComplete/MapComplete
85 lines
3.1 KiB
TypeScript
85 lines
3.1 KiB
TypeScript
import {UIElement} from "../UIElement";
|
|
import {UIEventSource} from "../../Logic/UIEventSource";
|
|
import LayerConfig from "../../Customizations/JSON/LayerConfig";
|
|
import EditableTagRendering from "./EditableTagRendering";
|
|
import QuestionBox from "./QuestionBox";
|
|
import Combine from "../Base/Combine";
|
|
import TagRenderingAnswer from "./TagRenderingAnswer";
|
|
import State from "../../State";
|
|
import {FixedUiElement} from "../Base/FixedUiElement";
|
|
import TagRenderingConfig from "../../Customizations/JSON/TagRenderingConfig";
|
|
import Svg from "../../Svg";
|
|
import Ornament from "../Base/Ornament";
|
|
|
|
export default class FeatureInfoBox extends UIElement {
|
|
private _tags: UIEventSource<any>;
|
|
private _layerConfig: LayerConfig;
|
|
|
|
private _title: UIElement;
|
|
private _titleIcons: UIElement;
|
|
private _renderings: UIElement[];
|
|
private _questionBox: UIElement;
|
|
private _returnToTheMap: UIElement;
|
|
private _tail: UIElement;
|
|
|
|
constructor(
|
|
tags: UIEventSource<any>,
|
|
layerConfig: LayerConfig
|
|
) {
|
|
super();
|
|
if (layerConfig === undefined) {
|
|
throw "Undefined layerconfig"
|
|
}
|
|
this._tags = tags;
|
|
this._layerConfig = layerConfig;
|
|
|
|
this._returnToTheMap = Svg.back_svg().onClick(() => {
|
|
State.state.fullScreenMessage.setData(undefined);
|
|
State.state.selectedElement.setData(undefined);
|
|
}).SetClass("only-on-mobile")
|
|
.SetClass("featureinfobox-back-to-the-map")
|
|
|
|
this._title = new TagRenderingAnswer(tags, layerConfig.title ?? new TagRenderingConfig("POI"))
|
|
.SetClass("featureinfobox-title");
|
|
this._titleIcons = new Combine(
|
|
layerConfig.titleIcons.map(icon => new TagRenderingAnswer(tags, icon)))
|
|
.SetClass("featureinfobox-icons");
|
|
|
|
let questionBox: UIElement = undefined;
|
|
if (State.state.featureSwitchUserbadge.data) {
|
|
questionBox = new QuestionBox(tags, layerConfig.tagRenderings);
|
|
}
|
|
|
|
let questionBoxIsUsed = false;
|
|
this._renderings = layerConfig.tagRenderings.map(tr => {
|
|
if (tr.question === null) {
|
|
questionBoxIsUsed = true;
|
|
// This is the question box!
|
|
return questionBox;
|
|
}
|
|
return new EditableTagRendering(tags, tr);
|
|
});
|
|
this._renderings[0]?.SetClass("first-rendering");
|
|
if (!questionBoxIsUsed) {
|
|
this._renderings.push(questionBox);
|
|
}
|
|
this._tail = new Combine([new Ornament()]).SetClass("only-on-mobile");
|
|
}
|
|
|
|
InnerRender(): string {
|
|
return new Combine([
|
|
new Combine([
|
|
this._returnToTheMap, new Combine([this._title, this._titleIcons]).SetClass("featureinfobox-titlebar-title")
|
|
]).SetClass("featureinfobox-titlebar"),
|
|
new Combine([
|
|
...this._renderings,
|
|
this._questionBox,
|
|
this._tail.SetClass("featureinfobox-tail")
|
|
]
|
|
).SetClass("featureinfobox-content"),
|
|
]).SetClass("featureinfobox")
|
|
.Render();
|
|
}
|
|
|
|
|
|
}
|