From 15267af822e0f61a60d9d49c8e65ce15d8a291e1 Mon Sep 17 00:00:00 2001
From: Tom MacWright <tom@macwright.org>
Date: Thu, 29 Nov 2012 16:43:56 -0500
Subject: [PATCH] Support drawing areas when you start out with ways

---
 css/map.css            |  9 +++++++--
 js/id/actions/modes.js | 16 ++++++++++++++--
 js/id/id.js            |  2 +-
 js/id/renderer/map.js  |  3 +--
 4 files changed, 23 insertions(+), 7 deletions(-)

diff --git a/css/map.css b/css/map.css
index b0f276d36..7ea106438 100644
--- a/css/map.css
+++ b/css/map.css
@@ -79,6 +79,13 @@ path.stroke.railway-subway {
     stroke-dasharray: 8,8;
 }
 
+path.area {
+    stroke-width:2;
+    stroke:red;
+    fill:#fff;
+    fill-opacity:0.3;
+}
+
 path.area.active {
     stroke-width:3 !important;
 }
@@ -87,14 +94,12 @@ path.area.natural {
     stroke: #ADD6A5;
     fill: #ADD6A5;
     stroke-width:1;
-    fill-opacity:0.3;
 }
 
 path.area.building {
     stroke: #9E176A;
     stroke-width: 1;
     fill: #ff6ec7;
-    fill-opacity: 0.3;
 }
 
 path.area.landuse,
diff --git a/js/id/actions/modes.js b/js/id/actions/modes.js
index 7db9f47b0..7b2968539 100644
--- a/js/id/actions/modes.js
+++ b/js/id/actions/modes.js
@@ -166,7 +166,8 @@ iD.modes.DrawRoad = function(way_id, direction) {
             var nextnode_id = nextnode.id;
 
             var way = this.map.history.graph().entity(way_id);
-            var lastnode_id = (direction === 'forward') ? _.last(way.nodes) : way.nodes[0];
+            var firstNode = way.nodes[0];
+            var lastNode = _.last(way.nodes);
             way.nodes[push](nextnode_id);
             this.map.perform(iD.actions.addWayNode(way, nextnode));
 
@@ -185,9 +186,20 @@ iD.modes.DrawRoad = function(way_id, direction) {
                 var t = d3.select(d3.event.target);
                 d3.event.stopPropagation();
                 if (t.data() && t.data()[0] && t.data()[0].type === 'node') {
-                    if (t.data()[0].id == lastnode_id) {
+                    if (t.data()[0].id == firstNode || t.data()[0].id == lastNode) {
                         var l = this.map.history.graph().entity(way.nodes[pop]());
                         this.map.perform(iD.actions.removeWayNode(way, l));
+                        // If this is drawing a loop and this is not the drawing
+                        // end of the stick, finish the circle
+                        if (direction === 'forward' && t.data()[0].id == firstNode) {
+                            way.nodes[push](firstNode);
+                            this.map.perform(iD.actions.addWayNode(way,
+                                this.map.history.graph().entity(firstNode)));
+                        } else if (direction === 'backward' && t.data()[0].id == lastNode) {
+                            way.nodes[push](lastNode);
+                            this.map.perform(iD.actions.addWayNode(way,
+                                this.map.history.graph().entity(lastNode)));
+                        }
                         delete way.tags.elastic;
                         this.map.perform(iD.actions.changeTags(way, way.tags));
                         // End by clicking on own tail
diff --git a/js/id/id.js b/js/id/id.js
index 4e1d0e475..6222af036 100644
--- a/js/id/id.js
+++ b/js/id/id.js
@@ -145,7 +145,7 @@ var iD = function(container) {
     });
 
     var hash = iD.Hash().map(map);
-    if (!hash.hadHash) map.setZoom(18).center([-92.0198, 38.8796]);
+    if (!hash.hadHash) map.setZoom(20).center([-77.02405, 38.87952]);
     d3.select('.user').call(iD.userpanel(connection)
         .on('logout', connection.logout)
         .on('login', connection.authenticate));
diff --git a/js/id/renderer/map.js b/js/id/renderer/map.js
index 8d2a6f739..a98067880 100644
--- a/js/id/renderer/map.js
+++ b/js/id/renderer/map.js
@@ -51,7 +51,6 @@ iD.Map = function(elem, connection) {
             .attr('clip-path', 'url(#clip)'),
         g = ['fill', 'casing', 'stroke', 'text', 'hit', 'temp'].reduce(function(mem, i) {
             return (mem[i] = r.append('g').attr('class', 'layer-g')) && mem;
-            return mem;
         }, {}),
         class_stroke = iD.Style.styleClasses('stroke'),
         class_fill = iD.Style.styleClasses('stroke'),
@@ -326,7 +325,7 @@ iD.Map = function(elem, connection) {
 
     function nameHoverIn() {
         var entity = d3.select(d3.event.target).data();
-        if (entity) d3.select('.messages').text(entity[0].tags.name || '(unknown)');
+        if (entity) d3.select('.messages').text(entity[0].tags.name || '#' + entity[0].id);
     }
 
     function nameHoverOut(d) { d3.select('.messages').text(''); }