Select new node on add

This commit is contained in:
Tom MacWright
2012-10-18 13:48:29 -04:00
parent 3e7df5acae
commit 931b862995
8 changed files with 125 additions and 109 deletions

View File

@@ -80,7 +80,7 @@ text {
cursor:pointer;
background:#fff;
color:#555;
font:bold 19px/35px 'Helvetica Neue';
font:bold 19px/30px 'Helvetica Neue';
border:0;
border-right:1px solid #222;
border-bottom:1px solid #222;
@@ -128,6 +128,6 @@ text {
width:135px;
}
polyline.way-fill {
polyline {
cursor: pointer;
}

View File

@@ -23,7 +23,7 @@
<script type="text/javascript" src="js/iD/Connection.js"></script>
<script>
require(["dojo/_base/lang","dojo/dom-geometry","dojo/dom-class","dojo/on","dojo/dom","dojo/Evented",
require(["dojo/dom-geometry","dojo/dom-class","dojo/on","dojo/dom","dojo/Evented",
"dojox/layout/FloatingPane",
"iD/actions/UndoStack",
"iD/actions/CreatePOIAction",
@@ -34,7 +34,7 @@ require(["dojo/_base/lang","dojo/dom-geometry","dojo/dom-class","dojo/on","dojo/
"iD/controller/shape/NoSelection",
"iD/renderer/Map","iD/styleparser/RuleSet",
"iD/ui/DragAndDrop","iD/ui/StepPane",
"dojo/domReady!"], function(lang,domGeom,domClass,on,dom,Evented){
"dojo/domReady!"], function(domGeom,domClass,on,dom,Evented){
var ruleset = new iD.styleparser.RuleSet();
var conn = new iD.Connection("http://www.overpass-api.de/api/xapi?");
@@ -67,7 +67,7 @@ require(["dojo/_base/lang","dojo/dom-geometry","dojo/dom-class","dojo/on","dojo/
new iD.ui.DragAndDrop("map", map, "dndgrid");
// Initialise help pane
controller.setStepper(new iD.ui.StepPane("helpPane", "helpSteps"));
controller.setStepper(new iD.ui.StepPane());
// Set initial controllerState
controller.setState(new iD.controller.edit.NoSelection());
@@ -82,17 +82,8 @@ require(["dojo/_base/lang","dojo/dom-geometry","dojo/dom-class","dojo/on","dojo/
// ----------------------------------------------------
// Mode button handlers
/*
finishClicked=function() {
controller.stepper.hide();
};
cancelClicked=function() {
controller.stepper.hide();
};
*/
$('#add-place').click(function() {
controller.setState(new iD.controller.shape.NoSelection());
controller.setState(new iD.controller.shape.NoSelection('node'));
});
$('#add-road').click(function() {
@@ -132,8 +123,6 @@ require(["dojo/_base/lang","dojo/dom-geometry","dojo/dom-class","dojo/on","dojo/
scroll = 0;
}
});
});
</script>
@@ -143,7 +132,6 @@ require(["dojo/_base/lang","dojo/dom-geometry","dojo/dom-class","dojo/on","dojo/
+ Road</button><button id="add-area">
+ Area</button>
<div id='addPOI'>
<p>Drag points onto the map</p>
<table id='dndgrid'>
</table>
</div>

View File

@@ -13,10 +13,10 @@ declare("iD.actions.CreatePOIAction", [iD.actions.CompositeUndoableAction], {
lon: NaN,
connection: null,
constructor:function(connection,tags,lat,lon) {
constructor: function(connection, tags, lat, lon) {
// summary: Create a new node and set it as a POI. Used by drag-and-drop. Note that the
// node is remembered, so that on redo we can just reinstate it.
this.setName("Create POI");
this.setName('Create POI');
this.connection = connection;
this.tags = tags;
this.lat = lat;
@@ -24,9 +24,11 @@ declare("iD.actions.CreatePOIAction", [iD.actions.CompositeUndoableAction], {
},
doAction:function() {
if (this.newNode===null) {
this.newNode=this.connection.doCreateNode(this.tags,this.lat,this.lon,lang.hitch(this,this.push));
}
if (this.newNode === null) {
this.newNode = this.connection.doCreateNode(this.tags,
this.lat, this.lon,
_.bind(this.push, this));
}
this.inherited(arguments);
this.connection.registerPOI(this.newNode);
return this.SUCCESS;

View File

@@ -12,30 +12,31 @@ define(['dojo/_base/declare',
declare("iD.controller.edit.NoSelection", [iD.controller.edit.EditBaseState], {
constructor:function() {
constructor: function() {
// summary: In 'Edit object' mode but nothing selected.
},
enterState:function() {
enterState: function() {
this.controller.stepper.hide();
},
processMouseEvent:function(event,entityUI) {
if (!entityUI) { return this; }
var entity = entityUI.entity;
if (event.type=='click') {
processMouseEvent: function(event, entityUI) {
if (!entityUI) { return this; }
var entity = entityUI.entity;
if (event.type === 'click') {
this.inherited(arguments);
switch (entity.entityType) {
case 'node':
var ways=entity.entity.parentWays();
if (!ways.length) { return new iD.controller.edit.SelectedPOINode(entity); }
else { return new iD.controller.edit.SelectedWayNode(entity,ways[0]); }
break;
case 'way':
return new iD.controller.edit.SelectedWay(entityUI.entity, event);
}
}
return this;
if (entity.entityType === 'node') {
var ways = entity.entity.parentWays();
if (!ways.length) {
return new iD.controller.edit.SelectedPOINode(entity);
} else {
return new iD.controller.edit.SelectedWayNode(entity,ways[0]);
}
} else if (entity.entityType === 'way') {
return new iD.controller.edit.SelectedWay(entityUI.entity, event);
}
}
return this;
}
});

View File

@@ -2,48 +2,53 @@
define(['dojo/_base/declare','iD/controller/edit/EditBaseState'], function(declare){
// ----------------------------------------------------------------------
// edit.SelectedPOINode class
// ----------------------------------------------------------------------
// edit.SelectedPOINode class
declare("iD.controller.edit.SelectedPOINode", [iD.controller.edit.EditBaseState], {
declare("iD.controller.edit.SelectedPOINode", [iD.controller.edit.EditBaseState], {
node: null,
nodeUI: null,
node: null,
nodeUI: null,
constructor:function(_node) {
// summary: In 'Edit object' mode and a POI node is selected.
this.node=_node;
},
enterState:function() {
var map=this.controller.map;
this.nodeUI=map.getUI(this.node);
this.nodeUI.setStateClass('selected');
this.nodeUI.redraw();
this.openEditorTooltip(map.lon2screen(this.node.lon),
map.lat2screen(this.node.lat), this.node);
},
exitState:function() {
this.nodeUI.resetStateClass('selected');
this.nodeUI.redraw();
this.closeEditorTooltip();
},
processMouseEvent:function(event,entityUI) {
var entity=entityUI ? entityUI.entity : null;
var entityType=entity ? entity.entityType : null;
constructor: function(node) {
// summary: In 'Edit object' mode and a POI node is selected.
this.node = node;
},
if (event.type=='click') {
switch (entityType) {
case null: return new iD.controller.edit.NoSelection();
case 'node': return new iD.controller.edit.SelectedPOINode(entityUI.entity);
case 'way': return new iD.controller.edit.SelectedWay(entityUI.entity, event);
}
}
return this;
}
});
// ----------------------------------------------------------------------
// End of module
enterState: function() {
var map = this.controller.map;
this.nodeUI = map.getUI(this.node);
this.nodeUI.setStateClass('selected')
.redraw();
this.openEditorTooltip(
map.lon2screen(this.node.lon),
map.lat2screen(this.node.lat), this.node);
return this;
},
exitState: function() {
this.nodeUI.resetStateClass('selected')
.nodeUI.redraw();
this.closeEditorTooltip();
return this;
},
processMouseEvent: function(event,entityUI) {
var entity=entityUI ? entityUI.entity : null;
var entityType=entity ? entity.entityType : null;
if (event.type=='click') {
switch (entityType) {
case null: return new iD.controller.edit.NoSelection();
case 'node': return new iD.controller.edit.SelectedPOINode(entityUI.entity);
case 'way': return new iD.controller.edit.SelectedWay(entityUI.entity, event);
}
}
return this;
}
});
// ----------------------------------------------------------------------
// End of module
});

View File

@@ -32,7 +32,7 @@ declare("iD.controller.edit.SelectedWay", [iD.controller.edit.EditBaseState], {
this.closeEditorTooltip();
},
processMouseEvent:function(event,entityUI) {
processMouseEvent:function(event, entityUI) {
var entity = entityUI ? entityUI.entity : null;
var entityType = entity ? entity.entityType : null;

View File

@@ -14,8 +14,8 @@
*/
define(['dojo/_base/declare','dojo/_base/lang','dojo/_base/array','dojox/gfx/shape','iD/controller/ControllerState'],
function(declare,lang,array,shape){
define(['dojo/_base/declare', 'dojo/_base/lang', 'dojox/gfx/shape', 'iD/controller/ControllerState'],
function(declare, lang, shape){
// ----------------------------------------------------------------------
// DrawWay class
@@ -44,25 +44,28 @@ declare("iD.controller.shape.DrawWay", [iD.controller.ControllerState], {
.redraw();
},
processMouseEvent:function(event,entityUI) {
var entity=entityUI ? entityUI.entity : null;
var entityType=entity ? entity.entityType : null;
var map = this.controller.map;
processMouseEvent: function(event, entityUI) {
var entity = entityUI ? entityUI.entity : null;
var entityType = entity ? entity.entityType : null;
var map = this.controller.map;
var ways, undo, action;
if (event.type=='mouseover' && entityType=='way' && entityUI!=this.wayUI) {
// Mouse over way, show hover highlight
entityUI.setStateClass('shownodeshover');
entityUI.redraw();
this.wayUI.redraw();
this.updateElastic(event);
return this;
if (event.type=='mouseover' && entityType=='way' &&
entityUI !== this.wayUI) {
} else if (event.type=='mouseout' && entityType=='way' && entityUI!=this.wayUI) {
// Mouse left way, remove hover highlight
// Find what object we're moving into
var into=shape.byId((event.hasOwnProperty('toElement') ? event.toElement : event.relatedTarget).__gfxObject__);
// If it's a nodeUI that belongs to a hovering way, don't deselect
// Mouse over way, show hover highlight
entityUI.setStateClass('shownodeshover')
.redraw();
this.wayUI.redraw();
this.updateElastic(event);
return this;
} else if (event.type=='mouseout' && entityType=='way' &&
entityUI !== this.wayUI) {
// Mouse left way, remove hover highlight
// Find what object we're moving into
var into = shape.byId((event.hasOwnProperty('toElement') ? event.toElement : event.relatedTarget).__gfxObject__);
// If it's a nodeUI that belongs to a hovering way, don't deselect
if (into &&
into.hasOwnProperty('source') &&
into.source.hasStateClass('hoverway') &&

View File

@@ -37,7 +37,11 @@ declare("iD.controller.shape.NoSelection", [iD.controller.ControllerState], {
enterState: function() {
this.controller.map.div.className = 'state-drawing';
this.controller.stepper.show().step(0);
if (this.intent === 'way') {
this.controller.stepper.show().step(0);
} else if (this.intent === 'node') {
this.controller.stepper.show().message('Click on the map to add a place');
}
},
processMouseEvent:function(event, entityUI) {
@@ -59,15 +63,28 @@ declare("iD.controller.shape.NoSelection", [iD.controller.ControllerState], {
return new iD.controller.shape.SelectedWay(entityUI.entity);
}
} else {
// Click to start a new way
var undo = new iD.actions.CompositeUndoableAction();
var startNode = this.getConnection().doCreateNode({},
map.coord2lat(map.mouseY(event)),
map.coord2lon(map.mouseX(event)), lang.hitch(undo,undo.push) );
var way = this.getConnection().doCreateWay({}, [startNode], lang.hitch(undo,undo.push) );
this.controller.undoStack.addAction(undo);
this.controller.map.createUI(way);
return new iD.controller.shape.DrawWay(way);
if (this.intent === 'way') {
// Click to start a new way
var undo = new iD.actions.CompositeUndoableAction();
var startNode = this.getConnection().doCreateNode({},
map.coord2lat(map.mouseY(event)),
map.coord2lon(map.mouseX(event)), lang.hitch(undo,undo.push) );
var way = this.getConnection().doCreateWay({}, [startNode], lang.hitch(undo,undo.push) );
this.controller.undoStack.addAction(undo);
this.controller.map.createUI(way);
return new iD.controller.shape.DrawWay(way);
} else if (this.intent === 'node') {
var action = new iD.actions.CreatePOIAction(this.getConnection(), {},
map.coord2lat(map.mouseY(event)),
map.coord2lon(map.mouseX(event)));
this.controller.undoStack.addAction(action);
var node = action.getNode();
this.controller.map.createUI(node);
var state = new iD.controller.edit.SelectedPOINode(node);
state.controller = this.controller;
state.enterState();
return state;
}
}
}
return this;