feat(edges): calc y handle pos

xyflow · Jul 29, 2019 · a681bab · a681bab
1 parent 06a7bad
commit a681bab
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 10 deletions.
diff --git a/dist/ReactGraph.js b/dist/ReactGraph.js
@@ -33171,12 +33171,14 @@
     var style = props.style || {};
     var sourceHandle = sourceNode.__rg.handleBounds.source;
     var sourceHandleX = sourceHandle ? sourceHandle.x + sourceHandle.width / 2 : sourceNode.__rg.width / 2;
+    var sourceHandleY = sourceHandle ? sourceHandle.y + sourceHandle.height / 2 : sourceNode.__rg.height;
     var sourceX = sourceNode.__rg.position.x + sourceHandleX;
-    var sourceY = sourceNode.__rg.position.y + sourceNode.__rg.height;
+    var sourceY = sourceNode.__rg.position.y + sourceHandleY;
     var targetHandle = targetNode.__rg.handleBounds.target;
     var targetHandleX = targetHandle ? targetHandle.x + targetHandle.width / 2 : targetNode.__rg.width / 2;
+    var targetHandleY = targetHandle ? targetHandle.y + targetHandle.height / 2 : 0;
     var targetX = targetNode.__rg.position.x + targetHandleX;
-    var targetY = targetNode.__rg.position.y;
+    var targetY = targetNode.__rg.position.y + targetHandleY;
     var yOffset = Math.abs(targetY - sourceY) / 2;
     var centerY = targetY < sourceY ? targetY + yOffset : targetY - yOffset;
     var dAttr = "M".concat(sourceX, ",").concat(sourceY, " C").concat(sourceX, ",").concat(centerY, " ").concat(targetX, ",").concat(centerY, " ").concat(targetX, ",").concat(targetY);

diff --git a/example/build/example.e31bb0bc.js b/example/build/example.e31bb0bc.js
@@ -41120,7 +41120,7 @@ var _default = (0, _react.memo)(function (_ref) {
       target = _ref.target,
       rest = _objectWithoutProperties(_ref, ["source", "target"]);
 
-  var handleClasses = (0, _classnames.default)('react-graph__handle', {
+  var handleClasses = (0, _classnames.default)('react-graph__handle', rest.className, {
     source: source,
     target: target
   });
@@ -41558,12 +41558,14 @@ var _default = function _default(props) {
   var style = props.style || {};
   var sourceHandle = sourceNode.__rg.handleBounds.source;
   var sourceHandleX = sourceHandle ? sourceHandle.x + sourceHandle.width / 2 : sourceNode.__rg.width / 2;
+  var sourceHandleY = sourceHandle ? sourceHandle.y + sourceHandle.height / 2 : sourceNode.__rg.height;
   var sourceX = sourceNode.__rg.position.x + sourceHandleX;
-  var sourceY = sourceNode.__rg.position.y + sourceNode.__rg.height;
+  var sourceY = sourceNode.__rg.position.y + sourceHandleY;
   var targetHandle = targetNode.__rg.handleBounds.target;
   var targetHandleX = targetHandle ? targetHandle.x + targetHandle.width / 2 : targetNode.__rg.width / 2;
+  var targetHandleY = targetHandle ? targetHandle.y + targetHandle.height / 2 : 0;
   var targetX = targetNode.__rg.position.x + targetHandleX;
-  var targetY = targetNode.__rg.position.y;
+  var targetY = targetNode.__rg.position.y + targetHandleY;
   var yOffset = Math.abs(targetY - sourceY) / 2;
   var centerY = targetY < sourceY ? targetY + yOffset : targetY - yOffset;
   var dAttr = "M".concat(sourceX, ",").concat(sourceY, " C").concat(sourceX, ",").concat(centerY, " ").concat(targetX, ",").concat(centerY, " ").concat(targetX, ",").concat(targetY);
@@ -42321,7 +42323,7 @@ var parent = module.bundle.parent;
 if ((!parent || !parent.isParcelRequire) && typeof WebSocket !== 'undefined') {
   var hostname = "" || location.hostname;
   var protocol = location.protocol === 'https:' ? 'wss' : 'ws';
-  var ws = new WebSocket(protocol + '://' + hostname + ':' + "56680" + '/');
+  var ws = new WebSocket(protocol + '://' + hostname + ':' + "63564" + '/');
 
   ws.onmessage = function (event) {
     checkedAssets = {};

diff --git a/example/build/example.e31bb0bc.js.map b/example/build/example.e31bb0bc.js.map
diff --git a/example/build/index.js b/example/build/index.js
diff --git a/src/EdgeRenderer/EdgeTypes/BezierEdge.js b/src/EdgeRenderer/EdgeTypes/BezierEdge.js
@@ -6,13 +6,15 @@ export default (props) => {
 
   const sourceHandle = sourceNode.__rg.handleBounds.source;
   const sourceHandleX = sourceHandle ? sourceHandle.x + (sourceHandle.width / 2) : sourceNode.__rg.width / 2;
+  const sourceHandleY = sourceHandle ? sourceHandle.y + (sourceHandle.height / 2) : sourceNode.__rg.height;
   const sourceX = sourceNode.__rg.position.x + sourceHandleX;
-  const sourceY = sourceNode.__rg.position.y + sourceNode.__rg.height;
+  const sourceY = sourceNode.__rg.position.y + sourceHandleY;
 
   const targetHandle = targetNode.__rg.handleBounds.target;
   const targetHandleX = targetHandle ? targetHandle.x + (targetHandle.width / 2) : targetNode.__rg.width / 2;
+  const targetHandleY = targetHandle ? targetHandle.y + (targetHandle.height / 2) : 0;
   const targetX = targetNode.__rg.position.x + targetHandleX;
-  const targetY = targetNode.__rg.position.y;
+  const targetY = targetNode.__rg.position.y + targetHandleY;
 
   const yOffset = Math.abs(targetY - sourceY) / 2;
   const centerY = targetY < sourceY ? targetY + yOffset : targetY - yOffset;