@nodeject/ui-components
Version:
UI library for non-trivial components
69 lines (68 loc) • 3.37 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.getEdgeConnectorsCoordinates = exports.Edge = void 0;
/**
* Draws the SVG edges of each node.
*/
var React = require("react");
var Edge_module_less_1 = require("./Edge.module.less");
var Graph_1 = require("../Graph");
var node_container_1 = require("../node-container");
var helpers_1 = require("../../helpers");
var Edge = function (props) {
var path;
// prettier-ignore
if (Graph_1.isOrgStyle(props.parentLayoutStyle)) { // WBS style
var xDistance = props.xSource - props.xTarget;
if (xDistance > 4) {
path = 'M' + Math.round(props.xSource) + ' ' + Math.round(props.ySource) + ' V' + (Math.round(props.yTarget) + (Math.round(props.ySource) - Math.round(props.yTarget)) / 2 + 4) + 'a4,4 0 0 0 -4,-4' + ' H' + Math.round(props.xTarget) + ' V' + Math.round(props.yTarget);
}
else if (xDistance >= -20 && xDistance <= 20) {
path = 'M' + Math.round(props.xSource) + ' ' + Math.round(props.ySource) + ' V' + (Math.round(props.yTarget) + (Math.round(props.ySource) - Math.round(props.yTarget)) / 2) + ' H' + Math.round(props.xTarget) + ' V' + Math.round(props.yTarget);
}
else {
path = 'M' + Math.round(props.xSource) + ' ' + Math.round(props.ySource) + ' V' + (Math.round(props.yTarget) + (Math.round(props.ySource) - Math.round(props.yTarget)) / 2 + 4) + 'a4,4 0 0 1 4,-4' + ' H' + Math.round(props.xTarget) + ' V' + Math.round(props.yTarget);
}
}
else { // List style
path = 'M' + Math.round(props.xSource) + ' ' + Math.round(props.ySource) + ' H' + (Math.round(props.xTarget) + 5) + 'a4,4 0 0 1 -4,-4' + ' V' + Math.round(props.yTarget);
}
return (React.createElement("svg", { className: Edge_module_less_1.default.edge, style: { overflow: 'visible' } },
React.createElement("path", { d: path })));
};
exports.Edge = Edge;
var getEdgeConnectorsCoordinates = function (nodeId, nodeParentId, isParentNodeOrgStyle, nodeStyle) {
var childDOM = node_container_1.getNodeDom(helpers_1.getClassAndIdNames(nodeStyle, nodeId).idName);
var parentDOM = nodeParentId !== '' &&
node_container_1.getNodeDom(helpers_1.getClassAndIdNames(nodeStyle, nodeParentId).idName);
if (nodeParentId !== '' && parentDOM && node_container_1.isDomNodeRendered(childDOM)) {
var parentBox = parentDOM.getBoundingClientRect();
var childBox = childDOM.getBoundingClientRect();
if (isParentNodeOrgStyle) {
return {
xSource: childBox.width / 2,
ySource: 0,
xTarget: parentBox.left - childBox.left + parentBox.width / 2,
yTarget: parentBox.bottom - childBox.top
};
}
else {
// List style
return {
xSource: 0,
ySource: childBox.height / 2,
xTarget: ((parentBox.left - childBox.left) * 2) / 3,
yTarget: parentBox.bottom - childBox.top
};
}
}
else {
return {
xSource: 0,
ySource: 0,
xTarget: 0,
yTarget: 0
};
}
};
exports.getEdgeConnectorsCoordinates = getEdgeConnectorsCoordinates;