fix toggle issue

Author: hmsklee

css/style.css

@@ -40,14 +40,15 @@ button {
 .node { cursor: pointer; }
 
 #graph {
-    width:100%;
-    height:220px;
-    border-top: 1px solid #ccc;
-    background:#fff;
-    position:fixed;
-    bottom:0;
-    left:0;
-    overflow:hidden;
+  cursor:move;
+  width:100%;
+  height:220px;
+  border-top: 1px solid #ccc;
+  background:#fff;
+  position:fixed;
+  bottom:0;
+  left:0;
+  overflow:hidden;
 }
 
 

js/GraphLayout.js

@@ -65,9 +65,7 @@ class GraphLayout {
         this.links.selectAll('*').remove();
     }
     graph(words) {
-        if (words.length === 0 || this.words.length === words.length && 
-            this.words.every((w,i) => words.indexOf(w) > -1)) { return; }
-        else { this.words = words; }
+        this.words = words;
 
         const maxDepth = this.maxDepth;
         let localMaxDepth = 0;
@@ -222,7 +220,9 @@ class GraphLayout {
             unhoverNode(d);
             let newArray = this.words.slice();
             let word = newArray.splice(i, 1, d.node)[0];
-            word.toggleHighlight(false);
+            if (newArray.indexOf(word) < 0) {
+                word.toggleHighlight(false);
+            }
             d.node.toggleHighlight(true);
             this.graph(newArray);
         }

js/annotate.js

@@ -116,7 +116,12 @@ class Link {
         this.isSelected = select;
       }
 
-      this.labelRectSVGs.forEach(rect => rect.toggleClass('selected', this.isSelected));
+      if (this.isSelected) {
+        this.labelRectSVGs.forEach(rect => rect.addClass('selected'));
+      }
+      else {
+        this.labelRectSVGs.forEach(rect => rect.removeClass('selected'));
+      }
     }
 
     hover(label) {
@@ -300,7 +305,12 @@ class Word {
         this.isSelected = select;
       }
 
-      this.svg.toggleClass('selected', this.isSelected);
+      if (this.isSelected) {
+        this.svg.addClass('selected');
+      }
+      else {
+        this.svg.removeClass('selected');
+      }
     }
 
     hover() {