CalvinBackup/iD
1
0
Fork 0
mirror of https://github.com/FoggedLens/iD.git synced 2026-02-13 01:02:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

Integrate new drag behaviors

Browse Source
This commit is contained in:
John Firebaugh
2012-12-21 09:31:02 -08:00
parent 511dcfa6ac
commit 2c8bbd8985
8 changed files with 119 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
index.html
View File

@@ -64,9 +64,11 @@
<script src='js/id/behavior.js'></script>
<script src='js/id/behavior/drag.js'></script>
<script src='js/id/behavior/drag_accuracy_handle.js'></script>
<script src='js/id/behavior/drag_node.js'></script>
<script src='js/id/behavior/drag_way.js'></script>
<script src='js/id/modes.js'></script>
<script src='js/id/modes/drag_features.js'></script>
<script src='js/id/modes/add_area.js'></script>
<script src='js/id/modes/add_point.js'></script>
<script src='js/id/modes/add_line.js'></script>

26
js/id/behavior/drag_accuracy_handle.js Normal file
View File

@@ -0,0 +1,26 @@
iD.behavior.DragAccuracyHandle = function(mode) {
var history = mode.history,
projection = mode.map.projection;
return iD.behavior.drag()
.delegate(".accuracy-handle")
.origin(function(d) {
return projection(d.loc);
})
.on('start', function(d) {
d.node = iD.Node({loc: d.loc});
history.perform(
iD.actions.AddNode(d.node),
iD.actions.AddWayNode(d.way, d.node.id, d.index));
})
.on('move', function(d) {
d3.event.sourceEvent.stopPropagation();
history.replace(
iD.actions.MoveNode(d.node.id, projection.invert(d3.event.loc)));
})
.on('end', function() {
history.replace(
iD.actions.Noop(),
'added a node to a way');
});
};

24
js/id/behavior/drag_node.js Normal file
View File

@@ -0,0 +1,24 @@
iD.behavior.DragNode = function(mode) {
var history = mode.history,
projection = mode.map.projection;
return iD.behavior.drag()
.delegate(".handle, .marker")
.origin(function(entity) {
return projection(entity.loc);
})
.on('start', function() {
history.perform(
iD.actions.Noop());
})
.on('move', function(entity) {
d3.event.sourceEvent.stopPropagation();
history.replace(
iD.actions.MoveNode(entity.id, projection.invert(d3.event.loc)));
})
.on('end', function() {
history.replace(
iD.actions.Noop(),
'moved a node');
});
};

24
js/id/behavior/drag_way.js Normal file
View File

@@ -0,0 +1,24 @@
iD.behavior.DragWay = function(mode) {
var history = mode.history,
projection = mode.map.projection;
return iD.behavior.drag()
.delegate('.casing, .stroke, .area')
.origin(function(entity) {
return projection(entity.nodes[0].loc);
})
.on('start', function() {
history.perform(
iD.actions.Noop());
})
.on('move', function(entity) {
d3.event.sourceEvent.stopPropagation();
history.replace(
iD.actions.MoveWay(entity.id, d3.event.dxdy, projection));
})
.on('end', function() {
history.replace(
iD.actions.Noop(),
'moved a way');
});
};

25
js/id/modes/browse.js
View File

@@ -6,11 +6,22 @@ iD.modes.Browse = function() {
description: 'Pan and zoom the map'
};
var behaviors;
mode.enter = function() {
d3.select('#map').attr('class', function() { return mode.id; });
iD.modes._dragFeatures(mode);
mode.map.surface.on('click.browse', function () {
var surface = mode.map.surface;
behaviors = [
iD.behavior.DragNode(mode),
iD.behavior.DragAccuracyHandle(mode)];
behaviors.forEach(function(behavior) {
behavior(surface);
});
surface.on('click.browse', function () {
var datum = d3.select(d3.event.target).datum();
if (datum instanceof iD.Entity) {
mode.controller.enter(iD.modes.Select(datum));
@@ -19,8 +30,14 @@ iD.modes.Browse = function() {
};
mode.exit = function() {
mode.map.surface.on('mousedown.latedrag', null);
mode.map.surface.on('click.browse', null);
var surface = mode.map.surface;
behaviors.forEach(function(behavior) {
behavior.off(surface);
});
surface.on('mousedown.latedrag', null);
surface.on('click.browse', null);
d3.select('#map').attr('class', null);
};

50
js/id/modes/drag_features.js
View File

@@ -1,50 +0,0 @@
iD.modes._dragFeatures = function(mode) {
var history = mode.history,
projection = mode.map.projection;
var dragNode = iD.behavior.drag()
.delegate(".handle, .marker")
.origin(function(entity) {
return projection(entity.loc);
})
.on('start', function() {
history.perform(
iD.actions.Noop());
})
.on('move', function(entity) {
d3.event.sourceEvent.stopPropagation();
history.replace(
iD.actions.MoveNode(entity.id, projection.invert(d3.event.loc)));
})
.on('end', function() {
history.replace(
iD.actions.Noop(),
'moved a node');
});
var dragAccuracy = iD.behavior.drag()
.delegate(".accuracy-handle")
.origin(function(d) {
return projection(d.loc);
})
.on('start', function(d) {
d.node = iD.Node({loc: d.loc});
history.perform(
iD.actions.AddNode(d.node),
iD.actions.AddWayNode(d.way, d.node.id, d.index));
})
.on('move', function(d) {
d3.event.sourceEvent.stopPropagation();
history.replace(
iD.actions.MoveNode(d.node.id, projection.invert(d3.event.loc)));
})
.on('end', function() {
history.replace(
iD.actions.Noop(),
'added a node to a way');
});
mode.map.surface
.call(dragNode)
.call(dragAccuracy);
};

53
js/id/modes/select.js
View File

@@ -6,7 +6,7 @@ iD.modes.Select = function (entity) {
};
var inspector = iD.Inspector(),
target;
behaviors;
function remove() {
if (entity.type === 'way') {
@@ -27,10 +27,16 @@ iD.modes.Select = function (entity) {
}
mode.enter = function () {
target = mode.map.surface.selectAll('*')
.filter(function (d) { return d === entity; });
var surface = mode.map.surface;
iD.modes._dragFeatures(mode);
behaviors = [
iD.behavior.DragNode(mode),
iD.behavior.DragWay(mode),
iD.behavior.DragAccuracyHandle(mode)];
behaviors.forEach(function(behavior) {
behavior(surface);
});
d3.select('.inspector-wrap')
.style('display', 'block')
@@ -60,30 +66,7 @@ iD.modes.Select = function (entity) {
mode.controller.exit();
});
if (entity.type === 'way') {
var history = mode.history,
projection = mode.map.projection;
target.call(iD.behavior.drag()
.origin(function(entity) {
return projection(entity.nodes[0].loc);
})
.on('start', function() {
history.perform(iD.actions.Noop());
})
.on('move', function(entity) {
d3.event.sourceEvent.stopPropagation();
history.replace(
iD.actions.MoveWay(entity.id, d3.event.dxdy, projection));
})
.on('end', function() {
history.replace(
iD.actions.Noop(),
'moved a way');
}));
}
mode.map.surface.on('click.browse', function () {
surface.on('click.browse', function () {
var datum = d3.select(d3.event.target).datum();
if (datum instanceof iD.Entity) {
mode.controller.enter(iD.modes.Select(datum));
@@ -101,18 +84,18 @@ iD.modes.Select = function (entity) {
};
mode.exit = function () {
var surface = mode.map.surface;
d3.select('.inspector-wrap')
.style('display', 'none');
if (entity.type === 'way') {
target.on('mousedown.drag', null)
.on('touchstart.drag', null);
}
behaviors.forEach(function(behavior) {
behavior.off(surface);
});
mode.map.surface.on("click.browse", null);
mode.map.surface.on('mousedown.latedrag', null);
surface.on("click.browse", null);
surface.on('mousedown.latedrag', null);
mode.map.keybinding().on('⌫.browse', null);
mode.map.selection(null);
};

4
test/index.html
View File

@@ -63,13 +63,15 @@
<script src='../js/id/behavior.js'></script>
<script src='../js/id/behavior/drag.js'></script>
<script src='../js/id/behavior/drag_accuracy_handle.js'></script>
<script src='../js/id/behavior/drag_node.js'></script>
<script src='../js/id/behavior/drag_way.js'></script>
<script src='../js/id/modes.js'></script>
<script src='../js/id/modes/add_area.js'></script>
<script src='../js/id/modes/add_point.js'></script>
<script src='../js/id/modes/add_line.js'></script>
<script src='../js/id/modes/browse.js'></script>
<script src='../js/id/modes/drag_features.js'></script>
<script src='../js/id/modes/draw_area.js'></script>
<script src='../js/id/modes/draw_line.js'></script>
<script src='../js/id/modes/select.js'></script>