First shot at magical extra fields for inspector

This commit is contained in:
Tom MacWright
2012-11-05 14:57:21 -05:00
parent 9101aa8772
commit 2b1df4a2d2
3 changed files with 43 additions and 26 deletions

View File

@@ -163,11 +163,13 @@ button small {
.inspector-wrap {
position:absolute;
top:90px;
right:20px;
top:40px;
right:00px;
overflow:auto;
padding:5px;
background:#fff;
padding:10px;
background:#222222;
border-top:1px solid #000;
color:#fff;
}
.inspector-wrap h2 {
@@ -196,8 +198,8 @@ button small {
margin:0;
padding:4px;
border:0;
background:#fff;
width:150px;
border:0;
}
.inspector input.tag-key {

View File

@@ -132,9 +132,9 @@ iD.Map = function(elem) {
points = graph.pois(graph.head);
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, 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, key);
var selected_id = selection && selection[0];

View File

@@ -51,26 +51,35 @@ iD.Inspector = function(graph) {
var tbody = table.append('tbody');
var row = tbody.selectAll('tr')
.data(d3.entries(d.tags))
.enter()
.append('tr');
function draw(data) {
var tr = tbody.selectAll('tr')
.data(data, function(d) { return d.key; });
row.append('td').append('input')
.attr('class', 'tag-key')
.property('value', function(d) { return d.key; })
.on('change', function(row) {
row.key = this.key;
event.update(d, newtags());
});
var row = tr.enter()
.append('tr');
tr.exit().remove();
row.append('td').append('input')
.attr('class', 'tag-value')
.property('value', function(d) { return d.value; })
.on('change', function(row) {
row.value = this.value;
event.update(d, newtags());
});
row.append('td').append('input')
.attr('class', 'tag-key')
.property('value', function(d) { return d.key; })
.on('change', function(row) {
row.key = this.value;
event.update(d, newtags());
draw(formtags());
});
row.append('td').append('input')
.attr('class', 'tag-value')
.property('value', function(d) { return d.value; })
.on('change', function(row) {
row.value = this.value;
event.update(d, newtags());
draw(formtags());
});
}
var data = d3.entries(d.tags).concat([{ key: '', value: ''}]);
draw(data);
// TODO: there must be a function for this
function unentries(x) {
@@ -81,6 +90,12 @@ iD.Inspector = function(graph) {
return obj;
}
function formtags() {
var t = newtags();
if (Object.keys(t).indexOf('') === -1) t[''] = '';
return d3.entries(t);
}
function newtags() {
var inputs = table.selectAll('input.tag-value')
.data();