Molstar is required on demand

frontend-js/package-lock.json

@@ -10,6 +10,21 @@
       "integrity": "sha512-bYDPZTX0/s1aihdjLuAgogUAT5M+TpoWChEMea2p0yOcfn5bu3k6cJb9cp6nw268XeSNIGGr+4+/8V5K6BGzLQ==",
       "dev": true
     },
+    "@types/react": {
+      "version": "15.6.14",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.6.14.tgz",
+      "integrity": "sha512-k6YJBmHfzkCtk3iT6aN2hclkPYL2fxlSc3dW//G2kENlmMJ/V+pKhqsHdJJeVluIi1bA296cCLLGATLm7WXToQ==",
+      "dev": true
+    },
+    "@types/react-dom": {
+      "version": "15.5.7",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.7.tgz",
+      "integrity": "sha512-XGLjgNtPnBuO1cITYWZAk4KbH0UEDqMg2kuG3xx0UgnrcSd6ijO57Fp9rimmrDKcBnx3b2vFQuEYRXu2GihRYQ==",
+      "dev": true,
+      "requires": {
+        "@types/react": "15.6.14"
+      }
+    },
     "JSONStream": {
       "version": "1.3.1",
       "resolved": "https://registry.npmjs.org/JSONStream/-/JSONStream-1.3.1.tgz",
@@ -20,6 +35,43 @@
         "through": "2.3.8"
       }
     },
+    "MolStar": {
+      "version": "git://github.com/davidhoksza/MolStar.git#45c20d0ab3ed81bdb555349b953b8add61ae1c55",
+      "dev": true,
+      "requires": {
+        "ProtVista": "git://github.com/davidhoksza/protvista.git#4e4bb737ba1e183291505bd25f8bae2e651ce21e",
+        "downloadjs": "1.4.7",
+        "jquery": "3.3.1",
+        "litemol": "github:dsehnal/LiteMol#a5419c696faa84530dd93acd55b747cf8136902b"
+      },
+      "dependencies": {
+        "jquery": {
+          "version": "3.3.1",
+          "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.3.1.tgz",
+          "integrity": "sha512-Ubldcmxp5np52/ENotGxlLe6aGMvmF4R8S6tZjsP6Knsaxd/xp3Zrh50cG93lR6nPXyUFwzN3ZSOQI0wRJNdGg==",
+          "dev": true
+        }
+      }
+    },
+    "ProtVista": {
+      "version": "git://github.com/davidhoksza/protvista.git#4e4bb737ba1e183291505bd25f8bae2e651ce21e",
+      "dev": true,
+      "requires": {
+        "d3": "3.5.17",
+        "file-saver": "1.3.3",
+        "jquery": "2.2.4",
+        "jszip": "3.1.4",
+        "underscore": "1.8.3"
+      },
+      "dependencies": {
+        "jquery": {
+          "version": "2.2.4",
+          "resolved": "https://registry.npmjs.org/jquery/-/jquery-2.2.4.tgz",
+          "integrity": "sha1-LInWiJterFIqfuoywUUhVZxsvwI=",
+          "dev": true
+        }
+      }
+    },
     "abab": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/abab/-/abab-1.0.3.tgz",
@@ -1048,6 +1100,12 @@
         "domelementtype": "1.3.0"
       }
     },
+    "downloadjs": {
+      "version": "1.4.7",
+      "resolved": "https://registry.npmjs.org/downloadjs/-/downloadjs-1.4.7.tgz",
+      "integrity": "sha1-9p+W+UDg0FU9rCkROYZaPNAQHjw=",
+      "dev": true
+    },
     "dual-listbox": {
       "version": "1.0.7",
       "resolved": "https://registry.npmjs.org/dual-listbox/-/dual-listbox-1.0.7.tgz",
@@ -1992,6 +2050,14 @@
         "immediate": "3.0.6"
       }
     },
+    "litemol": {
+      "version": "github:dsehnal/LiteMol#a5419c696faa84530dd93acd55b747cf8136902b",
+      "dev": true,
+      "requires": {
+        "@types/react": "15.6.14",
+        "@types/react-dom": "15.5.7"
+      }
+    },
     "lodash": {
       "version": "4.17.4",
       "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",

frontend-js/src/main/js/map/structure/MolStar.js

 var Functions = require('../../Functions');
 var SubMenu = require('../../gui/SubMenu');
 
-var MolStarPlugin = require('MolStar');
 
 function MolStar(containerParentElement, customMap) {
 
-    var molstarDiv = Functions.createElement({
-        type: "div",
-        id: "minervaMolStarContainer",
-        className: "minerva-molstar-container"
-      });
-      containerParentElement.appendChild(molstarDiv);
+  var molstarDiv = Functions.createElement({
+    type: "div",
+    id: "minervaMolStarContainer",
+    className: "minerva-molstar-container"
+  });
+  containerParentElement.appendChild(molstarDiv);
 
-    this.setContainerElement(molstarDiv);
-    this._customMap = customMap;
+  this.setContainerElement(molstarDiv);
+  this._customMap = customMap;
 }
 
 MolStar.prototype.setContainerElement = function (containerElement) {
-    this._containerElement = containerElement;
+  this._containerElement = containerElement;
 };
 
 MolStar.prototype.getContainerElement = function () {
-    return this._containerElement;
+  return this._containerElement;
 };
 
-function removeFromContextMenu(menu){
-    $(menu.getElement()).find('li:contains("MolStar")').remove();
+function removeFromContextMenu(menu) {
+  $(menu.getElement()).find('li:contains("MolStar")').remove();
 }
 
-MolStar.prototype.activateInContextMenu = function(uniprotIds) {
-
-    var self = this;
-    var menu = this._customMap.getContextMenu();
-    removeFromContextMenu(menu);
-
-    var submenu = new SubMenu({
-        element: Functions.createElement({type: "li"}),
-        name: "Open MolStar",
-        customMap: self._customMap
-    });
-    for (var i=0; i < uniprotIds.length; i++) {
-        var uniprotId = uniprotIds[i];
-        submenu.addOption(uniprotId, function() {
-            self._activate(uniprotId);
-        }, false);
-    }
-    menu.addOption(submenu);
+MolStar.prototype.activateInContextMenu = function (uniprotIds) {
+
+  var self = this;
+  var menu = this._customMap.getContextMenu();
+  removeFromContextMenu(menu);
+
+  var submenu = new SubMenu({
+    element: Functions.createElement({type: "li"}),
+    name: "Open MolStar",
+    customMap: self._customMap
+  });
+  for (var i = 0; i < uniprotIds.length; i++) {
+    var uniprotId = uniprotIds[i];
+    submenu.addOption(uniprotId, function () {
+      self._activate(uniprotId);
+    }, false);
+  }
+  menu.addOption(submenu);
 
 };
 
-MolStar.prototype.deactivateInContextMenu = function() {
-    var menu = this._customMap.getContextMenu();
-    removeFromContextMenu(menu);
-    menu.addOption("Open MolStar (no UniProt ID available)", function(){}, true);
+MolStar.prototype.deactivateInContextMenu = function () {
+  var menu = this._customMap.getContextMenu();
+  removeFromContextMenu(menu);
+  menu.addOption("Open MolStar (no UniProt ID available)", function () {
+  }, true);
 };
 
 MolStar.prototype._deactivate = function () {
-    var container = this.getContainerElement();
-    container.style.display = 'none';
-    $(container).empty();
-    this.molStar.destroy();
-    this.molStar = undefined;
+  var container = this.getContainerElement();
+  container.style.display = 'none';
+  $(container).empty();
+  this.molStar.destroy();
+  this.molStar = undefined;
 };
 
 MolStar.prototype._activate = function (uniprotId) {
 
-    var self = this;
-
-    var container = this.getContainerElement();
-    if (!container) return;
-
-    var molStarCloseButton = Functions.createElement({
-        type: "div",
-        className: "minerva-molstar-close-button",
-        content: 'x'
-    });
-    molStarCloseButton.addEventListener('click', function(){
-        self._deactivate();
-        return false;
-    });
-    container.appendChild(molStarCloseButton);
-
-    this.molStar = new MolStarPlugin({
-        uniprotId: uniprotId,
-        containerId: container.id
-    });
-    container.style.display = 'block';
+  var self = this;
+
+  var container = this.getContainerElement();
+  if (!container) return;
+
+  var molStarCloseButton = Functions.createElement({
+    type: "div",
+    className: "minerva-molstar-close-button",
+    content: 'x'
+  });
+  molStarCloseButton.addEventListener('click', function () {
+    self._deactivate();
+    return false;
+  });
+  container.appendChild(molStarCloseButton);
+
+  var MolStarPlugin = require('MolStar');
+
+  this.molStar = new MolStarPlugin({
+    uniprotId: uniprotId,
+    containerId: container.id
+  });
+  container.style.display = 'block';
 };
 
 

frontend-js/src/test/js/mocha-config.js

@@ -101,6 +101,11 @@ before(function () {
     return {};
   };
 // ---
+  // MolStar is inproperly packed
+  global.MolStar = function(){
+
+  };
+// ---
 
   require('jquery-ui-dist/jquery-ui.js');