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 d6ba7b9e7..580153fa3 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 c90e441dc..5e0a106c5 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 f3da37633..89aa91537 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 1053b4836..3041d22cc 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 fe757cac8..c6b7a1f1c 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 68367713e..aa75f7bbf 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 c6f59b04c..ed66eb2a6 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 f560bf293..9bafc24ec 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 bed317914..c4acc5f46 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 8fe2c0086..4179285f5 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 fce699803..d33d7df02 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 77201f22d..32f8c1317 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 c38e55e93..994a827f1 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,