From 6cce8a346180b0a669b72b35983adcf3be15088e Mon Sep 17 00:00:00 2001
From: Ian Fitzpatrick <itfitzpatrick@gmail.com>
Date: Thu, 15 Sep 2016 12:40:54 -0700
Subject: [PATCH 1/2] track event on edges should allow users to reassign edges
 to other ports

---
 the-graph/the-graph-edge.js | 65 ++++++++++++++++++++++++++++++++++---
 1 file changed, 60 insertions(+), 5 deletions(-)

diff --git a/the-graph/the-graph-edge.js b/the-graph/the-graph-edge.js
index 2f1c0c76..8b9a5a05 100644
--- a/the-graph/the-graph-edge.js
+++ b/the-graph/the-graph-edge.js
@@ -81,7 +81,7 @@
       var domNode = ReactDOM.findDOMNode(this);
 
       // Dragging
-      domNode.addEventListener("trackstart", this.dontPan);
+      domNode.addEventListener("trackstart", this.onTrackStart);
 
       if (this.props.onEdgeSelection) {
         // Needs to be click (not tap) to get event.shiftKey
@@ -94,11 +94,66 @@
         domNode.addEventListener("hold", this.showContext);
       }
     },
-    dontPan: function (event) {
-      // Don't drag under menu
-      if (this.props.app.menuShown) { 
-        event.stopPropagation();
+    onTrackStart: function (event) {
+      event.stopPropagation();
+
+      var distance = function (x1, y1, x2, y2) {
+        return Math.sqrt(Math.pow(x2 - x1, 2) + Math.pow(y2 - y1, 2));
+      };
+
+      var sourceX = this.props.sX;
+      var sourceY = this.props.sY;
+      var targetX = this.props.tX;
+      var targetY = this.props.tY;
+      var scale = this.props.app.state.scale;
+      var clientX = (event.clientX - this.props.app.state.x) / scale;
+      var clientY = (event.clientY - this.props.app.state.y) / scale;
+
+      var graph = this.props.graph;
+      var edge = this.props.edge;
+      var edgePort;
+      var isIn;
+      if (distance(clientX, clientY, sourceX, sourceY) <= 36) {
+        edgePort = edge.to;
+        isIn = true;
+      } else if (distance(clientX, clientY, targetX, targetY) <= 36) {
+        edgePort = edge.from;
+        isIn = false;
+      } else {
+        return;
       }
+
+      var node = graph.getNode(edgePort.node);
+      var library = this.props.app.props.library;
+      var component = library[node.component];
+      var componentPort = component[isIn ? 'inports' : 'outports'].filter(
+        function (p) {return p.name == edgePort.port}
+      )[0];
+
+      var port = {
+        process: edgePort.node,
+        port: edgePort.port,
+        type: componentPort.type
+      };
+
+      if (edgePort.index !== undefined && edgePort.index !== null) {
+        port.index = edgePort.index;
+      } else {
+        port.addressable = componentPort.addressable;
+      }
+
+      this.props.app.props.menus.edge.actions.delete(
+        this.props.graph, null, this.props.edge);
+
+      var edgeStartEvent = new CustomEvent('the-graph-edge-start', {
+        detail: {
+          isIn: isIn,
+          port: port,
+          route: this.props.route
+        },
+        bubbles: true
+      });
+      ReactDOM.findDOMNode(this).dispatchEvent(edgeStartEvent);
     },
     onEdgeSelection: function (event) {
       // Don't click app

From 0fc0977dc5370c67a6150fbf2589b6abaa083a73 Mon Sep 17 00:00:00 2001
From: Forrest Oliphant <github.com@sembiki.com>
Date: Tue, 20 Sep 2016 08:29:21 -0400
Subject: [PATCH 2/2] lint;

---
 the-graph/the-graph-edge.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/the-graph/the-graph-edge.js b/the-graph/the-graph-edge.js
index 8b9a5a05..7b2dcc6e 100644
--- a/the-graph/the-graph-edge.js
+++ b/the-graph/the-graph-edge.js
@@ -127,7 +127,7 @@
       var library = this.props.app.props.library;
       var component = library[node.component];
       var componentPort = component[isIn ? 'inports' : 'outports'].filter(
-        function (p) {return p.name == edgePort.port}
+        function (p) {return p.name == edgePort.port};
       )[0];
 
       var port = {