Performance fix for WebGL materials playing even when the dialog/file is no longer in view.

Also pausing videos when switching documents.

Signed-off-by: Nivesh Rajbhandari <mqg734@motorola.com>

5 files changed, 57 insertions, 29 deletions

diff --git a/js/document/views/base.js b/js/document/views/base.js
index d13dce1a..89759195 100755
--- a/js/document/views/base.js
+++ b/js/document/views/base.js
@@ -40,6 +40,7 @@ exports.BaseDocumentView = Montage.create(Component, {
                 if (this.iframe) {
                         this.iframe.style.display = 'block';
                 this.iframe.style.opacity = 1;
+                this.toggleWebGlAnimation(true);
                 } else {
                         console.log('Error: View has no iframe to show!');
                 }
@@ -54,6 +55,8 @@ exports.BaseDocumentView = Montage.create(Component, {
                 if (this.iframe) {
                         this.iframe.style.display = 'none';
                 this.iframe.style.opacity = 0;
+                this.pauseVideos();
+                this.toggleWebGlAnimation(false);
                 } else {
                         console.log('Error: View has no iframe to hide!');
                 }
diff --git a/js/document/views/design.js b/js/document/views/design.js
index 6a60e1f9..5c7ba4fc 100755
--- a/js/document/views/design.js
+++ b/js/document/views/design.js
@@ -497,9 +497,11 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
     //
     pauseVideos:{
         value:function(){
-                var i, videos = this.document.getElementsByTagName("video");
-            for(i = 0; i < videos.length; i++){
-                if(!videos[i].paused) videos[i].pause();
+            if(this.document) {
+                var i, videos = this.document.getElementsByTagName("video");
+                for(i = 0; i < videos.length; i++){
+                    if(!videos[i].paused) videos[i].pause();
+                }
             }
         }
     },
@@ -523,9 +525,28 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
                 videos[i].src = "";
             }
         }
-    }
+    },
         ////////////////////////////////////////////////////////////////////
         ////////////////////////////////////////////////////////////////////
+    toggleWebGlAnimation: {
+        value: function(show) {
+            if(this.document) {
+                var glCanvases = this.document.querySelectorAll('[data-RDGE-id]'),
+                    glShapeModel;
+                if(glCanvases) {
+                    for(var i = 0, len = glCanvases.length; i<len; i++) {
+                        glShapeModel = glCanvases[i].elementModel.shapeModel;
+                        if(show) {
+                            glShapeModel.GLWorld.restartRenderLoop();
+                        } else {
+                            glShapeModel.GLWorld.stop();
+                        }
+                    }
+
+                }
+            }
+        }
+    }
 });
 ////////////////////////////////////////////////////////////////////////
 ////////////////////////////////////////////////////////////////////////
\ No newline at end of file
diff --git a/js/lib/drawing/world.js b/js/lib/drawing/world.js
index 8068284e..c8c5b95a 100755
--- a/js/lib/drawing/world.js
+++ b/js/lib/drawing/world.js
@@ -623,6 +623,7 @@ World.prototype.clearTree = function()
 
         if (this._useWebGL)
     {
+        this.stop();
                 var root = this._rootNode;
                 root.children = new Array();
                 RDGE.globals.engine.unregisterCanvas( this._canvas.rdgeid );
diff --git a/js/panels/Materials/materials-library-panel.reel/materials-library-panel.js b/js/panels/Materials/materials-library-panel.reel/materials-library-panel.js
index cd933ea6..8c1aa1dc 100755
--- a/js/panels/Materials/materials-library-panel.reel/materials-library-panel.js
+++ b/js/panels/Materials/materials-library-panel.reel/materials-library-panel.js
@@ -129,6 +129,8 @@ exports.MaterialsLibraryPanel = Montage.create(Component, {
         enumerable: false,
         value: function (event) {
             if(this._materialPopup){
+//                console.log("hiding material popup");
+                this._materialInfo.destroy();
                 this._materialPopup.hide();
             }
         }
diff --git a/js/panels/Materials/materials-popup.reel/materials-popup.js b/js/panels/Materials/materials-popup.reel/materials-popup.js
index 3f702459..9b7b031b 100755
--- a/js/panels/Materials/materials-popup.reel/materials-popup.js
+++ b/js/panels/Materials/materials-popup.reel/materials-popup.js
@@ -69,11 +69,11 @@ exports.MaterialsPopup = Montage.create(Component, {
                         switch(event._currentTarget.label)
                         {
                                 case "Cancel":
-                                        console.log("Cancel material edit");
+//                                      console.log("Cancel material edit");
                                         this.revertToOriginalValues();
                                         break;
                                 case "OK":
-                                        console.log("Committing material with the following values:");
+//                                      console.log("Committing material with the following values:");
                     for(var i=0, len=this.materialsProperties.childComponents.length; i< len; i++)
                     {
                         var childControl = this.materialsProperties.childComponents[i];
@@ -109,7 +109,7 @@ exports.MaterialsPopup = Montage.create(Component, {
     {
         value: function()
         {
-            console.log("Save As...");
+//            console.log("Save As...");
             var materialCopy = prompt("Save material as", this._materialName + "_Copy");
 
             if (materialCopy)
@@ -123,7 +123,7 @@ exports.MaterialsPopup = Montage.create(Component, {
     {
         value: function()
         {
-            console.log("Reset");
+//            console.log("Reset");
         }
     },
 
@@ -186,15 +186,15 @@ exports.MaterialsPopup = Montage.create(Component, {
     {
         value: function(event)
         {
-            if(typeof event.propertyValue === "object")
-            {
-                console.log(event.propertyLabel + " changing to ");
-                console.dir(event.propertyValue);
-            }
-            else
-            {
-                console.log(event.propertyLabel + " changing to " + event.propertyValue);
-            }
+//            if(typeof event.propertyValue === "object")
+//            {
+//                console.log(event.propertyLabel + " changing to ");
+//                console.dir(event.propertyValue);
+//            }
+//            else
+//            {
+//                console.log(event.propertyLabel + " changing to " + event.propertyValue);
+//            }
 
                         if (event.propertyLabel && event.propertyValue)
                                 this.applyProperty( event.propertyLabel,  event.propertyValue );
@@ -206,15 +206,15 @@ exports.MaterialsPopup = Montage.create(Component, {
         value: function(theEvent)
         {
                         var event = theEvent._event;
-            if(typeof event.propertyValue === "object")
-            {
-                console.log(event.propertyLabel + " changed to ");
-                console.dir(event.propertyValue);
-            }
-            else
-            {
-                console.log(event.propertyLabel + " changed to " + event.propertyValue);
-            }
+//            if(typeof event.propertyValue === "object")
+//            {
+//                console.log(event.propertyLabel + " changed to ");
+//                console.dir(event.propertyValue);
+//            }
+//            else
+//            {
+//                console.log(event.propertyLabel + " changed to " + event.propertyValue);
+//            }
 
                         if (event.propertyLabel)
                                 this.applyProperty( event.propertyLabel,  event.propertyValue );
@@ -253,7 +253,7 @@ exports.MaterialsPopup = Montage.create(Component, {
                 var obj, matArray, matTypeArray, nMats, iMat, world;
                                 if (this._useSelection)
                                 {
-                                        console.log( "apply to selection" );
+//                                      console.log( "apply to selection" );
 
                                         var selection = this.application.ninja.selectedElements;
                                         if (selection && (selection.length > 0))
@@ -385,7 +385,7 @@ exports.MaterialsPopup = Montage.create(Component, {