From 5d5cf6782068759e95cc618ec1564dd04fe59230 Mon Sep 17 00:00:00 2001 From: Pieter Vander Vennet Date: Thu, 30 Jul 2020 00:59:08 +0200 Subject: [PATCH] Restructuring --- Customizations/Layout.ts | 12 ++- Helpers.ts | 3 +- InitUiElements.ts | 95 +++++++++++++++++-- Logic/Bounds.ts | 6 ++ Logic/LayerUpdater.ts | 37 ++++---- Logic/{ => Leaflet}/Basemap.ts | 4 +- Logic/{ => Leaflet}/GeoLocationHandler.ts | 6 +- Logic/{ => Leaflet}/StrayClickHandler.ts | 4 +- Logic/{ => Osm}/Changes.ts | 13 +-- Logic/{ => Osm}/Geocoding.ts | 6 +- Logic/Osm/Notes.ts | 9 ++ Logic/{ => Osm}/OsmConnection.ts | 3 +- Logic/{ => Osm}/OsmImageUploadHandler.ts | 6 +- Logic/{ => Osm}/OsmObject.ts | 0 Logic/{ => Osm}/Overpass.ts | 20 ++-- Logic/TagsFilter.ts | 10 +- UI/FeatureInfoBox.ts | 7 +- UI/Image/ImageCarousel.ts | 4 +- UI/Image/ImageCarouselWithUpload.ts | 5 +- UI/PendingChanges.ts | 2 +- UI/QuestionPicker.ts | 47 ---------- UI/SearchAndGo.ts | 16 ++-- UI/SimpleAddUI.ts | 11 ++- UI/UserBadge.ts | 4 +- UI/i18n/Translations.ts | 4 +- index.ts | 109 ++++++---------------- test.ts | 24 ----- 27 files changed, 220 insertions(+), 247 deletions(-) create mode 100644 Logic/Bounds.ts rename Logic/{ => Leaflet}/Basemap.ts (97%) rename Logic/{ => Leaflet}/GeoLocationHandler.ts (96%) rename Logic/{ => Leaflet}/StrayClickHandler.ts (95%) rename Logic/{ => Osm}/Changes.ts (96%) rename Logic/{ => Osm}/Geocoding.ts (86%) create mode 100644 Logic/Osm/Notes.ts rename Logic/{ => Osm}/OsmConnection.ts (99%) rename Logic/{ => Osm}/OsmImageUploadHandler.ts (94%) rename Logic/{ => Osm}/OsmObject.ts (100%) rename Logic/{ => Osm}/Overpass.ts (77%) delete mode 100644 UI/QuestionPicker.ts diff --git a/Customizations/Layout.ts b/Customizations/Layout.ts index e4a6f75..a5c1c96 100644 --- a/Customizations/Layout.ts +++ b/Customizations/Layout.ts @@ -96,12 +96,12 @@ export class WelcomeMessage extends UIElement { constructor(layout: Layout, languagePicker: UIElement, osmConnection: OsmConnection) { - super(osmConnection.userDetails); + super(osmConnection?.userDetails); this.languagePicker = languagePicker; this.ListenTo(Locale.language); this.osmConnection = osmConnection; this.layout = layout; - this.userDetails = osmConnection.userDetails; + this.userDetails = osmConnection?.userDetails; this.description = layout.welcomeMessage; this.plzLogIn = layout.gettingStartedPlzLogin; @@ -110,9 +110,15 @@ export class WelcomeMessage extends UIElement { } InnerRender(): string { + + let loginStatus = ""; + if (this.userDetails !== undefined) { + loginStatus = (this.userDetails.data.loggedIn ? this.welcomeBack : this.plzLogIn).Render(); + } + return "" + this.description.Render() + - (this.userDetails.data.loggedIn ? this.welcomeBack : this.plzLogIn).Render() + + loginStatus + this.tail.Render() + "
" + this.languagePicker.Render() + diff --git a/Helpers.ts b/Helpers.ts index 22e7d38..75336dd 100644 --- a/Helpers.ts +++ b/Helpers.ts @@ -1,6 +1,5 @@ -import {OsmConnection} from "./Logic/OsmConnection"; -import {Changes} from "./Logic/Changes"; import {UIEventSource} from "./UI/UIEventSource"; +import {Changes} from "./Logic/Osm/Changes"; export class Helpers { diff --git a/InitUiElements.ts b/InitUiElements.ts index e2b5437..9eb596f 100644 --- a/InitUiElements.ts +++ b/InitUiElements.ts @@ -6,25 +6,30 @@ import {ShareScreen} from "./UI/ShareScreen"; import {FixedUiElement} from "./UI/Base/FixedUiElement"; import {CheckBox} from "./UI/Input/CheckBox"; import Combine from "./UI/Base/Combine"; -import {OsmConnection} from "./Logic/OsmConnection"; -import {Basemap} from "./Logic/Basemap"; import {UIEventSource} from "./UI/UIEventSource"; import {UIElement} from "./UI/UIElement"; import {MoreScreen} from "./UI/MoreScreen"; +import {Tag} from "./Logic/TagsFilter"; +import {FilteredLayer} from "./Logic/FilteredLayer"; +import {FeatureInfoBox} from "./UI/FeatureInfoBox"; +import {ElementStorage} from "./Logic/ElementStorage"; +import {Preset} from "./UI/SimpleAddUI"; +import {Changes} from "./Logic/Osm/Changes"; +import {OsmConnection} from "./Logic/Osm/OsmConnection"; +import {Basemap} from "./Logic/Leaflet/Basemap"; export class InitUiElements { - static OnlyIf(featureSwitch: UIEventSource, callback: () => void) { + static OnlyIf(featureSwitch: UIEventSource, callback: () => void) { featureSwitch.addCallback(() => { - if (featureSwitch.data === "false") { - return; + if (featureSwitch.data) { + callback(); } - callback(); }); - if (featureSwitch.data !== "false") { + if (featureSwitch.data) { callback(); } @@ -33,7 +38,9 @@ export class InitUiElements { private static CreateWelcomePane(layoutToUse: Layout, osmConnection: OsmConnection, bm: Basemap) { - const welcome = new WelcomeMessage(layoutToUse, Locale.CreateLanguagePicker(layoutToUse, Translations.t.general.pickLanguage), osmConnection) + const welcome = new WelcomeMessage(layoutToUse, + Locale.CreateLanguagePicker(layoutToUse, Translations.t.general.pickLanguage), + osmConnection) const fullOptions = new TabbedComponent([ {header: ``, content: welcome}, @@ -77,8 +84,78 @@ export class InitUiElements { new FixedUiElement(`
help
`).onClick(() => { fullScreenMessage.setData(fullOptions2) }).AttachTo("help-button-mobile"); - + } + + static InitLayers(layoutToUse: Layout, osmConnection: OsmConnection, + changes: Changes, + allElements: ElementStorage, + bm: Basemap, + fullScreenMessage: UIEventSource, + selectedElement: UIEventSource): { + minZoom: number + flayers: FilteredLayer[], + presets: Preset[] + } { + const addButtons:Preset[] + = []; + + const flayers: FilteredLayer[] = [] + + let minZoom = 0; + + for (const layer of layoutToUse.layers) { + + const generateInfo = (tagsES, feature) => { + + return new FeatureInfoBox( + feature, + tagsES, + layer.title, + layer.elementsToShow, + changes, + osmConnection.userDetails + ) + }; + + minZoom = Math.max(minZoom, layer.minzoom); + + const flayer = FilteredLayer.fromDefinition(layer, bm, allElements, changes, osmConnection.userDetails, selectedElement, generateInfo); + + for (const preset of layer.presets ?? []) { + + if (preset.icon === undefined) { + const tags = {}; + for (const tag of preset.tags) { + const k = tag.key; + if (typeof (k) === "string") { + tags[k] = tag.value; + } + } + preset.icon = layer.style(tags)?.icon?.iconUrl; + } + + const addButton = { + name: preset.title, + description: preset.description, + icon: preset.icon, + tags: preset.tags, + layerToAddTo: flayer + } + addButtons.push(addButton); + } + flayers.push(flayer); + } + + + + return { + minZoom: minZoom, + flayers: flayers, + presets: addButtons + } + } + } \ No newline at end of file diff --git a/Logic/Bounds.ts b/Logic/Bounds.ts new file mode 100644 index 0000000..e11e7d0 --- /dev/null +++ b/Logic/Bounds.ts @@ -0,0 +1,6 @@ +export interface Bounds { + north: number, + east: number, + south: number, + west: number +} \ No newline at end of file diff --git a/Logic/LayerUpdater.ts b/Logic/LayerUpdater.ts index 5739a27..2f7eb02 100644 --- a/Logic/LayerUpdater.ts +++ b/Logic/LayerUpdater.ts @@ -1,9 +1,9 @@ -import {Basemap} from "./Basemap"; -import {Overpass} from "./Overpass"; import {Or, TagsFilter} from "./TagsFilter"; import {UIEventSource} from "../UI/UIEventSource"; import {FilteredLayer} from "./FilteredLayer"; - +import {Bounds} from "./Bounds"; +import {Overpass} from "./Osm/Overpass"; +import {Basemap} from "./Leaflet/Basemap"; export class LayerUpdater { private _map: Basemap; @@ -14,7 +14,7 @@ export class LayerUpdater { /** * The previous bounds for which the query has been run */ - private previousBounds: { north: number, east: number, south: number, west: number }; + private previousBounds: Bounds; private _overpass: Overpass; private _minzoom: number; @@ -93,10 +93,21 @@ export class LayerUpdater { if (this.runningQuery.data) { console.log("Still running a query, skip"); } - var bbox = this.buildBboxFor(); + + const bounds = this._map.map.getBounds(); + + const diff =0.07; + + const n = bounds.getNorth() + diff; + const e = bounds.getEast() + diff; + const s = bounds.getSouth() - diff; + const w = bounds.getWest() - diff; + + this.previousBounds = {north: n, east: e, south: s, west: w}; + this.runningQuery.setData(true); const self = this; - this._overpass.queryGeoJson(bbox, + this._overpass.queryGeoJson(this.previousBounds, function (data) { self.handleData(data) }, @@ -107,19 +118,7 @@ export class LayerUpdater { } - private buildBboxFor(): string { - const b = this._map.map.getBounds(); - const diff =0.07; - - const n = b.getNorth() + diff; - const e = b.getEast() + diff; - const s = b.getSouth() - diff; - const w = b.getWest() - diff; - - this.previousBounds = {north: n, east: e, south: s, west: w}; - - return "[bbox:" + s + "," + w + "," + n + "," + e + "]"; - } + private IsInBounds(): boolean { diff --git a/Logic/Basemap.ts b/Logic/Leaflet/Basemap.ts similarity index 97% rename from Logic/Basemap.ts rename to Logic/Leaflet/Basemap.ts index 2c3edea..b109da8 100644 --- a/Logic/Basemap.ts +++ b/Logic/Leaflet/Basemap.ts @@ -1,6 +1,6 @@ import L from "leaflet" -import {UIEventSource} from "../UI/UIEventSource"; -import {UIElement} from "../UI/UIElement"; +import {UIEventSource} from "../../UI/UIEventSource"; +import {UIElement} from "../../UI/UIElement"; export class BaseLayers { diff --git a/Logic/GeoLocationHandler.ts b/Logic/Leaflet/GeoLocationHandler.ts similarity index 96% rename from Logic/GeoLocationHandler.ts rename to Logic/Leaflet/GeoLocationHandler.ts index 930e0ad..06b483b 100644 --- a/Logic/GeoLocationHandler.ts +++ b/Logic/Leaflet/GeoLocationHandler.ts @@ -1,8 +1,8 @@ import {Basemap} from "./Basemap"; -import {UIEventSource} from "../UI/UIEventSource"; -import {UIElement} from "../UI/UIElement"; import L from "leaflet"; -import {Helpers} from "../Helpers"; +import {UIEventSource} from "../../UI/UIEventSource"; +import {UIElement} from "../../UI/UIElement"; +import {Helpers} from "../../Helpers"; export class GeoLocationHandler extends UIElement { diff --git a/Logic/StrayClickHandler.ts b/Logic/Leaflet/StrayClickHandler.ts similarity index 95% rename from Logic/StrayClickHandler.ts rename to Logic/Leaflet/StrayClickHandler.ts index b7fe283..2ba9719 100644 --- a/Logic/StrayClickHandler.ts +++ b/Logic/Leaflet/StrayClickHandler.ts @@ -1,7 +1,7 @@ import {Basemap} from "./Basemap"; import L from "leaflet"; -import {UIEventSource} from "../UI/UIEventSource"; -import {UIElement} from "../UI/UIElement"; +import {UIEventSource} from "../../UI/UIEventSource"; +import {UIElement} from "../../UI/UIElement"; /** * The stray-click-hanlders adds a marker to the map if no feature was clicked. diff --git a/Logic/Changes.ts b/Logic/Osm/Changes.ts similarity index 96% rename from Logic/Changes.ts rename to Logic/Osm/Changes.ts index 488ea50..0ae51c3 100644 --- a/Logic/Changes.ts +++ b/Logic/Osm/Changes.ts @@ -2,11 +2,11 @@ * Handles all changes made to OSM. * Needs an authenticator via OsmConnection */ +import {UIEventSource} from "../../UI/UIEventSource"; import {OsmConnection} from "./OsmConnection"; import {OsmNode, OsmObject} from "./OsmObject"; -import {ElementStorage} from "./ElementStorage"; -import {UIEventSource} from "../UI/UIEventSource"; -import {And, Tag, TagsFilter} from "./TagsFilter"; +import {And, Tag, TagsFilter} from "../TagsFilter"; +import {ElementStorage} from "../ElementStorage"; export class Changes { @@ -261,11 +261,4 @@ console.log("Received change",key, value) }); } - public asQuestions(qs : QuestionDefinition[]){ - let ls = []; - for (var i in qs){ - ls.push(new Question(this, qs[i])); - } - return ls; - } } \ No newline at end of file diff --git a/Logic/Geocoding.ts b/Logic/Osm/Geocoding.ts similarity index 86% rename from Logic/Geocoding.ts rename to Logic/Osm/Geocoding.ts index 275ade1..ea11389 100644 --- a/Logic/Geocoding.ts +++ b/Logic/Osm/Geocoding.ts @@ -1,7 +1,5 @@ -import * as $ from "jquery" -import {UIEventSource} from "../UI/UIEventSource"; -import {Basemap} from "./Basemap"; - +import {Basemap} from "../Leaflet/Basemap"; +import $ from "jquery" export class Geocoding { private static readonly host = "https://nominatim.openstreetmap.org/search?"; diff --git a/Logic/Osm/Notes.ts b/Logic/Osm/Notes.ts new file mode 100644 index 0000000..a3a3e0c --- /dev/null +++ b/Logic/Osm/Notes.ts @@ -0,0 +1,9 @@ +import {Bounds} from "../Bounds"; + +export class Notes { + + + queryGeoJson(bounds: Bounds, continuation: ((any) => void), onFail: ((reason) => void)): void { + + } +} \ No newline at end of file diff --git a/Logic/OsmConnection.ts b/Logic/Osm/OsmConnection.ts similarity index 99% rename from Logic/OsmConnection.ts rename to Logic/Osm/OsmConnection.ts index 62a7a4e..f6f4035 100644 --- a/Logic/OsmConnection.ts +++ b/Logic/Osm/OsmConnection.ts @@ -1,6 +1,6 @@ // @ts-ignore import osmAuth from "osm-auth"; -import {UIEventSource} from "../UI/UIEventSource"; +import {UIEventSource} from "../../UI/UIEventSource"; export class UserDetails { @@ -26,7 +26,6 @@ export class OsmConnection { this.auth = new osmAuth({ oauth_consumer_key: 'hivV7ec2o49Two8g9h8Is1VIiVOgxQ1iYexCbvem', oauth_secret: 'wDBRTCem0vxD7txrg1y6p5r8nvmz8tAhET7zDASI', - oauth_token: oauth_token.data, singlepage: true, landing: window.location.href, auto: true // show a login form if the user is not authenticated and diff --git a/Logic/OsmImageUploadHandler.ts b/Logic/Osm/OsmImageUploadHandler.ts similarity index 94% rename from Logic/OsmImageUploadHandler.ts rename to Logic/Osm/OsmImageUploadHandler.ts index cd242c7..35940f5 100644 --- a/Logic/OsmImageUploadHandler.ts +++ b/Logic/Osm/OsmImageUploadHandler.ts @@ -1,11 +1,11 @@ /** * Helps in uplaoding, by generating the rigth title, decription and by adding the tag to the changeset */ -import {UIEventSource} from "../UI/UIEventSource"; -import {ImageUploadFlow} from "../UI/ImageUploadFlow"; import {Changes} from "./Changes"; +import {UIEventSource} from "../../UI/UIEventSource"; +import {ImageUploadFlow} from "../../UI/ImageUploadFlow"; import {UserDetails} from "./OsmConnection"; -import {SlideShow} from "../UI/SlideShow"; +import {SlideShow} from "../../UI/SlideShow"; export class OsmImageUploadHandler { private _tags: UIEventSource; diff --git a/Logic/OsmObject.ts b/Logic/Osm/OsmObject.ts similarity index 100% rename from Logic/OsmObject.ts rename to Logic/Osm/OsmObject.ts diff --git a/Logic/Overpass.ts b/Logic/Osm/Overpass.ts similarity index 77% rename from Logic/Overpass.ts rename to Logic/Osm/Overpass.ts index 792ba8c..f6974ce 100644 --- a/Logic/Overpass.ts +++ b/Logic/Osm/Overpass.ts @@ -1,11 +1,11 @@ -import {TagsFilter} from "./TagsFilter"; -import * as OsmToGeoJson from "osmtogeojson"; -import * as $ from "jquery"; - - /** * Interfaces overpass to get all the latest data */ +import {Bounds} from "../Bounds"; +import {TagsFilter} from "../TagsFilter"; +import $ from "jquery" +import * as OsmToGeoJson from "osmtogeojson"; + export class Overpass { private _filter: TagsFilter public static testUrl: string = null @@ -14,7 +14,8 @@ export class Overpass { this._filter = filter } - public buildQuery(bbox: string): string { + + private buildQuery(bbox: string): string { const filters = this._filter.asOverpass() let filter = "" for (const filterOr of filters) { @@ -24,9 +25,10 @@ export class Overpass { '[out:json][timeout:25]' + bbox + ';(' + filter + ');out body;>;out skel qt;' return "https://overpass-api.de/api/interpreter?data=" + encodeURIComponent(query) } - - queryGeoJson(bbox: string, continuation: ((any) => void), onFail: ((reason) => void)): void { - let query = this.buildQuery(bbox) + + queryGeoJson(bounds: Bounds, continuation: ((any) => void), onFail: ((reason) => void)): void { + + let query = this.buildQuery( "[bbox:" + bounds.south + "," + bounds.west + "," + bounds.north + "," + bounds.east + "]") if(Overpass.testUrl !== null){ console.log("Using testing URL") diff --git a/Logic/TagsFilter.ts b/Logic/TagsFilter.ts index 8a9edd2..a94de50 100644 --- a/Logic/TagsFilter.ts +++ b/Logic/TagsFilter.ts @@ -55,8 +55,8 @@ export class Regex extends TagsFilter { export class Tag extends TagsFilter { - public key: string | RegExp - public value: string | RegExp + public key: string + public value: string public invertValue: boolean constructor(key: string | RegExp, value: string | RegExp, invertValue = false) { @@ -69,7 +69,9 @@ export class Tag extends TagsFilter { } super() + // @ts-ignore this.key = key + // @ts-ignore this.value = value this.invertValue = invertValue } @@ -107,10 +109,14 @@ export class Tag extends TagsFilter { } asOverpass(): string[] { + // @ts-ignore const keyIsRegex = this.key instanceof RegExp + // @ts-ignore const key = keyIsRegex ? (this.key as RegExp).source : this.key + // @ts-ignore const valIsRegex = this.value instanceof RegExp + // @ts-ignore const val = valIsRegex ? (this.value as RegExp).source : this.value const regexKeyPrefix = keyIsRegex ? '~' : '' diff --git a/UI/FeatureInfoBox.ts b/UI/FeatureInfoBox.ts index 3fb0f4d..34913a4 100644 --- a/UI/FeatureInfoBox.ts +++ b/UI/FeatureInfoBox.ts @@ -1,10 +1,6 @@ import {UIElement} from "./UIElement"; import {UIEventSource} from "./UIEventSource"; -import {QuestionPicker} from "./QuestionPicker"; -import {OsmImageUploadHandler} from "../Logic/OsmImageUploadHandler"; import {ImageCarousel} from "./Image/ImageCarousel"; -import {Changes} from "../Logic/Changes"; -import {UserDetails} from "../Logic/OsmConnection"; import {VerticalCombine} from "./Base/VerticalCombine"; import {TagRenderingOptions} from "../Customizations/TagRendering"; import {OsmLink} from "../Customizations/Questions/OsmLink"; @@ -12,6 +8,8 @@ import {WikipediaLink} from "../Customizations/Questions/WikipediaLink"; import {And} from "../Logic/TagsFilter"; import {TagDependantUIElement, TagDependantUIElementConstructor} from "../Customizations/UIElementConstructor"; import Translations from "./i18n/Translations"; +import {Changes} from "../Logic/Osm/Changes"; +import {UserDetails} from "../Logic/Osm/OsmConnection"; export class FeatureInfoBox extends UIElement { @@ -33,7 +31,6 @@ export class FeatureInfoBox extends UIElement { private _infoboxes: TagDependantUIElement[]; - private _questions: QuestionPicker; private _oneSkipped = Translations.t.general.oneSkippedQuestion.Clone(); private _someSkipped = Translations.t.general.skippedQuestions.Clone(); diff --git a/UI/Image/ImageCarousel.ts b/UI/Image/ImageCarousel.ts index 86c7ccf..e69fa3a 100644 --- a/UI/Image/ImageCarousel.ts +++ b/UI/Image/ImageCarousel.ts @@ -4,11 +4,11 @@ import {UIEventSource} from "../UIEventSource"; import {SlideShow} from "../SlideShow"; import {FixedUiElement} from "../Base/FixedUiElement"; import {VerticalCombine} from "../Base/VerticalCombine"; -import {Changes} from "../../Logic/Changes"; import {VariableUiElement} from "../Base/VariableUIElement"; import {ConfirmDialog} from "../ConfirmDialog"; -import {UserDetails} from "../../Logic/OsmConnection"; import {TagDependantUIElement, TagDependantUIElementConstructor} from "../../Customizations/UIElementConstructor"; +import {Changes} from "../../Logic/Osm/Changes"; +import {UserDetails} from "../../Logic/Osm/OsmConnection"; export class ImageCarouselConstructor implements TagDependantUIElementConstructor{ IsKnown(properties: any): boolean { diff --git a/UI/Image/ImageCarouselWithUpload.ts b/UI/Image/ImageCarouselWithUpload.ts index a4a8f1a..dcf2a7f 100644 --- a/UI/Image/ImageCarouselWithUpload.ts +++ b/UI/Image/ImageCarouselWithUpload.ts @@ -1,10 +1,9 @@ import {TagDependantUIElement, TagDependantUIElementConstructor} from "../../Customizations/UIElementConstructor"; import {ImageCarousel} from "./ImageCarousel"; -import {OsmImageUploadHandler} from "../../Logic/OsmImageUploadHandler"; import {UIEventSource} from "../UIEventSource"; -import {Changes} from "../../Logic/Changes"; -import {UserDetails} from "../../Logic/OsmConnection"; import {ImageUploadFlow} from "../ImageUploadFlow"; +import {Changes} from "../../Logic/Osm/Changes"; +import {OsmImageUploadHandler} from "../../Logic/Osm/OsmImageUploadHandler"; export class ImageCarouselWithUploadConstructor implements TagDependantUIElementConstructor{ IsKnown(properties: any): boolean { diff --git a/UI/PendingChanges.ts b/UI/PendingChanges.ts index cda6214..384f7c7 100644 --- a/UI/PendingChanges.ts +++ b/UI/PendingChanges.ts @@ -1,6 +1,6 @@ import {UIElement} from "./UIElement"; import {UIEventSource} from "./UIEventSource"; -import {Changes} from "../Logic/Changes"; +import {Changes} from "../Logic/Osm/Changes"; export class PendingChanges extends UIElement { private _pendingChangesCount: UIEventSource; diff --git a/UI/QuestionPicker.ts b/UI/QuestionPicker.ts deleted file mode 100644 index 82baac4..0000000 --- a/UI/QuestionPicker.ts +++ /dev/null @@ -1,47 +0,0 @@ -import {UIElement} from "./UIElement"; -import {Question} from "../Logic/Question"; -import {UIEventSource} from "./UIEventSource"; - -export class QuestionPicker extends UIElement { - private readonly _questions: Question[]; - private readonly tags: any; - private source: UIEventSource; - - constructor(questions: Question[], - tags: UIEventSource) { - super(tags); - this._questions = questions; - this.tags = tags.data; - this.source = tags; - } - - - protected InnerRender(): string { - - let t = this.tags; - let highestPriority = Number.MIN_VALUE; - let highestQ: Question; - for (const q of this._questions) { - - if (!q.Applicable(t)) { - continue; - } - - const priority = q.question.severity; - if (priority > highestPriority) { - highestPriority = priority; - highestQ = q; - } - } - - - if (highestQ === undefined) { - return "Er zijn geen vragen meer!"; - } - - return "
" + - highestQ.CreateHtml(this.source).Render() + - "
"; - } - -} \ No newline at end of file diff --git a/UI/SearchAndGo.ts b/UI/SearchAndGo.ts index 8e51f93..0e0a574 100644 --- a/UI/SearchAndGo.ts +++ b/UI/SearchAndGo.ts @@ -1,13 +1,13 @@ -import {UIElement} from "./UIElement"; -import {TextField} from "./Input/TextField"; -import {UIEventSource} from "./UIEventSource"; -import {FixedUiElement} from "./Base/FixedUiElement"; -import {Geocoding} from "../Logic/Geocoding"; -import {Basemap} from "../Logic/Basemap"; -import {VariableUiElement} from "./Base/VariableUIElement"; -import Translation from "./i18n/Translation"; import Locale from "./i18n/Locale"; +import {UIEventSource} from "./UIEventSource"; +import {UIElement} from "./UIElement"; +import Translation from "./i18n/Translation"; +import {VariableUiElement} from "./Base/VariableUIElement"; +import {FixedUiElement} from "./Base/FixedUiElement"; +import {TextField} from "./Input/TextField"; +import {Geocoding} from "../Logic/Osm/Geocoding"; import Translations from "./i18n/Translations"; +import {Basemap} from "../Logic/Leaflet/Basemap"; export class SearchAndGo extends UIElement { diff --git a/UI/SimpleAddUI.ts b/UI/SimpleAddUI.ts index 4a45e14..ecb24af 100644 --- a/UI/SimpleAddUI.ts +++ b/UI/SimpleAddUI.ts @@ -2,17 +2,17 @@ import {UIElement} from "./UIElement"; import {UIEventSource} from "./UIEventSource"; import {Tag} from "../Logic/TagsFilter"; import {FilteredLayer} from "../Logic/FilteredLayer"; -import {Changes} from "../Logic/Changes"; import {FixedUiElement} from "./Base/FixedUiElement"; import {Button} from "./Base/Button"; -import {UserDetails} from "../Logic/OsmConnection"; import Translations from "./i18n/Translations"; import Combine from "./Base/Combine"; import {SubtleButton} from "./Base/SubtleButton"; import {VerticalCombine} from "./Base/VerticalCombine"; import Locale from "./i18n/Locale"; +import {Changes} from "../Logic/Osm/Changes"; +import {UserDetails} from "../Logic/Osm/OsmConnection"; -interface Preset { +export interface Preset { description: string | UIElement, name: string | UIElement, icon: string, @@ -133,6 +133,11 @@ export class SimpleAddUI extends UIElement { let header: UIElement = Translations.t.general.add.header; + + if(this._userDetails === undefined){ + return header.Render(); + } + if (!this._userDetails.data.loggedIn) { return new Combine([header, Translations.t.general.add.pleaseLogin]).Render() } diff --git a/UI/UserBadge.ts b/UI/UserBadge.ts index 508bdb2..3438f5b 100644 --- a/UI/UserBadge.ts +++ b/UI/UserBadge.ts @@ -1,11 +1,11 @@ import {UIElement} from "./UIElement"; -import {UserDetails} from "../Logic/OsmConnection"; import {UIEventSource} from "./UIEventSource"; -import {Basemap} from "../Logic/Basemap"; import L from "leaflet"; import {FixedUiElement} from "./Base/FixedUiElement"; import {VariableUiElement} from "./Base/VariableUIElement"; import Translations from "./i18n/Translations"; +import {UserDetails} from "../Logic/Osm/OsmConnection"; +import {Basemap} from "../Logic/Leaflet/Basemap"; /** * Handles and updates the user badge diff --git a/UI/i18n/Translations.ts b/UI/i18n/Translations.ts index 81959e8..696659d 100644 --- a/UI/i18n/Translations.ts +++ b/UI/i18n/Translations.ts @@ -136,12 +136,12 @@ export default class Translations { }), yes: new T({ en: "This parking has room for cargo bikes", - nl: "Deze parking is overdekt (er is een afdak)", + nl: "Deze parking heeft plaats voor bakfietsen", fr: "TODO: fr" }), designated: new T({ en: "This parking has designated (official) spots for cargo bikes.", - nl: "Deze parking is overdekt (er is een afdak)", + nl: "Er zijn speciale plaatsen voorzien voor bakfietsen", fr: "TODO: fr" }), no: new T({ diff --git a/index.ts b/index.ts index 8b97429..b280a7d 100644 --- a/index.ts +++ b/index.ts @@ -1,20 +1,14 @@ -import {OsmConnection} from "./Logic/OsmConnection"; -import {Changes} from "./Logic/Changes"; import {ElementStorage} from "./Logic/ElementStorage"; import {UIEventSource} from "./UI/UIEventSource"; import {UserBadge} from "./UI/UserBadge"; -import {Basemap, BaseLayers} from "./Logic/Basemap"; import {PendingChanges} from "./UI/PendingChanges"; import {CenterMessageBox} from "./UI/CenterMessageBox"; import {Helpers} from "./Helpers"; -import {Tag, TagUtils} from "./Logic/TagsFilter"; -import {FilteredLayer} from "./Logic/FilteredLayer"; +import {TagUtils} from "./Logic/TagsFilter"; import {LayerUpdater} from "./Logic/LayerUpdater"; import {UIElement} from "./UI/UIElement"; import {FullScreenMessageBoxHandler} from "./UI/FullScreenMessageBoxHandler"; import {FeatureInfoBox} from "./UI/FeatureInfoBox"; -import {GeoLocationHandler} from "./Logic/GeoLocationHandler"; -import {StrayClickHandler} from "./Logic/StrayClickHandler"; import {SimpleAddUI} from "./UI/SimpleAddUI"; import {VariableUiElement} from "./UI/Base/VariableUIElement"; import {SearchAndGo} from "./UI/SearchAndGo"; @@ -22,7 +16,7 @@ import {AllKnownLayouts} from "./Customizations/AllKnownLayouts"; import {CheckBox} from "./UI/Input/CheckBox"; import Translations from "./UI/i18n/Translations"; import Locale from "./UI/i18n/Locale"; -import {Layout, WelcomeMessage} from "./Customizations/Layout"; +import {Layout} from "./Customizations/Layout"; import {DropDown} from "./UI/Input/DropDown"; import {FixedUiElement} from "./UI/Base/FixedUiElement"; import {LayerSelection} from "./UI/LayerSelection"; @@ -31,10 +25,12 @@ import {Img} from "./UI/Img"; import {QueryParameters} from "./Logic/QueryParameters"; import {Utils} from "./Utils"; import {LocalStorageSource} from "./Logic/LocalStorageSource"; -import {Button} from "./UI/Base/Button"; -import {TabbedComponent} from "./UI/Base/TabbedComponent"; -import {ShareScreen} from "./UI/ShareScreen"; import {InitUiElements} from "./InitUiElements"; +import {StrayClickHandler} from "./Logic/Leaflet/StrayClickHandler"; +import {BaseLayers, Basemap} from "./Logic/Leaflet/Basemap"; +import {GeoLocationHandler} from "./Logic/Leaflet/GeoLocationHandler"; +import {OsmConnection} from "./Logic/Osm/OsmConnection"; +import {Changes} from "./Logic/Osm/Changes"; // --------------------- Special actions based on the parameters ----------------- @@ -112,12 +108,18 @@ const lat = QueryParameters.GetQueryParameter("lat", undefined) const lon = QueryParameters.GetQueryParameter("lon", undefined) .syncWith(LocalStorageSource.Get("lon")); -const featureSwitchUserbadge = QueryParameters.GetQueryParameter("fs-userbadge", ""+layoutToUse.enableUserBadge); -const featureSwitchSearch = QueryParameters.GetQueryParameter("fs-search", ""+layoutToUse.enableSearch); -const featureSwitchWelcomeMessage = QueryParameters.GetQueryParameter("fs-welcome-message", "true"); -const featureSwitchLayers = QueryParameters.GetQueryParameter("fs-layers", ""+layoutToUse.enableLayers); -const featureSwitchAddNew = QueryParameters.GetQueryParameter("fs-add-new", ""+layoutToUse.enableAdd); -const featureSwitchIframe = QueryParameters.GetQueryParameter("fs-iframe", "false"); +function featSw(key: string, deflt: boolean): UIEventSource { + return QueryParameters.GetQueryParameter("fs-userbadge", "" + deflt).map((str) => { + return str !== "false"; + }); +} + +const featureSwitchUserbadge = featSw("fs-userbadge", layoutToUse.enableUserBadge); +const featureSwitchSearch = featSw("fs-search", layoutToUse.enableSearch); +const featureSwitchLayers = featSw("fs-layers", layoutToUse.enableLayers); +const featureSwitchAddNew = featSw("fs-add-new", layoutToUse.enableAdd); +const featureSwitchWelcomeMessage = featSw("fs-welcome-message", true); +const featureSwitchIframe = featSw("fs-iframe", false); const locationControl = new UIEventSource<{ lat: number, lon: number, zoom: number }>({ @@ -148,8 +150,8 @@ window.setLanguage = function (language: string) { } Locale.language.addCallback((currentLanguage) => { - console.log("REsetting languate to", layoutToUse.supportedLanguages[0]) if (layoutToUse.supportedLanguages.indexOf(currentLanguage) < 0) { + console.log("Resetting languate to", layoutToUse.supportedLanguages[0], "as", currentLanguage, " is unsupported") // The current language is not supported -> switch to a supported one Locale.language.setData(layoutToUse.supportedLanguages[0]); } @@ -181,63 +183,10 @@ const bm = new Basemap("leafletDiv", locationControl, new VariableUiElement( // ------------- Setup the layers ------------------------------- -const addButtons: { - name: string | UIElement, - description: string | UIElement, - icon: string, - tags: Tag[], - layerToAddTo: FilteredLayer -}[] - = []; -const flayers: FilteredLayer[] = [] +const layerSetup = InitUiElements.InitLayers(layoutToUse, osmConnection, changes, allElements, bm, fullScreenMessage, selectedElement); -let minZoom = 0; - -for (const layer of layoutToUse.layers) { - - const generateInfo = (tagsES, feature) => { - - return new FeatureInfoBox( - feature, - tagsES, - layer.title, - layer.elementsToShow, - changes, - osmConnection.userDetails - ) - }; - - minZoom = Math.max(minZoom, layer.minzoom); - - const flayer = FilteredLayer.fromDefinition(layer, bm, allElements, changes, osmConnection.userDetails, selectedElement, generateInfo); - - for (const preset of layer.presets ?? []) { - - if (preset.icon === undefined) { - const tags = {}; - for (const tag of preset.tags) { - const k = tag.key; - if (typeof (k) === "string") { - tags[k] = tag.value; - } - } - preset.icon = layer.style(tags)?.icon?.iconUrl; - } - - const addButton = { - name: preset.title, - description: preset.description, - icon: preset.icon, - tags: preset.tags, - layerToAddTo: flayer - } - addButtons.push(addButton); - } - flayers.push(flayer); -} - -const layerUpdater = new LayerUpdater(bm, minZoom, flayers); +const layerUpdater = new LayerUpdater(bm, layerSetup.minZoom, layerSetup.flayers); // --------------- Setting up layer selection ui -------- @@ -249,9 +198,9 @@ const openFilterButton = ` let baseLayerOptions = BaseLayers.baseLayers.map((layer) => {return {value: layer, shown: layer.name}}); const backgroundMapPicker = new Combine([new DropDown(`Background map`, baseLayerOptions, bm.CurrentLayer), openFilterButton]); -const layerSelection = new Combine([`

Maplayers

`, new LayerSelection(flayers)]); +const layerSelection = new Combine([`

Maplayers

`, new LayerSelection(layerSetup.flayers)]); let layerControl = backgroundMapPicker; -if (flayers.length > 1) { +if (layerSetup.flayers.length > 1) { layerControl = new Combine([layerSelection, backgroundMapPicker]); } @@ -283,7 +232,7 @@ InitUiElements.OnlyIf(featureSwitchAddNew, () => { selectedElement, layerUpdater.runningQuery, osmConnection.userDetails, - addButtons); + layerSetup.presets); } ); }); @@ -342,17 +291,17 @@ new FullScreenMessageBoxHandler(fullScreenMessage, () => { }).update(); InitUiElements.OnlyIf(featureSwitchWelcomeMessage, () => { - InitUiElements.InitWelcomeMessage(layoutToUse, osmConnection, bm, fullScreenMessage) + InitUiElements.InitWelcomeMessage(layoutToUse, + featureSwitchUserbadge.data ? osmConnection : undefined, bm, fullScreenMessage) }); -if ((window != window.top && featureSwitchWelcomeMessage.data === "false") || featureSwitchIframe.data !== "false") { - console.log("WELCOME? ",featureSwitchWelcomeMessage.data) +if ((window != window.top && !featureSwitchWelcomeMessage.data) || featureSwitchIframe.data) { new FixedUiElement(``).AttachTo("top-right") } new CenterMessageBox( - minZoom, + layerSetup.minZoom, centerMessage, osmConnection, locationControl, diff --git a/test.ts b/test.ts index dbf2fdf..e69de29 100644 --- a/test.ts +++ b/test.ts @@ -1,24 +0,0 @@ -import {FeatureInfoBox} from "./UI/FeatureInfoBox"; -import {TagRenderingOptions} from "./Customizations/TagRendering"; -import {Changes} from "./Logic/Changes"; -import {UIEventSource} from "./UI/UIEventSource"; -import {OsmConnection} from "./Logic/OsmConnection"; -import {ElementStorage} from "./Logic/ElementStorage"; -import {Tag} from "./Logic/TagsFilter"; -import FixedText from "./Customizations/Questions/FixedText"; -import {FixedUiElement} from "./UI/Base/FixedUiElement"; - -const osm = new OsmConnection(true); -const changes = new Changes("test", osm, new ElementStorage()); - -const tags = new UIEventSource({name: "ESCAPEE

"}); -const x = new TagRenderingOptions( - { - mappings: [ - {k: null, txt: "Test: {name}"} - ] - } -); - -new FeatureInfoBox(undefined, tags, new FixedText(new FixedUiElement("{name}")), [x], changes, osm.userDetails) - .AttachTo("maindiv"); \ No newline at end of file