From a1a54bd2a78555ba39c054b3f45eb70b7efc99d0 Mon Sep 17 00:00:00 2001
From: Sipke Schoorstra <sipkeschoorstra@outlook.com>
Date: Wed, 28 Apr 2021 15:16:09 +0200
Subject: [PATCH] Remove jsPlumb

---
 .../elsa-workflows-studio/package.json        |   1 -
 .../src/utils/jsplumb-helper.ts               | 119 ------------------
 2 files changed, 120 deletions(-)
 delete mode 100644 src/designer/elsa-workflows-studio/src/utils/jsplumb-helper.ts

diff --git a/src/designer/elsa-workflows-studio/package.json b/src/designer/elsa-workflows-studio/package.json
index c189621ca..748226a3d 100644
--- a/src/designer/elsa-workflows-studio/package.json
+++ b/src/designer/elsa-workflows-studio/package.json
@@ -45,7 +45,6 @@
     "el-transition": "^0.0.7",
     "eslint": "7.23.0",
     "js-event-bus": "^1.0.3",
-    "jsplumb": "2.15.5",
     "lodash": "^4.17.21",
     "moment": "^2.29.1",
     "monaco-editor": "^0.23.0",
diff --git a/src/designer/elsa-workflows-studio/src/utils/jsplumb-helper.ts b/src/designer/elsa-workflows-studio/src/utils/jsplumb-helper.ts
deleted file mode 100644
index 05d4368db..000000000
--- a/src/designer/elsa-workflows-studio/src/utils/jsplumb-helper.ts
+++ /dev/null
@@ -1,119 +0,0 @@
-import {Connection, jsPlumb} from 'jsplumb';
-import {ConnectionModel} from "../models";
-
-let jsPlumbInstance = null;
-
-function onConnectionCreated(e, callback) {
-  const connection: ConnectionModel = {
-    sourceId: e.connection.getParameter('sourceActivityId'),
-    targetId: e.connection.getParameter('targetActivityId'),
-    outcome: e.connection.getParameter('outcome')
-  };
-
-  callback(connection);
-}
-
-export function cleanup() {
-  destroy();
-}
-
-export function destroy() {
-  console.debug(`destroy called`);
-  if (jsPlumbInstance != null) {
-
-    jsPlumbInstance.batch(() => {
-      jsPlumbInstance.unbind("connection", onConnectionCreated);
-
-      try {
-        jsPlumbInstance.unmakeEverySource(); // Ensures all mouse event handlers are removed.
-        jsPlumbInstance.unmakeEveryTarget();
-      } catch {
-      }
-
-      jsPlumbInstance.reset();
-    });
-
-    jsPlumbInstance = null;
-  }
-}
-
-export function updateConnections(container, connections, sourceEndpoints, targets, connectionCreatedCallback, connectionDetachedCallback): Array<ConnectionModel> {
-
-  destroy();
-  const invalidConnections: Array<ConnectionModel> = [];
-
-  jsPlumbInstance = (jsPlumb as any).getInstance({
-    Container: container,
-    Connector: ['Flowchart', {cornerRadius: 5}],
-    Anchors: ['Bottom', 'Top', 'Left', 'Right'], // The typescript definition does not have an `Anchors` field, but the jsPlumb library does.
-    Endpoint: ['Dot', {radius: 5}]
-  });
-
-  jsPlumbInstance.ready(() => {
-
-    jsPlumbInstance.batch(function () {
-
-      for (const connection of connections) {
-        const jsPlumbConnection = jsPlumbInstance.connect({
-
-          source: connection.sourceId,
-          target: connection.targetId,
-          endpoint: 'Blank',
-          detachable: connection.sourceActivityId && connection.targetActivityId,
-          parameters: {
-            sourceActivityId: connection.sourceActivityId,
-            targetActivityId: connection.targetActivityId,
-            outcome: connection.outcome
-          }
-        });
-
-        if (!jsPlumbConnection) {
-          console.warn(`Unable to connect ${connection.sourceId} to ${connection.targetId} via ${connection.outcome}`);
-          //invalidConnections.push({sourceId: connection.sourceActivityId, targetId: connection.targetActivityId, outcome: connection.outcome});
-        } else
-          jsPlumbConnection.setData(connection);
-      }
-
-      for (const endpoint of sourceEndpoints) {
-        jsPlumbInstance.makeSource(endpoint.sourceId, {
-          anchor: ['Bottom', 'Top', 'Left', 'Right'],
-          endpoint: 'Blank',
-          maxConnections: 1,
-          parameters: {
-            sourceActivityId: endpoint.sourceActivityId,
-            outcome: endpoint.outcome
-          }
-        });
-      }
-
-      for (const target of targets) {
-        jsPlumbInstance.makeTarget(target.targetId, {
-          anchor: ['Left', 'Right'],
-          endpoint: 'Blank',
-          parameters: {
-            targetActivityId: target.targetActivityId
-          }
-        });
-      }
-    });
-
-    jsPlumbInstance.bind("connection", e => onConnectionCreated(e, connectionCreatedCallback));
-    jsPlumbInstance.bind("click", (connection, e) => {
-      const data = connection.getData();
-      const sourceActivityId: string = data.sourceActivityId;
-      const targetActivityId: string = data.targetActivityId;
-      const outcome: string = data.outcome;
-
-      if (sourceActivityId && targetActivityId && outcome) {
-        const model: ConnectionModel = {
-          sourceId: sourceActivityId,
-          targetId: targetActivityId,
-          outcome: outcome
-        }
-        connectionDetachedCallback(model);
-      }
-    });
-  });
-
-  return invalidConnections;
-}