Implement inspector without a collapsed mode and with semi-intelligent
detection of whether features will conflict with the position of the
inspector. Also adds a `centerEase` fn to the map object.
This commit is contained in:
Tom MacWright
2013-01-07 11:51:04 -05:00
parent a78b5925e4
commit 12beb14d07
3 changed files with 24 additions and 21 deletions
+10
View File
@@ -44,6 +44,16 @@ iD.modes.Select = function (entity) {
.datum(entity)
.call(inspector);
var inspector_size = d3.select('.inspector-wrap').size(),
map_size = mode.map.size(),
entity_extent = entity.extent(mode.history.graph()),
left_edge = map_size[0] - inspector_size[0];
var left = mode.map.projection(entity_extent[1])[0];
var right = mode.map.projection(entity_extent[0])[0];
if (left > left_edge) mode.map.centerEase(entity_extent[0]);
inspector.on('changeTags', function(d, tags) {
mode.history.perform(
iD.actions.ChangeEntityTags(d.id, tags),
+8
View File
@@ -423,6 +423,14 @@ iD.Map = function() {
}
};
map.centerEase = function(loc) {
var from = map.center().slice(), t = 0;
d3.timer(function() {
map.center(iD.util.geo.interp(from, loc, (t += 1) / 10));
return t == 10;
}, 20);
};
map.extent = function() {
return [projection.invert([0, 0]), projection.invert(dimensions)];
};
+6 -21
View File
@@ -43,26 +43,7 @@ iD.Inspector = function() {
.attr('class', 'inspector-buttons')
.call(drawButtons);
var inHeight = inspectorbody.node().offsetHeight;
inspectorbody.style('display', 'none')
.style('margin-top', (-inHeight) + 'px');
var inspectortoggle = selection.append('button')
.attr('class', 'inspector-toggle action')
.on('click', function() {
inspectortoggle.style('display', 'none');
inspectorbody
.style('display', 'block')
.transition()
.style('margin-top', '0px');
});
formsel.selectAll('input').node().focus();
inspectortoggle.append('span')
.text('Details')
.attr('class','label');
}
function drawHead(selection) {
@@ -184,7 +165,8 @@ iD.Inspector = function() {
}
function pushMore() {
if (d3.event.keyCode === 9 && tagList.selectAll('li:last-child input.value').node() === this) {
if (d3.event.keyCode === 9 &&
tagList.selectAll('li:last-child input.value').node() === this) {
addTag();
}
}
@@ -205,7 +187,10 @@ iD.Inspector = function() {
value.call(d3.typeahead()
.data(function(_, callback) {
taginfo.values({key: key.property('value'), query: value.property('value')}, function(err, data) {
taginfo.values({
key: key.property('value'),
query: value.property('value')
}, function(err, data) {
callback(data.data.map(function (d) {
return {value: d.value, title: d.description};
}));