diff --git a/css/app.css b/css/app.css
index 010950a47..b280730c6 100644
--- a/css/app.css
+++ b/css/app.css
@@ -721,7 +721,7 @@ a:hover .icon.out-link { background-position: -500px -14px;}
position: absolute;
right: 0;
bottom: 30px;
- padding: 8px;
+ padding: 5px;
background-color: #fff;
}
#mapillaryImage > div {
@@ -737,11 +737,11 @@ a:hover .icon.out-link { background-position: -500px -14px;}
}
#mapillaryImage .link {
- background-color: black;
+ background-color: rgba(0,0,0,.5);
position: absolute;
bottom: 0;
- padding: 2px 4px;
right: 0;
+ padding: 5px 10px;
}
#mapillaryImage img {
@@ -754,12 +754,16 @@ a:hover .icon.out-link { background-position: -500px -14px;}
visibility: hidden;
}
-#mapillaryImage .close {
- cursor: pointer;
+#mapillaryImage.temp button {
+ display: none;
+}
+
+#mapillaryImage button {
+ border-radius: 0;
+ padding: 5px;
position: absolute;
right: 0;
top: 0;
- background-color: #f2f2f2;
}
.feature-list-pane .inspector-body {
diff --git a/css/map.css b/css/map.css
index 0e20660a8..7e5ffe792 100644
--- a/css/map.css
+++ b/css/map.css
@@ -1149,21 +1149,23 @@ g.image.point {
g.image.point path,
g.image.point circle {
- stroke-width: 3;
+ stroke-width: 2;
stroke: #ffc600;
fill: #ffc600;
}
-g.image.point circle {
- fill-opacity: 0.3;
- stroke-width: 4;
-}
-g.image.point.selected circle,
-g.image.point.selected path,
g.image.point:hover circle,
g.image.point:hover path {
- stroke: #ff9900;
fill: #ff9900;
+ stroke-width: 2;
+ stroke: #ff9900;
+}
+
+g.image.point.selected circle,
+g.image.point.selected path {
+ fill: #ff5800;
+ stroke-width: 4;
+ stroke: #ff5800;
}
/* Modes */
diff --git a/data/core.yaml b/data/core.yaml
index ecf603004..d1118ef48 100644
--- a/data/core.yaml
+++ b/data/core.yaml
@@ -297,8 +297,8 @@ en:
browse: "Browse for a .gpx file"
mapillary:
tooltip: "Mapillary street photos"
- title: "Mapillary"
- view_on_mapillary: "View this image on Mapillary."
+ title: "Photo overlay"
+ view_on_mapillary: "View this image on Mapillary"
no_image_found: |
No image found on Mapillary. Go and take some!
help:
diff --git a/dist/img/cursor-select-mapillary.png b/dist/img/cursor-select-mapillary.png
index bdfecf6a6..5bf5c3feb 100644
Binary files a/dist/img/cursor-select-mapillary.png and b/dist/img/cursor-select-mapillary.png differ
diff --git a/dist/img/cursor-select-mapillary2x.png b/dist/img/cursor-select-mapillary2x.png
index 971c12e83..a21d86883 100644
Binary files a/dist/img/cursor-select-mapillary2x.png and b/dist/img/cursor-select-mapillary2x.png differ
diff --git a/dist/locales/en.json b/dist/locales/en.json
index 2342ca3f2..164deac2f 100644
--- a/dist/locales/en.json
+++ b/dist/locales/en.json
@@ -360,8 +360,8 @@
},
"mapillary": {
"tooltip": "Mapillary street photos",
- "title": "Mapillary",
- "view_on_mapillary": "View this image on Mapillary.",
+ "title": "Photo overlay",
+ "view_on_mapillary": "View this image on Mapillary",
"no_image_found": "No image found on Mapillary. Go and take some!\n"
},
"help": {
diff --git a/js/id/modes/select_image.js b/js/id/modes/select_image.js
index 9ddda13c4..9fc126b0d 100644
--- a/js/id/modes/select_image.js
+++ b/js/id/modes/select_image.js
@@ -19,7 +19,10 @@ iD.modes.SelectImage = function (context) {
context.surface().selectAll('.image.point')
.classed('selected', function(d) {
return d === datum;
- });
+ })
+ context.container()
+ .select('#mapillaryImage')
+ .classed('temp', false);
imageView.show(currentImage);
}
}
@@ -51,6 +54,11 @@ iD.modes.SelectImage = function (context) {
var datum = d3.event.target.__data__;
if (isImage(datum)) {
imageView.show(datum);
+ if (currentImage !== datum) {
+ context.container()
+ .select('#mapillaryImage')
+ .classed('temp', true);
+ }
}
})
.on('mouseout.image', function () {
@@ -73,7 +81,8 @@ iD.modes.SelectImage = function (context) {
if (!currentImage) {
context.container()
.select('#mapillaryImage')
- .classed('hidden', true);
+ .classed('hidden', true)
+ .classed('temp', false);
}
context.surface().select('defs').selectAll('marker.arrow')
diff --git a/js/id/svg/sequences.js b/js/id/svg/sequences.js
index ec5d7bfc9..29b620c04 100644
--- a/js/id/svg/sequences.js
+++ b/js/id/svg/sequences.js
@@ -47,7 +47,7 @@ iD.svg.Sequences = function (projection, context) {
image.append('circle')
.attr('dx', '0')
.attr('dy', '0')
- .attr('r', '10');
+ .attr('r', '8');
// Selecting the following implicitly
// sets the data (point entity) on the element
@@ -93,7 +93,7 @@ iD.svg.Sequences = function (projection, context) {
selection
.attr('class', klass)
.attr('transform', 'translate(0, 0)')
- .attr('d', 'M 0,-10 l 0,-20 l -5,20 l 10,0 l -5,-20');
+ .attr('d', 'M 0,-5 l 0,-20 l -5,30 l 10,0 l -5,-30');
};
return drawSequences;
diff --git a/js/id/ui/background.js b/js/id/ui/background.js
index 82065effc..2cf0b2c4d 100644
--- a/js/id/ui/background.js
+++ b/js/id/ui/background.js
@@ -264,6 +264,30 @@ iD.ui.Background = function(context) {
var overlayList = content.append('ul')
.attr('class', 'layer-list');
+ var mapillaryLayerItem = overlayList.append('li');
+
+ var mapillaryLabel = mapillaryLayerItem.append('label')
+ .call(bootstrap.tooltip()
+ .title(t('modes.selectImage.description'))
+ .placement('top'));
+
+ mapillaryLabel.append('input')
+ .attr('type', 'checkbox')
+ .attr('id', 'select_image_checkbox')
+ .on('change', function(){
+ if (this.checked) {
+ mapillaryLayerItem.classed('active',true);
+ context.enter(iD.modes.SelectImage(context));
+ } else {
+ mapillaryLayerItem.classed('active',false);
+ context.enter(iD.modes.Browse(context));
+ }
+ update();
+ });
+
+ mapillaryLabel.append('span')
+ .text(t('mapillary.title'));
+
var gpxLayerItem = content.append('ul')
.style('display', iD.detect().filedrop ? 'block' : 'none')
.attr('class', 'layer-list')
@@ -312,31 +336,6 @@ iD.ui.Background = function(context) {
label.append('span')
.text(t('gpx.local_layer'));
- var mapillaryLayerItem = content.append('ul')
- .attr('class', 'layer-list')
- .append('li')
- .classed('layer-toggle-gpx', true);
-
- var mapillaryLabel = mapillaryLayerItem.append('label')
- .call(bootstrap.tooltip()
- .title(t('modes.selectImage.description'))
- .placement('top'));
-
- mapillaryLabel.append('input')
- .attr('type', 'checkbox')
- .attr('id', 'select_image_checkbox')
- .on('change', function(){
- if (this.checked) {
- context.enter(iD.modes.SelectImage(context));
- } else {
- context.enter(iD.modes.Browse(context));
- }
- update();
- });
-
- mapillaryLabel.append('span')
- .text(t('mapillary.title'));
-
var adjustments = content.append('div')
.attr('class', 'adjustments');
diff --git a/js/id/ui/image_view.js b/js/id/ui/image_view.js
index b16db05d0..7795d9606 100644
--- a/js/id/ui/image_view.js
+++ b/js/id/ui/image_view.js
@@ -26,20 +26,24 @@ iD.ui.ImageView = function (context) {
imageWrapper.html('');
var content = imageWrapper
.append('div');
- content.append('div')
- .attr('class', 'icon close')
- .on('click', function(){
- imageWrapper.classed('hidden', true);
- });
+ content.append('button')
+ .on('click', function(){
+ imageWrapper.classed('hidden', true);
+ })
+ .append('div')
+ .attr('class', 'icon close');
var wrap = content.append('div');
wrap.append('div')
.append('img')
.attr('src', 'https://d1cuyjsrcm0gby.cloudfront.net/KEY/thumb-320.jpg'.replace('KEY', key));
- wrap.append('a')
+ var wrapLink = wrap.append('a')
+ .attr('class', 'link')
+ .attr('target', '_blank')
+ .attr('src', 'http://mapillary.com/map/im/KEY'.replace('KEY', key));
+ wrapLink.append('span')
+ .attr('class','icon icon-pre-text out-link')
+ wrapLink.append('span')
.text(t('mapillary.view_on_mapillary'))
- .attr('class', 'link')
- .attr('target', '_blank')
- .attr('src', 'http://mapillary.com/map/im/KEY'.replace('KEY', key));
};
return imageView;
diff --git a/svg/cursors.svg b/svg/cursors.svg
index 1c71eb967..252876269 100644
--- a/svg/cursors.svg
+++ b/svg/cursors.svg
@@ -14,7 +14,7 @@
height="1052.3622047"
id="svg54747"
version="1.1"
- inkscape:version="0.48.2 r9819"
+ inkscape:version="0.48.5 r10040"
sodipodi:docname="cursors.svg">
@@ -52,11 +52,11 @@
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
- inkscape:zoom="1"
- inkscape:cx="-405.07998"
- inkscape:cy="990.65897"
+ inkscape:zoom="8"
+ inkscape:cx="-535.77448"
+ inkscape:cy="943.92752"
inkscape:document-units="px"
- inkscape:current-layer="cursor-draw-connect-line"
+ inkscape:current-layer="layer1"
showgrid="false"
inkscape:window-width="1337"
inkscape:window-height="840"
@@ -89,7 +89,7 @@
image/svg+xml
-
+
@@ -1081,5 +1081,80 @@
style="font-size:medium;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;text-indent:0;text-align:start;text-decoration:none;line-height:normal;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;text-anchor:start;baseline-shift:baseline;opacity:0.5;color:#000000;fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1.99999988;marker:none;visibility:visible;display:inline;overflow:visible;filter:url(#filter8013-4);enable-background:accumulate;font-family:Sans;-inkscape-font-specification:Sans"
inkscape:connector-curvature="0" />
+
+
+
+
+
+
+
+
+
+
+
+
+
+