From b2e780c4c91f4eda4e64e4ada2b4414a05739986 Mon Sep 17 00:00:00 2001
From: Tom MacWright <tom@macwright.org>
Date: Thu, 1 Nov 2012 12:00:27 -0400
Subject: [PATCH] Reorganize inspector

---
 css/app.css           | 16 +++++++++++-----
 js/iD/renderer/Map.js |  9 +++------
 js/iD/ui/Inspector.js | 13 +++++++------
 3 files changed, 21 insertions(+), 17 deletions(-)

diff --git a/css/app.css b/css/app.css
index 0df34b245..790d58f21 100644
--- a/css/app.css
+++ b/css/app.css
@@ -175,28 +175,34 @@ table td {
 
 .inspector-wrap a.permalink {
     text-decoration:none;
-    margin-right:2em;
+    margin-right:1em;
     font: normal 11px/20px 'Helvetica'
 }
 
 .inspector thead th {
     font-size:10px;
-    line-height:10px;
+    line-height:15px;
     color:#999;
     font-weight:normal;
     text-transform:uppercase;
 }
 
+.inspector tbody td {
+    border: 1px solid #ccc;
+}
+
 .inspector input {
     margin:0;
     padding:4px;
     border:0;
-    border-bottom:1px solid #ccc;
     width:150px;
+    border:0;
 }
 
-.inspector input.tag-input {
-    box-shadow: inset -2px 0 10px #EEE
+.inspector input.tag-key {
+}
+
+.inspector input.tag-value {
 }
 
 .presets h3 {
diff --git a/js/iD/renderer/Map.js b/js/iD/renderer/Map.js
index c7c277926..825241acc 100755
--- a/js/iD/renderer/Map.js
+++ b/js/iD/renderer/Map.js
@@ -150,12 +150,9 @@ iD.Map = function(parentSelector) {
                 return a.type === 'node';
             });
 
-        var fills = fill_g.selectAll('path.area')
-                .data(areas, key),
-            casings = casing_g.selectAll('path.casing')
-                .data(ways, key),
-            strokes = stroke_g.selectAll('path.stroke')
-                .data(ways, key),
+        var fills = fill_g.selectAll('path.area').data(areas, key),
+            casings = casing_g.selectAll('path.casing').data(ways, key),
+            strokes = stroke_g.selectAll('path.stroke').data(ways, key),
             markers = hit_g.selectAll('image.marker')
                 .data(points.filter(iD.markerimage), key);
 
diff --git a/js/iD/ui/Inspector.js b/js/iD/ui/Inspector.js
index 195e71cc2..48c009ee2 100644
--- a/js/iD/ui/Inspector.js
+++ b/js/iD/ui/Inspector.js
@@ -18,36 +18,37 @@ iD.Inspector = function(graph) {
                 .attr('class', 'permalink')
                 .attr('href', 'http://www.openstreetmap.org/browse/' +
                       d.type + '/' + d.id)
-                .text('#' + d.id);
+                .text('OSM');
 
             head.append('a')
                 .attr('class', 'permalink')
                 .attr('href', '#')
-                .text(d.id + '.geojson')
+                .text('GeoJSON')
                 .on('click', function() {
-                    iD.Util.codeWindow(
-                        JSON.stringify(iD.GeoJSON.mapping(graph.fetch(d.id)), null, 2));
                     d3.event.stopPropagation();
+                    iD.Util.codeWindow(JSON.stringify(
+                        iD.GeoJSON.mapping(graph.fetch(d.id)), null, 2));
                 });
 
             var table = d3.select(this)
                 .append('table')
                 .attr('class', 'inspector');
 
-            var tbody = table.append('tbody');
-
             table.append('thead').append('tr').selectAll('th')
                 .data(['tag', 'value'])
                 .enter()
                 .append('th')
                     .text(String);
 
+            var tbody = table.append('tbody');
+
             var row = tbody.selectAll('tr')
                 .data(d3.entries(d.tags))
                 .enter()
                 .append('tr');
 
             row.append('td').append('input')
+                .attr('class', 'tag-key')
                 .property('value', function(d) { return d.key; })
                 .on('change', function(row) {
                     row.key = this.key;