From a6ce12efb64f9b0e36af194b375f69c2aa679453 Mon Sep 17 00:00:00 2001
From: John Firebaugh <john.firebaugh@gmail.com>
Date: Thu, 7 Mar 2013 10:32:59 -0800
Subject: [PATCH] Add shadow on area strokes (fixes #674)

---
 css/map.css                 |  3 ++-
 js/id/behavior/drag_node.js | 40 ++++++++++++++++++-------------------
 js/id/svg/areas.js          |  4 +++-
 3 files changed, 24 insertions(+), 23 deletions(-)

diff --git a/css/map.css b/css/map.css
index 5b172b5dd..6cbec597e 100644
--- a/css/map.css
+++ b/css/map.css
@@ -822,7 +822,8 @@ text.point {
 .mode-draw-area .behavior-hover .way,
 .mode-add-line  .behavior-hover .way,
 .mode-add-area  .behavior-hover .way,
-.behavior-drag-node.behavior-hover .way {
+.behavior-drag-node.behavior-hover .way.stroke,
+.behavior-drag-node.behavior-hover .way.shadow  {
     cursor: crosshair;
     cursor: url(../img/cursor-draw-connect-line.png) 9 9, crosshair;
 }
diff --git a/js/id/behavior/drag_node.js b/js/id/behavior/drag_node.js
index e8749927f..cabed2db6 100644
--- a/js/id/behavior/drag_node.js
+++ b/js/id/behavior/drag_node.js
@@ -72,9 +72,16 @@ iD.behavior.DragNode = function(context) {
     function datum() {
         if (d3.event.sourceEvent.altKey) {
             return {};
-        } else {
-            return d3.event.sourceEvent.target.__data__ || {};
         }
+
+        var datum = d3.event.sourceEvent.target.__data__,
+            target = d3.select(d3.event.sourceEvent.target);
+
+        if (datum && !target.classed('fill')) {
+            return datum;
+        }
+
+        return {};
     }
 
     function move(entity) {
@@ -91,15 +98,12 @@ iD.behavior.DragNode = function(context) {
         if (d.type === 'node' && d.id !== entity.id) {
             loc = d.loc;
         } else if (d.type === 'way') {
-            var point = d3.mouse(context.surface().node()),
-                index = iD.geo.chooseIndex(d, point, context);
-            if (iD.geo.dist(point, context.projection(index.loc)) < 10) {
-                loc = index.loc;
-            }
+            loc = iD.geo.chooseIndex(d, d3.mouse(context.surface().node()), context).loc;
         }
 
-        context.replace(iD.actions.MoveNode(entity.id, loc),
-                t('operations.move.annotation.' + entity.geometry(context.graph())));
+        context.replace(
+            iD.actions.MoveNode(entity.id, loc),
+            t('operations.move.annotation.' + entity.geometry(context.graph())));
     }
 
     function end(entity) {
@@ -108,18 +112,12 @@ iD.behavior.DragNode = function(context) {
 
         var d = datum();
         if (d.type === 'way') {
-            var point = d3.mouse(context.surface().node()),
-                choice = iD.geo.chooseIndex(d, point, context);
-            if (iD.geo.dist(point, context.projection(choice.loc)) < 10) {
-                context.replace(
-                    iD.actions.MoveNode(entity.id, choice.loc),
-                    iD.actions.AddVertex(d.id, entity.id, choice.index),
-                    connectAnnotation(d));
-                return;
-            }
-        }
-
-        if (d.type === 'node' && d.id !== entity.id) {
+            var choice = iD.geo.chooseIndex(d, d3.mouse(context.surface().node()), context);
+            context.replace(
+                iD.actions.MoveNode(entity.id, choice.loc),
+                iD.actions.AddVertex(d.id, entity.id, choice.index),
+                connectAnnotation(d));
+        } else if (d.type === 'node' && d.id !== entity.id) {
             context.replace(
                 iD.actions.Connect([entity.id, d.id]),
                 connectAnnotation(d));
diff --git a/js/id/svg/areas.js b/js/id/svg/areas.js
index 42b881090..21ace67b0 100644
--- a/js/id/svg/areas.js
+++ b/js/id/svg/areas.js
@@ -83,9 +83,11 @@ iD.svg.Areas = function(projection) {
             return area.type === 'way';
         });
 
-        var fill = surface.select('.layer-fill'),
+        var shadow = surface.select('.layer-shadow'),
+            fill   = surface.select('.layer-fill'),
             stroke = surface.select('.layer-stroke');
 
+        drawPaths(shadow, strokes, filter, 'shadow');
         drawPaths(fill, areas, filter, 'fill', true);
         drawPaths(stroke, strokes, filter, 'stroke');
     };