show arrow along with label

This commit is contained in:
Mutasem 2021-10-21 18:42:50 +02:00
parent 2e7425f79b
commit efad3e32ca
3 changed files with 17 additions and 8 deletions

View file

@ -434,10 +434,6 @@ export default mixins(externalHooks, nodeBase, nodeHelpers, workflowHelpers).ext
z-index: 8;
}
.jtk-endpoint.dropHover {
border: 2px solid #ff2244;
}
.jtk-drag-selected .node-default {
/* https://www.cssmatic.com/box-shadow */
-webkit-box-shadow: 0px 0px 6px 2px rgba(50, 75, 216, 0.37);

View file

@ -238,7 +238,7 @@ const CONNECTOR_PAINT_STYLE_SUCCESS = {
};
const CONNECTOR_TYPE_BEZIER = ['Bezier', { curviness: _CURVINESS }];
const CONNECTOR_TYPE_FLOWCHART = ['Flowchart', { cornerRadius: 8, stub: JSPLUMB_FLOWCHART_STUB, gap: 5, alwaysRespectStubs: _ALWAYS_RESPECT_STUB}];
const CONNECTOR_TYPE_FLOWCHART = ['Flowchart', { cornerRadius: 4, stub: JSPLUMB_FLOWCHART_STUB, gap: 5, alwaysRespectStubs: _ALWAYS_RESPECT_STUB}];
const CONNECTOR_ARROW_OVERLAYS: OverlaySpec[] = [
[
@ -1503,8 +1503,10 @@ export default mixins(
}
showOverlay(info.connection, OVERLAY_CONNECTION_ACTIONS_ID);
hideOverlay(info.connection, OVERLAY_MIDPOINT_ARROW_ID);
hideOverlay(info.connection, OVERLAY_RUN_ITEMS_ID);
if (!info.connection.getOverlay(OVERLAY_RUN_ITEMS_ID)) {
hideOverlay(info.connection, OVERLAY_MIDPOINT_ARROW_ID);
}
});
info.connection.bind('mouseout', (connection: IConnection) => {
@ -1953,6 +1955,7 @@ export default mixins(
if (!output || !output.total) {
conn.setPaintStyle(CONNECTOR_PAINT_STYLE_DEFAULT);
conn.removeOverlay(OVERLAY_RUN_ITEMS_ID);
showOrHideMidpointArrow(conn);
return;
}
@ -1977,6 +1980,7 @@ export default mixins(
]);
showOrHideItemsLabel(conn);
showOrHideMidpointArrow(conn);
});
});
});

View file

@ -119,13 +119,22 @@ export const hideOverlay = (connection: Connection, overlayId: string) => {
};
export const showOrHideMidpointArrow = (connection: Connection) => {
const hasItemsLabel = !!connection.getOverlay(OVERLAY_RUN_ITEMS_ID);
const sourceEndpoint = connection.endpoints[0];
const targetEndpoint = connection.endpoints[1];
const requiresArrow = sourceEndpoint.anchor.lastReturnValue[0] >= targetEndpoint.anchor.lastReturnValue[0];
const sourcePosition = sourceEndpoint.anchor.lastReturnValue[0];
const targetPosition = targetEndpoint.anchor.lastReturnValue[0];
const minimum = hasItemsLabel ? 150 : 0;
const isBackwards = sourcePosition >= targetPosition;
const isTooLong = Math.abs(sourcePosition - targetPosition) >= minimum;
const arrow = connection.getOverlay(OVERLAY_MIDPOINT_ARROW_ID);
if (arrow) {
arrow.setVisible(requiresArrow);
arrow.setVisible(isBackwards && isTooLong);
arrow.setLocation(hasItemsLabel ? .6: .5);
}
};