From e74b4e380498133c90ebda900b116730daa74f70 Mon Sep 17 00:00:00 2001 From: Pieter Vander Vennet Date: Sun, 15 Nov 2020 01:16:35 +0100 Subject: [PATCH] Small fixes, perf improvements, remove duplicate images of ghost bikes, add wall mount --- InitUiElements.ts | 4 +-- Logic/FilteredLayer.ts | 16 ++++------ State.ts | 2 +- Svg.ts | 2 +- UI/FullScreenMessageBoxHandler.ts | 7 ++-- UI/Image/ImageUploadFlow.ts | 2 +- UI/Popup/FeatureInfoBox.ts | 1 - UI/Popup/TagRenderingAnswer.ts | 5 ++- UI/SimpleAddUI.ts | 2 +- UI/WelcomeMessage.ts | 3 +- assets/layers/ghost_bike/ghost_bike.json | 3 +- assets/svg/camera-plus.svg | 4 +-- .../surveillance_cameras.json | 32 +++++++++++++++++++ 13 files changed, 57 insertions(+), 26 deletions(-) diff --git a/InitUiElements.ts b/InitUiElements.ts index d6ba7b9e76..580153fa34 100644 --- a/InitUiElements.ts +++ b/InitUiElements.ts @@ -153,10 +153,10 @@ export class InitUiElements { * This is given to the div which renders fullscreen on mobile devices */ State.state.selectedElement.addCallback((feature) => { - if (feature?.feature?.properties === undefined) { + if (feature?.properties === undefined) { return; } - const data = feature.feature.properties; + const data = feature.properties; // Which is the applicable set? for (const layer of layoutToUse.layers) { if (typeof layer === "string") { diff --git a/Logic/FilteredLayer.ts b/Logic/FilteredLayer.ts index c90e441dc8..5e0a106c5d 100644 --- a/Logic/FilteredLayer.ts +++ b/Logic/FilteredLayer.ts @@ -322,14 +322,9 @@ export class FilteredLayer { eventSource.addCallback(updateStyle); function openPopup(e) { - updateStyle() - - if (feature.geometry.type === "Point") { - State.state.selectedElement.setData({feature: feature}); - return; // Points bind there own popups + return; // Points bind their own popups } - const uiElement = self._showOnPopup(eventSource, feature); L.popup({ autoPan: true, @@ -337,14 +332,17 @@ export class FilteredLayer { .setLatLng(e.latlng) .openOn(State.state.bm.map); uiElement.Update(); - State.state.selectedElement.setData({feature: feature}); - if (e) { L.DomEvent.stop(e); // Marks the event as consumed } } - layer.on("click", openPopup); + layer.on("click", (e) => { + updateStyle(); + openPopup(e); + State.state.selectedElement.setData(feature); + + }); } }); diff --git a/State.ts b/State.ts index f3da376332..89aa915374 100644 --- a/State.ts +++ b/State.ts @@ -82,7 +82,7 @@ export default class State { /** The latest element that was selected - used to generate the right UI at the right place */ - public readonly selectedElement = new UIEventSource<{ feature: any }>(undefined); + public readonly selectedElement = new UIEventSource(undefined); public readonly zoom: UIEventSource; public readonly lat: UIEventSource; diff --git a/Svg.ts b/Svg.ts index 1053b48367..3041d22cc4 100644 --- a/Svg.ts +++ b/Svg.ts @@ -34,7 +34,7 @@ export default class Svg { public static bug_svg() { return new FixedUiElement(Svg.bug);} public static bug_ui() { return new FixedUiElement(Svg.bug_img);} - public static camera_plus = " image/svg+xml " + public static camera_plus = " image/svg+xml " public static camera_plus_img = Img.AsImageElement(Svg.camera_plus) public static camera_plus_svg() { return new FixedUiElement(Svg.camera_plus);} public static camera_plus_ui() { return new FixedUiElement(Svg.camera_plus_img);} diff --git a/UI/FullScreenMessageBoxHandler.ts b/UI/FullScreenMessageBoxHandler.ts index fe757cac82..c6b7a1f1c6 100644 --- a/UI/FullScreenMessageBoxHandler.ts +++ b/UI/FullScreenMessageBoxHandler.ts @@ -13,9 +13,11 @@ export class FullScreenMessageBox extends UIElement { private readonly returnToTheMap: UIElement; constructor(onClear: (() => void)) { - super(State.state.fullScreenMessage); + super(); this.HideOnEmpty(true); + const self = this; State.state.fullScreenMessage.addCallbackAndRun(uiElement => { + self.Update(); if (uiElement === undefined) { location.hash = ""; } else { @@ -28,14 +30,12 @@ export class FullScreenMessageBox extends UIElement { window.onhashchange = function () { if (location.hash === "") { // No more element: back to the map! - console.log("Clearing full screen message"); State.state.fullScreenMessage.setData(undefined); onClear(); } } } - const self = this; this.returnToTheMap = new Combine([Translations.t.general.returnToTheMap.Clone().SetStyle("font-size:xx-large")]) .SetStyle("background:#7ebc6f;" + @@ -69,7 +69,6 @@ export class FullScreenMessageBox extends UIElement { } const el = document.getElementById(this.id); - console.warn(el, el.style.display); const uielement = new Combine([State.state.fullScreenMessage.data]).SetStyle( "display:block;" + diff --git a/UI/Image/ImageUploadFlow.ts b/UI/Image/ImageUploadFlow.ts index 68367713e0..aa75f7bbf7 100644 --- a/UI/Image/ImageUploadFlow.ts +++ b/UI/Image/ImageUploadFlow.ts @@ -115,7 +115,7 @@ export class ImageUploadFlow extends UIElement { "cursor:pointer;" + "padding: 0.5em;" + "border-radius: 1em;" + - "border: 3px solid var(--popup-border);" + + "border: 3px solid var(--foreground-color);" + "box-sizing:border-box;") const actualInputElement = diff --git a/UI/Popup/FeatureInfoBox.ts b/UI/Popup/FeatureInfoBox.ts index c6f59b04ca..ed66eb2a66 100644 --- a/UI/Popup/FeatureInfoBox.ts +++ b/UI/Popup/FeatureInfoBox.ts @@ -40,7 +40,6 @@ export class FeatureInfoBox extends UIElement { } InnerRender(): string { - console.error("Inner rendering infobox for ", this._tags.data.id, this.id) return new Combine([ new Combine([this._title, this._titleIcons]) .SetClass("featureinfobox-titlebar"), diff --git a/UI/Popup/TagRenderingAnswer.ts b/UI/Popup/TagRenderingAnswer.ts index f560bf293a..9bafc24ec1 100644 --- a/UI/Popup/TagRenderingAnswer.ts +++ b/UI/Popup/TagRenderingAnswer.ts @@ -9,6 +9,7 @@ import {SubstitutedTranslation} from "../SpecialVisualizations"; export default class TagRenderingAnswer extends UIElement { private _tags: UIEventSource; private _configuration: TagRenderingConfig; + private _content: UIElement; constructor(tags: UIEventSource, configuration: TagRenderingConfig) { super(tags); @@ -31,7 +32,9 @@ export default class TagRenderingAnswer extends UIElement { if (tr === undefined) { return ""; } - return new SubstitutedTranslation(tr, this._tags).Render(); + // Bit of a hack; remember that the fields are updated + this._content = new SubstitutedTranslation(tr, this._tags); + return this._content.Render(); } } \ No newline at end of file diff --git a/UI/SimpleAddUI.ts b/UI/SimpleAddUI.ts index bed317914b..c4acc5f469 100644 --- a/UI/SimpleAddUI.ts +++ b/UI/SimpleAddUI.ts @@ -116,7 +116,7 @@ export class SimpleAddUI extends UIElement { const loc = State.state.bm.LastClickLocation.data; let feature = State.state.changes.createElement(tags, loc.lat, loc.lon); layerToAddTo.AddNewElement(feature); - State.state.selectedElement.setData({feature: feature}); + State.state.selectedElement.setData(feature); } } diff --git a/UI/WelcomeMessage.ts b/UI/WelcomeMessage.ts index 8fe2c00863..4179285f53 100644 --- a/UI/WelcomeMessage.ts +++ b/UI/WelcomeMessage.ts @@ -24,9 +24,10 @@ export class WelcomeMessage extends UIElement { this.description = new Combine([ "

", layout.title, "

", layout.description - ]) layout.descriptionTail + + this.plzLogIn = diff --git a/assets/layers/ghost_bike/ghost_bike.json b/assets/layers/ghost_bike/ghost_bike.json index fce6998033..d33d7df023 100644 --- a/assets/layers/ghost_bike/ghost_bike.json +++ b/assets/layers/ghost_bike/ghost_bike.json @@ -43,8 +43,7 @@ } ], "tagRenderings": [ - "images", - { + { "render": { "en": "A ghost bike is a memorial for a cyclist who died in a traffic accident, in the form of a white bicycle placed permanently near the accident location.", "nl": "Een Witte Fiets (of Spookfiets) is een aandenken aan een fietser die bij een verkeersongeval om het leven kwam. Het gaat over een witgeschilderde fiets die geplaatst werd in de buurt van het ongeval.", diff --git a/assets/svg/camera-plus.svg b/assets/svg/camera-plus.svg index 77201f22d0..32f8c1317d 100644 --- a/assets/svg/camera-plus.svg +++ b/assets/svg/camera-plus.svg @@ -65,12 +65,12 @@ diff --git a/assets/themes/surveillance_cameras/surveillance_cameras.json b/assets/themes/surveillance_cameras/surveillance_cameras.json index c38e55e934..994a827f1b 100644 --- a/assets/themes/surveillance_cameras/surveillance_cameras.json +++ b/assets/themes/surveillance_cameras/surveillance_cameras.json @@ -230,6 +230,38 @@ } } ] + }, + { + "question": { + "en": "How is this camera placed?", + "nl": "Hoe is deze camera geplaatst?" + }, + "freeform": { + "key": "camera:mount" + }, + "mappings": [ + { + "if": "camera:mount=wall", + "then": { + "en": "This camera is placed against a wall", + "nl": "Deze camera hangt aan een muur" + } + }, + { + "if": "camera:mount=pole", + "then": { + "en": "This camera is placed one a pole", + "nl": "Deze camera staat op een paal" + } + }, + { + "if": "camera:mount=pole", + "then": { + "en": "This camera is placed one a pole", + "nl": "Deze camera staat op een paal" + } + } + ] } ], "hideUnderlayingFeaturesMinPercentage": 0,