Several fixes for issues when embedding `ili to other pages

MolecularCartography · May 17, 2017 · 6f3e25c · iprotsyuk · May 17, 2017 · 6f3e25c
1 parent 96d0091
commit 6f3e25c
Show file tree

Hide file tree

Showing 5 changed files with 7 additions and 4 deletions.
diff --git a/index.html b/index.html
@@ -17,6 +17,5 @@
   <meta name="google-site-verification" content="cxpSm-lsEATF7z2pMt1-RCZPSaKRzb6h0RiIjaVQvsE" />
 </head>
 <body>
-  <div id="ili-container"></div>
 </body>
 </html>
diff --git a/js/ViewGroup3D.js b/js/ViewGroup3D.js
@@ -32,7 +32,7 @@ function(THREE, Scene3D, View3D, SpotLabel3D, SpotsController) {
 
         this._div.addEventListener('mousedown', this._onMouseDown.bind(this));
 
-        var divs = this._div.querySelectorAll('.View3d');
+        var divs = this._div.querySelectorAll('.View3D');
         for (var i = 0; i < divs.length; i++) {
             this._views.push(new View3D(this, divs[i]));
         }

diff --git a/js/index.js b/js/index.js
@@ -89,5 +89,5 @@ require.config({
 });
 
 require(['main'], function (ili) {
-    var app = new ili(document.getElementById('ili-container'));
+    var app = new ili(document.getElementsByTagName('body')[0]);
 });
diff --git a/js/main.js b/js/main.js
@@ -15,8 +15,10 @@ function (Workspace, ViewContainer, ViewGroup3D, MapSelector, ColorMap, saveAs,
             alert('WebGL technology is not enabled in your browser. Turn it on to get `ili functioning properly.');
         }
 
-        this._appContainer = appContainer;
+        this._appContainer = document.createElement('div');
+        this._appContainer.id = 'ili-container';
         this._appContainer.innerHTML = appLayout;
+        appContainer.appendChild(this._appContainer);
 
         this._spotsController = new SpotsController();
         this._workspace = new Workspace(this._spotsController);

diff --git a/layout.css b/layout.css
@@ -3,10 +3,12 @@
 #ili-container > .row {
     margin-left: 0;
     margin-right: 0;
+    height: 100%;
 }
 
 #ili-container > .row > * {
     padding: 0;
+    height: 100%;
 }
 
 .tab-pane:not(.active) {