highlighting newNode, fixed findClosestOverlappingNode

apcj · Feb 23, 2013 · f1be24a · f1be24a
1 parent 657820d
commit f1be24a
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 8 deletions.
diff --git a/graph-diagram.css b/graph-diagram.css
@@ -8,6 +8,10 @@ circle.node {
     fill: white;
 }
 
+circle.node.new {
+    stroke: red;
+}
+
 circle.node.highlight {
     stroke: blue;
 }

diff --git a/graph-diagram.js b/graph-diagram.js
@@ -28,14 +28,16 @@ gd = {};
             var classes = [];
             var properties = new Properties();
 
+            this.isNew = false;
+
             this.class = function(classesString) {
                 if (arguments.length == 1) {
                     classes = classesString.split(" ").filter(function(className) {
                         return className.length > 0 && className != "node";
                     });
                     return this;
                 }
-                return ["node"].concat(classes);
+                return (this.isNew ? ["new","node"]:["node"]).concat(classes);
             };
 
             this.x = function(x) {

diff --git a/graph-editor.js b/graph-editor.js
@@ -44,7 +44,7 @@
     function findClosestOverlappingNode( node )
     {
         var closestNode = null;
-        var closestDistance = Number.MAX_VALUE;
+        var closestDistance = gd.parameters.radius * graphModel.internalScale();
 
         var allNodes = graphModel.nodeList();
 
@@ -54,7 +54,7 @@
             if ( candidateNode !== node )
             {
                 var candidateDistance = node.distanceTo( candidateNode ) * graphModel.internalScale();
-                if ( candidateDistance < 50 && candidateDistance < closestDistance )
+                if ( candidateDistance < closestDistance )
                 {
                     closestNode = candidateNode;
                     closestDistance = candidateDistance;
@@ -71,18 +71,21 @@
         var node = dragTarget[0][0].__data__;
         if ( !newNode && shiftKey )
         {
-            newNode = graphModel.createNode().x( node.x() ).y( node.y() );
+            newNode = graphModel.createNode().x( node.x() + d3.event.dx).y( node.y() + d3.event.dy);
+            newNode.isNew = true;
             newRelationship = graphModel.createRelationship( node, newNode );
         }
         if ( newNode )
         {
             var connectionNode = findClosestOverlappingNode( newNode );
-            if ( connectionNode )
+            if ( connectionNode && connectionNode != node )
             {
-                newRelationship.end = connectionNode
+                newRelationship.end = connectionNode;
+                newNode.isNew = false;
             } else
             {
                 newRelationship.end = newNode;
+                newNode.isNew = true;
             }
             node = newNode;
         }
@@ -92,9 +95,13 @@
 
     function dragEnd()
     {
-        if ( newNode && newRelationship && newRelationship.end !== newNode )
+        if ( newNode )
         {
-            graphModel.deleteNode( newNode );
+            if ( newRelationship && newRelationship.end !== newNode )
+            {
+                graphModel.deleteNode( newNode );
+            }
+            newNode.isNew = false;
         }
         newNode = null;
         save( formatMarkup() );