implement link removal

Author: hmsklee

js/components/link.js

@@ -8,27 +8,20 @@ class Link {
       this.top = top;
       this.visible = true;
 
-      this.slot = 0;
+      this.resetSlotRecalculation();
 
       if (this.top) {
         // top links
         if (this.trigger) {
           this.trigger.links.push(this);
-          this.slot = this.trigger.slot;
         }
         this.arguments.forEach(arg => {
           arg.anchor.links.push(this);
-          if (arg.anchor.slot > this.slot) {
-            this.slot = arg.anchor.slot;
-          }
         });
-
-        this.slot += 1;
       }
       else {
         // bottom links
         this.trigger.links.push(this);
-        this.slot = -1;
         this.arguments.forEach(arg => arg.anchor.links.push(this));
       }
 
@@ -391,6 +384,25 @@ class Link {
 
     resetSlotRecalculation() {
       this.isRecalculated = false;
+      this.slot = 0;
+
+      if (this.top) {
+        // top links
+        if (this.trigger) {
+          this.slot = this.trigger.slot;
+        }
+        this.arguments.forEach(arg => {
+          if (arg.anchor.slot > this.slot) {
+            this.slot = arg.anchor.slot;
+          }
+        });
+
+        this.slot += 1;
+      }
+      else {
+        // bottom links
+        this.slot = -1;
+      }
     }
 
     recalculateSlots(words) {

js/main.js

@@ -45,6 +45,16 @@ const Main = (function() {
       rm.moveWordOnRow(e.detail.object, e.detail.x);
     });
 
+    svg.on('row-recalculate-slots', function(e) {
+      links.forEach(link => {
+        link.resetSlotRecalculation();
+      });
+      links.forEach(link => {
+        link.recalculateSlots(words);
+        link.draw();
+      });
+    });
+
     // window event listeners
     // resize function
     window.onresize = function() {

js/managers/tooltip.js

@@ -39,7 +39,7 @@ const Tooltip = (function() {
     }
     else if (activeObject instanceof Link) {
       if (e.detail.type === 'text') {
-        html += '<p id="menu--edit-link-label">Edit label</p>';
+        html += '<p id="menu--edit-link-label">Edit label</p><p id="menu--remove-link">Remove link</p>';
       }
       else {
         html += '<p id="menu--remove-link">Remove link</p>';
@@ -94,6 +94,7 @@ const Tooltip = (function() {
           break;
         case 'menu--remove-link':
           activeObject.remove();
+          _svg.fire('row-recalculate-slots', { object: activeObject, r1: activeObject.endpoints[0].row, r2: activeObject.endpoints[1].row });
           break;
         default: ;
       }