11 files changed, 355 insertions, 285 deletions

diff --git a/js/data/panels-data.js b/js/data/panels-data.js
index fd83d0c7..a1346ec4 100644
--- a/js/data/panels-data.js
+++ b/js/data/panels-data.js
@@ -39,12 +39,12 @@ exports.PanelsData = Montage.create(Montage, {
         {
             name: "Materials",
             groups: ["default"],
-            minHeight: 100,
-            height: 100,
+            minHeight: 270,
+            height: 270,
             maxHeight: null,
-            flexible: true,
+            flexible: false,
             collapsed: true,
-            scrollable: true,
+            scrollable: false,
             open: true,
             modulePath: "js/panels/Materials/materials-library-panel.reel",
             moduleName: "MaterialsLibraryPanel"
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 b7c50a7c..f8020f2b 100755
--- a/js/document/views/design.js
+++ b/js/document/views/design.js
@@ -513,9 +513,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();
+                }
             }
         }
     },
@@ -539,9 +541,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-data.json b/js/panels/Materials/materials-data.json
index a5d8997b..fde82d3d 100644
--- a/js/panels/Materials/materials-data.json
+++ b/js/panels/Materials/materials-data.json
@@ -101,6 +101,11 @@
                     "id" : "Z-Invert"
                 }
             ]
+        },
+        {
+            "label": "Custom Materials",
+            "children": [
+            ]
         }
     ]
 }
\ No newline at end of file
diff --git a/js/panels/Materials/materials-library-panel.reel/materials-library-panel.css b/js/panels/Materials/materials-library-panel.reel/materials-library-panel.css
index bed3acfe..b5d36108 100755
--- a/js/panels/Materials/materials-library-panel.reel/materials-library-panel.css
+++ b/js/panels/Materials/materials-library-panel.reel/materials-library-panel.css
@@ -15,6 +15,12 @@
     margin: 4px 0 4px 0;
 }
 
+.materials_library_panel .ml_tree_holder {
+    height: 200px;
+    min-height: 200px;
+    max-height: 200px;
+    overflow-y: scroll;
+}
 
 .ml_buttons {
     clear:both;
@@ -30,9 +36,19 @@
     cursor: pointer;
     margin: 0 1px;
     float: left;
+    width: 40px;
+}
+
+.ml_buttons .ml_duplicate_btn {
     width: 60px;
 }
 
-.ml_buttons .nj-skinned:last-child {
+.ml_buttons .ml_delete_btn {
+    width: 50px;
     float: right;
+}
+
+.ml_buttons .nj-skinned:hover,
+.ml_buttons .nj-skinned:active {
+    color: white;
 }
\ No newline at end of file
diff --git a/js/panels/Materials/materials-library-panel.reel/materials-library-panel.html b/js/panels/Materials/materials-library-panel.reel/materials-library-panel.html
index 6fa54495..3adb2108 100755
--- a/js/panels/Materials/materials-library-panel.reel/materials-library-panel.html
+++ b/js/panels/Materials/materials-library-panel.reel/materials-library-panel.html
@@ -10,12 +10,12 @@
         <link rel="stylesheet" type="text/css" href="materials-library-panel.css">
          <script type="text/montage-serialization">
         {
-            "addButton": {
+            "duplicateButton": {
                 "prototype": "montage/ui/button.reel",
                 "properties": {
-                    "element": {"#": "ml_add_btn"},
-                                        "enabled": false
-                },
+                    "element": {"#": "ml_duplicate_btn"},
+                                        "enabled": true
+               },
                 "listeners": [
                     {
                         "type": "action",
@@ -23,11 +23,10 @@
                     }
                 ]
              },
-            "copyButton": {
+            "editButton": {
                 "prototype": "montage/ui/button.reel",
                 "properties": {
-                    "element": {"#": "ml_copy_btn"},
-                                        "enabled": false
+                    "element": {"#": "ml_edit_btn"}
                },