From 7fcae51b0c67806726e36db35e8fba9e26962d7b Mon Sep 17 00:00:00 2001
From: Pierre GIRAUD <pierre.giraud@camptocamp.com>
Date: Thu, 15 Nov 2012 22:53:49 +0100
Subject: [PATCH] Adding a close button to the inspector, See #85

---
 css/app.css           |  8 ++++++++
 js/iD/renderer/Map.js | 13 +++++++++++--
 js/iD/ui/Inspector.js | 10 +++++++++-
 3 files changed, 28 insertions(+), 3 deletions(-)

diff --git a/css/app.css b/css/app.css
index 2e8ce06b6..8ee1aada0 100644
--- a/css/app.css
+++ b/css/app.css
@@ -191,3 +191,11 @@ button small {
     padding:0;
     border-spacing:0;
 }
+
+.inspector-wrap .close {
+    border: 0;
+    position: absolute;
+    top: 0;
+    right: 0;
+    cursor: pointer;
+}
diff --git a/js/iD/renderer/Map.js b/js/iD/renderer/Map.js
index be9e9c23d..0535bf457 100755
--- a/js/iD/renderer/Map.js
+++ b/js/iD/renderer/Map.js
@@ -52,7 +52,11 @@ iD.Map = function(elem) {
         },
         key = function(d) { return d.id; };
 
-    d3.select('.inspector-wrap').style('display', 'none');
+    function hideInspector() {
+        d3.select('.inspector-wrap').style('display', 'none');
+    }
+
+    hideInspector();
     var messages = d3.select('.messages');
 
     // Containers
@@ -355,7 +359,7 @@ iD.Map = function(elem) {
         selection = null;
         if (hadSelection) {
             drawVector();
-            d3.select('.inspector-wrap').style('display', 'none');
+            hideInspector();
         }
     }
 
@@ -376,6 +380,11 @@ iD.Map = function(elem) {
         map.operate(iD.operations.remove(d));
     });
 
+    inspector.on('close', function(d) {
+        deselectClick();
+        hideInspector();
+    });
+
     var translateStart;
 
     function zoomPan() {
diff --git a/js/iD/ui/Inspector.js b/js/iD/ui/Inspector.js
index 53260c72f..4d92285e9 100644
--- a/js/iD/ui/Inspector.js
+++ b/js/iD/ui/Inspector.js
@@ -1,5 +1,5 @@
 iD.Inspector = function(graph) {
-    var event = d3.dispatch('change', 'update', 'remove');
+    var event = d3.dispatch('change', 'update', 'remove', 'close');
 
     function inspector(selection) {
         // http://jsfiddle.net/7WQjr/
@@ -7,6 +7,14 @@ iD.Inspector = function(graph) {
             // TODO: there must be a better way to do this.
             d3.select(this).node().innerHTML = '';
 
+            d3.select(this).append('button')
+                .text('x')
+                .attr('title', 'close')
+                .attr('class', 'close')
+                .on('click', function() {
+                    event.close(d);
+                });
+
             var head = d3.select(this)
                 .append('div')
                 .attr('class', 'head');