From 5e6f54f660f7ac74ce60e6474994400e3baa1ae7 Mon Sep 17 00:00:00 2001 From: Pieter Vander Vennet Date: Wed, 18 Nov 2020 13:41:31 +0100 Subject: [PATCH 01/14] Bugfix: camera with direction wouldn't show up --- Customizations/JSON/LayerConfigJson.ts | 6 ++++++ InitUiElements.ts | 4 ++-- Logic/Leaflet/GeoLocationHandler.ts | 4 ---- .../themes/surveillance_cameras/custom_theme.css | 15 --------------- index.css | 5 +++++ 5 files changed, 13 insertions(+), 21 deletions(-) diff --git a/Customizations/JSON/LayerConfigJson.ts b/Customizations/JSON/LayerConfigJson.ts index 98df035ff9..ac1b338a8e 100644 --- a/Customizations/JSON/LayerConfigJson.ts +++ b/Customizations/JSON/LayerConfigJson.ts @@ -121,6 +121,12 @@ export interface LayerConfigJson { /** * All the tag renderings. * A tag rendering is a block that either shows the known value or asks a question. + * + * Refer to the class `TagRenderingConfigJson` to see the possibilities. + * + * Note that we can also use a string here - where the string refers to a tagrenering defined in `assets/questions/questions.json`, + * where a few very general questions are defined e.g. website, phone number, ... + * */ tagRenderings?: (string | TagRenderingConfigJson) [] } \ No newline at end of file diff --git a/InitUiElements.ts b/InitUiElements.ts index e4ac7026a7..551704c938 100644 --- a/InitUiElements.ts +++ b/InitUiElements.ts @@ -161,7 +161,7 @@ export class InitUiElements { if (feature === undefined) { State.state.fullScreenMessage.setData(undefined); } - if (feature?.properties === undefined) { + if (feature?.properties === undefined) { return; } const data = feature.properties; @@ -175,7 +175,7 @@ export class InitUiElements { continue; } - if(layer.title === null && layer.tagRenderings.length === 0){ + if((layer.title ?? null) === null && layer.tagRenderings.length === 0){ continue; } diff --git a/Logic/Leaflet/GeoLocationHandler.ts b/Logic/Leaflet/GeoLocationHandler.ts index e94b23e3d7..d201fdf072 100644 --- a/Logic/Leaflet/GeoLocationHandler.ts +++ b/Logic/Leaflet/GeoLocationHandler.ts @@ -25,14 +25,10 @@ export class GeoLocationHandler extends UIElement { function onAccuratePositionProgress(e) { - console.log(e.accuracy); - console.log(e.latlng); State.state.currentGPSLocation.setData({latlng: e.latlng, accuracy: e.accuracy}); } function onAccuratePositionFound(e) { - console.log(e.accuracy); - console.log(e.latlng); State.state.currentGPSLocation.setData({latlng: e.latlng, accuracy: e.accuracy}); } diff --git a/assets/themes/surveillance_cameras/custom_theme.css b/assets/themes/surveillance_cameras/custom_theme.css index 97a49d87b0..02e139eeeb 100644 --- a/assets/themes/surveillance_cameras/custom_theme.css +++ b/assets/themes/surveillance_cameras/custom_theme.css @@ -9,18 +9,3 @@ html { --foreground-color: white !important; --shadow-color: #0f0 !important; } - -#innercolor { - stop-color:#ff0000 -} -.leaflet-div-icon svg { - width: calc(100% - 3px); - height: calc(100% + 3px); -} -/* -.leaflet-div-icon svg path { - fill: none !important; - stroke-width: 1px !important; - stroke: #0f0 !important; -} -*/ diff --git a/index.css b/index.css index ed793ac90d..8afce07dc6 100644 --- a/index.css +++ b/index.css @@ -420,6 +420,11 @@ a { } +.leaflet-div-icon svg { + width: calc(100%); + height: calc(100%); +} + /****** ShareScreen *****/ .literal-code { From d4cf677d7e83725825a20031a4bde277ac25bea4 Mon Sep 17 00:00:00 2001 From: Christian Neumann Date: Fri, 20 Nov 2020 10:24:42 +0100 Subject: [PATCH 02/14] Fix message box layout for Firefox. --- UI/FullScreenMessageBoxHandler.ts | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/UI/FullScreenMessageBoxHandler.ts b/UI/FullScreenMessageBoxHandler.ts index 70d5d907a0..412d65a178 100644 --- a/UI/FullScreenMessageBoxHandler.ts +++ b/UI/FullScreenMessageBoxHandler.ts @@ -45,10 +45,13 @@ export class FullScreenMessageBox extends UIElement { return ""; } this._content = State.state.fullScreenMessage.data; - const uielement = new Combine([this._content]).SetStyle( - "display:block;" + + const innerWrap = new Combine([this._content]).SetStyle( + "display: block;" + "padding: 1em;" + - "padding-bottom:6em;" + + "padding-bottom: 6em; " + ); + const uielement = new Combine([innerWrap]).SetStyle( + "display:block;" + `margin-bottom: var(--return-to-the-map-height);` + "box-sizing:border-box;" + `height:calc(100vh - var(--return-to-the-map-height));` + From d7d7952111ebbba5bff9e4a15ab3198b6fdedad2 Mon Sep 17 00:00:00 2001 From: Christian Neumann Date: Fri, 20 Nov 2020 11:29:57 +0100 Subject: [PATCH 03/14] Wait for loading of AccuratePosition script. --- Logic/Leaflet/GeoLocationHandler.ts | 8 ++++++++ index.html | 1 - 2 files changed, 8 insertions(+), 1 deletion(-) diff --git a/Logic/Leaflet/GeoLocationHandler.ts b/Logic/Leaflet/GeoLocationHandler.ts index e94b23e3d7..8950e31f31 100644 --- a/Logic/Leaflet/GeoLocationHandler.ts +++ b/Logic/Leaflet/GeoLocationHandler.ts @@ -17,6 +17,14 @@ export class GeoLocationHandler extends UIElement { constructor() { super(undefined); this._hasLocation = State.state.currentGPSLocation.map((location) => location !== undefined); + var self = this; + import("../../vendor/Leaflet.AccuratePosition.js").then(() => { + self.init(); + }) + } + + + public init() { this.ListenTo(this._hasLocation); this.ListenTo(this._isActive); this.ListenTo(this._permission); diff --git a/index.html b/index.html index 3751ce67d2..d74743ada1 100644 --- a/index.html +++ b/index.html @@ -65,7 +65,6 @@
- From 5134bce714383a1e227f1135ad442f24d8d402c7 Mon Sep 17 00:00:00 2001 From: Christian Neumann Date: Fri, 20 Nov 2020 11:31:11 +0100 Subject: [PATCH 04/14] Increase animation speed, decrease zoom level of fly to location. --- Logic/Leaflet/GeoLocationHandler.ts | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/Logic/Leaflet/GeoLocationHandler.ts b/Logic/Leaflet/GeoLocationHandler.ts index 8950e31f31..a668a5cdd3 100644 --- a/Logic/Leaflet/GeoLocationHandler.ts +++ b/Logic/Leaflet/GeoLocationHandler.ts @@ -114,7 +114,12 @@ export class GeoLocationHandler extends UIElement { return ""; } if (State.state.currentGPSLocation.data !== undefined) { - map.flyTo(State.state.currentGPSLocation.data.latlng, 18); + State.state.bm.map.flyTo( + State.state.currentGPSLocation.data.latlng, 16, + { + duration: 0.25, + } + ); } From fa154b324c6f2372136c818377a3ed320b2e3a89 Mon Sep 17 00:00:00 2001 From: Christian Neumann Date: Fri, 20 Nov 2020 11:31:54 +0100 Subject: [PATCH 05/14] Add scale to map. --- Logic/Leaflet/Basemap.ts | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/Logic/Leaflet/Basemap.ts b/Logic/Leaflet/Basemap.ts index a1b09c9d53..e1139e79bb 100644 --- a/Logic/Leaflet/Basemap.ts +++ b/Logic/Leaflet/Basemap.ts @@ -42,6 +42,11 @@ export class Basemap { layers: [this._previousLayer], }); + L.control.scale( + { + position: 'topright', + } + ).addTo(this.map) // Users are not allowed to zoom to the 'copies' on the left and the right, stuff goes wrong then // We give a bit of leeway for people on the edges From cd548ab04b8051262b2bf85cde70deb3ac70121a Mon Sep 17 00:00:00 2001 From: Pieter Vander Vennet Date: Fri, 20 Nov 2020 14:00:37 +0100 Subject: [PATCH 06/14] Add Fietsambassade logo to cyclofix; various svg- and css fixes --- Customizations/JSON/LayerConfig.ts | 2 +- InitUiElements.ts | 1 - Logic/FilteredLayer.ts | 4 +- State.ts | 2 +- Svg.ts | 9 +- UI/Popup/EditableTagRendering.ts | 2 +- UI/Popup/FeatureInfoBox.ts | 10 +- .../bike_repair_station.json | 8 ++ assets/layers/bike_shop/bike_shop.json | 102 +++++++++++++----- .../{repair_station.svg => tools.svg} | 0 .../cycling_themed_objects.json | 13 +-- assets/questions/questions.json | 39 +++++-- assets/svg/ampersand.svg | 2 +- assets/svg/phone.svg | 59 ++++++++++ .../cyclofix/fietsambassade_gent_logo.svg | 1 + .../fietsambassade_gent_logo_small.svg | 82 ++++++++++++++ css/tagrendering.css | 31 ++++++ index.css | 5 +- package.json | 4 +- test.ts | 2 +- test/Tag.spec.ts | 13 ++- 21 files changed, 332 insertions(+), 59 deletions(-) rename assets/layers/bike_shop/{repair_station.svg => tools.svg} (100%) create mode 100644 assets/svg/phone.svg create mode 100644 assets/themes/cyclofix/fietsambassade_gent_logo.svg create mode 100644 assets/themes/cyclofix/fietsambassade_gent_logo_small.svg diff --git a/Customizations/JSON/LayerConfig.ts b/Customizations/JSON/LayerConfig.ts index 6e14be6a33..faa7ac5b58 100644 --- a/Customizations/JSON/LayerConfig.ts +++ b/Customizations/JSON/LayerConfig.ts @@ -100,7 +100,7 @@ export default class LayerConfig { } this.tagRenderings = trs(json.tagRenderings).concat(roamingRenderings); - this.titleIcons = trs(json.titleIcons ?? ["wikipedialink","osmlink"]); + this.titleIcons = trs(json.titleIcons ?? ["phonelink","wikipedialink","osmlink"]); function tr(key, deflt) { diff --git a/InitUiElements.ts b/InitUiElements.ts index 551704c938..ad0488431d 100644 --- a/InitUiElements.ts +++ b/InitUiElements.ts @@ -230,7 +230,6 @@ export class InitUiElements { }); const marker = L.marker([home.lat, home.lon], {icon: icon}) marker.addTo(State.state.bm.map) - console.log(marker) }); new GeoLocationHandler() diff --git a/Logic/FilteredLayer.ts b/Logic/FilteredLayer.ts index c978185cd7..a9f2302c51 100644 --- a/Logic/FilteredLayer.ts +++ b/Logic/FilteredLayer.ts @@ -184,7 +184,9 @@ export class FilteredLayer { if (feature.properties.id.replace(/\//g, "_") === Hash.Get().data) { const center = GeoOperations.centerpoint(feature).geometry.coordinates; popup.setLatLng({lat: center[1], lng: center[0]}); - popup.openOn(State.state.bm.map) + popup.openOn(State.state.bm.map); + State.state.selectedElement.setData(feature); + uiElement.Update(); } } diff --git a/State.ts b/State.ts index ec61047be2..b96bee973f 100644 --- a/State.ts +++ b/State.ts @@ -23,7 +23,7 @@ export default class State { // The singleton of the global state public static state: State; - public static vNumber = "0.2.0"; + public static vNumber = "0.2.1c"; // The user journey states thresholds when a new feature gets unlocked public static userJourney = { diff --git a/Svg.ts b/Svg.ts index fbcbcdda20..4fcddce8f6 100644 --- a/Svg.ts +++ b/Svg.ts @@ -14,7 +14,7 @@ export default class Svg { public static addSmall_svg() { return new FixedUiElement(Svg.addSmall);} public static addSmall_ui() { return new FixedUiElement(Svg.addSmall_img);} - public static ampersand = "e image/svg+xml " + public static ampersand = " image/svg+xml " public static ampersand_img = Img.AsImageElement(Svg.ampersand) public static ampersand_svg() { return new FixedUiElement(Svg.ampersand);} public static ampersand_ui() { return new FixedUiElement(Svg.ampersand_img);} @@ -174,6 +174,11 @@ export default class Svg { public static pencil_svg() { return new FixedUiElement(Svg.pencil);} public static pencil_ui() { return new FixedUiElement(Svg.pencil_img);} + public static phone = " image/svg+xml " + public static phone_img = Img.AsImageElement(Svg.phone) + public static phone_svg() { return new FixedUiElement(Svg.phone);} + public static phone_ui() { return new FixedUiElement(Svg.phone_img);} + public static pop_out = " Svg Vector Icons : http://www.onlinewebfonts.com/icon " public static pop_out_img = Img.AsImageElement(Svg.pop_out) public static pop_out_svg() { return new FixedUiElement(Svg.pop_out);} @@ -219,4 +224,4 @@ export default class Svg { public static wikipedia_svg() { return new FixedUiElement(Svg.wikipedia);} public static wikipedia_ui() { return new FixedUiElement(Svg.wikipedia_img);} -public static All = {"add.svg": Svg.add,"addSmall.svg": Svg.addSmall,"ampersand.svg": Svg.ampersand,"arrow-left-smooth.svg": Svg.arrow_left_smooth,"arrow-right-smooth.svg": Svg.arrow_right_smooth,"bug.svg": Svg.bug,"camera-plus.svg": Svg.camera_plus,"checkmark.svg": Svg.checkmark,"close.svg": Svg.close,"compass.svg": Svg.compass,"crosshair-blue-center.svg": Svg.crosshair_blue_center,"crosshair-blue.svg": Svg.crosshair_blue,"crosshair.svg": Svg.crosshair,"delete_icon.svg": Svg.delete_icon,"direction.svg": Svg.direction,"direction_gradient.svg": Svg.direction_gradient,"down.svg": Svg.down,"envelope.svg": Svg.envelope,"floppy.svg": Svg.floppy,"gear.svg": Svg.gear,"help.svg": Svg.help,"home.svg": Svg.home,"home_white_bg.svg": Svg.home_white_bg,"josm_logo.svg": Svg.josm_logo,"layers.svg": Svg.layers,"layersAdd.svg": Svg.layersAdd,"logo.svg": Svg.logo,"logout.svg": Svg.logout,"mapillary.svg": Svg.mapillary,"no_checkmark.svg": Svg.no_checkmark,"or.svg": Svg.or,"osm-logo-us.svg": Svg.osm_logo_us,"osm-logo.svg": Svg.osm_logo,"pencil.svg": Svg.pencil,"pop-out.svg": Svg.pop_out,"reload.svg": Svg.reload,"search.svg": Svg.search,"share.svg": Svg.share,"star.svg": Svg.star,"statistics.svg": Svg.statistics,"up.svg": Svg.up,"wikimedia-commons-white.svg": Svg.wikimedia_commons_white,"wikipedia.svg": Svg.wikipedia};} +public static All = {"add.svg": Svg.add,"addSmall.svg": Svg.addSmall,"ampersand.svg": Svg.ampersand,"arrow-left-smooth.svg": Svg.arrow_left_smooth,"arrow-right-smooth.svg": Svg.arrow_right_smooth,"bug.svg": Svg.bug,"camera-plus.svg": Svg.camera_plus,"checkmark.svg": Svg.checkmark,"close.svg": Svg.close,"compass.svg": Svg.compass,"crosshair-blue-center.svg": Svg.crosshair_blue_center,"crosshair-blue.svg": Svg.crosshair_blue,"crosshair.svg": Svg.crosshair,"delete_icon.svg": Svg.delete_icon,"direction.svg": Svg.direction,"direction_gradient.svg": Svg.direction_gradient,"down.svg": Svg.down,"envelope.svg": Svg.envelope,"floppy.svg": Svg.floppy,"gear.svg": Svg.gear,"help.svg": Svg.help,"home.svg": Svg.home,"home_white_bg.svg": Svg.home_white_bg,"josm_logo.svg": Svg.josm_logo,"layers.svg": Svg.layers,"layersAdd.svg": Svg.layersAdd,"logo.svg": Svg.logo,"logout.svg": Svg.logout,"mapillary.svg": Svg.mapillary,"no_checkmark.svg": Svg.no_checkmark,"or.svg": Svg.or,"osm-logo-us.svg": Svg.osm_logo_us,"osm-logo.svg": Svg.osm_logo,"pencil.svg": Svg.pencil,"phone.svg": Svg.phone,"pop-out.svg": Svg.pop_out,"reload.svg": Svg.reload,"search.svg": Svg.search,"share.svg": Svg.share,"star.svg": Svg.star,"statistics.svg": Svg.statistics,"up.svg": Svg.up,"wikimedia-commons-white.svg": Svg.wikimedia_commons_white,"wikipedia.svg": Svg.wikipedia};} diff --git a/UI/Popup/EditableTagRendering.ts b/UI/Popup/EditableTagRendering.ts index ea61c89260..0481eef241 100644 --- a/UI/Popup/EditableTagRendering.ts +++ b/UI/Popup/EditableTagRendering.ts @@ -33,7 +33,7 @@ export default class EditableTagRendering extends UIElement { this.dumbMode = false; if (this._configuration.question !== undefined) { - if (State.state.featureSwitchUserbadge.data) { + if (State.state?.featureSwitchUserbadge?.data) { // 2.3em total width const self = this; this._editButton = diff --git a/UI/Popup/FeatureInfoBox.ts b/UI/Popup/FeatureInfoBox.ts index 9a669dcf99..7c1ac0b490 100644 --- a/UI/Popup/FeatureInfoBox.ts +++ b/UI/Popup/FeatureInfoBox.ts @@ -44,9 +44,13 @@ export class FeatureInfoBox extends UIElement { return new Combine([ new Combine([this._title, this._titleIcons]) .SetClass("featureinfobox-titlebar"), - ...this._renderings, - this._questionBox, - ]).Render(); + new Combine([ + ...this._renderings, + this._questionBox + ] + ).SetClass("featureinfobox-content"), + ]).SetClass("featureinfobox") + .Render(); } } diff --git a/assets/layers/bike_repair_station/bike_repair_station.json b/assets/layers/bike_repair_station/bike_repair_station.json index 4089160f4b..daa1e3dc86 100644 --- a/assets/layers/bike_repair_station/bike_repair_station.json +++ b/assets/layers/bike_repair_station/bike_repair_station.json @@ -89,6 +89,14 @@ } ] }, + "titleIcons": [ + { + "render": "", + "condition": "operator=De Fietsambassade Gent" + }, + "wikipedialink", + "osmlink" + ], "tagRenderings": [ "images", { diff --git a/assets/layers/bike_shop/bike_shop.json b/assets/layers/bike_shop/bike_shop.json index 613e5a693a..1a931461ce 100644 --- a/assets/layers/bike_shop/bike_shop.json +++ b/assets/layers/bike_shop/bike_shop.json @@ -12,6 +12,13 @@ "#": "We select all bicycle shops, sport shops (but we try to weed out non-bicycle related shops), and any shop with a bicycle related tag", "or": [ "shop=bicycle", + { + "#": "A bicycle rental with a network is something such as villo, bluebike, ... We don't want them", + "and": [ + "amenity=bicycle_rental", + "network=" + ] + }, { "#": "if sport is defined and is not bicycle, it is retrackted; if bicycle retail/repair is marked as 'no', it is retracted too.", "##": "There will be a few false-positives with this. They will get filtered out by people marking both 'not selling bikes' and 'not repairing bikes'. Furthermore, the OSMers will add a sports-subcategory on it", @@ -68,7 +75,12 @@ } }, { - "if": "shop!~bicycle", + "if": { + "and": [ + "shop!~bicycle", + "shop~*" + ] + }, "then": "Other shop" }, { @@ -127,6 +139,23 @@ "de": "Fahrradgeschäft" } }, + { + "if": { + "and": [ + "name~*", + { + "or": [ + "service:bicycle:rental=yes", + "amenity=bicycle_rental" + ] + } + ] + }, + "then": { + "nl": "Fietsverhuur {name}", + "en": "Bicycle rental {name}" + } + }, { "if": "name~*", "then": { @@ -141,37 +170,34 @@ }, "titleIcons": [ { - "mappings": [ - { - "if": "service:bicycle:pump=yes", - "then": "" - } - ] + "render": "", + "condition": "operator=De Fietsambassade Gent" }, { - "mappings": [ - { - "if": "service:bicycle:diy=yes", - "then": "" - } - ] + "condition": { + "or": [ + "service:bicycle:pump=yes", + "service:bicycle:pump=seperate" + ] + }, + "render": "" }, { - "mappings": [ - { - "if": { - "or": [ - "service:bicycle:cleaning=yes", - "service:bicycle:cleaning=diy" - ] - }, - "then": "" - } - ] + "condition": "service:bicycle:diy=yes", + "render": "" }, + { + "condition": { + "or": [ + "service:bicycle:cleaning=yes", + "service:bicycle:cleaning=diy" + ] + }, + "render": "" + }, + "phonelink", "wikipedialink", "osmlink" - ], "description": { "en": "A shop specifically selling bicycles or related items", @@ -182,6 +208,7 @@ { "condition": { "and": [ + "shop~*", "shop!~bicycle", "shop!~sports" ] @@ -257,6 +284,13 @@ "type": "opening_hours" } }, + "description", + { + "render": "Enkel voor {access}", + "freeform": { + "key": "access" + } + }, { "question": { "en": "Does this shop sell bikes?", @@ -439,6 +473,13 @@ "gl": "Esta tenda non ofrece unha bomba de ar para uso de calquera persoa", "de": "Dieses Geschäft bietet für niemanden eine Fahrradpumpe an" } + }, + { + "if": "service:bicycle:pump=seperate", + "then": { + "en": "There is bicycle pump, it is shown as a seperate point ", + "nl": "Er is een fietspomp, deze is apart aangeduid" + } } ] }, @@ -470,6 +511,13 @@ "gl": "Non hai ferramentas aquí para arranxar a túa propia bicicleta", "de": "Dieses Geschäft bietet keine Werkzeuge für Heimwerkerreparaturen an" } + }, + { + "if": "service:bicycle:diy=only_sold", + "then": { + "en": "Tools for DIY repair are only available if you bought/hire the bike in the shop", + "nl": "Het gereedschap aan om je fiets zelf te herstellen is enkel voor als je de fiets er kocht of huurt" + } } ] }, @@ -521,6 +569,10 @@ "icon": { "render": "./assets/layers/bike_shop/repair_shop.svg", "mappings": [ + { + "if": "operator=De Fietsambassade Gent", + "then": "./assets/themes/cyclofix/fietsambassade_gent_logo_small.svg" + }, { "if": "service:bicycle:retail=yes", "then": "./assets/layers/bike_shop/shop.svg" diff --git a/assets/layers/bike_shop/repair_station.svg b/assets/layers/bike_shop/tools.svg similarity index 100% rename from assets/layers/bike_shop/repair_station.svg rename to assets/layers/bike_shop/tools.svg diff --git a/assets/layers/cycling_themed_object/cycling_themed_objects.json b/assets/layers/cycling_themed_object/cycling_themed_objects.json index 2f4be6eab1..7e57106d70 100644 --- a/assets/layers/cycling_themed_object/cycling_themed_objects.json +++ b/assets/layers/cycling_themed_object/cycling_themed_objects.json @@ -7,7 +7,7 @@ "de": "Mit Fahrrad zusammenhängendes Objekt" }, "minzoom": 13, - "overpassTags": "theme~cycling|bicycle", + "overpassTags": {"or": ["theme~cycling|bicycle", "sport=cycling"]}, "title": { "render": { "en": "Bike related object", @@ -18,12 +18,13 @@ "mappings": [ { "if": "name~*", + "then":"{name}" + }, + { + "if": "leisure=track", "then": { - "en": "{name}", - "nl": "{name}", - "fr": "{name}", - "gl": "{name}", - "de": "{name}" + "nl": "Wielerpiste", + "en": "Cycle track" } } ] diff --git a/assets/questions/questions.json b/assets/questions/questions.json index 2595eab2cb..6d34f7e8d6 100644 --- a/assets/questions/questions.json +++ b/assets/questions/questions.json @@ -5,17 +5,40 @@ "osmlink": { "render": "", - "mappings":[{ - "if": "id~=-", - "then": "Uploading..." - }] + "mappings": [ + { + "if": "id~=-", + "then": "Uploading..." + } + ] }, - "wikipedialink": { - "render": "WP", - "condition": "wikipedia~*" + "render": "WP", + "condition": "wikipedia~*" + }, + "phonelink": { + "render": "", + "condition": "phone~*" + }, + "description": { + "question": { + "nl": "Zijn er extra zaken die je niet in de bovenstaande vragen kwijt kon? Zet deze in de descriptionHerhaal geen antwoorden die je reeds gaf", + "en": "Is there still something relevant you couldn't give in the previous questions? Add it here.
Don't repeat already stated facts" + }, + "render": "{description}", + "freeform": { + "key": "description" + }, + "mappings": [ + { + "if": "description=", + "then": { + "nl": "Geen extra beschrijving", + "en": "No extra description" + } + } + ] }, - "website": { "question": { "en": "What is the website of {name}?", diff --git a/assets/svg/ampersand.svg b/assets/svg/ampersand.svg index f2df861c43..525a1ef740 100644 --- a/assets/svg/ampersand.svg +++ b/assets/svg/ampersand.svg @@ -1,4 +1,4 @@ -e + + + + + + image/svg+xml + + + + + + + + + + diff --git a/assets/themes/cyclofix/fietsambassade_gent_logo.svg b/assets/themes/cyclofix/fietsambassade_gent_logo.svg new file mode 100644 index 0000000000..53c3aef9bf --- /dev/null +++ b/assets/themes/cyclofix/fietsambassade_gent_logo.svg @@ -0,0 +1 @@ +Lg_fietsambassade_Q_blauw_neg \ No newline at end of file diff --git a/assets/themes/cyclofix/fietsambassade_gent_logo_small.svg b/assets/themes/cyclofix/fietsambassade_gent_logo_small.svg new file mode 100644 index 0000000000..9835e74521 --- /dev/null +++ b/assets/themes/cyclofix/fietsambassade_gent_logo_small.svg @@ -0,0 +1,82 @@ + + + + + + image/svg+xml + + + + + + + + + + + + Lg_fietsambassade_Q_blauw_neg + + + diff --git a/css/tagrendering.css b/css/tagrendering.css index aa82b69487..8026491369 100644 --- a/css/tagrendering.css +++ b/css/tagrendering.css @@ -1,12 +1,23 @@ + +.featureinfobox { + display: flex; + flex-direction: column; +} + .featureinfobox-title { font-size: xx-large; } .featureinfobox-icons img{ max-height: 1.5em; + width:1.5em; } .featureinfobox-icons { } +.featureinfobox-icons span { + display: inline-block; +} + .featureinfobox-titlebar{ font-size: large; font-weight: bold; @@ -14,6 +25,20 @@ justify-content: space-between; } +.featureinfobox-content { + display:block; + max-height: 75vh; + overflow-y: auto; +} +@media only screen and (max-width: 600px), only screen and (max-height: 600px) { + .featureinfobox-content { + display:block; + max-height: unset !important; + overflow-y: auto; + } +} + + .answer { display: flex; width: 100%; @@ -43,6 +68,12 @@ height: 100%; } +.question a { + pointer-events: none; + text-decoration: none; + color: var(--subtle-detail-color-contrast) +} + .question-text { font-size: larger; font-weight: bold; diff --git a/index.css b/index.css index 8afce07dc6..3e263582b0 100644 --- a/index.css +++ b/index.css @@ -408,10 +408,7 @@ a { } .leaflet-popup-content { - width: 40em !important; - max-height: 80vh; - overflow-y: auto; - overflow-x: hidden; + width: 45em !important; } .leaflet-div-icon { diff --git a/package.json b/package.json index 9de328463b..1d87f5757d 100644 --- a/package.json +++ b/package.json @@ -8,7 +8,7 @@ "staticPath": [ { "staticPath": "tiles/", - "staticOutDir": "./tiles/" + "staticOutDir": "tiles/" } ] }, @@ -24,7 +24,7 @@ "build": "rm -rf dist/ && npm run generate && parcel build --public-url ./ *.html assets/** assets/**/** assets/**/**/** vendor/* vendor/*/*", "prepare-deploy": "npm run generate && npm run build && rm -rf .cache", "deploy:staging": "npm run prepare-deploy && rm -rf /home/pietervdvn/git/pietervdvn.github.io/Staging/* && cp -r dist/* /home/pietervdvn/git/pietervdvn.github.io/Staging/ && cd /home/pietervdvn/git/pietervdvn.github.io/ && git add * && git commit -m 'New MapComplete Version' && git push && cd - && npm run clean", - "deploy:production": "npm run prepare-deploy && npm run optimize-images && rm -rf /home/pietervdvn/git/pietervdvn.github.io/MapComplete/* && cp -r dist/* /home/pietervdvn/git/pietervdvn.github.io/MapComplete/ && cd /home/pietervdvn/git/pietervdvn.github.io/ && git add * && git commit -m 'New MapComplete Version' && git push && cd - && npm run clean", + "deploy:production": "rm -rf ./assets/generated && npm run prepare-deploy && npm run optimize-images && rm -rf /home/pietervdvn/git/pietervdvn.github.io/MapComplete/* && cp -r dist/* /home/pietervdvn/git/pietervdvn.github.io/MapComplete/ && cd /home/pietervdvn/git/pietervdvn.github.io/ && git add * && git commit -m 'New MapComplete Version' && git push && cd - && npm run clean", "clean": "rm -rf .cache/ && (find *.html | grep -v \"\\(index\\|land\\|test\\|preferences\\|customGenerator\\).html\" | xargs rm) && (find *.webmanifest | xargs rm)" diff --git a/test.ts b/test.ts index 1a50ef30d0..87cb971bd6 100644 --- a/test.ts +++ b/test.ts @@ -6,7 +6,7 @@ import {UIEventSource} from "./Logic/UIEventSource"; import {VariableUiElement} from "./UI/Base/VariableUIElement"; const d = new UIEventSource("90"); -new Direction(d, [51.21576,3.22001]).AttachTo("maindiv") +new Direction(d).AttachTo("maindiv") new VariableUiElement(d.map(d => "" + d + "°")).AttachTo("extradiv") UIEventSource.Chronic(25, () => { diff --git a/test/Tag.spec.ts b/test/Tag.spec.ts index 9544c43e52..0237eabe96 100644 --- a/test/Tag.spec.ts +++ b/test/Tag.spec.ts @@ -1,6 +1,7 @@ import {UIElement} from "../UI/UIElement"; UIElement.runningFromConsole = true; - +import {Img} from "../UI/Img"; +Img.runningFromConsole = true; import {equal} from "assert"; import T from "./TestHelper"; import {FromJSON} from "../Customizations/JSON/FromJSON"; @@ -17,7 +18,6 @@ import {Utils} from "../Utils"; import {Translation} from "../UI/i18n/Translation"; - new T([ ["Tag replacement works in translation", () => { const tr = new Translation({ @@ -35,6 +35,15 @@ new T([ equal((and.and[0] as Tag).key, "key"); equal((and.and[1] as Tag).value, "y"); + + const notReg = FromJSON.Tag("x!~y") as And; + equal(notReg.matches([{k:"x",v:"y"}]), false) + equal(notReg.matches([{k:"x",v:"z"}]), true) + equal(notReg.matches([{k:"x",v:""}]), true) + + equal(notReg.matches([]), true) + + })], ["Is equivalent test", (() => { From 9c9a25a415becfca92db8582d8464b11def8e0ee Mon Sep 17 00:00:00 2001 From: Pieter Vander Vennet Date: Fri, 20 Nov 2020 14:07:19 +0100 Subject: [PATCH 07/14] Add escape-html as dependency; in preparation of #158 --- package.json | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/package.json b/package.json index 1d87f5757d..b15b17b6ab 100644 --- a/package.json +++ b/package.json @@ -25,9 +25,7 @@ "prepare-deploy": "npm run generate && npm run build && rm -rf .cache", "deploy:staging": "npm run prepare-deploy && rm -rf /home/pietervdvn/git/pietervdvn.github.io/Staging/* && cp -r dist/* /home/pietervdvn/git/pietervdvn.github.io/Staging/ && cd /home/pietervdvn/git/pietervdvn.github.io/ && git add * && git commit -m 'New MapComplete Version' && git push && cd - && npm run clean", "deploy:production": "rm -rf ./assets/generated && npm run prepare-deploy && npm run optimize-images && rm -rf /home/pietervdvn/git/pietervdvn.github.io/MapComplete/* && cp -r dist/* /home/pietervdvn/git/pietervdvn.github.io/MapComplete/ && cd /home/pietervdvn/git/pietervdvn.github.io/ && git add * && git commit -m 'New MapComplete Version' && git push && cd - && npm run clean", - "clean": "rm -rf .cache/ && (find *.html | grep -v \"\\(index\\|land\\|test\\|preferences\\|customGenerator\\).html\" | xargs rm) && (find *.webmanifest | xargs rm)" - }, "keywords": [ "OpenStreetMap", @@ -40,6 +38,7 @@ "codegrid-js": "git://github.com/hlaw/codegrid-js.git", "country-language": "^0.1.7", "email-validator": "^2.0.4", + "escape-html": "^1.0.3", "i18next-client": "^1.11.4", "jquery": "latest", "leaflet": "^1.7.1", From 8537103bd424752fc3692062d2dfeea902aa40fc Mon Sep 17 00:00:00 2001 From: Pieter Vander Vennet Date: Fri, 20 Nov 2020 21:47:29 +0100 Subject: [PATCH 08/14] Better wording on Maps-theme --- assets/themes/maps/maps.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/assets/themes/maps/maps.json b/assets/themes/maps/maps.json index ae9d03ffbc..cb7f8c7113 100644 --- a/assets/themes/maps/maps.json +++ b/assets/themes/maps/maps.json @@ -6,12 +6,12 @@ "fr": "Carte des cartes" }, "shortDescription": { - "en": "On this map, all the maps known by OpenStreetMap are shown", + "en": "This theme shows all (touristic) maps that OpenStreetMap knows of", "nl": "Een kaart met alle kaarten die OpenStreetMap kent", "fr": "Cette carte affiche toutes les cartes (plans) mappés dans OpenStreetMap" }, "description": { - "en": "On this map you can find all maps OpenStreetMap knows.

If a map is missing, you can easily map this map on OpenStreetMap.", + "en": "On this map you can find all maps OpenStreetMap knows - typically a big map on an information board showing the area, city or region, e.g. a tourist map on the back of a billboard, a map of a nature reserve, a map of cycling networks in the region, ...)

If a map is missing, you can easily map this map on OpenStreetMap.", "nl": "Op deze kaart kan je alle kaarten zien die OpenStreetMap kent.

Ontbreekt er een kaart, dan kan je die kaart hier ook gemakelijk aan deze kaart toevoegen.", "fr": "Sur cette carte sont affichées les cartes (plans) mappées dans OpenStreetMap.

Si une carte est manquante, vous pouvez l'ajouer facilement avec un compte OpenStreetMap." }, From a261577ef34a0ec4b293a773e7c05b78e3750a1a Mon Sep 17 00:00:00 2001 From: Pieter Vander Vennet Date: Sat, 21 Nov 2020 15:36:05 +0100 Subject: [PATCH 09/14] Reorder questions --- assets/layers/toilets/toilets.json | 2 + assets/layers/toilets/toilets.svg | 82 +++++++++++++++++ assets/layers/toilets/urinal.svg | 88 +++++++++++++++++++ .../{themes => layers}/toilets/wheelchair.svg | 0 assets/tagRenderings/icons.json | 2 + .../questions.json | 37 +++++++- 6 files changed, 210 insertions(+), 1 deletion(-) create mode 100644 assets/layers/toilets/toilets.json create mode 100644 assets/layers/toilets/toilets.svg create mode 100644 assets/layers/toilets/urinal.svg rename assets/{themes => layers}/toilets/wheelchair.svg (100%) create mode 100644 assets/tagRenderings/icons.json rename assets/{questions => tagRenderings}/questions.json (51%) diff --git a/assets/layers/toilets/toilets.json b/assets/layers/toilets/toilets.json new file mode 100644 index 0000000000..7a73a41bfd --- /dev/null +++ b/assets/layers/toilets/toilets.json @@ -0,0 +1,2 @@ +{ +} \ No newline at end of file diff --git a/assets/layers/toilets/toilets.svg b/assets/layers/toilets/toilets.svg new file mode 100644 index 0000000000..4af924c321 --- /dev/null +++ b/assets/layers/toilets/toilets.svg @@ -0,0 +1,82 @@ + + + + + + + image/svg+xml + + + + + + + + + + + + + + diff --git a/assets/layers/toilets/urinal.svg b/assets/layers/toilets/urinal.svg new file mode 100644 index 0000000000..29bcfb3aab --- /dev/null +++ b/assets/layers/toilets/urinal.svg @@ -0,0 +1,88 @@ + +image/svg+xml \ No newline at end of file diff --git a/assets/themes/toilets/wheelchair.svg b/assets/layers/toilets/wheelchair.svg similarity index 100% rename from assets/themes/toilets/wheelchair.svg rename to assets/layers/toilets/wheelchair.svg diff --git a/assets/tagRenderings/icons.json b/assets/tagRenderings/icons.json new file mode 100644 index 0000000000..7a73a41bfd --- /dev/null +++ b/assets/tagRenderings/icons.json @@ -0,0 +1,2 @@ +{ +} \ No newline at end of file diff --git a/assets/questions/questions.json b/assets/tagRenderings/questions.json similarity index 51% rename from assets/questions/questions.json rename to assets/tagRenderings/questions.json index 2595eab2cb..32662cdd33 100644 --- a/assets/questions/questions.json +++ b/assets/tagRenderings/questions.json @@ -2,7 +2,7 @@ "images": { "render": "{image_carousel()}{image_upload()}" }, - + "osmlink": { "render": "", "mappings":[{ @@ -15,6 +15,26 @@ "render": "WP", "condition": "wikipedia~*" }, + + "phone": { + "question": { + "en": "What is the phone number of {name}?", + "de": "Was ist die Telefonnummer von {name}?" + }, + "render": "{phone}", + "freeform": { + "key": "phone", + "type": "phone" + } + }, + + "email": { + "render": "{email}", + "freeform": { + "key": "email", + "type": "email" + } + }, "website": { "question": { @@ -28,5 +48,20 @@ "key": "website", "type": "url" } + }, + + "opening_hours": { + "question": { + "en": "What are the opening hours of {name}?", + "de": "Was sind die Öffnungszeiten von {name}?" + }, + "render": { + "de": "

Öffnungszeiten

{opening_hours_table(opening_hours)}", + "en": "

Opening hours

{opening_hours_table(opening_hours)}" + }, + "freeform": { + "key": "opening_hours", + "type": "opening_hours" + } } } \ No newline at end of file From 4018e6710b7a8c20fba1b3c531b4fefd3fe1e7f7 Mon Sep 17 00:00:00 2001 From: Pieter Vander Vennet Date: Sat, 21 Nov 2020 16:44:48 +0100 Subject: [PATCH 10/14] Add share icon, reordering of questions and icons, add urinal to toilet --- Customizations/JSON/LayerConfig.ts | 2 +- Customizations/SharedLayers.ts | 3 + Customizations/SharedTagRenderings.ts | 20 +- README.md | 3 + State.ts | 2 +- UI/SpecialVisualizations.ts | 35 +++ assets/layers/toilets/toilets.json | 303 +++++++++++++++++++ assets/layers/toilets/urinal.svg | 105 +++---- assets/tagRenderings/icons.json | 17 ++ assets/tagRenderings/questions.json | 17 -- assets/themes/cyclestreets/cyclestreets.json | 2 +- assets/themes/toilets/toilets.json | 302 +----------------- 12 files changed, 416 insertions(+), 395 deletions(-) diff --git a/Customizations/JSON/LayerConfig.ts b/Customizations/JSON/LayerConfig.ts index 6e14be6a33..e1b2a6419e 100644 --- a/Customizations/JSON/LayerConfig.ts +++ b/Customizations/JSON/LayerConfig.ts @@ -100,7 +100,7 @@ export default class LayerConfig { } this.tagRenderings = trs(json.tagRenderings).concat(roamingRenderings); - this.titleIcons = trs(json.titleIcons ?? ["wikipedialink","osmlink"]); + this.titleIcons = trs(json.titleIcons ?? ["wikipedialink","osmlink", "sharelink"]); function tr(key, deflt) { diff --git a/Customizations/SharedLayers.ts b/Customizations/SharedLayers.ts index 4beaa3ead5..7203faa066 100644 --- a/Customizations/SharedLayers.ts +++ b/Customizations/SharedLayers.ts @@ -15,6 +15,8 @@ import * as maps from "../assets/layers/maps/maps.json" import * as information_boards from "../assets/layers/information_board/information_board.json" import * as direction from "../assets/layers/direction/direction.json" import * as surveillance_camera from "../assets/layers/surveillance_cameras/surveillance_cameras.json" +import * as toilets from "../assets/layers/toilets/toilets.json" + import LayerConfig from "./JSON/LayerConfig"; export default class SharedLayers { @@ -41,6 +43,7 @@ export default class SharedLayers { new LayerConfig(maps,[], "shared_layers"), new LayerConfig(direction,[], "shared_layers"), new LayerConfig(information_boards,[], "shared_layers"), + new LayerConfig(toilets,[], "shared_layers"), new LayerConfig(surveillance_camera,[], "shared_layers") ]; diff --git a/Customizations/SharedTagRenderings.ts b/Customizations/SharedTagRenderings.ts index 9cd62eeed3..1b5c2812b8 100644 --- a/Customizations/SharedTagRenderings.ts +++ b/Customizations/SharedTagRenderings.ts @@ -1,5 +1,6 @@ -import * as questions from "../assets/questions/questions.json"; import TagRenderingConfig from "./JSON/TagRenderingConfig"; +import * as questions from "../assets/tagRenderings/questions.json"; +import * as icons from "../assets/tagRenderings/icons.json"; export default class SharedTagRenderings { @@ -7,13 +8,24 @@ export default class SharedTagRenderings { private static generatedSharedFields() { const dict = {} - for (const key in questions) { + + + function add(key, store){ try { - dict[key] = new TagRenderingConfig(questions[key]) + dict[key] = new TagRenderingConfig(store[key]) } catch (e) { - console.error("COULD NOT PARSE", key, " FROM QUESTIONS:", e) + console.error("BUG: could not parse", key, " from questions.json or icons.json", e) } } + + + for (const key in questions) { + add(key, questions); + } + for (const key in icons) { + add(key, icons); + } + return dict; } diff --git a/README.md b/README.md index f5393a60c5..8e2f015cae 100644 --- a/README.md +++ b/README.md @@ -260,3 +260,6 @@ Shower icon (used in 'bike_cleaning.svg'): https://commons.wikimedia.org/wiki/File:Shower_symbol.svg Bench icons from StreetComplete: https://github.com/westnordost/StreetComplete/tree/v25.0-beta1/res/graphics/quest%20icons, GPLv3.0 + + +Urinal icon: https://thenounproject.com/term/urinal/1307984/ \ No newline at end of file diff --git a/State.ts b/State.ts index ec61047be2..d60d4c1e7c 100644 --- a/State.ts +++ b/State.ts @@ -23,7 +23,7 @@ export default class State { // The singleton of the global state public static state: State; - public static vNumber = "0.2.0"; + public static vNumber = "0.2.1d"; // The user journey states thresholds when a new feature gets unlocked public static userJourney = { diff --git a/UI/SpecialVisualizations.ts b/UI/SpecialVisualizations.ts index a20a1bfe2d..b88cff2314 100644 --- a/UI/SpecialVisualizations.ts +++ b/UI/SpecialVisualizations.ts @@ -9,6 +9,7 @@ import {FixedUiElement} from "./Base/FixedUiElement"; import Locale from "../UI/i18n/Locale"; import {ImageUploadFlow} from "./Image/ImageUploadFlow"; import {Translation} from "./i18n/Translation"; +import State from "../State"; export class SubstitutedTranslation extends UIElement { private readonly tags: UIEventSource; @@ -183,7 +184,41 @@ export default class SpecialVisualizations { return new VariableUiElement(source.map(data => data[neededValue] ?? "Loading...")); } }, + { + funcName: "share_link", + docs: "Creates a link that (attempts to) open the native 'share'-screen", + example: "{share_link()} to share the current page, {share_link()} to share the given url", + args: [ + { + name: "url", + doc: "The url to share", + defaultValue: "{current_url()}" + } + ], + constr: (tagSource: UIEventSource, args) => { + if (navigator.share !== undefined) { + return new FixedUiElement("").onClick(() => { + + let name = tagSource["name"] + let title= State.state.layoutToUse.data.title.txt + if(name === undefined){ + name = title + }else{ + name = `${name} (${title})` + } + + navigator.share({ + url: args[0] ?? window.location.href, + title: name, + text: State.state.layoutToUse.data.shortDescription.txt + }) + }) + } else { + return new FixedUiElement("") + } + } + } ] static HelpMessage: UIElement = SpecialVisualizations.GenHelpMessage(); diff --git a/assets/layers/toilets/toilets.json b/assets/layers/toilets/toilets.json index 7a73a41bfd..7770573d69 100644 --- a/assets/layers/toilets/toilets.json +++ b/assets/layers/toilets/toilets.json @@ -1,2 +1,305 @@ { + "id": "toilets", + "name": { + "en": "Toilets", + "de": "Toiletten", + "fr": "Toilettes" + }, + "overpassTags": "amenity=toilets", + "title": { + "render": { + "en": "Toilet", + "de": "Toilette", + "fr": "Toilettes" + } + }, + "icon": { + "render": "./assets/layers/toilets/toilets.svg", + "mappings": [ + { + "if": "wheelchair=yes", + "then": "./assets/layers/toilets/wheelchair.svg" + }, + { + "if": "toilets:position=urinals", + "then": "./assets/layers/toilets/urinal.svg" + } + ] + }, + "color": { + "render": "#0000ff" + }, + "minzoom": 12, + "wayHandling": 2, + "presets": [ + { + "title": { + "en": "Toilet", + "de": "Toilette", + "fr": "Toilettes" + }, + "tags": [ + "amenity=toilets" + ], + "description": { + "en": "A publicly accessible toilet or restroom", + "de": "Eine öffentlich zugängliche Toilette", + "fr": "Des toilettes" + } + }, + { + "title": { + "en": "Toilets with wheelchair accessible toilet", + "de": "Toiletten mit rollstuhlgerechter Toilette", + "fr": "Toilettes accessible aux personnes à mobilité réduite" + }, + "tags": [ + "amenity=toilets", + "wheelchair=yes" + ], + "description": { + "en": "A restroom which has at least one wheelchair-accessible toilet", + "de": "Eine Toilettenanlage mit mindestens einer rollstuhlgerechten Toilette", + "fr": "Toilettes avec au moins un WC accessible aux personnes à mobilité réduite" + } + } + ], + "tagRenderings": [ + "images", + { + "question": { + "en": "Are these toilets publicly accessible?", + "de": "Sind diese Toiletten öffentlich zugänglich?", + "fr": "Ces toilettes sont-elles accessibles publiquement ?" + }, + "render": { + "en": "Access is {access}", + "de": "Zugang ist {access}", + "fr": "L'accès est {access}" + }, + "freeform": { + "key": "access", + "addExtraTags": [ + "fixme=the tag access was filled out by the user and might need refinement" + ] + }, + "mappings": [ + { + "if": "access=yes", + "then": { + "en": "Public access", + "de": "Öffentlicher Zugang", + "fr": "Accès publique" + } + }, + { + "if": "access=customers", + "then": { + "en": "Only access to customers", + "de": "Nur Zugang für Kunden", + "fr": "Accès réservé aux clients" + } + }, + { + "if": "access=no", + "then": { + "en": "Not accessible", + "de": "Nicht zugänglich", + "fr": "WC privés" + } + }, + { + "if": "access=key", + "then": { + "en": "Accessible, but one has to ask a key to enter", + "de": "Zugänglich, aber man muss einen Schlüssel für die Eingabe verlangen", + "fr": "Accessible, mais vous devez demander la clé" + } + } + ] + }, + { + "question": { + "en": "Are these toilets free to use?", + "de": "Können diese Toiletten kostenlos benutzt werden?", + "fr": "Ces toilettes sont-elles payantes" + }, + "mappings": [ + { + "then": { + "en": "These are paid toilets", + "de": "Dies sind bezahlte Toiletten", + "fr": "Toilettes payantes" + }, + "if": "fee=yes" + }, + { + "if": "fee=no", + "then": { + "en": "Free to use", + "de": "Kostenlose Nutzung", + "fr": "Toilettes gratuites" + } + } + ] + }, + { + "question": { + "en": "How much does one have to pay for these toilets?", + "de": "Wie viel muss man für diese Toiletten bezahlen?", + "fr": "Quel est le prix d'accès de ces toilettes ?" + }, + "render": { + "en": "The fee is {charge}", + "de": "Die Gebühr beträgt {charge}", + "fr": "Le prix est {charge}" + }, + "condition": "fee=yes", + "freeform": { + "key": "charge", + "type": "string" + } + }, + { + "question": { + "en": "Is there a dedicated toilet for wheelchair users", + "de": "Gibt es eine Toilette für Rollstuhlfahrer?", + "fr": "Un WC réservé aux personnes à mobilité réduite est-il présent ?" + }, + "mappings": [ + { + "then": { + "en": "There is a dedicated toilet for wheelchair users", + "de": "Es gibt eine Toilette für Rollstuhlfahrer", + "fr": "Il y a un WC réservé pour les personnes à mobilité réduite" + }, + "if": "wheelchair=yes" + }, + { + "if": "wheelchair=no", + "then": { + "en": "No wheelchair access", + "de": "Kein Zugang für Rollstuhlfahrer", + "fr": "Non accessible aux personnes à mobilité réduite" + } + } + ] + }, + { + "question": { + "en": "Which kind of toilets are this?", + "de": "Welche Art von Toiletten sind das?", + "fr": "De quel type sont ces toilettes ?" + }, + "mappings": [ + { + "if": "toilets:position=seated", + "then": { + "en": "There are only seated toilets", + "de": "Es gibt nur Sitztoiletten", + "fr": "Il y a uniquement des WC assis" + } + }, + { + "if": "toilets:position=urinals", + "then": { + "en": "There are only urinals here", + "de": "Hier gibt es nur Pissoirs", + "fr": "Il y a uniquement des urinoirs" + } + }, + { + "if": "toilets:position=squat", + "then": { + "en": "There are only squat toilets here", + "de": "Es gibt hier nur Hocktoiletten.", + "fr": "Il y a uniquement des WC turques" + } + }, + { + "if": "toilets:position=seated;urinals", + "then": { + "en": "Both seated toilets and urinals are available here", + "de": "Sowohl Sitztoiletten als auch Pissoirs sind hier verfügbar", + "fr": "Il y a des WC assis et des urinoirs" + } + } + ] + }, + { + "question": { + "en": "Is a changing table (to change diapers) available?", + "de": "Ist ein Wickeltisch (zum Wechseln der Windeln) vorhanden?", + "fr": "Ces WC disposent-ils d'une table à langer ?" + }, + "mappings": [ + { + "then": { + "en": "A changing table is available", + "de": "Ein Wickeltisch ist verfügbar", + "fr": "Une table à langer est disponible" + }, + "if": "changing_table=yes" + }, + { + "if": "changing_table=no", + "then": { + "en": "No changing table is available", + "de": "Es ist kein Wickeltisch verfügbar", + "fr": "Aucune table à langer" + } + } + ] + }, + { + "question": { + "en": "Where is the changing table located?", + "de": "Wo befindet sich der Wickeltisch?", + "fr": "Où se situe la table à langer ?" + }, + "render": { + "en": "The changing table is located at {changing_table:location}", + "de": "Die Wickeltabelle befindet sich in {changing_table:location}", + "fr": "Emplacement de la table à langer : {changing_table:location}" + }, + "condition": "changing_table=yes", + "freeform": { + "key": "changing_table:location" + }, + "mappings": [ + { + "then": { + "en": "The changing table is in the toilet for women. ", + "de": "Der Wickeltisch befindet sich in der Damentoilette. ", + "fr": "La table à langer se situe dans les WC pour femmes. " + }, + "if": "changing_table:location=female_toilet" + }, + { + "then": { + "en": "The changing table is in the toilet for men. ", + "de": "Der Wickeltisch befindet sich in der Herrentoilette. ", + "fr": "La table à langer se situe dans les WC pour hommes. " + }, + "if": "changing_table:location=male_toilet" + }, + { + "if": "changing_table:location=wheelchair_toilet", + "then": { + "en": "The changing table is in the toilet for wheelchair users. ", + "de": "Der Wickeltisch befindet sich in der Toilette für Rollstuhlfahrer. ", + "fr": "La table à langer se situe dans les WC pour personnes à mobilité réduite. " + } + }, + { + "if": "changing_table:location=dedicated_room", + "then": { + "en": "The changing table is in a dedicated room. ", + "de": "Der Wickeltisch befindet sich in einem eigenen Raum. ", + "fr": "La table à langer se situe dans un espace dédié. " + } + } + ] + } + ] } \ No newline at end of file diff --git a/assets/layers/toilets/urinal.svg b/assets/layers/toilets/urinal.svg index 29bcfb3aab..cecba0c476 100644 --- a/assets/layers/toilets/urinal.svg +++ b/assets/layers/toilets/urinal.svg @@ -5,84 +5,49 @@ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" - xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" - xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" - version="1.1" - x="0px" - y="0px" - viewBox="0 0 100.18594 100.18594" - enable-background="new 0 0 100 100" - xml:space="preserve" - id="svg22" - sodipodi:docname="noun_Urinal_1307984.svg" - width="100.18594" height="100.18594" - inkscape:version="0.92.4 (5da689c313, 2019-01-14)">image/svg+xml \ No newline at end of file + d="m 68.240384,43.32148 v 15.764528 c -3.446517,5.459344 -5.76619,4.074036 -10.247903,5.133803 1.652985,11.916006 8.426597,10.425906 10.341535,21.124208 v 0.06209 c 2.338689,-0.4811 6.021132,0.919057 6.10748,-2.71532 L 74.347864,43.32148 Z" + id="path14" /> diff --git a/assets/tagRenderings/icons.json b/assets/tagRenderings/icons.json index 7a73a41bfd..de7de5bf5e 100644 --- a/assets/tagRenderings/icons.json +++ b/assets/tagRenderings/icons.json @@ -1,2 +1,19 @@ { + "osmlink": { + "render": "", + "mappings": [ + { + "if": "id~=-", + "then": "Uploading..." + } + ] + }, + "wikipedialink": { + "render": "WP", + "condition": "wikipedia~*" + }, + + "sharelink": { + "render": "{share_link()}" + } } \ No newline at end of file diff --git a/assets/tagRenderings/questions.json b/assets/tagRenderings/questions.json index 32662cdd33..3ffefa6acc 100644 --- a/assets/tagRenderings/questions.json +++ b/assets/tagRenderings/questions.json @@ -2,20 +2,6 @@ "images": { "render": "{image_carousel()}{image_upload()}" }, - - "osmlink": { - "render": "", - "mappings":[{ - "if": "id~=-", - "then": "Uploading..." - }] - }, - - "wikipedialink": { - "render": "WP", - "condition": "wikipedia~*" - }, - "phone": { "question": { "en": "What is the phone number of {name}?", @@ -27,7 +13,6 @@ "type": "phone" } }, - "email": { "render": "{email}", "freeform": { @@ -35,7 +20,6 @@ "type": "email" } }, - "website": { "question": { "en": "What is the website of {name}?", @@ -49,7 +33,6 @@ "type": "url" } }, - "opening_hours": { "question": { "en": "What are the opening hours of {name}?", diff --git a/assets/themes/cyclestreets/cyclestreets.json b/assets/themes/cyclestreets/cyclestreets.json index 6c61bb6b6f..0026d01839 100644 --- a/assets/themes/cyclestreets/cyclestreets.json +++ b/assets/themes/cyclestreets/cyclestreets.json @@ -166,7 +166,7 @@ } ] }, - "icon": "./assets/pencil.svg", + "icon": "./assets/svg/pencil.svg", "width": "5", "color": { "render": "#aaaaaa", diff --git a/assets/themes/toilets/toilets.json b/assets/themes/toilets/toilets.json index 31dcdc1046..f5c38a4055 100644 --- a/assets/themes/toilets/toilets.json +++ b/assets/themes/toilets/toilets.json @@ -23,306 +23,6 @@ "widenFactor": 0.05, "icon": "./assets/themes/toilets/toilets.svg", "layers": [ - { - "id": "Toilet", - "name": { - "en": "Toilets", - "de": "Toiletten", - "fr": "Toilettes" - }, - "overpassTags": "amenity=toilets", - "title": { - "render": { - "en": "Toilet", - "de": "Toilette", - "fr": "Toilettes" - } - }, - "icon": { - "render": "./assets/themes/toilets/toilets.svg", - "mappings": [ - { - "if": "wheelchair=yes", - "then": "./assets/themes/toilets/wheelchair.svg" - } - ] - }, - "color": { - "render": "#0000ff" - }, - "minzoom": 12, - "wayHandling": 2, - "presets": [ - { - "title": { - "en": "Toilet", - "de": "Toilette", - "fr": "Toilettes" - }, - "tags": [ - "amenity=toilets" - ], - "description": { - "en": "A publicly accessible toilet or restroom", - "de": "Eine öffentlich zugängliche Toilette", - "fr": "Des toilettes" - } - }, - { - "title": { - "en": "Toilets with wheelchair accessible toilet", - "de": "Toiletten mit rollstuhlgerechter Toilette", - "fr": "Toilettes accessible aux personnes à mobilité réduite" - }, - "tags": [ - "amenity=toilets", - "wheelchair=yes" - ], - "description": { - "en": "A restroom which has at least one wheelchair-accessible toilet", - "de": "Eine Toilettenanlage mit mindestens einer rollstuhlgerechten Toilette", - "fr": "Toilettes avec au moins un WC accessible aux personnes à mobilité réduite" - } - } - ], - "tagRenderings": [ - "images", - { - "question": { - "en": "Are these toilets publicly accessible?", - "de": "Sind diese Toiletten öffentlich zugänglich?", - "fr": "Ces toilettes sont-elles accessibles publiquement ?" - }, - "render": { - "en": "Access is {access}", - "de": "Zugang ist {access}", - "fr": "L'accès est {access}" - }, - "freeform": { - "key": "access", - "addExtraTags": [ - "fixme=the tag access was filled out by the user and might need refinement" - ] - }, - "mappings": [ - { - "if": "access=yes", - "then": { - "en": "Public access", - "de": "Öffentlicher Zugang", - "fr": "Accès publique" - } - }, - { - "if": "access=customers", - "then": { - "en": "Only access to customers", - "de": "Nur Zugang für Kunden", - "fr": "Accès réservé aux clients" - } - }, - { - "if": "access=no", - "then": { - "en": "Not accessible", - "de": "Nicht zugänglich", - "fr": "WC privés" - } - }, - { - "if": "access=key", - "then": { - "en": "Accessible, but one has to ask a key to enter", - "de": "Zugänglich, aber man muss einen Schlüssel für die Eingabe verlangen", - "fr": "Accessible, mais vous devez demander la clé" - } - } - ] - }, - { - "question": { - "en": "Are these toilets free to use?", - "de": "Können diese Toiletten kostenlos benutzt werden?", - "fr": "Ces toilettes sont-elles payantes" - }, - "mappings": [ - { - "then": { - "en": "These are paid toilets", - "de": "Dies sind bezahlte Toiletten", - "fr": "Toilettes payantes" - }, - "if": "fee=yes" - }, - { - "if": "fee=no", - "then": { - "en": "Free to use", - "de": "Kostenlose Nutzung", - "fr": "Toilettes gratuites" - } - } - ] - }, - { - "question": { - "en": "How much does one have to pay for these toilets?", - "de": "Wie viel muss man für diese Toiletten bezahlen?", - "fr": "Quel est le prix d'accès de ces toilettes ?" - }, - "render": { - "en": "The fee is {charge}", - "de": "Die Gebühr beträgt {charge}", - "fr": "Le prix est {charge}" - }, - "condition": "fee=yes", - "freeform": { - "key": "charge", - "type": "string" - } - }, - { - "question": { - "en": "Is there a dedicated toilet for wheelchair users", - "de": "Gibt es eine Toilette für Rollstuhlfahrer?", - "fr": "Un WC réservé aux personnes à mobilité réduite est-il présent ?" - }, - "mappings": [ - { - "then": { - "en": "There is a dedicated toilet for wheelchair users", - "de": "Es gibt eine Toilette für Rollstuhlfahrer", - "fr": "Il y a un WC réservé pour les personnes à mobilité réduite" - }, - "if": "wheelchair=yes" - }, - { - "if": "wheelchair=no", - "then": { - "en": "No wheelchair access", - "de": "Kein Zugang für Rollstuhlfahrer", - "fr": "Non accessible aux personnes à mobilité réduite" - } - } - ] - }, - { - "question": { - "en": "Which kind of toilets are this?", - "de": "Welche Art von Toiletten sind das?", - "fr": "De quel type sont ces toilettes ?" - }, - "mappings": [ - { - "if": "toilets:position=seated", - "then": { - "en": "There are only seated toilets", - "de": "Es gibt nur Sitztoiletten", - "fr": "Il y a uniquement des WC assis" - } - }, - { - "if": "toilets:position=urinals", - "then": { - "en": "There are only urinals here", - "de": "Hier gibt es nur Pissoirs", - "fr": "Il y a uniquement des urinoirs" - } - }, - { - "if": "toilets:position=squat", - "then": { - "en": "There are only squat toilets here", - "de": "Es gibt hier nur Hocktoiletten.", - "fr": "Il y a uniquement des WC turques" - } - }, - { - "if": "toilets:position=seated;urinals", - "then": { - "en": "Both seated toilets and urinals are available here", - "de": "Sowohl Sitztoiletten als auch Pissoirs sind hier verfügbar", - "fr": "Il y a des WC assis et des urinoirs" - } - } - ] - }, - { - "question": { - "en": "Is a changing table (to change diapers) available?", - "de": "Ist ein Wickeltisch (zum Wechseln der Windeln) vorhanden?", - "fr": "Ces WC disposent-ils d'une table à langer ?" - }, - "mappings": [ - { - "then": { - "en": "A changing table is available", - "de": "Ein Wickeltisch ist verfügbar", - "fr": "Une table à langer est disponible" - }, - "if": "changing_table=yes" - }, - { - "if": "changing_table=no", - "then": { - "en": "No changing table is available", - "de": "Es ist kein Wickeltisch verfügbar", - "fr": "Aucune table à langer" - } - } - ] - }, - { - "question": { - "en": "Where is the changing table located?", - "de": "Wo befindet sich der Wickeltisch?", - "fr": "Où se situe la table à langer ?" - }, - "render": { - "en": "The changing table is located at {changing_table:location}", - "de": "Die Wickeltabelle befindet sich in {changing_table:location}", - "fr": "Emplacement de la table à langer : {changing_table:location}" - }, - "condition": "changing_table=yes", - "freeform": { - "key": "changing_table:location" - }, - "mappings": [ - { - "then": { - "en": "The changing table is in the toilet for women. ", - "de": "Der Wickeltisch befindet sich in der Damentoilette. ", - "fr": "La table à langer se situe dans les WC pour femmes. " - }, - "if": "changing_table:location=female_toilet" - }, - { - "then": { - "en": "The changing table is in the toilet for men. ", - "de": "Der Wickeltisch befindet sich in der Herrentoilette. ", - "fr": "La table à langer se situe dans les WC pour hommes. " - }, - "if": "changing_table:location=male_toilet" - }, - { - "if": "changing_table:location=wheelchair_toilet", - "then": { - "en": "The changing table is in the toilet for wheelchair users. ", - "de": "Der Wickeltisch befindet sich in der Toilette für Rollstuhlfahrer. ", - "fr": "La table à langer se situe dans les WC pour personnes à mobilité réduite. " - } - }, - { - "if": "changing_table:location=dedicated_room", - "then": { - "en": "The changing table is in a dedicated room. ", - "de": "Der Wickeltisch befindet sich in einem eigenen Raum. ", - "fr": "La table à langer se situe dans un espace dédié. " - } - } - ] - } - ] - } + "toilets" ] } \ No newline at end of file From e10f9b61e2f1738d079995096d14f80210d15533 Mon Sep 17 00:00:00 2001 From: Pieter Vander Vennet Date: Sun, 22 Nov 2020 03:16:56 +0100 Subject: [PATCH 11/14] Experimenting with a share button... --- UI/ShareButton.ts | 38 +++++++++++++++++++++++++++++++++++++ UI/SpecialVisualizations.ts | 4 ++-- 2 files changed, 40 insertions(+), 2 deletions(-) create mode 100644 UI/ShareButton.ts diff --git a/UI/ShareButton.ts b/UI/ShareButton.ts new file mode 100644 index 0000000000..42bb0aba12 --- /dev/null +++ b/UI/ShareButton.ts @@ -0,0 +1,38 @@ +import {UIElement} from "./UIElement"; + +export default class ShareButton extends UIElement{ + private _embedded: UIElement; + private _shareData: { text: string; title: string; url: string }; + + constructor(embedded: UIElement, shareData: { + text: string, + title: string, + url: string + }) { + super(); + this._embedded = embedded; + this._shareData = shareData; + } + + InnerRender(): string { + return `` + } + + protected InnerUpdate(htmlElement: HTMLElement) { + super.InnerUpdate(htmlElement); + const self= this; + htmlElement.addEventListener('click', () => { + if (navigator.share) { + navigator.share(self._shareData).then(() => { + console.log('Thanks for sharing!'); + }) + .catch(err => { + console.log(`Couldn't share because of`, err.message); + }); + } else { + console.log('web share not supported'); + } + }); + } + +} \ No newline at end of file diff --git a/UI/SpecialVisualizations.ts b/UI/SpecialVisualizations.ts index b88cff2314..2f65470073 100644 --- a/UI/SpecialVisualizations.ts +++ b/UI/SpecialVisualizations.ts @@ -196,8 +196,8 @@ export default class SpecialVisualizations { } ], constr: (tagSource: UIEventSource, args) => { - if (navigator.share !== undefined) { - return new FixedUiElement("").onClick(() => { + if (navigator.share) { + return new FixedUiElement("Share").onClick(() => { let name = tagSource["name"] let title= State.state.layoutToUse.data.title.txt From 2d25393962f69a9b98486d6f91f6647cc0cec93a Mon Sep 17 00:00:00 2001 From: Pieter Vander Vennet Date: Sun, 22 Nov 2020 03:50:09 +0100 Subject: [PATCH 12/14] Experimenting with the ShareButton --- AllTranslationAssets.ts | 2 +- State.ts | 2 +- UI/ShareButton.ts | 2 +- UI/SpecialVisualizations.ts | 34 ++++++++++++++--------------- assets/tagRenderings/questions.json | 10 +++++++++ assets/translations.json | 4 ++-- index.css | 30 +++++++++++++++++++++++++ 7 files changed, 61 insertions(+), 23 deletions(-) diff --git a/AllTranslationAssets.ts b/AllTranslationAssets.ts index 2e15891c97..3ef54ca45f 100644 --- a/AllTranslationAssets.ts +++ b/AllTranslationAssets.ts @@ -90,7 +90,7 @@ export default class AllTranslationAssets { getStartedNewAccount: new Translation( {"en":" or create a new account","nl":" of maak een nieuwe account aan ","fr":" ou registrez vous","es":" o crea una nueva cuenta","ca":" o crea un nou compte","gl":" ou crea unha nova conta","de":" oder ein neues Konto anlegen"} ), noTagsSelected: new Translation( {"en":"No tags selected","es":"No se han seleccionado etiquetas","ca":"No s'han seleccionat etiquetes","gl":"Non se seleccionaron etiquetas","de":"Keine Tags ausgewählt"} ), customThemeIntro: new Translation( {"en":"

Custom themes

These are previously visited user-generated themes.","nl":"

Onofficiële themea's

Je bezocht deze thema's gemaakt door andere OpenStreetMappers eerder","gl":"

Temas personalizados

Estes son temas xerados por usuarios previamente visitados.","de":"

Kundenspezifische Themen

Dies sind zuvor besuchte benutzergenerierte Themen"} ), - aboutMapcomplete: new Translation( {"en":"

About MapComplete

MapComplete is an OpenStreetMap editor that is meant to help everyone to easily add information on a single theme.

Only features relevant to a single theme are shown with a few predefined questions, in order to keep things simple and extremly user-friendly.The theme maintainer can also choose a language for the interface, choose to disable elements or even to embed it into a different website without any UI-element at all.

However, another important part of MapComplete is to always offer the next step to learn more about OpenStreetMap:

  • An iframe without UI-elements will link to a full-screen version
  • The fullscreen version offers information about OpenStreetMap
  • If you're not logged in, you're asked to log in
  • If you answered a single question, you are allowed to add points
  • At a certain point, the actual added tags appear which later get linked to the wiki...

Do you notice an issue with MapComplete? Do you have a feature request? Do you want to help translating? Head over to the source code or issue tracker.

","nl":"

Over MapComplete

MapComplete is een OpenStreetMap-editor om eenvoudig informatie toe te voegen over één enkel onderwerp.

Om de editor zo simpel en gebruiksvriendelijk mogelijk te houden, worden enkel objecten relevant voor het thema getoond.Voor deze objecten kunnen dan vragen beantwoord worden, of men kan een nieuw punt van dit thema toevoegen.De maker van het thema kan er ook voor opteren om een aantal elementen van de gebruikersinterface uit te schakelen of de taal ervan in te stellen.

Een ander belangrijk aspect is om bezoekers stap voor stap meer te leren over OpenStreetMap:

  • Een iframe zonder verdere uitleg linkt naar de volledige versie van MapComplete
  • De volledige versie heeft uitleg over OpenStreetMap
  • Als je niet aangemeld bent, wordt er je gevraagd dit te doen
  • Als je minstens één vraag hebt beantwoord, kan je punten gaan toevoegen.
  • Heb je genoeg changesets, dan verschijnen de tags die wat later doorlinken naar de wiki

Merk je een bug of wil je een extra feature? Wil je helpen vertalen? Bezoek dan de broncode en issue tracker

","de":"

Über MapComplete

MapComplete ist ein OpenStreetMap-Editor, der jedem helfen soll, auf einfache Weise Informationen zu einem Einzelthema hinzuzufügen.

Nur Merkmale, die für ein einzelnes Thema relevant sind, werden mit einigen vordefinierten Fragen gezeigt, um die Dinge einfach und extrem benutzerfreundlich zu halten.Der Themen-Betreuer kann auch eine Sprache für die Schnittstelle wählen, Elemente deaktivieren oder sogar in eine andere Website ohne jegliches UI-Element einbetten.

Ein weiterer wichtiger Teil von MapComplete ist jedoch, immer den nächsten Schritt anzubietenum mehr über OpenStreetMap zu erfahren:

  • Ein iframe ohne UI-Elemente verlinkt zu einer Vollbildversion
  • Die Vollbildversion bietet Informationen über OpenStreetMap
  • Wenn Sie nicht eingeloggt sind, werden Sie gebeten, sich einzuloggen
  • Wenn Sie eine einzige Frage beantwortet haben, dürfen Sie Punkte hinzufügen
  • An einem bestimmten Punkt erscheinen die tatsächlich hinzugefügten Tags, die später mit dem Wiki verlinkt werden...

Fällt Ihnen ein Problem mit MapComplete auf? Haben Sie einen Feature-Wunsch? Wollen Sie beim Übersetzen helfen? Gehen Sie zum Quellcode oder zur Problemverfolgung.

"} ), + aboutMapcomplete: new Translation( {"en":"

About MapComplete

MapComplete is an OpenStreetMap editor that is meant to help everyone to easily add information on a single theme.

Only features relevant to a single theme are shown with a few predefined questions, in order to keep things simple and extremly user-friendly.The theme maintainer can also choose a language for the interface, choose to disable elements or even to embed it into a different website without any UI-element at all.

However, another important part of MapComplete is to always offer the next step to learn more about OpenStreetMap:

  • An iframe without UI-elements will link to a full-screen version
  • The fullscreen version offers information about OpenStreetMap
  • If you're not logged in, you're asked to log in
  • If you answered a single question, you are allowed to add points
  • At a certain point, the actual added tags appear which later get linked to the wiki...

Do you notice an issue with MapComplete? Do you have a feature request? Do you want to help translating? Head over to the source code or issue tracker. Follow the edit count on OsmCha

","nl":"

Over MapComplete

MapComplete is een OpenStreetMap-editor om eenvoudig informatie toe te voegen over één enkel onderwerp.

Om de editor zo simpel en gebruiksvriendelijk mogelijk te houden, worden enkel objecten relevant voor het thema getoond.Voor deze objecten kunnen dan vragen beantwoord worden, of men kan een nieuw punt van dit thema toevoegen.De maker van het thema kan er ook voor opteren om een aantal elementen van de gebruikersinterface uit te schakelen of de taal ervan in te stellen.

Een ander belangrijk aspect is om bezoekers stap voor stap meer te leren over OpenStreetMap:

  • Een iframe zonder verdere uitleg linkt naar de volledige versie van MapComplete
  • De volledige versie heeft uitleg over OpenStreetMap
  • Als je niet aangemeld bent, wordt er je gevraagd dit te doen
  • Als je minstens één vraag hebt beantwoord, kan je punten gaan toevoegen.
  • Heb je genoeg changesets, dan verschijnen de tags die wat later doorlinken naar de wiki

Merk je een bug of wil je een extra feature? Wil je helpen vertalen? Bezoek dan de broncode en issue tracker. Volg de edits op OsmCha

","de":"

Über MapComplete

MapComplete ist ein OpenStreetMap-Editor, der jedem helfen soll, auf einfache Weise Informationen zu einem Einzelthema hinzuzufügen.

Nur Merkmale, die für ein einzelnes Thema relevant sind, werden mit einigen vordefinierten Fragen gezeigt, um die Dinge einfach und extrem benutzerfreundlich zu halten.Der Themen-Betreuer kann auch eine Sprache für die Schnittstelle wählen, Elemente deaktivieren oder sogar in eine andere Website ohne jegliches UI-Element einbetten.

Ein weiterer wichtiger Teil von MapComplete ist jedoch, immer den nächsten Schritt anzubietenum mehr über OpenStreetMap zu erfahren:

  • Ein iframe ohne UI-Elemente verlinkt zu einer Vollbildversion
  • Die Vollbildversion bietet Informationen über OpenStreetMap
  • Wenn Sie nicht eingeloggt sind, werden Sie gebeten, sich einzuloggen
  • Wenn Sie eine einzige Frage beantwortet haben, dürfen Sie Punkte hinzufügen
  • An einem bestimmten Punkt erscheinen die tatsächlich hinzugefügten Tags, die später mit dem Wiki verlinkt werden...

Fällt Ihnen ein Problem mit MapComplete auf? Haben Sie einen Feature-Wunsch? Wollen Sie beim Übersetzen helfen? Gehen Sie zum Quellcode oder zur Problemverfolgung.

"} ), backgroundMap: new Translation( {"en":"Background map","ca":"Mapa de fons","es":"Mapa de fondo","nl":"Achtergrondkaart","de":"Hintergrundkarte"} ), zoomInToSeeThisLayer: new Translation( {"en":"Zoom in to see this layer","ca":"Amplia per veure aquesta capa","es":"Amplía para ver esta capa","nl":"Vergroot de kaart om deze laag te zien","de":"Vergrößern, um diese Ebene zu sehen"} ), weekdays: { abbreviations: { monday: new Translation( {"en":"Mon","ca":"Dil","es":"Lun","nl":"Maan","fr":"Lun"} ), diff --git a/State.ts b/State.ts index d60d4c1e7c..5eb6fd3cec 100644 --- a/State.ts +++ b/State.ts @@ -23,7 +23,7 @@ export default class State { // The singleton of the global state public static state: State; - public static vNumber = "0.2.1d"; + public static vNumber = "0.2.1e"; // The user journey states thresholds when a new feature gets unlocked public static userJourney = { diff --git a/UI/ShareButton.ts b/UI/ShareButton.ts index 42bb0aba12..9fadc94519 100644 --- a/UI/ShareButton.ts +++ b/UI/ShareButton.ts @@ -15,7 +15,7 @@ export default class ShareButton extends UIElement{ } InnerRender(): string { - return `` + return `` } protected InnerUpdate(htmlElement: HTMLElement) { diff --git a/UI/SpecialVisualizations.ts b/UI/SpecialVisualizations.ts index 2f65470073..f0815d4061 100644 --- a/UI/SpecialVisualizations.ts +++ b/UI/SpecialVisualizations.ts @@ -10,6 +10,8 @@ import Locale from "../UI/i18n/Locale"; import {ImageUploadFlow} from "./Image/ImageUploadFlow"; import {Translation} from "./i18n/Translation"; import State from "../State"; +import ShareButton from "./ShareButton"; +import Svg from "../Svg"; export class SubstitutedTranslation extends UIElement { private readonly tags: UIEventSource; @@ -196,25 +198,21 @@ export default class SpecialVisualizations { } ], constr: (tagSource: UIEventSource, args) => { - if (navigator.share) { - return new FixedUiElement("Share").onClick(() => { - - let name = tagSource["name"] - let title= State.state.layoutToUse.data.title.txt - if(name === undefined){ - name = title - }else{ - name = `${name} (${title})` - } - - navigator.share({ - url: args[0] ?? window.location.href, - title: name, - text: State.state.layoutToUse.data.shortDescription.txt - }) - }) + if (window.navigator.share) { + const title = State.state.layoutToUse.data.title.txt; + let name = tagSource.data.name; + if(name){ + name += `${name} (${title})` + }else{ + name = title; + } + return new ShareButton(Svg.share_svg(), { + title: name, + url: args[0] ?? window.location.href, + text: State.state.layoutToUse.data.shortDescription.txt + }) } else { - return new FixedUiElement("") + return new Combine([""]) } } diff --git a/assets/tagRenderings/questions.json b/assets/tagRenderings/questions.json index 3ffefa6acc..d0591b1d84 100644 --- a/assets/tagRenderings/questions.json +++ b/assets/tagRenderings/questions.json @@ -46,5 +46,15 @@ "key": "opening_hours", "type": "opening_hours" } + }, + "description": { + "question": { + "nl": "Zijn er extra zaken die je niet in de bovenstaande vragen kwijt kon? Zet deze in de descriptionHerhaal geen antwoorden die je reeds gaf", + "en": "Is there still something relevant you couldn't give in the previous questions? Add it here.
Don't repeat already stated facts" + }, + "render": "{description}", + "freeform": { + "key": "description" + } } } \ No newline at end of file diff --git a/assets/translations.json b/assets/translations.json index ed3416956c..d5ce8bf765 100644 --- a/assets/translations.json +++ b/assets/translations.json @@ -709,8 +709,8 @@ "de": "

Kundenspezifische Themen

Dies sind zuvor besuchte benutzergenerierte Themen" }, "aboutMapcomplete": { - "en": "

About MapComplete

MapComplete is an OpenStreetMap editor that is meant to help everyone to easily add information on a single theme.

Only features relevant to a single theme are shown with a few predefined questions, in order to keep things simple and extremly user-friendly.The theme maintainer can also choose a language for the interface, choose to disable elements or even to embed it into a different website without any UI-element at all.

However, another important part of MapComplete is to always offer the next step to learn more about OpenStreetMap:

  • An iframe without UI-elements will link to a full-screen version
  • The fullscreen version offers information about OpenStreetMap
  • If you're not logged in, you're asked to log in
  • If you answered a single question, you are allowed to add points
  • At a certain point, the actual added tags appear which later get linked to the wiki...

Do you notice an issue with MapComplete? Do you have a feature request? Do you want to help translating? Head over to the source code or issue tracker.

", - "nl": "

Over MapComplete

MapComplete is een OpenStreetMap-editor om eenvoudig informatie toe te voegen over één enkel onderwerp.

Om de editor zo simpel en gebruiksvriendelijk mogelijk te houden, worden enkel objecten relevant voor het thema getoond.Voor deze objecten kunnen dan vragen beantwoord worden, of men kan een nieuw punt van dit thema toevoegen.De maker van het thema kan er ook voor opteren om een aantal elementen van de gebruikersinterface uit te schakelen of de taal ervan in te stellen.

Een ander belangrijk aspect is om bezoekers stap voor stap meer te leren over OpenStreetMap:

  • Een iframe zonder verdere uitleg linkt naar de volledige versie van MapComplete
  • De volledige versie heeft uitleg over OpenStreetMap
  • Als je niet aangemeld bent, wordt er je gevraagd dit te doen
  • Als je minstens één vraag hebt beantwoord, kan je punten gaan toevoegen.
  • Heb je genoeg changesets, dan verschijnen de tags die wat later doorlinken naar de wiki

Merk je een bug of wil je een extra feature? Wil je helpen vertalen? Bezoek dan de broncode en issue tracker

", + "en": "

About MapComplete

MapComplete is an OpenStreetMap editor that is meant to help everyone to easily add information on a single theme.

Only features relevant to a single theme are shown with a few predefined questions, in order to keep things simple and extremly user-friendly.The theme maintainer can also choose a language for the interface, choose to disable elements or even to embed it into a different website without any UI-element at all.

However, another important part of MapComplete is to always offer the next step to learn more about OpenStreetMap:

  • An iframe without UI-elements will link to a full-screen version
  • The fullscreen version offers information about OpenStreetMap
  • If you're not logged in, you're asked to log in
  • If you answered a single question, you are allowed to add points
  • At a certain point, the actual added tags appear which later get linked to the wiki...

Do you notice an issue with MapComplete? Do you have a feature request? Do you want to help translating? Head over to the source code or issue tracker. Follow the edit count on OsmCha

", + "nl": "

Over MapComplete

MapComplete is een OpenStreetMap-editor om eenvoudig informatie toe te voegen over één enkel onderwerp.

Om de editor zo simpel en gebruiksvriendelijk mogelijk te houden, worden enkel objecten relevant voor het thema getoond.Voor deze objecten kunnen dan vragen beantwoord worden, of men kan een nieuw punt van dit thema toevoegen.De maker van het thema kan er ook voor opteren om een aantal elementen van de gebruikersinterface uit te schakelen of de taal ervan in te stellen.

Een ander belangrijk aspect is om bezoekers stap voor stap meer te leren over OpenStreetMap:

  • Een iframe zonder verdere uitleg linkt naar de volledige versie van MapComplete
  • De volledige versie heeft uitleg over OpenStreetMap
  • Als je niet aangemeld bent, wordt er je gevraagd dit te doen
  • Als je minstens één vraag hebt beantwoord, kan je punten gaan toevoegen.
  • Heb je genoeg changesets, dan verschijnen de tags die wat later doorlinken naar de wiki

Merk je een bug of wil je een extra feature? Wil je helpen vertalen? Bezoek dan de broncode en issue tracker. Volg de edits op OsmCha

", "de": "

Über MapComplete

MapComplete ist ein OpenStreetMap-Editor, der jedem helfen soll, auf einfache Weise Informationen zu einem Einzelthema hinzuzufügen.

Nur Merkmale, die für ein einzelnes Thema relevant sind, werden mit einigen vordefinierten Fragen gezeigt, um die Dinge einfach und extrem benutzerfreundlich zu halten.Der Themen-Betreuer kann auch eine Sprache für die Schnittstelle wählen, Elemente deaktivieren oder sogar in eine andere Website ohne jegliches UI-Element einbetten.

Ein weiterer wichtiger Teil von MapComplete ist jedoch, immer den nächsten Schritt anzubietenum mehr über OpenStreetMap zu erfahren:

  • Ein iframe ohne UI-Elemente verlinkt zu einer Vollbildversion
  • Die Vollbildversion bietet Informationen über OpenStreetMap
  • Wenn Sie nicht eingeloggt sind, werden Sie gebeten, sich einzuloggen
  • Wenn Sie eine einzige Frage beantwortet haben, dürfen Sie Punkte hinzufügen
  • An einem bestimmten Punkt erscheinen die tatsächlich hinzugefügten Tags, die später mit dem Wiki verlinkt werden...

Fällt Ihnen ein Problem mit MapComplete auf? Haben Sie einen Feature-Wunsch? Wollen Sie beim Übersetzen helfen? Gehen Sie zum Quellcode oder zur Problemverfolgung.

" }, "backgroundMap": { diff --git a/index.css b/index.css index 3e263582b0..83d982aa80 100644 --- a/index.css +++ b/index.css @@ -501,3 +501,33 @@ a { max-width: 1em; } + +.share-button { + background-color: var(--subtle-detail-color); + border: none; + color: var(--subtle-detail-color-contrast); + text-decoration: none; + display: inline-block; + border-radius: 3em; + width: 4em; + height: 3em; + box-sizing: border-box; +} + +.share-button svg { + max-height: 2.0em; + width: 2.0em; + padding: 0.5em; + fill: var(--subtle-detail-color-contrast); + stroke: var(--subtle-detail-color-contrast); +} + +.share-button svg path{ + fill: var(--subtle-detail-color-contrast); + stroke: var(--subtle-detail-color-contrast); +} + +.share-button svg circle{ + fill: var(--subtle-detail-color-contrast); + stroke: var(--subtle-detail-color-contrast); +} From 4700e71d2e5afb1742cec431358dd13453f3abbd Mon Sep 17 00:00:00 2001 From: Pieter Vander Vennet Date: Mon, 23 Nov 2020 02:55:18 +0100 Subject: [PATCH 13/14] Add share button (supported browsers only), refactoring of fullscreenmessage, fancier scrolling --- InitUiElements.ts | 2 +- State.ts | 2 +- Svg.ts | 2 +- UI/FullScreenMessageBoxHandler.ts | 56 +++++++------------ UI/Popup/FeatureInfoBox.ts | 1 + UI/SpecialVisualizations.ts | 7 ++- assets/svg/share.svg | 89 ++++++++----------------------- assets/tagRenderings/icons.json | 2 +- css/fullscreenmessagebox.css | 57 ++++++++++++++++++++ css/mobile.css | 1 + css/tagrendering.css | 4 +- index.css | 11 ++-- index.html | 1 + 13 files changed, 117 insertions(+), 118 deletions(-) create mode 100644 css/fullscreenmessagebox.css diff --git a/InitUiElements.ts b/InitUiElements.ts index ad0488431d..6af20b870d 100644 --- a/InitUiElements.ts +++ b/InitUiElements.ts @@ -299,7 +299,7 @@ export class InitUiElements { ] if (State.state.featureSwitchShareScreen.data) { - tabs.push({header: Svg.share, content: new ShareScreen()}); + tabs.push({header: Svg.share_img, content: new ShareScreen()}); } if (State.state.featureSwitchMoreQuests.data) { diff --git a/State.ts b/State.ts index 5eb6fd3cec..d393630695 100644 --- a/State.ts +++ b/State.ts @@ -23,7 +23,7 @@ export default class State { // The singleton of the global state public static state: State; - public static vNumber = "0.2.1e"; + public static vNumber = "0.2.2"; // The user journey states thresholds when a new feature gets unlocked public static userJourney = { diff --git a/Svg.ts b/Svg.ts index 4fcddce8f6..1af54286c6 100644 --- a/Svg.ts +++ b/Svg.ts @@ -194,7 +194,7 @@ export default class Svg { public static search_svg() { return new FixedUiElement(Svg.search);} public static search_ui() { return new FixedUiElement(Svg.search_img);} - public static share = " image/svg+xml " + public static share = " image/svg+xml " public static share_img = Img.AsImageElement(Svg.share) public static share_svg() { return new FixedUiElement(Svg.share);} public static share_ui() { return new FixedUiElement(Svg.share_img);} diff --git a/UI/FullScreenMessageBoxHandler.ts b/UI/FullScreenMessageBoxHandler.ts index 412d65a178..2451495787 100644 --- a/UI/FullScreenMessageBoxHandler.ts +++ b/UI/FullScreenMessageBoxHandler.ts @@ -16,26 +16,15 @@ export class FullScreenMessageBox extends UIElement { this.HideOnEmpty(true); this.returnToTheMap = - new Combine([Translations.t.general.returnToTheMap.Clone().SetStyle("font-size:xx-large")]) - .SetStyle("background:var(--catch-detail-color);" + - "position: fixed;" + - "z-index: 10000;" + - "bottom: 0;" + - "left: 0;" + - `height: var(--return-to-the-map-height);` + - "width: 100vw;" + - "color: var(--catch-detail-color-contrast);" + - "font-weight: bold;" + - "pointer-events: all;" + - "cursor: pointer;" + - "padding-top: 1.2em;" + - "text-align: center;" + - "padding-bottom: 1.2em;" + - "box-sizing:border-box") - .onClick(() => { - State.state.fullScreenMessage.setData(undefined); - onClear(); - }); + new Combine([ + // Wrapped another time to prevent the value of 'em' to fluctuate + Translations.t.general.returnToTheMap.Clone() + ]) + .onClick(() => { + State.state.fullScreenMessage.setData(undefined); + onClear(); + }) + .SetClass("to-the-map") } @@ -45,25 +34,18 @@ export class FullScreenMessageBox extends UIElement { return ""; } this._content = State.state.fullScreenMessage.data; - const innerWrap = new Combine([this._content]).SetStyle( - "display: block;" + - "padding: 1em;" + - "padding-bottom: 6em; " - ); - const uielement = new Combine([innerWrap]).SetStyle( - "display:block;" + - `margin-bottom: var(--return-to-the-map-height);` + - "box-sizing:border-box;" + - `height:calc(100vh - var(--return-to-the-map-height));` + - "overflow-y: auto;" + - "max-width:100vw;" + - "overflow-x:hidden;" + - "background:var(--background-color);" + - "color: var(--foreground-color);" - ); - return new Combine([uielement, this.returnToTheMap]) + const innerWrap = new Combine([this._content]).SetClass("fullscreenmessage-content") + + return new Combine([innerWrap, this.returnToTheMap]) + .SetStyle("display:block; height: 100%;") .Render(); } + protected InnerUpdate(htmlElement: HTMLElement) { + super.InnerUpdate(htmlElement); + const height = htmlElement.getElementsByClassName("featureinfobox-titlebar")[0]?.clientHeight ?? 0; + htmlElement.style.setProperty("--variable-title-height", height+"px") + } + } \ No newline at end of file diff --git a/UI/Popup/FeatureInfoBox.ts b/UI/Popup/FeatureInfoBox.ts index 7c1ac0b490..a6436277b9 100644 --- a/UI/Popup/FeatureInfoBox.ts +++ b/UI/Popup/FeatureInfoBox.ts @@ -53,4 +53,5 @@ export class FeatureInfoBox extends UIElement { .Render(); } + } diff --git a/UI/SpecialVisualizations.ts b/UI/SpecialVisualizations.ts index f0815d4061..0afad7be6e 100644 --- a/UI/SpecialVisualizations.ts +++ b/UI/SpecialVisualizations.ts @@ -193,8 +193,7 @@ export default class SpecialVisualizations { args: [ { name: "url", - doc: "The url to share", - defaultValue: "{current_url()}" + doc: "The url to share (defualt: current URL)", } ], constr: (tagSource: UIEventSource, args) => { @@ -202,7 +201,7 @@ export default class SpecialVisualizations { const title = State.state.layoutToUse.data.title.txt; let name = tagSource.data.name; if(name){ - name += `${name} (${title})` + name = `${name} (${title})` }else{ name = title; } @@ -212,7 +211,7 @@ export default class SpecialVisualizations { text: State.state.layoutToUse.data.shortDescription.txt }) } else { - return new Combine([""]) + return new FixedUiElement("") } } diff --git a/assets/svg/share.svg b/assets/svg/share.svg index 83f599f43a..1347e23c6d 100644 --- a/assets/svg/share.svg +++ b/assets/svg/share.svg @@ -1,60 +1,17 @@ - - + version="1.1" + viewBox="0 0 20.06869 19.489862" + height="73.662468" + width="75.850166"> - - - - - @@ -63,38 +20,34 @@ image/svg+xml - + + transform="translate(-3.3314588,-273.65084)" + id="layer1"> + d="m 19.212364,278.17517 -11.9689358,5.52059 11.9388628,5.50669" + style="fill:none;stroke-width:2.43863511;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;stroke:#000000" /> + cx="7.2434282" + id="path820" + style="fill-opacity:1;stroke:none;stroke-width:0.53329796;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" /> - + + cx="19.48818" + id="path820-3-6" + style="fill-opacity:1;stroke:none;stroke-width:0.53329796;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" /> diff --git a/assets/tagRenderings/icons.json b/assets/tagRenderings/icons.json index db3dd39098..cc3fcbfda0 100644 --- a/assets/tagRenderings/icons.json +++ b/assets/tagRenderings/icons.json @@ -13,7 +13,7 @@ "condition": "wikipedia~*" }, "phonelink": { - "render": "", + "render": "", "condition": "phone~*" }, "sharelink": { diff --git a/css/fullscreenmessagebox.css b/css/fullscreenmessagebox.css new file mode 100644 index 0000000000..dba3e476d6 --- /dev/null +++ b/css/fullscreenmessagebox.css @@ -0,0 +1,57 @@ +.fullscreenmessage-content { + max-height: calc(100vh - var(--return-to-the-map-height)); + height: 100%; + overflow-y: auto; + overflow-x: hidden; + background-color: var(--background-color); + display: block; +} + +.fullscreenmessage-content .featureinfobox { + padding: 1em; + position: relative; +} + +.fullscreenmessage-content .featureinfobox-content { + padding: 1em; + top: var(--variable-title-height); + /* 2em extra: padding from the title */ + max-height: calc(100vh - var(--variable-title-height) - var(--return-to-the-map-height) - 2em) !important; + display: block; + position: absolute; + overflow-y: auto; +} + +.fullscreenmessage-content .featureinfobox-titlebar { + position: fixed; + top: 0; + left: 0; + z-index: 10001; + background-color: var(--background-color); + padding: 0.5em; + width: 100%; + box-sizing: border-box; + border-bottom: 2px solid var(--foreground-color); +} + +.to-the-map span { + font-size: xx-large; +} + +.to-the-map { + background: var(--catch-detail-color); + height: var(--return-to-the-map-height); + position: fixed; + z-index: 10000; + bottom: 0; + left: 0; + width: 100vw; + color: var(--catch-detail-color-contrast); + font-weight: bold; + pointer-events: all; + cursor: pointer; + padding-top: 1.2em; + text-align: center; + padding-bottom: 1.2em; + box-sizing: border-box; +} diff --git a/css/mobile.css b/css/mobile.css index 8525b13106..c6070551a3 100644 --- a/css/mobile.css +++ b/css/mobile.css @@ -68,6 +68,7 @@ Contains tweaks for small screens position: absolute; z-index: 10000; width: 100vw; + height: 100vh; } #welcomeMessage { diff --git a/css/tagrendering.css b/css/tagrendering.css index 8026491369..c8e0f687cd 100644 --- a/css/tagrendering.css +++ b/css/tagrendering.css @@ -9,13 +9,14 @@ } .featureinfobox-icons img{ max-height: 1.5em; - width:1.5em; + width: 1.5em; } .featureinfobox-icons { } .featureinfobox-icons span { display: inline-block; + padding-right: 0.1em; } .featureinfobox-titlebar{ @@ -29,6 +30,7 @@ display:block; max-height: 75vh; overflow-y: auto; + overflow-x: hidden; } @media only screen and (max-width: 600px), only screen and (max-height: 600px) { .featureinfobox-content { diff --git a/index.css b/index.css index 83d982aa80..655a69aef2 100644 --- a/index.css +++ b/index.css @@ -10,6 +10,7 @@ --shadow-color: #00000066; --return-to-the-map-height: 5em; + --variable-title-height: 0px; /*Set by javascript dynamically*/ } html, body { @@ -509,15 +510,17 @@ a { text-decoration: none; display: inline-block; border-radius: 3em; - width: 4em; - height: 3em; + height: 2.5em; + width: 2.5em; box-sizing: border-box; + padding:0; } .share-button svg { - max-height: 2.0em; - width: 2.0em; + height: 1.5em; + width: 1.5em; padding: 0.5em; + padding-left: 0.4em; fill: var(--subtle-detail-color-contrast); stroke: var(--subtle-detail-color-contrast); } diff --git a/index.html b/index.html index d74743ada1..9692608b7f 100644 --- a/index.html +++ b/index.html @@ -14,6 +14,7 @@ + From 02ce4e5d7e99c5e490d42006e1b174f8bca727cd Mon Sep 17 00:00:00 2001 From: Pieter Vander Vennet Date: Mon, 23 Nov 2020 03:13:52 +0100 Subject: [PATCH 14/14] Small workaround for share api which does not share the hash --- InitUiElements.ts | 5 +++++ State.ts | 2 +- UI/ShareButton.ts | 3 +++ assets/layers/bike_shop/bike_shop.json | 3 ++- css/fullscreenmessagebox.css | 2 +- css/tagrendering.css | 1 + 6 files changed, 13 insertions(+), 3 deletions(-) diff --git a/InitUiElements.ts b/InitUiElements.ts index 6af20b870d..711e1a6c72 100644 --- a/InitUiElements.ts +++ b/InitUiElements.ts @@ -85,6 +85,11 @@ export class InitUiElements { throw "Incorrect layout" } + const hashContent = QueryParameters.GetQueryParameter("hash_content", "", "A workaround for the share-api which doesn't share the hash..."); + if((hashContent.data ?? "") !== ""){ + window.location.hash = hashContent.data; + } + console.log("Using layout: ", layoutToUse.id, "LayoutFromBase64 is ", layoutFromBase64); State.state = new State(layoutToUse); diff --git a/State.ts b/State.ts index d393630695..235227ac11 100644 --- a/State.ts +++ b/State.ts @@ -23,7 +23,7 @@ export default class State { // The singleton of the global state public static state: State; - public static vNumber = "0.2.2"; + public static vNumber = "0.2.2a"; // The user journey states thresholds when a new feature gets unlocked public static userJourney = { diff --git a/UI/ShareButton.ts b/UI/ShareButton.ts index 9fadc94519..a94c55da0d 100644 --- a/UI/ShareButton.ts +++ b/UI/ShareButton.ts @@ -12,6 +12,9 @@ export default class ShareButton extends UIElement{ super(); this._embedded = embedded; this._shareData = shareData; + if(this._shareData.url.indexOf("#")> 0){ + this._shareData.url = this._shareData.url.replace("#","&hash_content="); + } } InnerRender(): string { diff --git a/assets/layers/bike_shop/bike_shop.json b/assets/layers/bike_shop/bike_shop.json index 1a931461ce..3d1d6c988f 100644 --- a/assets/layers/bike_shop/bike_shop.json +++ b/assets/layers/bike_shop/bike_shop.json @@ -197,7 +197,8 @@ }, "phonelink", "wikipedialink", - "osmlink" + "osmlink", + "sharelink" ], "description": { "en": "A shop specifically selling bicycles or related items", diff --git a/css/fullscreenmessagebox.css b/css/fullscreenmessagebox.css index dba3e476d6..97dc0d5e83 100644 --- a/css/fullscreenmessagebox.css +++ b/css/fullscreenmessagebox.css @@ -31,7 +31,7 @@ padding: 0.5em; width: 100%; box-sizing: border-box; - border-bottom: 2px solid var(--foreground-color); + } .to-the-map span { diff --git a/css/tagrendering.css b/css/tagrendering.css index c8e0f687cd..76bbf9282d 100644 --- a/css/tagrendering.css +++ b/css/tagrendering.css @@ -24,6 +24,7 @@ font-weight: bold; display: flex; justify-content: space-between; + border-bottom: 2px solid var(--foreground-color); } .featureinfobox-content {