diff --git a/css/map.css b/css/map.css
index 624aa97a2..b2d232a0d 100644
--- a/css/map.css
+++ b/css/map.css
@@ -1549,6 +1549,44 @@ text.gpx {
.layer-mapillary g path.viewfield {
stroke-width: 0;
fill-opacity: 0.6;
+
+/* Mapillary sign Layer */
+
+.node {
+ border: 1px solid green;
+ //background-color: white;
+}
+
+.node body {
+ min-width: 20px;
+}
+
+.layer-mapillary-signs {
+ pointer-events: none;
+}
+
+.layer-mapillary-signs g {
+ pointer-events: visible;
+ cursor: pointer; /* Opera */
+ cursor: url(img/cursor-select-mapillary.png) 6 1, pointer; /* FF */
+}
+
+.layer-mapillary-signs g * {
+ stroke-width: 2;
+ stroke: red;
+ fill: red;
+}
+
+.layer-mapillary-signs g:hover * {
+ stroke-width: 2;
+ stroke: red;
+ fill: red;
+}
+
+.layer-mapillary-signs g.selected * {
+ stroke-width: 4;
+ stroke: red;
+ fill: red;
}
/* Modes */
diff --git a/data/core.yaml b/data/core.yaml
index c236dae97..7440c3e5b 100644
--- a/data/core.yaml
+++ b/data/core.yaml
@@ -418,6 +418,10 @@ en:
tooltip: "Street-level photos from Mapillary"
title: "Photo Overlay (Mapillary)"
view_on_mapillary: "View this image on Mapillary"
+ mapillary_signs:
+ tooltip: "Traffic signs from Mapillary"
+ title: "Traffic sign Overlay (Mapillary)"
+ view_on_mapillary: "View this image on Mapillary"
help:
title: "Help"
help: |
diff --git a/dist/locales/en.json b/dist/locales/en.json
index 85f710944..b8e9edc46 100644
--- a/dist/locales/en.json
+++ b/dist/locales/en.json
@@ -505,6 +505,11 @@
"title": "Photo Overlay (Mapillary)",
"view_on_mapillary": "View this image on Mapillary"
},
+ "mapillary_signs": {
+ "tooltip": "Traffic signs from Mapillary",
+ "title": "Traffic sign Overlay (Mapillary)",
+ "view_on_mapillary": "View this image on Mapillary"
+ },
"help": {
"title": "Help",
"help": "# Help\n\nThis is an editor for [OpenStreetMap](http://www.openstreetmap.org/), the\nfree and editable map of the world. You can use it to add and update\ndata in your area, making an open-source and open-data map of the world\nbetter for everyone.\n\nEdits that you make on this map will be visible to everyone who uses\nOpenStreetMap. In order to make an edit, you'll need to\n[log in](https://www.openstreetmap.org/login).\n\nThe [iD editor](http://ideditor.com/) is a collaborative project with [source\ncode available on GitHub](https://github.com/openstreetmap/iD).\n",
diff --git a/index.html b/index.html
index 9bb30b26b..c851a6ec5 100644
--- a/index.html
+++ b/index.html
@@ -6,6 +6,7 @@
+
@@ -57,8 +58,10 @@
+
+
diff --git a/js/id/renderer/background.js b/js/id/renderer/background.js
index ce478e220..bbd2e69ed 100644
--- a/js/id/renderer/background.js
+++ b/js/id/renderer/background.js
@@ -5,6 +5,7 @@ iD.Background = function(context) {
gpxLayer = iD.GpxLayer(context, dispatch)
.projection(context.projection),
mapillaryLayer = iD.MapillaryLayer(context),
+ mapillarySignsLayer = iD.MapillarySignsLayer(context),
overlayLayers = [];
var backgroundSources;
@@ -92,6 +93,13 @@ iD.Background = function(context) {
.attr('class', 'layer-layer layer-mapillary');
mapillary.call(mapillaryLayer);
+ var mapillary_signs = selection.selectAll('.layer-mapillary-signs')
+ .data([0]);
+
+ mapillary_signs.enter().insert('div')
+ .attr('class', 'layer-layer layer-mapillary-signs');
+
+ mapillary_signs.call(mapillarySignsLayer);
}
background.sources = function(extent) {
@@ -104,6 +112,7 @@ iD.Background = function(context) {
baseLayer.dimensions(_);
gpxLayer.dimensions(_);
mapillaryLayer.dimensions(_);
+ mapillarySignsLayer.dimensions(_);
overlayLayers.forEach(function(layer) {
layer.dimensions(_);
@@ -176,11 +185,19 @@ iD.Background = function(context) {
return mapillaryLayer.enable();
};
+ background.showsMapillarySignsLayer = function() {
+ return mapillarySignsLayer.enable();
+ };
+
background.toggleMapillaryLayer = function() {
mapillaryLayer.enable(!mapillaryLayer.enable());
dispatch.change();
};
+ background.toggleMapillarySignsLayer = function() {
+ mapillarySignsLayer.enable(!mapillarySignsLayer.enable());
+ dispatch.change();
+ };
background.showsLayer = function(d) {
return d === baseLayer.source() ||
(d.id === 'custom' && baseLayer.source().id === 'custom') ||
diff --git a/js/id/ui/map_data.js b/js/id/ui/map_data.js
index 903860137..d35283eb0 100644
--- a/js/id/ui/map_data.js
+++ b/js/id/ui/map_data.js
@@ -46,6 +46,10 @@ iD.ui.MapData = function(context) {
context.background().toggleMapillaryLayer();
update();
}
+ function clickMapillarySigns() {
+ context.background().toggleMapillarySignsLayer();
+ update();
+ }
function drawList(selection, data, type, name, change, active) {
var items = selection.selectAll('li')
@@ -99,7 +103,8 @@ iD.ui.MapData = function(context) {
var hasGpx = context.background().hasGpxLayer(),
showsGpx = context.background().showsGpxLayer(),
- showsMapillary = context.background().showsMapillaryLayer();
+ showsMapillary = context.background().showsMapillaryLayer(),
+ showsMapillarySigns = context.background().showsMapillarySignsLayer();
gpxLayerItem
.classed('active', showsGpx)
@@ -111,6 +116,11 @@ iD.ui.MapData = function(context) {
.classed('active', showsMapillary)
.selectAll('input')
.property('checked', showsMapillary);
+
+ mapillarySignsLayerItem
+ .classed('active', showsMapillarySigns)
+ .selectAll('input')
+ .property('checked', showsMapillarySigns);
}
function hidePanel() { setVisible(false); }
@@ -210,7 +220,24 @@ iD.ui.MapData = function(context) {
label.append('span')
.text(t('mapillary.title'));
- // gpx
+ // mapillary signs
+ var mapillarySignsLayerItem = layerContainer.append('ul')
+ .attr('class', 'layer-list')
+ .append('li');
+
+ var label_signs = mapillarySignsLayerItem.append('label')
+ .call(bootstrap.tooltip()
+ .title(t('mapillary_signs.tooltip'))
+ .placement('top'));
+
+ label_signs.append('input')
+ .attr('type', 'checkbox')
+ .on('change', clickMapillarySigns);
+
+ label_signs.append('span')
+ .text(t('mapillary_signs.title'));
+
+ //gpx
var gpxLayerItem = layerContainer.append('ul')
.style('display', iD.detect().filedrop ? 'block' : 'none')
.attr('class', 'layer-list')