From 931b862995ab4b627aa459bd9fc189fdc9ecf0b5 Mon Sep 17 00:00:00 2001 From: Tom MacWright Date: Thu, 18 Oct 2012 13:48:29 -0400 Subject: [PATCH] Select new node on add --- css/app.css | 4 +- index.html | 20 ++---- js/iD/actions/CreatePOIAction.js | 12 ++-- js/iD/controller/edit/NoSelection.js | 35 +++++----- js/iD/controller/edit/SelectedPOINode.js | 85 +++++++++++++----------- js/iD/controller/edit/SelectedWay.js | 2 +- js/iD/controller/shape/DrawWay.js | 39 ++++++----- js/iD/controller/shape/NoSelection.js | 37 ++++++++--- 8 files changed, 125 insertions(+), 109 deletions(-) diff --git a/css/app.css b/css/app.css index 68d270d8e..1b108ad9f 100644 --- a/css/app.css +++ b/css/app.css @@ -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; } diff --git a/index.html b/index.html index 649e303af..92eda5e7a 100755 --- a/index.html +++ b/index.html @@ -23,7 +23,7 @@ @@ -143,7 +132,6 @@ require(["dojo/_base/lang","dojo/dom-geometry","dojo/dom-class","dojo/on","dojo/ + Road
-

Drag points onto the map

diff --git a/js/iD/actions/CreatePOIAction.js b/js/iD/actions/CreatePOIAction.js index 05c9a3de6..e470b5a1b 100644 --- a/js/iD/actions/CreatePOIAction.js +++ b/js/iD/actions/CreatePOIAction.js @@ -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; diff --git a/js/iD/controller/edit/NoSelection.js b/js/iD/controller/edit/NoSelection.js index 16b80df64..526be7644 100755 --- a/js/iD/controller/edit/NoSelection.js +++ b/js/iD/controller/edit/NoSelection.js @@ -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; } }); diff --git a/js/iD/controller/edit/SelectedPOINode.js b/js/iD/controller/edit/SelectedPOINode.js index 59e180d07..64e5685dc 100755 --- a/js/iD/controller/edit/SelectedPOINode.js +++ b/js/iD/controller/edit/SelectedPOINode.js @@ -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 }); diff --git a/js/iD/controller/edit/SelectedWay.js b/js/iD/controller/edit/SelectedWay.js index d07e2955e..62174bc7d 100755 --- a/js/iD/controller/edit/SelectedWay.js +++ b/js/iD/controller/edit/SelectedWay.js @@ -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; diff --git a/js/iD/controller/shape/DrawWay.js b/js/iD/controller/shape/DrawWay.js index f38b8c526..71a6fe12a 100644 --- a/js/iD/controller/shape/DrawWay.js +++ b/js/iD/controller/shape/DrawWay.js @@ -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') && diff --git a/js/iD/controller/shape/NoSelection.js b/js/iD/controller/shape/NoSelection.js index d1e3485de..d5a45351f 100644 --- a/js/iD/controller/shape/NoSelection.js +++ b/js/iD/controller/shape/NoSelection.js @@ -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;