in ui/src/app/editor/components/pipeline/pipeline.component.ts [293:434]
initPlumb() {
this.JsplumbBridge.unbind(EVENT_CONNECTION);
this.JsplumbBridge.bind(EVENT_CONNECTION_DRAG, () => {
this.shouldOpenCustomizeSettings = true;
});
this.JsplumbBridge.bind(EVENT_CONNECTION_ABORT, () => {
this.shouldOpenCustomizeSettings = false;
});
this.JsplumbBridge.bind(EVENT_CONNECTION_MOVED, info => {
const pe = this.objectProvider.findElement(
info.newTargetEndpoint.elementId,
this.rawPipelineModel,
);
const oldPe = this.objectProvider.findElement(
info.originalTargetEndpoint.elementId,
this.rawPipelineModel,
);
(oldPe.payload as InvocablePipelineElementUnion).configured = false;
(pe.payload as InvocablePipelineElementUnion).configured = false;
});
this.JsplumbBridge.bind(EVENT_CONNECTION_DETACHED, info => {
const pe = this.objectProvider.findElement(
info.targetEndpoint.elementId,
this.rawPipelineModel,
);
(pe.payload as InvocablePipelineElementUnion).configured = false;
info.targetEndpoint.setType('empty');
this.JsplumbBridge.repaintEverything();
this.validatePipeline();
});
this.JsplumbBridge.bind(EVENT_CONNECTION_DRAG, () => {
this.JsplumbBridge.selectEndpoints().each(endpoint => {
if (endpoint.isTarget && endpoint.connections.length === 0) {
endpoint.setType('highlight');
}
});
this.JsplumbBridge.repaintEverything();
});
this.JsplumbBridge.bind(EVENT_CONNECTION_ABORT, () => {
this.JsplumbBridge.selectEndpoints().each(endpoint => {
if (endpoint.isTarget && endpoint.connections.length === 0) {
endpoint.setType('empty');
}
});
this.JsplumbBridge.repaintEverything();
});
this.JsplumbBridge.bind(EVENT_CONNECTION, info => {
const pe = this.objectProvider.findElement(
info.target.id,
this.rawPipelineModel,
);
if (
this.shouldOpenCustomizeSettings ||
info.connection.data.openCustomize
) {
this.currentPipelineModel = this.objectProvider.makePipeline(
this.rawPipelineModel,
);
pe.settings.loadingStatus = true;
this.objectProvider
.updatePipeline(this.currentPipelineModel)
.subscribe(
pipelineModificationMessage => {
pe.settings.loadingStatus = false;
const edgeValidations =
this.getTargetEdgeValidations(
pipelineModificationMessage,
info.target.id,
);
const currentConnectionValid =
this.currentConnectionValid(edgeValidations);
if (currentConnectionValid) {
this.validatePipeline(
pipelineModificationMessage,
);
this.modifyPipeline(
pipelineModificationMessage,
);
if (
this.jsplumbService.isFullyConnected(
pe,
this.readonly,
)
) {
const payload =
pe.payload as InvocablePipelineElementUnion;
if (
(payload.staticProperties &&
payload.staticProperties.length >
0) ||
this.isCustomOutput(pe)
) {
this.showCustomizeDialog(pe);
} else {
(
pe.payload as InvocablePipelineElementUnion
).configured = true;
this.pipelineStyleService.updatePeConfigurationStatus(
pe,
PipelineElementConfigurationStatus.OK,
);
this.announceConfiguredElement(pe);
this.triggerPipelineCacheUpdateEmitter.emit();
}
}
} else {
this.JsplumbBridge.detach(info.connection);
const invalidEdgeValidation =
edgeValidations.find(
e => e.sourceId === info.source.id,
);
if (invalidEdgeValidation) {
this.showMatchingErrorDialog(
invalidEdgeValidation.status
.notifications,
);
}
}
},
status => {
pe.settings.loadingStatus = false;
this.showErrorDialog(
status.error.title,
status.error.description,
);
},
);
}
});
window.onresize = () => {
this.JsplumbBridge.repaintEverything();
};
}