Add OpenStreetMap Notes Layer (#458)

* use a local variable (best practices)

* Add OpenStreetMap notes as overlay.

This commit adds a new layer which renders OpenStreetMap notes in the
current view.

The layer can be activated via the "More" button in the layers sidebar.

Fixes #439

README.md

@@ -140,3 +140,5 @@ Copyright (c) 2018 Norbert Renner and [contributors](https://github.com/nrenner/
     [CC0-1.0 License](https://github.com/mapbox/maki/blob/master/LICENSE.txt)
 -   [temaki](https://github.com/ideditor/temaki)
     [CC0-1.0 License](https://github.com/ideditor/temaki/blob/main/LICENSE.md)
+-   [leaflet-osm-notes](https://github.com/osmlab/leaflet-osm-notes)
+    [The Unlicense](https://github.com/osmlab/leaflet-osm-notes/blob/gh-pages/LICENSE)

js/LayersConfig.js

@@ -59,7 +59,7 @@ BR.LayersConfig = L.Class.extend({
     _customizeLayers: function () {
         var propertyOverrides = BR.confLayers.getPropertyOverrides();
 
-        for (id in propertyOverrides) {
+        for (var id in propertyOverrides) {
             var layer = BR.layerIndex[id];
 
             if (layer) {
@@ -238,6 +238,10 @@ BR.LayersConfig = L.Class.extend({
         );
     },
 
+    createOpenStreetMapNotesLayer: function () {
+        return new leafletOsmNotes();
+    },
+
     createLayer: function (layerData) {
         var props = layerData.properties;
         var url = props.url;
@@ -322,6 +326,8 @@ BR.LayersConfig = L.Class.extend({
             }
         } else if (props.dataSource === 'OverpassAPI') {
             layer = this.createOverpassLayer(props.query, props.icon);
+        } else if (props.dataSource === 'OpenStreetMapNotesAPI') {
+            layer = this.createOpenStreetMapNotesLayer();
         } else {
             // JOSM
             var josmUrl = url;

js/control/Layers.js

@@ -118,6 +118,8 @@ BR.Layers = L.Class.extend({
 
             if (dataSource === 'OverpassAPI') {
                 layer = this._layersControl.layersConfig.createOverpassLayer(layerUrl);
+            } else if (dataSource === 'OpenStreetMapNotesAPI') {
+                layer = this._layersControl.layersConfig.createOpenStreetMapNotesLayer();
             } else {
                 layer = L.tileLayer(layerUrl);
             }

layers/config/overrides.js

@@ -220,6 +220,10 @@ BR.confLayers.getPropertyOverrides = function() {
             'nameShort': 'Mapillary',
             'mapUrl': 'https://www.mapillary.com/app/?lat={lat}&lng={lon}&z={zoom}&menu=false'
         },
+        'osm-notes': {
+            'nameShort': 'OSM Notes',
+            'mapUrl': 'https://www.openstreetmap.org/#map={zoom}/{lat}/{lon}&layers=N'
+        },
         'openpt_map': {
             'nameShort': 'openptmap',
             'mapUrl': 'http://openptmap.org/?zoom={zoom}&lat={lat}&lon={lon}&layers=B0000TFT'

layers/config/tree.js

@@ -72,7 +72,8 @@ BR.confLayers.tree = {
             'Waymarked_Trails-Cycling',
             'Waymarked_Trails-Hiking',
             'Waymarked_Trails-MTB',
-            'mapillary-coverage-raster'
+            'mapillary-coverage-raster',
+            'osm-notes'
         ],
         'country': [
             'historic-place-contours',

layers/extra/osm-notes.geojson

@@ -0,0 +1,14 @@
+{
+    "geometry": null,
+    "properties": {
+        "attribution": {
+            "text": "© OpenStreetMap contributors",
+            "url": "https://www.openstreetmap.org/"
+        },
+        "id": "osm-notes",
+        "name": "OpenStreetMap Notes",
+        "overlay": true,
+        "dataSource": "OpenStreetMapNotesAPI"
+    },
+    "type": "Feature"
+}

package.json

@@ -66,6 +66,7 @@
         "leaflet-filelayer": "^1.2.0",
         "leaflet-geometryutil": "^0.9.1",
         "leaflet-hotline": "^0.4.0",
+        "leaflet-osm-notes": "osmlab/leaflet-osm-notes#af2aa811",
         "leaflet-plugins": "~3.0.0",
         "leaflet-providers": "^1.10.2",
         "leaflet-routing": "nrenner/leaflet-routing#e94e153",
@@ -200,6 +201,11 @@
                 "images/*.+(png|gif)"
             ]
         },
+        "leaflet-osm-notes": {
+            "main": [
+                "leaflet-osm-notes.js"
+            ]
+        },
         "url-search-params": {
             "main": "build/url-search-params.js"
         },

yarn.lock

@@ -7784,6 +7784,13 @@ leaflet-hotline@^0.4.0:
   resolved "https://registry.yarnpkg.com/leaflet-hotline/-/leaflet-hotline-0.4.0.tgz#e01069836a9d2e2c78b1fa1db2013bd03c8ff8d9"
   integrity sha1-4BBpg2qdLix4sfodsgE70DyP+Nk=
 
+leaflet-osm-notes@osmlab/leaflet-osm-notes#af2aa811:
+  version "0.0.1"
+  resolved "https://codeload.github.com/osmlab/leaflet-osm-notes/tar.gz/af2aa8116ee693c1d818df53f57809391c08f514"
+  dependencies:
+    moment "~2.0.0"
+    reqwest "~0.7.2"
+
 leaflet-plugins@~3.0.0:
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/leaflet-plugins/-/leaflet-plugins-3.0.3.tgz#7c727ac79a37636b245dd1adc64e10c61b425864"
@@ -8391,6 +8398,11 @@ mkdirp@^0.5.1, mkdirp@^0.5.5, "mkdirp@~0.3 || 0.4 || 0.5", mkdirp@~0.5.0:
   dependencies:
     minimist "^1.2.5"
 
+moment@~2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/moment/-/moment-2.0.0.tgz#2bbc5b44c321837693ab6efcadbd46ed946211fe"
+  integrity sha1-K7xbRMMhg3aTq278rb1G7ZRiEf4=
+
 mothership@~0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/mothership/-/mothership-0.2.0.tgz#93d48a2fbc3e50e2a5fc8ed586f5bc44c65f9a99"
@@ -9953,6 +9965,11 @@ requires-port@^1.0.0:
   resolved "https://registry.yarnpkg.com/requires-port/-/requires-port-1.0.0.tgz#925d2601d39ac485e091cf0da5c6e694dc3dcaff"
   integrity sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8=
 
+reqwest@~0.7.2:
+  version "0.7.3"
+  resolved "https://registry.yarnpkg.com/reqwest/-/reqwest-0.7.3.tgz#d7e249ba42690fc70dc9901f36ce4e33b0d43d85"
+  integrity sha1-1+JJukJpD8cNyZAfNs5OM7DUPYU=
+
 resolve-cwd@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/resolve-cwd/-/resolve-cwd-3.0.0.tgz#0f0075f1bb2544766cf73ba6a6e2adfebcb13f2d"