fix for collapsing proteins from table (keep them on screen)

Author: colin-combe

dist/complexviewer.js

@@ -1,6 +1,6 @@
 {
   "name": "complexviewer",
-  "version": "2.1.15",
+  "version": "2.1.16",
   "description": "A network visualisation that displays molecular interaction data, including detailed residue-level information such as binding sites. Used in EBI's Complex Portal and elsewhere.",
   "author": {
     "name": "Colin Combe",

package.json

@@ -239,7 +239,7 @@ export class App {
 
     collapseProtein() {
         d3.select(".custom-menu-margin").style("display", "none");
-        this.contextMenuProt.setExpanded(false, this.contextMenuPoint);
+        this.contextMenuProt.setExpanded(false);//, this.contextMenuPoint);
         this.contextMenuProt = null;
         this.notifyExpandListeners();
     }

src/js/app.js

@@ -148,8 +148,12 @@ export class Interactor {
         //remember previous position
         this.px = this.x;
         this.py = this.y;
-
         let xOffset = (this.width / 2 - (this.getSymbolRadius()));
+        /*
+        // let xOffset = (15 + this.labelSVG.getComputedTextLength()) / 2;
+        // would also work because
+        // width = (2 * this.getSymbolRadius()) + 15 + this.labelSVG.getComputedTextLength();
+        */
         if (this.expanded) {
             xOffset = xOffset - (this.size / 2 * this.stickZoom);
         }

src/js/viz/interactor/interactor.js

@@ -159,6 +159,21 @@ export class Polymer extends Interactor {
     }
 
     toCircle(transition = true, svgP) {
+
+        if (!svgP) {
+            const width = this.app.svgElement.parentNode.clientWidth;
+            const ctm = this.app.container.getCTM().inverse();
+            const z = this.app.container.getCTM().inverse().a;
+            if (this.ix < ctm.e){
+                console.log("off left edge");
+                svgP = {x:ctm.e  + ((this.getSymbolRadius() + 15 + this.labelSVG.getComputedTextLength())), y:this.iy};
+            }
+            if (this.ix > ctm.e + (width * z)){
+                console.log("off right edge");
+                svgP = {x:ctm.e + (width * z)  - ((this.getSymbolRadius() + 5)), y:this.iy};
+            }
+        }
+
         const transitionTime = transition ? Polymer.transitionTime : 0;
         this.postAnimExpanded = false; // bit of a hack, used for updating listeners before anim complete, todo - is there better way
         this.busy = true;