mirror of
https://github.com/n8n-io/n8n.git
synced 2025-03-05 20:50:17 -08:00
fix snapping
This commit is contained in:
parent
ef584e659d
commit
0ecd6a48ec
|
@ -1,146 +1,3 @@
|
|||
(function () {
|
||||
|
||||
"use strict";
|
||||
var root = this, _jp = root.jsPlumb, _ju = root.jsPlumbUtil;
|
||||
|
||||
_jp.Connectors.AbstractBezierConnector = function(params) {
|
||||
params = params || {};
|
||||
var showLoopback = params.showLoopback !== false,
|
||||
curviness = params.curviness || 10,
|
||||
margin = params.margin || 5,
|
||||
proximityLimit = params.proximityLimit || 80,
|
||||
clockwise = params.orientation && params.orientation === "clockwise",
|
||||
loopbackRadius = params.loopbackRadius || 25,
|
||||
isLoopbackCurrently = false,
|
||||
_super;
|
||||
|
||||
this._compute = function (paintInfo, p) {
|
||||
|
||||
var sp = p.sourcePos,
|
||||
tp = p.targetPos,
|
||||
_w = Math.abs(sp[0] - tp[0]),
|
||||
_h = Math.abs(sp[1] - tp[1]);
|
||||
|
||||
if (!showLoopback || (p.sourceEndpoint.elementId !== p.targetEndpoint.elementId)) {
|
||||
isLoopbackCurrently = false;
|
||||
this._computeBezier(paintInfo, p, sp, tp, _w, _h);
|
||||
} else {
|
||||
isLoopbackCurrently = true;
|
||||
// a loopback connector. draw an arc from one anchor to the other.
|
||||
var x1 = p.sourcePos[0], y1 = p.sourcePos[1] - margin,
|
||||
cx = x1, cy = y1 - loopbackRadius,
|
||||
// canvas sizing stuff, to ensure the whole painted area is visible.
|
||||
_x = cx - loopbackRadius,
|
||||
_y = cy - loopbackRadius;
|
||||
|
||||
_w = 2 * loopbackRadius;
|
||||
_h = 2 * loopbackRadius;
|
||||
|
||||
paintInfo.points[0] = _x;
|
||||
paintInfo.points[1] = _y;
|
||||
paintInfo.points[2] = _w;
|
||||
paintInfo.points[3] = _h;
|
||||
|
||||
// ADD AN ARC SEGMENT.
|
||||
_super.addSegment(this, "Arc", {
|
||||
loopback: true,
|
||||
x1: (x1 - _x) + 4,
|
||||
y1: y1 - _y,
|
||||
startAngle: 0,
|
||||
endAngle: 2 * Math.PI,
|
||||
r: loopbackRadius,
|
||||
ac: !clockwise,
|
||||
x2: (x1 - _x) - 4,
|
||||
y2: y1 - _y,
|
||||
cx: cx - _x,
|
||||
cy: cy - _y,
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
_super = _jp.Connectors.AbstractConnector.apply(this, arguments);
|
||||
return _super;
|
||||
};
|
||||
_ju.extend(_jp.Connectors.AbstractBezierConnector, _jp.Connectors.AbstractConnector);
|
||||
|
||||
var Bezier = function (params) {
|
||||
params = params || {};
|
||||
this.type = "N8nBezier";
|
||||
|
||||
var _super = _jp.Connectors.AbstractBezierConnector.apply(this, arguments),
|
||||
majorAnchor = params.curviness || 150,
|
||||
minorAnchor = 10;
|
||||
|
||||
this.getCurviness = function () {
|
||||
return majorAnchor;
|
||||
};
|
||||
|
||||
this._findControlPoint = function (point, sourceAnchorPosition, targetAnchorPosition, sourceEndpoint, targetEndpoint, soo, too) {
|
||||
// determine if the two anchors are perpendicular to each other in their orientation. we swap the control
|
||||
// points around if so (code could be tightened up)
|
||||
var perpendicular = soo[0] !== too[0] || soo[1] === too[1],
|
||||
p = [];
|
||||
|
||||
if (!perpendicular) {
|
||||
if (soo[0] === 0) {
|
||||
p.push(sourceAnchorPosition[0] < targetAnchorPosition[0] ? point[0] + minorAnchor : point[0] - minorAnchor);
|
||||
}
|
||||
else {
|
||||
p.push(point[0] - (majorAnchor * soo[0]));
|
||||
}
|
||||
|
||||
if (soo[1] === 0) {
|
||||
p.push(sourceAnchorPosition[1] < targetAnchorPosition[1] ? point[1] + minorAnchor : point[1] - minorAnchor);
|
||||
}
|
||||
else {
|
||||
p.push(point[1] + (majorAnchor * too[1]));
|
||||
}
|
||||
}
|
||||
else {
|
||||
if (too[0] === 0) {
|
||||
p.push(targetAnchorPosition[0] < sourceAnchorPosition[0] ? point[0] + minorAnchor : point[0] - minorAnchor);
|
||||
}
|
||||
else {
|
||||
p.push(point[0] + (majorAnchor * too[0]));
|
||||
}
|
||||
|
||||
if (too[1] === 0) {
|
||||
p.push(targetAnchorPosition[1] < sourceAnchorPosition[1] ? point[1] + minorAnchor : point[1] - minorAnchor);
|
||||
}
|
||||
else {
|
||||
p.push(point[1] + (majorAnchor * soo[1]));
|
||||
}
|
||||
}
|
||||
|
||||
return p;
|
||||
};
|
||||
|
||||
this._computeBezier = function (paintInfo, p, sp, tp, _w, _h) {
|
||||
|
||||
var _CP, _CP2,
|
||||
_sx = sp[0] < tp[0] ? _w : 0,
|
||||
_sy = sp[1] < tp[1] ? _h : 0,
|
||||
_tx = sp[0] < tp[0] ? 0 : _w,
|
||||
_ty = sp[1] < tp[1] ? 0 : _h;
|
||||
|
||||
_CP = this._findControlPoint([_sx, _sy], sp, tp, p.sourceEndpoint, p.targetEndpoint, paintInfo.so, paintInfo.to);
|
||||
_CP2 = this._findControlPoint([_tx, _ty], tp, sp, p.targetEndpoint, p.sourceEndpoint, paintInfo.to, paintInfo.so);
|
||||
|
||||
|
||||
_super.addSegment(this, "Bezier", {
|
||||
x1: _sx, y1: _sy, x2: _tx, y2: _ty,
|
||||
cp1x: _CP[0], cp1y: _CP[1], cp2x: _CP2[0], cp2y: _CP2[1],
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
};
|
||||
|
||||
_jp.Connectors.N8nBezier = Bezier;
|
||||
_ju.extend(Bezier, _jp.Connectors.AbstractBezierConnector);
|
||||
|
||||
}).call(typeof window !== 'undefined' ? window : this);
|
||||
|
||||
(function () {
|
||||
|
||||
"use strict";
|
||||
|
@ -406,7 +263,7 @@
|
|||
oProduct = ((so[0] * to[0]) + (so[1] * to[1]));
|
||||
|
||||
const sourceStubWithOffset = sourceStub + (getEndpointOffset && params.sourceEndpoint ? getEndpointOffset(params.sourceEndpoint) : 0);
|
||||
const targetStubWithOffset = targetStub + (getEndpointOffset && targetEndpoint ? getEndpointOffset(params.targetEndpoint) : 0);
|
||||
const targetStubWithOffset = targetStub + (getEndpointOffset && targetEndpoint ? getEndpointOffset(targetEndpoint) : 0);
|
||||
|
||||
var result = {
|
||||
sx: sx, sy: sy, tx: tx, ty: ty, lw: lw,
|
||||
|
@ -428,6 +285,10 @@
|
|||
sourceAxis: so[0] === 0 ? "y" : "x",
|
||||
points: [x, y, w, h, sx, sy, tx, ty ],
|
||||
stubs:[sourceStubWithOffset, targetStubWithOffset],
|
||||
sourceEndpoint: params.sourceEndpoint,
|
||||
targetEndpoint: targetEndpoint,
|
||||
sourcePos: params.sourcePos,
|
||||
targetPos: targetEndpoint.anchor.getCurrentLocation(),
|
||||
};
|
||||
result.anchorOrientation = result.opposite ? "opposite" : result.orthogonal ? "orthogonal" : "perpendicular";
|
||||
return result;
|
||||
|
@ -472,7 +333,7 @@
|
|||
paintInfo = _prepareCompute.call(this, params);
|
||||
|
||||
_clearSegments();
|
||||
this._compute(paintInfo, params);
|
||||
this._compute(paintInfo);
|
||||
this.x = paintInfo.points[0];
|
||||
this.y = paintInfo.points[1];
|
||||
this.w = paintInfo.points[2];
|
||||
|
@ -494,358 +355,454 @@
|
|||
};
|
||||
_ju.extend(_jp.Connectors.N8nAbstractConnector, AbstractComponent);
|
||||
|
||||
/**
|
||||
* Custom flowchart type
|
||||
* Based on jsplumb Flowchart type https://github.com/jsplumb/jsplumb/blob/fb5fce52794fa52306825bdaa62bf3855cdfd7e0/src/connectors-flowchart.js
|
||||
*
|
||||
* @param stub {number} length of stub segments
|
||||
* @param getEndpointOffset {Function} callback to offset stub length based on endpoint
|
||||
* @param midpoint {number} float percent of halfway point of segments
|
||||
* @param loopbackVerticalLength {number} height of vertical segment when looping
|
||||
* @param cornerRadius {number} radius of flowchart connectors
|
||||
* @param loopbackMinimum {number} minimum threshold before looping behavior takes effect
|
||||
* @param gap {number | [number, number]} gap between connector and source/target endpoints
|
||||
*/
|
||||
|
||||
var Flowchart = function (params) {
|
||||
this.type = "N8nFlowchart";
|
||||
_jp.Connectors.N8nAbstractBezierConnector = function(params) {
|
||||
params = params || {};
|
||||
params.stub = params.stub == null ? 30 : params.stub;
|
||||
params.getEndpointOffset = params.getEndpointOffset;
|
||||
var segments,
|
||||
_super = _jp.Connectors.N8nAbstractConnector.apply(this, arguments),
|
||||
midpoint = params.midpoint == null ? 0.5 : params.midpoint,
|
||||
alwaysRespectStubs = params.alwaysRespectStubs === true,
|
||||
loopbackVerticalLength = params.loopbackVerticalLength || 0,
|
||||
lastx = null, lasty = null, lastOrientation,
|
||||
cornerRadius = params.cornerRadius != null ? params.cornerRadius : 0,
|
||||
loopbackMinimum = params.loopbackMinimum || 100,
|
||||
var _super;
|
||||
|
||||
sgn = function (n) {
|
||||
return n < 0 ? -1 : n === 0 ? 0 : 1;
|
||||
},
|
||||
segmentDirections = function(segment) {
|
||||
return [
|
||||
sgn( segment[2] - segment[0] ),
|
||||
sgn( segment[3] - segment[1] ),
|
||||
];
|
||||
},
|
||||
/**
|
||||
* helper method to add a segment.
|
||||
*/
|
||||
addSegment = function (segments, x, y, paintInfo) {
|
||||
if (lastx === x && lasty === y) {
|
||||
return;
|
||||
}
|
||||
var lx = lastx == null ? paintInfo.sx : lastx,
|
||||
ly = lasty == null ? paintInfo.sy : lasty,
|
||||
o = lx === x ? "v" : "h";
|
||||
|
||||
lastx = x;
|
||||
lasty = y;
|
||||
segments.push([ lx, ly, x, y, o ]);
|
||||
},
|
||||
segLength = function (s) {
|
||||
return Math.sqrt(Math.pow(s[0] - s[2], 2) + Math.pow(s[1] - s[3], 2));
|
||||
},
|
||||
_cloneArray = function (a) {
|
||||
var _a = [];
|
||||
_a.push.apply(_a, a);
|
||||
return _a;
|
||||
},
|
||||
writeSegments = function (conn, segments, paintInfo) {
|
||||
var current = null, next, currentDirection, nextDirection;
|
||||
for (var i = 0; i < segments.length - 1; i++) {
|
||||
|
||||
current = current || _cloneArray(segments[i]);
|
||||
next = _cloneArray(segments[i + 1]);
|
||||
|
||||
currentDirection = segmentDirections(current);
|
||||
nextDirection = segmentDirections(next);
|
||||
|
||||
if (cornerRadius > 0 && current[4] !== next[4]) {
|
||||
|
||||
var minSegLength = Math.min(segLength(current), segLength(next));
|
||||
var radiusToUse = Math.min(cornerRadius, minSegLength / 2);
|
||||
|
||||
current[2] -= currentDirection[0] * radiusToUse;
|
||||
current[3] -= currentDirection[1] * radiusToUse;
|
||||
next[0] += nextDirection[0] * radiusToUse;
|
||||
next[1] += nextDirection[1] * radiusToUse;
|
||||
|
||||
var ac = (currentDirection[1] === nextDirection[0] && nextDirection[0] === 1) ||
|
||||
((currentDirection[1] === nextDirection[0] && nextDirection[0] === 0) && currentDirection[0] !== nextDirection[1]) ||
|
||||
(currentDirection[1] === nextDirection[0] && nextDirection[0] === -1),
|
||||
sgny = next[1] > current[3] ? 1 : -1,
|
||||
sgnx = next[0] > current[2] ? 1 : -1,
|
||||
sgnEqual = sgny === sgnx,
|
||||
cx = (sgnEqual && ac || (!sgnEqual && !ac)) ? next[0] : current[2],
|
||||
cy = (sgnEqual && ac || (!sgnEqual && !ac)) ? current[3] : next[1];
|
||||
|
||||
_super.addSegment(conn, STRAIGHT, {
|
||||
x1: current[0], y1: current[1], x2: current[2], y2: current[3],
|
||||
});
|
||||
|
||||
_super.addSegment(conn, ARC, {
|
||||
r: radiusToUse,
|
||||
x1: current[2],
|
||||
y1: current[3],
|
||||
x2: next[0],
|
||||
y2: next[1],
|
||||
cx: cx,
|
||||
cy: cy,
|
||||
ac: ac,
|
||||
});
|
||||
}
|
||||
else {
|
||||
// dx + dy are used to adjust for line width.
|
||||
var dx = (current[2] === current[0]) ? 0 : (current[2] > current[0]) ? (paintInfo.lw / 2) : -(paintInfo.lw / 2),
|
||||
dy = (current[3] === current[1]) ? 0 : (current[3] > current[1]) ? (paintInfo.lw / 2) : -(paintInfo.lw / 2);
|
||||
|
||||
_super.addSegment(conn, STRAIGHT, {
|
||||
x1: current[0] - dx, y1: current[1] - dy, x2: current[2] + dx, y2: current[3] + dy,
|
||||
});
|
||||
}
|
||||
current = next;
|
||||
}
|
||||
if (next != null) {
|
||||
// last segment
|
||||
_super.addSegment(conn, STRAIGHT, {
|
||||
x1: next[0], y1: next[1], x2: next[2], y2: next[3],
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
this._compute = function (paintInfo, connParams) {
|
||||
|
||||
segments = [];
|
||||
lastx = null;
|
||||
lasty = null;
|
||||
lastOrientation = null;
|
||||
|
||||
var commonStubCalculator = function () {
|
||||
return [paintInfo.startStubX, paintInfo.startStubY, paintInfo.endStubX, paintInfo.endStubY];
|
||||
},
|
||||
stubCalculators = {
|
||||
perpendicular: commonStubCalculator,
|
||||
orthogonal: commonStubCalculator,
|
||||
opposite: function (axis) {
|
||||
var pi = paintInfo,
|
||||
idx = axis === "x" ? 0 : 1,
|
||||
areInProximity = {
|
||||
"x": function () {
|
||||
return ( (pi.so[idx] === 1 && (
|
||||
( (pi.startStubX > pi.endStubX) && (pi.tx > pi.startStubX) ) ||
|
||||
( (pi.sx > pi.endStubX) && (pi.tx > pi.sx))))) ||
|
||||
|
||||
( (pi.so[idx] === -1 && (
|
||||
( (pi.startStubX < pi.endStubX) && (pi.tx < pi.startStubX) ) ||
|
||||
( (pi.sx < pi.endStubX) && (pi.tx < pi.sx)))));
|
||||
},
|
||||
"y": function () {
|
||||
return ( (pi.so[idx] === 1 && (
|
||||
( (pi.startStubY > pi.endStubY) && (pi.ty > pi.startStubY) ) ||
|
||||
( (pi.sy > pi.endStubY) && (pi.ty > pi.sy))))) ||
|
||||
|
||||
( (pi.so[idx] === -1 && (
|
||||
( (pi.startStubY < pi.endStubY) && (pi.ty < pi.startStubY) ) ||
|
||||
( (pi.sy < pi.endStubY) && (pi.ty < pi.sy)))));
|
||||
},
|
||||
};
|
||||
|
||||
if (!alwaysRespectStubs && areInProximity[axis]()) {
|
||||
return {
|
||||
"x": [(paintInfo.sx + paintInfo.tx) / 2, paintInfo.startStubY, (paintInfo.sx + paintInfo.tx) / 2, paintInfo.endStubY],
|
||||
"y": [paintInfo.startStubX, (paintInfo.sy + paintInfo.ty) / 2, paintInfo.endStubX, (paintInfo.sy + paintInfo.ty) / 2],
|
||||
}[axis];
|
||||
}
|
||||
else {
|
||||
return [paintInfo.startStubX, paintInfo.startStubY, paintInfo.endStubX, paintInfo.endStubY];
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
// calculate Stubs.
|
||||
var stubs = stubCalculators[paintInfo.anchorOrientation](paintInfo.sourceAxis),
|
||||
idx = paintInfo.sourceAxis === "x" ? 0 : 1,
|
||||
oidx = paintInfo.sourceAxis === "x" ? 1 : 0,
|
||||
ss = stubs[idx],
|
||||
oss = stubs[oidx],
|
||||
es = stubs[idx + 2],
|
||||
oes = stubs[oidx + 2];
|
||||
|
||||
// add the start stub segment. use stubs for loopback as it will look better, with the loop spaced
|
||||
// away from the element.
|
||||
addSegment(segments, stubs[0], stubs[1], paintInfo);
|
||||
|
||||
const diffX = paintInfo.endStubX - paintInfo.startStubX;
|
||||
const diffY = paintInfo.endStubY - paintInfo.startStubY;
|
||||
const direction = diffY >= 0 ? 1 : -1; // vertical direction of loop, above or below source
|
||||
|
||||
var midx = paintInfo.startStubX + ((paintInfo.endStubX - paintInfo.startStubX) * midpoint),
|
||||
midy;
|
||||
|
||||
if (diffX < (-1 * loopbackMinimum)) {
|
||||
// loop backward behavior
|
||||
midy = paintInfo.startStubY - (diffX < 0 ? direction * loopbackVerticalLength : 0);
|
||||
} else {
|
||||
// original flowchart behavior
|
||||
midy = paintInfo.startStubY + ((paintInfo.endStubY - paintInfo.startStubY) * midpoint);
|
||||
}
|
||||
|
||||
var orientations = {x: [0, 1], y: [1, 0]},
|
||||
lineCalculators = {
|
||||
perpendicular: function (axis) {
|
||||
var pi = paintInfo,
|
||||
sis = {
|
||||
x: [
|
||||
[[1, 2, 3, 4], null, [2, 1, 4, 3]],
|
||||
null,
|
||||
[[4, 3, 2, 1], null, [3, 4, 1, 2]],
|
||||
],
|
||||
y: [
|
||||
[[3, 2, 1, 4], null, [2, 3, 4, 1]],
|
||||
null,
|
||||
[[4, 1, 2, 3], null, [1, 4, 3, 2]],
|
||||
],
|
||||
},
|
||||
stubs = {
|
||||
x: [[pi.startStubX, pi.endStubX], null, [pi.endStubX, pi.startStubX]],
|
||||
y: [[pi.startStubY, pi.endStubY], null, [pi.endStubY, pi.startStubY]],
|
||||
},
|
||||
midLines = {
|
||||
x: [[midx, pi.startStubY], [midx, pi.endStubY]],
|
||||
y: [[pi.startStubX, midy], [pi.endStubX, midy]],
|
||||
},
|
||||
linesToEnd = {
|
||||
x: [[pi.endStubX, pi.startStubY]],
|
||||
y: [[pi.startStubX, pi.endStubY]],
|
||||
},
|
||||
startToEnd = {
|
||||
x: [[pi.startStubX, pi.endStubY], [pi.endStubX, pi.endStubY]],
|
||||
y: [[pi.endStubX, pi.startStubY], [pi.endStubX, pi.endStubY]],
|
||||
},
|
||||
startToMidToEnd = {
|
||||
x: [[pi.startStubX, midy], [pi.endStubX, midy], [pi.endStubX, pi.endStubY]],
|
||||
y: [[midx, pi.startStubY], [midx, pi.endStubY], [pi.endStubX, pi.endStubY]],
|
||||
},
|
||||
otherStubs = {
|
||||
x: [pi.startStubY, pi.endStubY],
|
||||
y: [pi.startStubX, pi.endStubX],
|
||||
},
|
||||
soIdx = orientations[axis][0], toIdx = orientations[axis][1],
|
||||
_so = pi.so[soIdx] + 1,
|
||||
_to = pi.to[toIdx] + 1,
|
||||
otherFlipped = (pi.to[toIdx] === -1 && (otherStubs[axis][1] < otherStubs[axis][0])) || (pi.to[toIdx] === 1 && (otherStubs[axis][1] > otherStubs[axis][0])),
|
||||
stub1 = stubs[axis][_so][0],
|
||||
stub2 = stubs[axis][_so][1],
|
||||
segmentIndexes = sis[axis][_so][_to];
|
||||
|
||||
if (pi.segment === segmentIndexes[3] || (pi.segment === segmentIndexes[2] && otherFlipped)) {
|
||||
return midLines[axis];
|
||||
}
|
||||
else if (pi.segment === segmentIndexes[2] && stub2 < stub1) {
|
||||
return linesToEnd[axis];
|
||||
}
|
||||
else if ((pi.segment === segmentIndexes[2] && stub2 >= stub1) || (pi.segment === segmentIndexes[1] && !otherFlipped)) {
|
||||
return startToMidToEnd[axis];
|
||||
}
|
||||
else if (pi.segment === segmentIndexes[0] || (pi.segment === segmentIndexes[1] && otherFlipped)) {
|
||||
return startToEnd[axis];
|
||||
}
|
||||
},
|
||||
orthogonal: function (axis, startStub, otherStartStub, endStub, otherEndStub) {
|
||||
var pi = paintInfo,
|
||||
extent = {
|
||||
"x": pi.so[0] === -1 ? Math.min(startStub, endStub) : Math.max(startStub, endStub),
|
||||
"y": pi.so[1] === -1 ? Math.min(startStub, endStub) : Math.max(startStub, endStub),
|
||||
}[axis];
|
||||
|
||||
return {
|
||||
"x": [
|
||||
[extent, otherStartStub],
|
||||
[extent, otherEndStub],
|
||||
[endStub, otherEndStub],
|
||||
],
|
||||
"y": [
|
||||
[otherStartStub, extent],
|
||||
[otherEndStub, extent],
|
||||
[otherEndStub, endStub],
|
||||
],
|
||||
}[axis];
|
||||
},
|
||||
opposite: function (axis, ss, oss, es) {
|
||||
var pi = paintInfo,
|
||||
otherAxis = {"x": "y", "y": "x"}[axis],
|
||||
dim = {"x": "height", "y": "width"}[axis],
|
||||
comparator = pi["is" + axis.toUpperCase() + "GreaterThanStubTimes2"];
|
||||
|
||||
if (connParams.sourceEndpoint.elementId === connParams.targetEndpoint.elementId) {
|
||||
var _val = oss + ((1 - connParams.sourceEndpoint.anchor[otherAxis]) * connParams.sourceInfo[dim]) + _super.maxStub;
|
||||
return {
|
||||
"x": [
|
||||
[ss, _val],
|
||||
[es, _val],
|
||||
],
|
||||
"y": [
|
||||
[_val, ss],
|
||||
[_val, es],
|
||||
],
|
||||
}[axis];
|
||||
|
||||
}
|
||||
else if (!comparator || (pi.so[idx] === 1 && ss > es) || (pi.so[idx] === -1 && ss < es)) {
|
||||
return {
|
||||
"x": [
|
||||
[ss, midy],
|
||||
[es, midy],
|
||||
],
|
||||
"y": [
|
||||
[midx, ss],
|
||||
[midx, es],
|
||||
],
|
||||
}[axis];
|
||||
}
|
||||
else if ((pi.so[idx] === 1 && ss < es) || (pi.so[idx] === -1 && ss > es)) {
|
||||
return {
|
||||
"x": [
|
||||
[midx, pi.sy],
|
||||
[midx, pi.ty],
|
||||
],
|
||||
"y": [
|
||||
[pi.sx, midy],
|
||||
[pi.tx, midy],
|
||||
],
|
||||
}[axis];
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
// compute the rest of the line
|
||||
var p = lineCalculators[paintInfo.anchorOrientation](paintInfo.sourceAxis, ss, oss, es, oes);
|
||||
if (p) {
|
||||
for (var i = 0; i < p.length; i++) {
|
||||
addSegment(segments, p[i][0], p[i][1], paintInfo);
|
||||
}
|
||||
}
|
||||
|
||||
// line to end stub
|
||||
addSegment(segments, stubs[2], stubs[3], paintInfo);
|
||||
|
||||
//}
|
||||
|
||||
// end stub to end (common)
|
||||
addSegment(segments, paintInfo.tx, paintInfo.ty, paintInfo);
|
||||
|
||||
|
||||
|
||||
// write out the segments.
|
||||
writeSegments(this, segments, paintInfo);
|
||||
this._compute = function (paintInfo) {
|
||||
var sp = paintInfo.sourcePos,
|
||||
tp = paintInfo.targetPos,
|
||||
_w = Math.abs(sp[0] - tp[0]),
|
||||
_h = Math.abs(sp[1] - tp[1]);
|
||||
|
||||
this._computeBezier(paintInfo, sp, tp, _w, _h);
|
||||
};
|
||||
|
||||
_super = _jp.Connectors.N8nAbstractConnector.apply(this, arguments);
|
||||
return _super;
|
||||
};
|
||||
_ju.extend(_jp.Connectors.N8nAbstractBezierConnector, _jp.Connectors.N8nAbstractConnector);
|
||||
|
||||
var Bezier = function (params) {
|
||||
params = params || {};
|
||||
this.type = "N8nBezier";
|
||||
|
||||
var _super = _jp.Connectors.N8nAbstractBezierConnector.apply(this, arguments),
|
||||
majorAnchor = params.curviness || 150,
|
||||
minorAnchor = 10;
|
||||
|
||||
this.getCurviness = function () {
|
||||
return majorAnchor;
|
||||
};
|
||||
|
||||
this._findControlPoint = function (point, sourceAnchorPosition, targetAnchorPosition, sourceEndpoint, targetEndpoint, soo, too) {
|
||||
// determine if the two anchors are perpendicular to each other in their orientation. we swap the control
|
||||
// points around if so (code could be tightened up)
|
||||
var perpendicular = soo[0] !== too[0] || soo[1] === too[1],
|
||||
p = [];
|
||||
|
||||
if (!perpendicular) {
|
||||
if (soo[0] === 0) {
|
||||
p.push(sourceAnchorPosition[0] < targetAnchorPosition[0] ? point[0] + minorAnchor : point[0] - minorAnchor);
|
||||
}
|
||||
else {
|
||||
p.push(point[0] - (majorAnchor * soo[0]));
|
||||
}
|
||||
|
||||
if (soo[1] === 0) {
|
||||
p.push(sourceAnchorPosition[1] < targetAnchorPosition[1] ? point[1] + minorAnchor : point[1] - minorAnchor);
|
||||
}
|
||||
else {
|
||||
p.push(point[1] + (majorAnchor * too[1]));
|
||||
}
|
||||
}
|
||||
else {
|
||||
if (too[0] === 0) {
|
||||
p.push(targetAnchorPosition[0] < sourceAnchorPosition[0] ? point[0] + minorAnchor : point[0] - minorAnchor);
|
||||
}
|
||||
else {
|
||||
p.push(point[0] + (majorAnchor * too[0]));
|
||||
}
|
||||
|
||||
if (too[1] === 0) {
|
||||
p.push(targetAnchorPosition[1] < sourceAnchorPosition[1] ? point[1] + minorAnchor : point[1] - minorAnchor);
|
||||
}
|
||||
else {
|
||||
p.push(point[1] + (majorAnchor * soo[1]));
|
||||
}
|
||||
}
|
||||
|
||||
return p;
|
||||
};
|
||||
|
||||
this._computeBezier = function (paintInfo, sp, tp, _w, _h) {
|
||||
var _CP, _CP2,
|
||||
_sx = sp[0] < tp[0] ? _w : 0,
|
||||
_sy = sp[1] < tp[1] ? _h : 0,
|
||||
_tx = sp[0] < tp[0] ? 0 : _w,
|
||||
_ty = sp[1] < tp[1] ? 0 : _h;
|
||||
|
||||
_CP = this._findControlPoint([_sx, _sy], sp, tp, paintInfo.sourceEndpoint, paintInfo.targetEndpoint, paintInfo.so, paintInfo.to);
|
||||
_CP2 = this._findControlPoint([_tx, _ty], tp, sp, paintInfo.targetEndpoint, paintInfo.sourceEndpoint, paintInfo.to, paintInfo.so);
|
||||
|
||||
|
||||
_super.addSegment(this, "Bezier", {
|
||||
x1: _sx, y1: _sy, x2: _tx, y2: _ty,
|
||||
cp1x: _CP[0], cp1y: _CP[1], cp2x: _CP2[0], cp2y: _CP2[1],
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
};
|
||||
|
||||
_jp.Connectors.N8nFlowchart = Flowchart;
|
||||
_ju.extend(_jp.Connectors.N8nFlowchart, _jp.Connectors.N8nAbstractConnector);
|
||||
_jp.Connectors.N8nBezier = Bezier;
|
||||
_ju.extend(_jp.Connectors.N8nBezier, _jp.Connectors.N8nAbstractBezierConnector);
|
||||
|
||||
}).call(typeof window !== 'undefined' ? window : this);
|
||||
|
||||
// (function () {
|
||||
// /**
|
||||
// * Custom flowchart type
|
||||
// * Based on jsplumb Flowchart type https://github.com/jsplumb/jsplumb/blob/fb5fce52794fa52306825bdaa62bf3855cdfd7e0/src/connectors-flowchart.js
|
||||
// *
|
||||
// * @param stub {number} length of stub segments
|
||||
// * @param getEndpointOffset {Function} callback to offset stub length based on endpoint
|
||||
// * @param midpoint {number} float percent of halfway point of segments
|
||||
// * @param loopbackVerticalLength {number} height of vertical segment when looping
|
||||
// * @param cornerRadius {number} radius of flowchart connectors
|
||||
// * @param loopbackMinimum {number} minimum threshold before looping behavior takes effect
|
||||
// * @param gap {number | [number, number]} gap between connector and source/target endpoints
|
||||
// */
|
||||
|
||||
// var Flowchart = function (params) {
|
||||
// this.type = "N8nFlowchart";
|
||||
// params = params || {};
|
||||
// params.stub = params.stub == null ? 30 : params.stub;
|
||||
// params.getEndpointOffset = params.getEndpointOffset;
|
||||
// var segments,
|
||||
// _super = _jp.Connectors.N8nAbstractConnector.apply(this, arguments),
|
||||
// midpoint = params.midpoint == null ? 0.5 : params.midpoint,
|
||||
// alwaysRespectStubs = params.alwaysRespectStubs === true,
|
||||
// loopbackVerticalLength = params.loopbackVerticalLength || 0,
|
||||
// lastx = null, lasty = null, lastOrientation,
|
||||
// cornerRadius = params.cornerRadius != null ? params.cornerRadius : 0,
|
||||
// loopbackMinimum = params.loopbackMinimum || 100,
|
||||
|
||||
// sgn = function (n) {
|
||||
// return n < 0 ? -1 : n === 0 ? 0 : 1;
|
||||
// },
|
||||
// segmentDirections = function(segment) {
|
||||
// return [
|
||||
// sgn( segment[2] - segment[0] ),
|
||||
// sgn( segment[3] - segment[1] ),
|
||||
// ];
|
||||
// },
|
||||
// /**
|
||||
// * helper method to add a segment.
|
||||
// */
|
||||
// addSegment = function (segments, x, y, paintInfo) {
|
||||
// if (lastx === x && lasty === y) {
|
||||
// return;
|
||||
// }
|
||||
// var lx = lastx == null ? paintInfo.sx : lastx,
|
||||
// ly = lasty == null ? paintInfo.sy : lasty,
|
||||
// o = lx === x ? "v" : "h";
|
||||
|
||||
// lastx = x;
|
||||
// lasty = y;
|
||||
// segments.push([ lx, ly, x, y, o ]);
|
||||
// },
|
||||
// segLength = function (s) {
|
||||
// return Math.sqrt(Math.pow(s[0] - s[2], 2) + Math.pow(s[1] - s[3], 2));
|
||||
// },
|
||||
// _cloneArray = function (a) {
|
||||
// var _a = [];
|
||||
// _a.push.apply(_a, a);
|
||||
// return _a;
|
||||
// },
|
||||
// writeSegments = function (conn, segments, paintInfo) {
|
||||
// var current = null, next, currentDirection, nextDirection;
|
||||
// for (var i = 0; i < segments.length - 1; i++) {
|
||||
|
||||
// current = current || _cloneArray(segments[i]);
|
||||
// next = _cloneArray(segments[i + 1]);
|
||||
|
||||
// currentDirection = segmentDirections(current);
|
||||
// nextDirection = segmentDirections(next);
|
||||
|
||||
// if (cornerRadius > 0 && current[4] !== next[4]) {
|
||||
|
||||
// var minSegLength = Math.min(segLength(current), segLength(next));
|
||||
// var radiusToUse = Math.min(cornerRadius, minSegLength / 2);
|
||||
|
||||
// current[2] -= currentDirection[0] * radiusToUse;
|
||||
// current[3] -= currentDirection[1] * radiusToUse;
|
||||
// next[0] += nextDirection[0] * radiusToUse;
|
||||
// next[1] += nextDirection[1] * radiusToUse;
|
||||
|
||||
// var ac = (currentDirection[1] === nextDirection[0] && nextDirection[0] === 1) ||
|
||||
// ((currentDirection[1] === nextDirection[0] && nextDirection[0] === 0) && currentDirection[0] !== nextDirection[1]) ||
|
||||
// (currentDirection[1] === nextDirection[0] && nextDirection[0] === -1),
|
||||
// sgny = next[1] > current[3] ? 1 : -1,
|
||||
// sgnx = next[0] > current[2] ? 1 : -1,
|
||||
// sgnEqual = sgny === sgnx,
|
||||
// cx = (sgnEqual && ac || (!sgnEqual && !ac)) ? next[0] : current[2],
|
||||
// cy = (sgnEqual && ac || (!sgnEqual && !ac)) ? current[3] : next[1];
|
||||
|
||||
// _super.addSegment(conn, STRAIGHT, {
|
||||
// x1: current[0], y1: current[1], x2: current[2], y2: current[3],
|
||||
// });
|
||||
|
||||
// _super.addSegment(conn, ARC, {
|
||||
// r: radiusToUse,
|
||||
// x1: current[2],
|
||||
// y1: current[3],
|
||||
// x2: next[0],
|
||||
// y2: next[1],
|
||||
// cx: cx,
|
||||
// cy: cy,
|
||||
// ac: ac,
|
||||
// });
|
||||
// }
|
||||
// else {
|
||||
// // dx + dy are used to adjust for line width.
|
||||
// var dx = (current[2] === current[0]) ? 0 : (current[2] > current[0]) ? (paintInfo.lw / 2) : -(paintInfo.lw / 2),
|
||||
// dy = (current[3] === current[1]) ? 0 : (current[3] > current[1]) ? (paintInfo.lw / 2) : -(paintInfo.lw / 2);
|
||||
|
||||
// _super.addSegment(conn, STRAIGHT, {
|
||||
// x1: current[0] - dx, y1: current[1] - dy, x2: current[2] + dx, y2: current[3] + dy,
|
||||
// });
|
||||
// }
|
||||
// current = next;
|
||||
// }
|
||||
// if (next != null) {
|
||||
// // last segment
|
||||
// _super.addSegment(conn, STRAIGHT, {
|
||||
// x1: next[0], y1: next[1], x2: next[2], y2: next[3],
|
||||
// });
|
||||
// }
|
||||
// };
|
||||
|
||||
// this._compute = function (paintInfo, connParams) {
|
||||
|
||||
// segments = [];
|
||||
// lastx = null;
|
||||
// lasty = null;
|
||||
// lastOrientation = null;
|
||||
|
||||
// var commonStubCalculator = function () {
|
||||
// return [paintInfo.startStubX, paintInfo.startStubY, paintInfo.endStubX, paintInfo.endStubY];
|
||||
// },
|
||||
// stubCalculators = {
|
||||
// perpendicular: commonStubCalculator,
|
||||
// orthogonal: commonStubCalculator,
|
||||
// opposite: function (axis) {
|
||||
// var pi = paintInfo,
|
||||
// idx = axis === "x" ? 0 : 1,
|
||||
// areInProximity = {
|
||||
// "x": function () {
|
||||
// return ( (pi.so[idx] === 1 && (
|
||||
// ( (pi.startStubX > pi.endStubX) && (pi.tx > pi.startStubX) ) ||
|
||||
// ( (pi.sx > pi.endStubX) && (pi.tx > pi.sx))))) ||
|
||||
|
||||
// ( (pi.so[idx] === -1 && (
|
||||
// ( (pi.startStubX < pi.endStubX) && (pi.tx < pi.startStubX) ) ||
|
||||
// ( (pi.sx < pi.endStubX) && (pi.tx < pi.sx)))));
|
||||
// },
|
||||
// "y": function () {
|
||||
// return ( (pi.so[idx] === 1 && (
|
||||
// ( (pi.startStubY > pi.endStubY) && (pi.ty > pi.startStubY) ) ||
|
||||
// ( (pi.sy > pi.endStubY) && (pi.ty > pi.sy))))) ||
|
||||
|
||||
// ( (pi.so[idx] === -1 && (
|
||||
// ( (pi.startStubY < pi.endStubY) && (pi.ty < pi.startStubY) ) ||
|
||||
// ( (pi.sy < pi.endStubY) && (pi.ty < pi.sy)))));
|
||||
// },
|
||||
// };
|
||||
|
||||
// if (!alwaysRespectStubs && areInProximity[axis]()) {
|
||||
// return {
|
||||
// "x": [(paintInfo.sx + paintInfo.tx) / 2, paintInfo.startStubY, (paintInfo.sx + paintInfo.tx) / 2, paintInfo.endStubY],
|
||||
// "y": [paintInfo.startStubX, (paintInfo.sy + paintInfo.ty) / 2, paintInfo.endStubX, (paintInfo.sy + paintInfo.ty) / 2],
|
||||
// }[axis];
|
||||
// }
|
||||
// else {
|
||||
// return [paintInfo.startStubX, paintInfo.startStubY, paintInfo.endStubX, paintInfo.endStubY];
|
||||
// }
|
||||
// },
|
||||
// };
|
||||
|
||||
// // calculate Stubs.
|
||||
// var stubs = stubCalculators[paintInfo.anchorOrientation](paintInfo.sourceAxis),
|
||||
// idx = paintInfo.sourceAxis === "x" ? 0 : 1,
|
||||
// oidx = paintInfo.sourceAxis === "x" ? 1 : 0,
|
||||
// ss = stubs[idx],
|
||||
// oss = stubs[oidx],
|
||||
// es = stubs[idx + 2],
|
||||
// oes = stubs[oidx + 2];
|
||||
|
||||
// // add the start stub segment. use stubs for loopback as it will look better, with the loop spaced
|
||||
// // away from the element.
|
||||
// addSegment(segments, stubs[0], stubs[1], paintInfo);
|
||||
|
||||
// const diffX = paintInfo.endStubX - paintInfo.startStubX;
|
||||
// const diffY = paintInfo.endStubY - paintInfo.startStubY;
|
||||
// const direction = diffY >= 0 ? 1 : -1; // vertical direction of loop, above or below source
|
||||
|
||||
// var midx = paintInfo.startStubX + ((paintInfo.endStubX - paintInfo.startStubX) * midpoint),
|
||||
// midy;
|
||||
|
||||
// if (diffX < (-1 * loopbackMinimum)) {
|
||||
// // loop backward behavior
|
||||
// midy = paintInfo.startStubY - (diffX < 0 ? direction * loopbackVerticalLength : 0);
|
||||
// } else {
|
||||
// // original flowchart behavior
|
||||
// midy = paintInfo.startStubY + ((paintInfo.endStubY - paintInfo.startStubY) * midpoint);
|
||||
// }
|
||||
|
||||
// var orientations = {x: [0, 1], y: [1, 0]},
|
||||
// lineCalculators = {
|
||||
// perpendicular: function (axis) {
|
||||
// var pi = paintInfo,
|
||||
// sis = {
|
||||
// x: [
|
||||
// [[1, 2, 3, 4], null, [2, 1, 4, 3]],
|
||||
// null,
|
||||
// [[4, 3, 2, 1], null, [3, 4, 1, 2]],
|
||||
// ],
|
||||
// y: [
|
||||
// [[3, 2, 1, 4], null, [2, 3, 4, 1]],
|
||||
// null,
|
||||
// [[4, 1, 2, 3], null, [1, 4, 3, 2]],
|
||||
// ],
|
||||
// },
|
||||
// stubs = {
|
||||
// x: [[pi.startStubX, pi.endStubX], null, [pi.endStubX, pi.startStubX]],
|
||||
// y: [[pi.startStubY, pi.endStubY], null, [pi.endStubY, pi.startStubY]],
|
||||
// },
|
||||
// midLines = {
|
||||
// x: [[midx, pi.startStubY], [midx, pi.endStubY]],
|
||||
// y: [[pi.startStubX, midy], [pi.endStubX, midy]],
|
||||
// },
|
||||
// linesToEnd = {
|
||||
// x: [[pi.endStubX, pi.startStubY]],
|
||||
// y: [[pi.startStubX, pi.endStubY]],
|
||||
// },
|
||||
// startToEnd = {
|
||||
// x: [[pi.startStubX, pi.endStubY], [pi.endStubX, pi.endStubY]],
|
||||
// y: [[pi.endStubX, pi.startStubY], [pi.endStubX, pi.endStubY]],
|
||||
// },
|
||||
// startToMidToEnd = {
|
||||
// x: [[pi.startStubX, midy], [pi.endStubX, midy], [pi.endStubX, pi.endStubY]],
|
||||
// y: [[midx, pi.startStubY], [midx, pi.endStubY], [pi.endStubX, pi.endStubY]],
|
||||
// },
|
||||
// otherStubs = {
|
||||
// x: [pi.startStubY, pi.endStubY],
|
||||
// y: [pi.startStubX, pi.endStubX],
|
||||
// },
|
||||
// soIdx = orientations[axis][0], toIdx = orientations[axis][1],
|
||||
// _so = pi.so[soIdx] + 1,
|
||||
// _to = pi.to[toIdx] + 1,
|
||||
// otherFlipped = (pi.to[toIdx] === -1 && (otherStubs[axis][1] < otherStubs[axis][0])) || (pi.to[toIdx] === 1 && (otherStubs[axis][1] > otherStubs[axis][0])),
|
||||
// stub1 = stubs[axis][_so][0],
|
||||
// stub2 = stubs[axis][_so][1],
|
||||
// segmentIndexes = sis[axis][_so][_to];
|
||||
|
||||
// if (pi.segment === segmentIndexes[3] || (pi.segment === segmentIndexes[2] && otherFlipped)) {
|
||||
// return midLines[axis];
|
||||
// }
|
||||
// else if (pi.segment === segmentIndexes[2] && stub2 < stub1) {
|
||||
// return linesToEnd[axis];
|
||||
// }
|
||||
// else if ((pi.segment === segmentIndexes[2] && stub2 >= stub1) || (pi.segment === segmentIndexes[1] && !otherFlipped)) {
|
||||
// return startToMidToEnd[axis];
|
||||
// }
|
||||
// else if (pi.segment === segmentIndexes[0] || (pi.segment === segmentIndexes[1] && otherFlipped)) {
|
||||
// return startToEnd[axis];
|
||||
// }
|
||||
// },
|
||||
// orthogonal: function (axis, startStub, otherStartStub, endStub, otherEndStub) {
|
||||
// var pi = paintInfo,
|
||||
// extent = {
|
||||
// "x": pi.so[0] === -1 ? Math.min(startStub, endStub) : Math.max(startStub, endStub),
|
||||
// "y": pi.so[1] === -1 ? Math.min(startStub, endStub) : Math.max(startStub, endStub),
|
||||
// }[axis];
|
||||
|
||||
// return {
|
||||
// "x": [
|
||||
// [extent, otherStartStub],
|
||||
// [extent, otherEndStub],
|
||||
// [endStub, otherEndStub],
|
||||
// ],
|
||||
// "y": [
|
||||
// [otherStartStub, extent],
|
||||
// [otherEndStub, extent],
|
||||
// [otherEndStub, endStub],
|
||||
// ],
|
||||
// }[axis];
|
||||
// },
|
||||
// opposite: function (axis, ss, oss, es) {
|
||||
// var pi = paintInfo,
|
||||
// otherAxis = {"x": "y", "y": "x"}[axis],
|
||||
// dim = {"x": "height", "y": "width"}[axis],
|
||||
// comparator = pi["is" + axis.toUpperCase() + "GreaterThanStubTimes2"];
|
||||
|
||||
// if (connParams.sourceEndpoint.elementId === connParams.targetEndpoint.elementId) {
|
||||
// var _val = oss + ((1 - connParams.sourceEndpoint.anchor[otherAxis]) * connParams.sourceInfo[dim]) + _super.maxStub;
|
||||
// return {
|
||||
// "x": [
|
||||
// [ss, _val],
|
||||
// [es, _val],
|
||||
// ],
|
||||
// "y": [
|
||||
// [_val, ss],
|
||||
// [_val, es],
|
||||
// ],
|
||||
// }[axis];
|
||||
|
||||
// }
|
||||
// else if (!comparator || (pi.so[idx] === 1 && ss > es) || (pi.so[idx] === -1 && ss < es)) {
|
||||
// return {
|
||||
// "x": [
|
||||
// [ss, midy],
|
||||
// [es, midy],
|
||||
// ],
|
||||
// "y": [
|
||||
// [midx, ss],
|
||||
// [midx, es],
|
||||
// ],
|
||||
// }[axis];
|
||||
// }
|
||||
// else if ((pi.so[idx] === 1 && ss < es) || (pi.so[idx] === -1 && ss > es)) {
|
||||
// return {
|
||||
// "x": [
|
||||
// [midx, pi.sy],
|
||||
// [midx, pi.ty],
|
||||
// ],
|
||||
// "y": [
|
||||
// [pi.sx, midy],
|
||||
// [pi.tx, midy],
|
||||
// ],
|
||||
// }[axis];
|
||||
// }
|
||||
// },
|
||||
// };
|
||||
|
||||
// // compute the rest of the line
|
||||
// var p = lineCalculators[paintInfo.anchorOrientation](paintInfo.sourceAxis, ss, oss, es, oes);
|
||||
// if (p) {
|
||||
// for (var i = 0; i < p.length; i++) {
|
||||
// addSegment(segments, p[i][0], p[i][1], paintInfo);
|
||||
// }
|
||||
// }
|
||||
|
||||
// // line to end stub
|
||||
// addSegment(segments, stubs[2], stubs[3], paintInfo);
|
||||
|
||||
// //}
|
||||
|
||||
// // end stub to end (common)
|
||||
// addSegment(segments, paintInfo.tx, paintInfo.ty, paintInfo);
|
||||
|
||||
|
||||
|
||||
// // write out the segments.
|
||||
// writeSegments(this, segments, paintInfo);
|
||||
|
||||
// };
|
||||
// };
|
||||
|
||||
// _jp.Connectors.N8nFlowchart = Flowchart;
|
||||
// _ju.extend(_jp.Connectors.N8nFlowchart, _jp.Connectors.N8nAbstractConnector);
|
||||
|
||||
// }).call(typeof window !== 'undefined' ? window : this);
|
||||
|
|
|
@ -663,7 +663,7 @@ export const getUniqueNodeName = (nodes: INodeUi[], originalName: string, additi
|
|||
export const showDropConnectionState = (connection: Connection, targetEndpoint?: Endpoint) => {
|
||||
if (connection && connection.connector) {
|
||||
if (targetEndpoint) {
|
||||
// connection.connector.setTargetEndpoint(targetEndpoint);
|
||||
connection.connector.setTargetEndpoint(targetEndpoint);
|
||||
}
|
||||
connection.setPaintStyle(CONNECTOR_PAINT_STYLE_PRIMARY);
|
||||
hideOverlay(connection, OVERLAY_DROP_NODE_ID);
|
||||
|
@ -673,7 +673,7 @@ export const showDropConnectionState = (connection: Connection, targetEndpoint?:
|
|||
|
||||
export const showPullConnectionState = (connection: Connection) => {
|
||||
if (connection && connection.connector) {
|
||||
// connection.connector.resetTargetEndpoint();
|
||||
connection.connector.resetTargetEndpoint();
|
||||
connection.setPaintStyle(CONNECTOR_PAINT_STYLE_PULL);
|
||||
showOverlay(connection, OVERLAY_DROP_NODE_ID);
|
||||
hideOverlay(connection, OVERLAY_ENDPOINT_ARROW_ID);
|
||||
|
@ -682,7 +682,7 @@ export const showPullConnectionState = (connection: Connection) => {
|
|||
|
||||
export const resetConnectionAfterPull = (connection: Connection) => {
|
||||
if (connection && connection.connector) {
|
||||
// connection.connector.resetTargetEndpoint();
|
||||
connection.connector.resetTargetEndpoint();
|
||||
connection.setPaintStyle(CONNECTOR_PAINT_STYLE_DEFAULT);
|
||||
showOverlay(connection, OVERLAY_ENDPOINT_ARROW_ID);
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue