22 files changed, 248 insertions, 165 deletions

diff --git a/css/ninja.css b/css/ninja.css
index ce27977b..e3d560ab 100755
--- a/css/ninja.css
+++ b/css/ninja.css
@@ -909,7 +909,7 @@ input[type="radio"]:disabled { opacity: .3; background: #282828; border-width: 1
 
 ::-webkit-scrollbar-track:disabled { display: none; }
 
-:-webkit-scrollbar-track:vertical:disabled { display: none; }
+::-webkit-scrollbar-track:vertical:disabled { display: none; }
 
 ::-webkit-scrollbar-track:horizontal:disabled { display: none; }
 
@@ -919,18 +919,6 @@ input[type="radio"]:disabled { opacity: .3; background: #282828; border-width: 1
 
 ::-webkit-scrollbar-corner:disabled { display: none; }
 
-#iframeContainer::-webkit-resizer:disabled { display: block; }
-
-#iframeContainer::-webkit-scrollbar-track:vertical:disabled { display: block; }
-
-#iframeContainer::-webkit-scrollbar-track:horizontal:disabled { display: block; }
-
-#iframeContainer::-webkit-scrollbar-track-piece:disabled { display: block; }
-
-#iframeContainer::-webkit-scrollbar-corner:disabled { display: block; }
-
-#iframeContainer::-webkit-resizer:disabled { display: block; }
-
 .tree { -webkit-user-select: none; cursor: default; float: left; padding-left: 0; color: white; }
 
 .tree li { -webkit-margin-before: 0px; -webkit-margin-after: 0px; list-style-type: none; }
diff --git a/js/components/layout/bread-crumb.reel/bread-crumb.js b/js/components/layout/bread-crumb.reel/bread-crumb.js
index ac131f2c..260922b3 100755
--- a/js/components/layout/bread-crumb.reel/bread-crumb.js
+++ b/js/components/layout/bread-crumb.reel/bread-crumb.js
@@ -51,22 +51,6 @@ exports.Breadcrumb = Montage.create(Component, {
         }
     },
 
-    _container:{
-        value:null
-    },
-
-    container: {
-        set: function(value) {
-            if(this._container !== value) {
-                this._container = value;
-                this.createContainerElements();
-            }
-        },
-        get: function() {
-            return this._container;
-        }
-    },
-
     containerElements: {
         value: []
     },
@@ -74,31 +58,37 @@ exports.Breadcrumb = Montage.create(Component, {
     prepareForDraw: {
         value: function() {
             this.breadcrumbBt.addEventListener("action", this, false);
+            this.addPropertyChangeListener("currentDocument.model.domContainer", this)
         }
     },
 
-    createContainerElements: {
+    handleChange: {
         value: function() {
-            var parentNode;
+            if(this.currentDocument && this.currentDocument.model.getProperty("domContainer")) {
+                this.createContainerElements(this.currentDocument.model.getProperty("domContainer"));
+            }
+        }
+    },
+
+    createContainerElements: {
+        value: function(container) {
 
 //            delete this.containerElements;
                 this.containerElements = [];
 
-            parentNode = this.container;
-
-            while(parentNode !== this.currentDocument.model.documentRoot) {
-                this.containerElements.unshift({"node": parentNode, "nodeUuid":parentNode.uuid, "label": parentNode.nodeName});
-                parentNode = parentNode.parentNode;
+            while(container !== this.currentDocument.model.documentRoot) {
+                this.containerElements.unshift({"node": container, "nodeUuid":container.uuid, "label": container.nodeName});
+                container = container.parentNode;
             }
 
             // This is always the top container which is now hardcoded to body
-            this.containerElements.unshift({"node": parentNode, "nodeUuid":parentNode.uuid, "label": parentNode.nodeName});
+            this.containerElements.unshift({"node": container, "nodeUuid":container.uuid, "label": container.nodeName});
         }
     },
 
     handleAction: {
         value: function(evt) {
-            if(evt.target.value === this.container.uuid) {
+            if(evt.target.value === this.currentDocument.model.domContainer.uuid) {
                 return;
             }
 
@@ -109,7 +99,7 @@ exports.Breadcrumb = Montage.create(Component, {
             }
 
             // TODO: This is bound 2 ways, update the internal property
-            this.application.ninja.currentSelectedContainer = this.containerElements[i].node;
+            this.currentDocument.model.domContainer = this.containerElements[i].node;
         }
     }
 });
diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js
index 4a02e9a3..e40a646a 100755
--- a/js/controllers/elements/element-controller.js
+++ b/js/controllers/elements/element-controller.js
@@ -19,13 +19,13 @@ exports.ElementController = Montage.create(Component, {
                 var selectedLayerIndex = this.application.ninja.timeline.getLayerIndexByID(this.application.ninja.timeline.currentLayerSelected.layerData.layerID);
 
                 if(selectedLayerIndex === 0) {
-                    this.application.ninja.currentSelectedContainer.appendChild(el);
+                    this.application.ninja.currentDocument.model.domContainer.appendChild(el);
                 } else {
                     var element = this.application.ninja.timeline.arrLayers[selectedLayerIndex].layerData.elementsList[0];
                     element.parentNode.insertBefore(el, element.nextSibling);
                 }
             } else {
-                this.application.ninja.currentSelectedContainer.appendChild(el);
+                this.application.ninja.currentDocument.model.domContainer.appendChild(el);
             }
 
             if(styles) {
diff --git a/js/controllers/selection-controller.js b/js/controllers/selection-controller.js
index 4bca0755..9ae1cfc9 100755
--- a/js/controllers/selection-controller.js
+++ b/js/controllers/selection-controller.js
@@ -35,7 +35,7 @@ exports.SelectionController = Montage.create(Component, {
 
             if(this._currentDocument && this._currentDocument.currentView === "design") {
                 this._currentDocument.model._selection = this.application.ninja.selectedElements;
-                this._currentDocument.model.selectionContainer = this.application.ninja._currentSelectedContainer;
+//                this._currentDocument.model.selectionContainer = this.application.ninja._currentSelectedContainer;
             }
 
             this._currentDocument = value;
@@ -65,7 +65,7 @@ exports.SelectionController = Montage.create(Component, {
                 this._selectedElements = value;
 
                 this.application.ninja.selectedElements = this._selectedElements;
-                this.application.ninja._currentSelectedContainer = this._selectionContainer = this.application.ninja.currentDocument.model.documentRoot;
+//                this.application.ninja._currentSelectedContainer = this._selectionContainer = this.application.ninja.currentDocument.model.documentRoot;
 
                 if(this._selectedElements.length === 0) {
                     this.executeSelectElement();
@@ -78,30 +78,24 @@ exports.SelectionController = Montage.create(Component, {
         }
     },
 
-    // Bound property to the ninja currentSelectedContainer
-    _selectionContainer: {
-        value: null
-    },
-
-    selectionContainer: {
-        get: function() {
-            return this._selectionContainer
-        },
-        set: function(value) {
-            if(this._selectionContainer && this._selectionContainer !== value) {