17782: Typing fixes on cwl-svg.

Arvados-DCO-1.1-Signed-off-by: Lucas Di Pentima <lucas.dipentima@curii.com>

diff --git a/src/lib/cwl-svg/plugins/arrange/arrange.ts b/src/lib/cwl-svg/plugins/arrange/arrange.ts
index 4090278fcd575e20c97b1b4a3e9aa2b712ad8fdb..34efd6f399bd9fdd04e53881752fa38903a5cbcc 100644 (file)
--- a/src/lib/cwl-svg/plugins/arrange/arrange.ts
+++ b/src/lib/cwl-svg/plugins/arrange/arrange.ts
@@ -247,7 +247,7 @@ export class SVGArrangePlugin implements SVGPlugin {
         }
     } {
         const distributionArea = {width: 0, height: 0};
-        const columnDimensions = [];
+        const columnDimensions: any[] = [];
 
         for (let i = 1; i < columns.length; i++) {
 
@@ -361,7 +361,7 @@ export class SVGArrangePlugin implements SVGPlugin {
             return 1;
         }
 
-        const inputPathLengths = [];
+        const inputPathLengths: any[] = [];
 
         for (let i = 0; i < node.inputs.length; i++) {
             const el = nodeGraph[node.inputs[i]];

diff --git a/src/lib/cwl-svg/plugins/edge-hover/edge-hover.ts b/src/lib/cwl-svg/plugins/edge-hover/edge-hover.ts
index c36343c8c9584a56ae91b2eaabeb8c0fbf3a089c..01f1ad545b0ce9da6b0fe8fc5e26820ac967ac67 100644 (file)
--- a/src/lib/cwl-svg/plugins/edge-hover/edge-hover.ts
+++ b/src/lib/cwl-svg/plugins/edge-hover/edge-hover.ts
@@ -31,9 +31,9 @@ export class SVGEdgeHoverPlugin extends PluginBase {
 
 
         // Ignore if we did not enter an edge
-        if (!ev.srcElement!.classList.contains("edge")) return;
+        if (!(ev.target! as Element).classList.contains("edge")) return;
 
-        const target = ev.srcElement as SVGGElement;
+        const target = ev.target as SVGGElement;
         let tipEl: SVGGElement;
 
         const onMouseMove = ((ev: MouseEvent) => {

diff --git a/src/lib/cwl-svg/plugins/node-move/node-move.ts b/src/lib/cwl-svg/plugins/node-move/node-move.ts
index e0bbf0ec8c5ddefca1fac5ceda2870433427c67a..0f3d4a494db74d7ea58ea6b870237784cacfb362 100644 (file)
--- a/src/lib/cwl-svg/plugins/node-move/node-move.ts
+++ b/src/lib/cwl-svg/plugins/node-move/node-move.ts
@@ -21,10 +21,10 @@ export class SVGNodeMovePlugin extends PluginBase {
     private sdy: number;
 
     /** Stored onDragStart so we can put node to a fixed position determined by startX + ∆x */
-    private startX: number;
+    private startX?: number;
 
     /** Stored onDragStart so we can put node to a fixed position determined by startY + ∆y */
-    private startY: number;
+    private startY?: number;
 
     /** How far from the edge of the viewport does mouse need to be before panning is triggered */
     private scrollMargin = 50;
@@ -33,19 +33,19 @@ export class SVGNodeMovePlugin extends PluginBase {
     private movementSpeed = 10;
 
     /** Holds an element that is currently being dragged. Stored onDragStart and translated afterwards. */
-    private movingNode: SVGGElement;
+    private movingNode?: SVGGElement;
 
     /** Stored onDragStart to detect collision with viewport edges */
-    private boundingClientRect: ClientRect;
+    private boundingClientRect?: ClientRect;
 
     /** Cache input edges and their parsed bezier curve parameters so we don't query for them on each mouse move */
-    private inputEdges: Map<SVGPathElement, number[]>;
+    private inputEdges?: Map<SVGPathElement, number[]>;
 
     /** Cache output edges and their parsed bezier curve parameters so we don't query for them on each mouse move */
-    private outputEdges: Map<SVGPathElement, number[]>;
+    private outputEdges?: Map<SVGPathElement, number[]>;
 
     /** Workflow panning at the time of onDragStart, used to adjust ∆x and ∆y while panning */
-    private startWorkflowTranslation: { x: number, y: number };
+    private startWorkflowTranslation?: { x: number, y: number };
 
     private wheelPrevent = (ev: any) => ev.stopPropagation();
 
@@ -124,8 +124,8 @@ export class SVGNodeMovePlugin extends PluginBase {
 
         /** Need to know how far did the workflow itself move since when we started dragging */
         const matrixMovement = {
-            x: this.getWorkflowMatrix().e - this.startWorkflowTranslation.x,
-            y: this.getWorkflowMatrix().f - this.startWorkflowTranslation.y
+            x: this.getWorkflowMatrix().e - this.startWorkflowTranslation!.x,
+            y: this.getWorkflowMatrix().f - this.startWorkflowTranslation!.y
         };
 
         /** We might have hit the boundary and need to start panning */
@@ -133,7 +133,7 @@ export class SVGNodeMovePlugin extends PluginBase {
             this.sdx += sdx;
             this.sdy += sdy;
 
-            this.translateNodeBy(this.movingNode, sdx, sdy);
+            this.translateNodeBy(this.movingNode!, sdx, sdy);
             this.redrawEdges(this.sdx, this.sdy);
         });
 
@@ -149,10 +149,10 @@ export class SVGNodeMovePlugin extends PluginBase {
         this.sdx = (dx - matrixMovement.x) / scale;
         this.sdy = (dy - matrixMovement.y) / scale;
 
-        const moveX = this.sdx + this.startX;
-        const moveY = this.sdy + this.startY;
+        const moveX = this.sdx + this.startX!;
+        const moveY = this.sdy + this.startY!;
 
-        this.translateNodeTo(this.movingNode, moveX, moveY);
+        this.translateNodeTo(this.movingNode!, moveX, moveY);
         this.redrawEdges(this.sdx, this.sdy);
     }
 
@@ -228,12 +228,12 @@ export class SVGNodeMovePlugin extends PluginBase {
      * scaled transformation differences, sdx and sdy.
      */
     private redrawEdges(sdx: number, sdy: number): void {
-        this.inputEdges.forEach((p, el) => {
+        this.inputEdges!.forEach((p, el) => {
             const path = Workflow.makeConnectionPath(p[0], p[1], p[6] + sdx, p[7] + sdy);
             el.setAttribute("d", path!);
         });
 
-        this.outputEdges.forEach((p, el) => {
+        this.outputEdges!.forEach((p, el) => {
             const path = Workflow.makeConnectionPath(p[0] + sdx, p[1] + sdy, p[6], p[7]);
             el.setAttribute("d", path!);
         });
@@ -246,14 +246,14 @@ export class SVGNodeMovePlugin extends PluginBase {
 
         this.edgePanner.stop();
 
-        const id        = this.movingNode.getAttribute("data-connection-id")!;
+        const id        = this.movingNode!.getAttribute("data-connection-id")!;
         const nodeModel = this.workflow.model.findById(id);
 
         if (!nodeModel.customProps) {
             nodeModel.customProps = {};
         }
 
-        const matrix = this.movingNode.transform.baseVal.getItem(0).matrix;
+        const matrix = this.movingNode!.transform.baseVal.getItem(0).matrix;
 
         Object.assign(nodeModel.customProps, {
             "sbg:x": matrix.e,

diff --git a/src/lib/cwl-svg/plugins/port-drag/port-drag.ts b/src/lib/cwl-svg/plugins/port-drag/port-drag.ts
index 85c6c5f8b037869bbc3dc401fdca1732d08215f5..10f30e075225da803c8da91e875f384b96f7febb 100644 (file)
--- a/src/lib/cwl-svg/plugins/port-drag/port-drag.ts
+++ b/src/lib/cwl-svg/plugins/port-drag/port-drag.ts
@@ -361,8 +361,8 @@ export class SVGPortDragPlugin extends PluginBase {
      * Finds a port closest to given SVG coordinates.
      */
     private findClosestPort(x: number, y: number): { portEl: SVGGElement | undefined, distance: number } {
-        let closestPort     = undefined;
-        let closestDistance = Infinity;
+        let closestPort: any     = undefined;
+        let closestDistance: any = Infinity;
 
         this.portOrigins!.forEach((matrix, port) => {