move subcomplexes on drag

colin-combe · Jun 29, 2020 · 6264d35 · 6264d35
1 parent ec95741
commit 6264d35
Show file tree

Hide file tree

Showing 9 changed files with 38 additions and 61 deletions.
diff --git a/.eslintignore b/.eslintignore
@@ -0,0 +1 @@
+/src/js/cola.js
diff --git a/css/demo.css b/css/demo.css
@@ -140,6 +140,7 @@ div#legendInner {
 }
 
 .logoBar {
+    margin-top: 5px;
     display: -webkit-box;
     display: -moz-box;
     display: -ms-flexbox;

diff --git a/data/index.js b/data/index.js
@@ -1,14 +1,15 @@
 // eslint-disable-next-line no-unused-vars
 const exampleIndex = [
     {
-        "ac": "CPX-5183",
-        "name": "CPX-5183",
-        "url": "https://www.ebi.ac.uk/complexportal/complex/CPX-5183",
-    }, {
         "ac": "CPX-1920",
         "name": "~CPX-1920",
         "url": "https://www.ebi.ac.uk/complexportal/complex/CPX-1920",
     },
+    {
+        "ac": "CPX-5183",
+        "name": "CPX-5183",
+        "url": "https://www.ebi.ac.uk/complexportal/complex/CPX-5183",
+    },
     {
         "ac": "EBI-12598622",
         "name": "EBI-12598622",

diff --git a/dist/complexviewer.js b/dist/complexviewer.js
diff --git a/src/js/app.js b/src/js/app.js
@@ -405,7 +405,7 @@ App.prototype.zoomToExtent = function () {
         let y = (deltaHeight / 2) - bbox.y;
         this.container.setAttribute("transform", "scale(" + 1 + ") translate(" + x + " " + y + ")");
     }
-    //todo - followign could be tided up by using acknowledgement bbox or positioning att's of text
+    //todo - following could be tided up by using acknowledgement bbox or positioning att's of text
     this.acknowledgement.setAttribute("transform", "translate("+(width - 150)+", " + (height - 30) + ")");
 };
 
@@ -443,19 +443,12 @@ App.prototype.mouseMove = function (evt) {
         if (this.state === this.STATES.DRAGGING) {
             // we are currently dragging things around
             let ox, oy, nx, ny;
-            if (typeof this.dragElement.cx === "undefined") { // if not an Interactor
+            if (!this.dragElement.cx) { // if not an Interactor (that makes it so-called 'naryLink')
                 const nodes = this.dragElement.interactors;
-                for (let protein of nodes) {
-                    ox = protein.cx;
-                    oy = protein.cy;
-                    nx = ox - dx;
-                    ny = oy - dy;
-                    protein.setPosition(nx, ny);
-                    protein.setAllLinkCoordinates();
-                }
-                for (let node of nodes) {
-                    node.setAllLinkCoordinates();
+                for (let protein of nodes) { // todo - rename var
+                    protein.changePosition(dx, dy);
                 }
+                this.setAllLinkCoordinates();
             } else {
                 //its a protein - drag it TODO: DRAG SELECTED
                 ox = this.dragElement.cx;
@@ -927,7 +920,7 @@ App.prototype.addColorSchemeKey = function (/*HTMLDivElement*/ div) {
     ColorSchemeKey.update(div, this);
 };
 
-App.prototype.removeColorSchemeKeylegend = function (/*HTMLDivElement*/ colorSchemeKeyDiv) {
+App.prototype.removeColorSchemeKey = function (/*HTMLDivElement*/ colorSchemeKeyDiv) {
     this.colorSchemeKeyDivs.remove(colorSchemeKeyDiv);
     colorSchemeKeyDiv.textContent = "";
 };

diff --git a/src/js/color-scheme-key.js b/src/js/color-scheme-key.js
@@ -32,9 +32,8 @@ export function update(/*HTMLDivElement*/ div, /*App*/app) {
             const tr = featureColorTable.insertRow();
             const tc1 = tr.insertCell();
             // make transparent version of color
-            var temp = new RGBColor(range[i % 20]);
-            const trans = "rgba(" + temp.r + "," + temp.g + "," + temp.b + ", 0.6)";
-            tc1.style.backgroundColor = trans;
+            const temp = new RGBColor(range[i % 20]);
+            tc1.style.backgroundColor = "rgba(" + temp.r + "," + temp.g + "," + temp.b + ", 0.6)";
             const tc2 = tr.insertCell();
             tc2.textContent = domain[i];
         }

diff --git a/src/js/viz/interactor/complex.js b/src/js/viz/interactor/complex.js
@@ -34,6 +34,13 @@ Complex.prototype.getPosition = function () {
 };
 
 Complex.prototype.setPosition = function () {
+    console.log("bad - called setPosition on ", this);
+};
+
+Complex.prototype.changePosition = function (dx, dy) {
+    for (let participant of this.naryLink.interactors){
+        participant.changePosition(dx, dy);
+    }
 };
 
 Complex.prototype.getResidueCoordinates = function () {

diff --git a/src/js/viz/interactor/interactor.js b/src/js/viz/interactor/interactor.js
@@ -89,20 +89,20 @@ Interactor.prototype.setSelected = function(select) {
 */
 
 Interactor.prototype.getPosition = function () {
-    return [this.cx, this.cy];
+    return [this.cx, this.cy]; // todo - type of return is kind of inconsistent
 };
 
-// more accurately described as setting transform for top svg elements (sets scale also)
 Interactor.prototype.setPosition = function (x, y) {
     this.cx = x;
     this.cy = y;
-    // if (this.form === 1) {
-    this.upperGroup.setAttribute("transform", "translate(" + (this.cx) + " " + this.cy + ")"); // +
-    //         " scale(" + (this.util.z) + ") " + "rotate(" + this.rotation + ")");
-    // } else {
-    //     this.upperGroup.setAttribute("transform", "translate(" + this.cx + " " + this.cy + ")" +
-    //         " scale(" + (this.util.z) + ") ");
-    // }
+    this.upperGroup.setAttribute("transform", "translate(" + (this.cx) + " " + this.cy + ")");
+};
+
+Interactor.prototype.changePosition = function (x, y) {
+    this.cx -= x;
+    this.cy -= y;
+    this.upperGroup.setAttribute("transform", "translate(" + (this.cx) + " " + this.cy + ")");
+    // this.setAllLinkCoordinates(); // todo - look at calls
 };
 
 Interactor.prototype.getAggregateSelfLinkPath = function () {
@@ -132,7 +132,7 @@ Interactor.prototype.checkLinks = function () {
         }
     }
 
-    // checkAll(this.naryLinks); // hacked out to help fix ordering of nLinks
+    // checkAll(this.naryLinks); // hacked out to fix ordering of nLinks
     checkAll(this.binaryLinks);
     checkAll(this.sequenceLinks);
     if (this.selfLink !== null) {

diff --git a/src/js/viz/link/link.js b/src/js/viz/link/link.js
@@ -107,32 +107,7 @@ Link.prototype.filteredEvidence = function () {
 
 //used by BinaryLink and UnaryLink
 Link.prototype.hide = function () {
-    this.thickLine.remove();
+    this.thickLine.remove(); // todo - this isn't used
     this.highlightLine.remove();
     this.line.remove();
-    // const p_pLinksWide = [];
-    // const highlights = [];
-    // const p_pLinks = [];
-    //
-    // for (var i = 0; i < this.util.p_pLinksWide.childNodes.length; i++) {
-    //     p_pLinksWide[i] = this.util.p_pLinksWide.childNodes[i];
-    // }
-    //
-    // for (var i = 0; i < this.util.highlights.childNodes.length; i++) {
-    //     highlights[i] = this.util.highlights.childNodes[i];
-    // }
-    //
-    // for (var i = 0; i < this.util.p_pLinks.childNodes.length; i++) {
-    //     p_pLinks[i] = this.util.p_pLinks.childNodes[i];
-    // }
-    //
-    // if (p_pLinksWide.indexOf(this.thickLine) > -1) {
-    //     this.util.p_pLinksWide.removeChild(this.thickLine);
-    // }
-    // if (highlights.indexOf(this.highlightLine) > -1) {
-    //     this.util.highlights.removeChild(this.highlightLine);
-    // }
-    // if (p_pLinks.indexOf(this.line) > -1) {
-    //     this.util.p_pLinks.removeChild(this.line);
-    // }
 };