add label constants

This commit is contained in:
Mutasem 2021-11-01 15:45:58 +01:00
parent 0015cb4f34
commit 9a39c655f8
4 changed files with 10 additions and 8 deletions

View file

@ -44,7 +44,7 @@ declare module 'jsplumb' {
}; };
// bind(event: string, (connection: Connection): void;): void; // tslint:disable-line:no-any // bind(event: string, (connection: Connection): void;): void; // tslint:disable-line:no-any
bind(event: string, callback: Function): void; // tslint:disable-line:no-any bind(event: string, callback: Function): void;
removeOverlay(name: string): void; removeOverlay(name: string): void;
removeOverlays(): void; removeOverlays(): void;
setParameter(name: string, value: any): void; // tslint:disable-line:no-any setParameter(name: string, value: any): void; // tslint:disable-line:no-any

View file

@ -201,7 +201,7 @@ export const nodeBase = mixins(
['Label', ['Label',
{ {
id: CanvasHelpers.OVERLAY_INPUT_NAME_LABEL, id: CanvasHelpers.OVERLAY_INPUT_NAME_LABEL,
location: [-3, 0.5], location: CanvasHelpers.OVERLAY_INPUT_NAME_LABEL_POSITION,
label: nodeTypeData.inputNames[index], label: nodeTypeData.inputNames[index],
cssClass: 'node-input-endpoint-label', cssClass: 'node-input-endpoint-label',
visible: true, visible: true,
@ -263,7 +263,7 @@ export const nodeBase = mixins(
newEndpointData.overlays = [ newEndpointData.overlays = [
['Label', ['Label',
{ {
id: 'output-name-label', id: CanvasHelpers.OVERLAY_OUTPUT_NAME_LABEL,
location: [1.9, 0.5], location: [1.9, 0.5],
label: nodeTypeData.outputNames[index], label: nodeTypeData.outputNames[index],
cssClass: 'node-output-endpoint-label', cssClass: 'node-output-endpoint-label',

View file

@ -1504,7 +1504,7 @@ export default mixins(
const inputNameOverlay = info.targetEndpoint.getOverlay(CanvasHelpers.OVERLAY_INPUT_NAME_LABEL); const inputNameOverlay = info.targetEndpoint.getOverlay(CanvasHelpers.OVERLAY_INPUT_NAME_LABEL);
if (inputNameOverlay) { if (inputNameOverlay) {
inputNameOverlay.setLocation([-4.5, .5]); inputNameOverlay.setLocation(CanvasHelpers.OVERLAY_INPUT_NAME_LABEL_POSITION_MOVED);
} }
this.$store.commit('addConnection', { this.$store.commit('addConnection', {
@ -1528,7 +1528,7 @@ export default mixins(
// If the source endpoint is not connected to anything else anymore // If the source endpoint is not connected to anything else anymore
// display the output-name overlays on the endpoint if any exist // display the output-name overlays on the endpoint if any exist
if (sourceEndpoint !== undefined && sourceEndpoint.connections!.length === maxConnections) { if (sourceEndpoint !== undefined && sourceEndpoint.connections!.length === maxConnections) {
const outputNameOverlay = sourceEndpoint.getOverlay('output-name-label'); const outputNameOverlay = sourceEndpoint.getOverlay(CanvasHelpers.OVERLAY_OUTPUT_NAME_LABEL);
if (![null, undefined].includes(outputNameOverlay)) { if (![null, undefined].includes(outputNameOverlay)) {
outputNameOverlay.setVisible(true); outputNameOverlay.setVisible(true);
} }
@ -1576,8 +1576,7 @@ export default mixins(
this.instance.bind('connectionDetached', (info) => { this.instance.bind('connectionDetached', (info) => {
const inputNameOverlay = info.targetEndpoint.getOverlay(CanvasHelpers.OVERLAY_INPUT_NAME_LABEL); const inputNameOverlay = info.targetEndpoint.getOverlay(CanvasHelpers.OVERLAY_INPUT_NAME_LABEL);
if (inputNameOverlay) { if (inputNameOverlay) {
// todo inputNameOverlay.setLocation(CanvasHelpers.OVERLAY_INPUT_NAME_LABEL_POSITION);
inputNameOverlay.setLocation([-3, .5]);
} }
updateConnectionDetach(info.sourceEndpoint, info.targetEndpoint, 1); updateConnectionDetach(info.sourceEndpoint, info.targetEndpoint, 1);

View file

@ -10,6 +10,9 @@ export const OVERLAY_RUN_ITEMS_ID = 'output-items-label';
export const OVERLAY_CONNECTION_ACTIONS_ID = 'connection-actions'; export const OVERLAY_CONNECTION_ACTIONS_ID = 'connection-actions';
export const JSPLUMB_FLOWCHART_STUB = 26; export const JSPLUMB_FLOWCHART_STUB = 26;
export const OVERLAY_INPUT_NAME_LABEL = 'input-name-label'; export const OVERLAY_INPUT_NAME_LABEL = 'input-name-label';
export const OVERLAY_INPUT_NAME_LABEL_POSITION = [-3, .5];
export const OVERLAY_INPUT_NAME_LABEL_POSITION_MOVED = [-4.5, .5];
export const OVERLAY_OUTPUT_NAME_LABEL = 'output-name-label';
const MIN_X_TO_SHOW_OUTPUT_LABEL = 90; const MIN_X_TO_SHOW_OUTPUT_LABEL = 90;
const MIN_Y_TO_SHOW_OUTPUT_LABEL = 100; const MIN_Y_TO_SHOW_OUTPUT_LABEL = 100;
@ -57,7 +60,7 @@ export const getFlowChartType = (connection: Connection) => {
const outputIndex = connection.__meta ? connection.__meta.sourceOutputIndex : 0; const outputIndex = connection.__meta ? connection.__meta.sourceOutputIndex : 0;
const outputEndpoint = connection.endpoints[0]; const outputEndpoint = connection.endpoints[0];
const outputOverlay = outputEndpoint.getOverlay('output-name-label'); const outputOverlay = outputEndpoint.getOverlay(OVERLAY_OUTPUT_NAME_LABEL);
let labelOffset = 0; let labelOffset = 0;
if (outputOverlay && outputOverlay.label && outputOverlay.label.length > 1) { if (outputOverlay && outputOverlay.label && outputOverlay.label.length > 1) {
labelOffset = 16; labelOffset = 16;