diff --git a/css/app.css b/css/app.css index 3ac71d399..44cc8998a 100644 --- a/css/app.css +++ b/css/app.css @@ -2763,10 +2763,6 @@ img.wiki-image { fill: rgba(255,255,255,.5); } -.radial-menu .icon { - pointer-events: none; -} - .lasso-box { fill-opacity:0.1; stroke: #fff; diff --git a/css/map.css b/css/map.css index f3c540cc0..9654a56cf 100644 --- a/css/map.css +++ b/css/map.css @@ -957,6 +957,11 @@ g.turn.restricted path { stroke: red; } +g.turn rect { + fill: none; + pointer-events: all; +} + /* Cursors */ #map { @@ -1104,6 +1109,15 @@ g.turn.restricted path { ) 9 9, crosshair; } +.turn rect { + cursor: pointer; /* Opera */ + cursor: url(img/cursor-pointer.png) 6 1, pointer; /* FF */ + cursor: -webkit-image-set( + url(img/cursor-pointer.png) 1x, + url(img/cursor-pointer2x.png) 2x + ) 6 1, pointer; +} + .lasso #map { pointer-events: visibleStroke; } diff --git a/data/operations-sprite.json b/data/operations-sprite.json index 23c5a816d..9eab70d5c 100644 --- a/data/operations-sprite.json +++ b/data/operations-sprite.json @@ -23,5 +23,10 @@ "icon-operation-disabled-orthogonalize": [160, 160], "icon-operation-disabled-rotate": [180, 160], "icon-operation-disabled-simplify": [200, 160], - "icon-operation-disabled-continue": [220, 160] + "icon-operation-disabled-continue": [220, 160], + + "icon-restriction-yes": [50, 80], + "icon-restriction-no": [95, 80], + "icon-restriction-yes-u": [140, 80], + "icon-restriction-no-u": [185, 80] } \ No newline at end of file diff --git a/dist/img/sprite.svg b/dist/img/sprite.svg index f93948414..5fc64cbb9 100644 --- a/dist/img/sprite.svg +++ b/dist/img/sprite.svg @@ -27,12 +27,12 @@ inkscape:window-width="1440" inkscape:window-height="856" id="namedview392" - showgrid="false" - inkscape:zoom="11.313708" - inkscape:cx="19.712517" - inkscape:cy="454.54715" - inkscape:window-x="298" - inkscape:window-y="6" + showgrid="true" + inkscape:zoom="2.8284271" + inkscape:cx="124.86957" + inkscape:cy="471.44031" + inkscape:window-x="305" + inkscape:window-y="95" inkscape:window-maximized="0" inkscape:current-layer="svg12393" showguides="false" @@ -48,6 +48,22 @@ visible="true" enabled="true" snapvisiblegridlinesonly="true" /> + + + + @@ -1881,4 +1897,86 @@ transform="matrix(0,1,-1,0,0,0)" rx="0.5" ry="0.5" /> + + + + + + + + + + + + + + + + + + + + diff --git a/js/id/actions/restrict_turn.js b/js/id/actions/restrict_turn.js index e6786e6e6..0b4ebd02f 100644 --- a/js/id/actions/restrict_turn.js +++ b/js/id/actions/restrict_turn.js @@ -75,6 +75,8 @@ iD.actions.RestrictTurn = function(turn, projection, restrictionId) { var angle = iD.geo.angle(via, graph.entity(turn.from.node), projection) - iD.geo.angle(via, graph.entity(turn.to.node), projection); + angle = angle * 180 / Math.PI; + if (angle > 158 || angle < -158) return 'no_straight_on'; if (angle > 23) diff --git a/js/id/geo.js b/js/id/geo.js index f667ca100..8978828b0 100644 --- a/js/id/geo.js +++ b/js/id/geo.js @@ -33,12 +33,12 @@ iD.geo.edgeEqual = function(a, b) { (a[0] === b[1] && a[1] === b[0]); }; -// Return the counterclockwise angle in the range (-180, 180) degrees +// Return the counterclockwise angle in the range (-pi, pi) // between the positive X axis and the line intersecting a and b. iD.geo.angle = function(a, b, projection) { a = projection(a.loc); b = projection(b.loc); - return Math.atan2(b[1] - a[1], b[0] - a[0]) * 180 / Math.PI; + return Math.atan2(b[1] - a[1], b[0] - a[0]); }; // Choose the edge with the minimal distance from `point` to its orthogonal diff --git a/js/id/svg/defs.js b/js/id/svg/defs.js index ad9182a41..7789e9d6e 100644 --- a/js/id/svg/defs.js +++ b/js/id/svg/defs.js @@ -92,7 +92,7 @@ iD.svg.Defs = function(context) { }); defs.selectAll() - .data([12, 18, 20]) + .data([12, 18, 20, 45]) .enter().append('clipPath') .attr('id', function (d) { return 'clip-square-' + d; diff --git a/js/id/svg/turns.js b/js/id/svg/turns.js index f20f20a3d..b49dd435d 100644 --- a/js/id/svg/turns.js +++ b/js/id/svg/turns.js @@ -3,14 +3,21 @@ iD.svg.Turns = function(projection) { var groups = surface.select('.layer-hit').selectAll('g.turn') .data(turns); + // Enter + var enter = groups.enter().append('g') .attr('class', 'turn'); - enter.append('path') - .attr('class', 'turn') - .attr('d', function() { - return 'M20 0 L50 0 M40 10 L50 0 M40 -10 L50 0'; - }); + enter.append('rect') + .attr('transform', 'translate(-12, -12)') + .attr('width', '45') + .attr('height', '25'); + + enter.append('use') + .attr('transform', 'translate(-12, -12)') + .attr('clip-path', 'url(#clip-square-45)'); + + // Update groups .classed('restricted', function(turn) { @@ -18,12 +25,21 @@ iD.svg.Turns = function(projection) { }) .attr('transform', function(turn) { var v = graph.entity(turn.via.node), - t = graph.entity(turn.to.node); - return iD.svg.PointTransform(projection)(v) + - 'rotate(' + iD.geo.angle(v, t, projection) + ')'; + t = graph.entity(turn.to.node), + a = iD.geo.angle(v, t, projection), + p = projection(v.loc), + r = 60; + + return 'translate(' + (r * Math.cos(a) + p[0]) + ',' + (r * Math.sin(a) + p[1]) + ')' + + 'rotate(' + a * 180 / Math.PI + ')'; }); - groups.select('path'); // Propagate updated data. + groups.select('use') + .attr('xlink:href', function(turn) { return '#icon-restriction-' + (turn.restriction ? 'no' : 'yes'); }); + + groups.select('rect'); + + // Exit groups.exit() .remove(); diff --git a/svg/resitriction-no-u.svg b/svg/resitriction-no-u.svg deleted file mode 100644 index af584a552..000000000 --- a/svg/resitriction-no-u.svg +++ /dev/null @@ -1,76 +0,0 @@ - - - - - - - - - - image/svg+xml - - - - - - - - - - - diff --git a/svg/restriction-no.svg b/svg/restriction-no.svg deleted file mode 100644 index 512ad5616..000000000 --- a/svg/restriction-no.svg +++ /dev/null @@ -1,78 +0,0 @@ - - - - - - - - - - image/svg+xml - - - - - - - - - - - diff --git a/svg/restriction-yes-u.svg b/svg/restriction-yes-u.svg deleted file mode 100644 index 854f8761d..000000000 --- a/svg/restriction-yes-u.svg +++ /dev/null @@ -1,76 +0,0 @@ - - - - - - - - - - image/svg+xml - - - - - - - - - - - diff --git a/svg/restriction-yes.svg b/svg/restriction-yes.svg deleted file mode 100644 index a0b088a31..000000000 --- a/svg/restriction-yes.svg +++ /dev/null @@ -1,77 +0,0 @@ - - - - - - - - - - image/svg+xml - - - - - - - - - - -