mapcomplete/UI/FeatureInfoBox.ts

151 lines
4.7 KiB
TypeScript
Raw Normal View History

import {UIElement} from "./UIElement";
import {UIEventSource} from "./UIEventSource";
import {ImageCarousel} from "./Image/ImageCarousel";
2020-06-29 03:12:44 +02:00
import {VerticalCombine} from "./Base/VerticalCombine";
2020-07-05 18:59:47 +02:00
import {OsmLink} from "../Customizations/Questions/OsmLink";
import {WikipediaLink} from "../Customizations/Questions/WikipediaLink";
import {And} from "../Logic/TagsFilter";
2020-07-21 00:07:04 +02:00
import {TagDependantUIElement, TagDependantUIElementConstructor} from "../Customizations/UIElementConstructor";
import Translations from "./i18n/Translations";
2020-07-30 00:59:08 +02:00
import {Changes} from "../Logic/Osm/Changes";
import {UserDetails} from "../Logic/Osm/OsmConnection";
2020-07-30 09:59:30 +02:00
import {FixedUiElement} from "./Base/FixedUiElement";
import {State} from "../State";
2020-07-31 17:38:03 +02:00
import {TagRenderingOptions} from "../Customizations/TagRenderingOptions";
export class FeatureInfoBox extends UIElement {
/**
* The actual GEOJSON-object, with geometry and stuff
*/
private _feature: any;
/**
* The tags, wrapped in a global event source
*/
private _tagsES: UIEventSource<any>;
private _changes: Changes;
private _title: UIElement;
private _osmLink: UIElement;
private _wikipedialink: UIElement;
2020-07-12 23:19:05 +02:00
private _infoboxes: TagDependantUIElement[];
private _oneSkipped = Translations.t.general.oneSkippedQuestion.Clone();
private _someSkipped = Translations.t.general.skippedQuestions.Clone();
constructor(
feature: any,
tagsES: UIEventSource<any>,
2020-07-30 09:59:30 +02:00
title: TagRenderingOptions | UIElement | string,
2020-07-21 00:07:04 +02:00
elementsToShow: TagDependantUIElementConstructor[],
) {
super(tagsES);
this._feature = feature;
this._tagsES = tagsES;
this.ListenTo(State.state.osmConnection.userDetails);
const deps = {tags: this._tagsES, changes: this._changes}
2020-07-05 18:59:47 +02:00
this._infoboxes = [];
elementsToShow = elementsToShow ?? []
const self = this;
2020-07-05 18:59:47 +02:00
for (const tagRenderingOption of elementsToShow) {
self._infoboxes.push(
tagRenderingOption.construct(deps));
}
function initTags() {
self._infoboxes = []
for (const tagRenderingOption of elementsToShow) {
self._infoboxes.push(
tagRenderingOption.construct(deps));
}
self.Update();
}
this._someSkipped.onClick(initTags)
this._oneSkipped.onClick(initTags)
2020-07-05 18:59:47 +02:00
title = title ?? new TagRenderingOptions(
{
mappings: [{k: new And([]), txt: ""}]
}
)
2020-07-30 09:59:30 +02:00
if (typeof (title) == "string") {
this._title = new FixedUiElement(title);
} else if (title instanceof UIElement) {
this._title = title;
} else {
this._title = new TagRenderingOptions(title.options).construct(deps);
}
this._osmLink = new OsmLink().construct(deps);
this._wikipedialink = new WikipediaLink().construct(deps);
}
InnerRender(): string {
2020-07-05 18:59:47 +02:00
const info = [];
const questions: TagDependantUIElement[] = [];
let skippedQuestions = 0;
2020-07-05 18:59:47 +02:00
for (const infobox of this._infoboxes) {
if (infobox.IsKnown()) {
info.push(infobox);
} else if (infobox.IsQuestioning()) {
questions.push(infobox);
2020-07-25 01:07:02 +02:00
} else if(infobox.IsSkipped()){
// This question is neither known nor questioning -> it was skipped
skippedQuestions++;
2020-07-05 18:59:47 +02:00
}
}
let questionsHtml = "";
if (State.state.osmConnection.userDetails.data.loggedIn && questions.length > 0) {
2020-07-05 18:59:47 +02:00
// We select the most important question and render that one
let mostImportantQuestion;
let score = -1000;
for (const question of questions) {
2020-07-12 23:19:05 +02:00
if (mostImportantQuestion === undefined || question.Priority() > score) {
2020-07-05 18:59:47 +02:00
mostImportantQuestion = question;
2020-07-12 23:19:05 +02:00
score = question.Priority();
2020-07-05 18:59:47 +02:00
}
}
questionsHtml = mostImportantQuestion.Render();
} else if (skippedQuestions == 1) {
questionsHtml = this._oneSkipped.Render();
} else if (skippedQuestions > 0) {
questionsHtml = this._someSkipped.Render();
}
return "<div class='featureinfobox'>" +
"<div class='featureinfoboxtitle'>" +
2020-07-05 18:59:47 +02:00
"<span>" +
this._title.Render() +
"</span>" +
this._wikipedialink.Render() +
this._osmLink.Render() +
"</div>" +
"<div class='infoboxcontents'>" +
2020-07-05 18:59:47 +02:00
new VerticalCombine(info, "infobox-information ").Render() +
2020-07-05 18:59:47 +02:00
questionsHtml +
"</div>" +
"" +
"</div>";
}
2020-07-20 09:57:19 +02:00
2020-07-20 15:54:50 +02:00
}