27 files changed, 402 insertions, 367 deletions

diff --git a/js/components/converter/string-units-converter.js b/js/components/converter/string-units-converter.js
index 6b97d5c5..9f6e4112 100644
--- a/js/components/converter/string-units-converter.js
+++ b/js/components/converter/string-units-converter.js
@@ -9,7 +9,6 @@ var Montage = require("montage").Montage,
 
 exports.StringUnitsConverter = Montage.create(Converter, {
 
-    // convert fahrenheit to celsius (showing our non-metric heritage here)
     convert: {
         value: function(value) {
             if(value) {
@@ -20,7 +19,6 @@ exports.StringUnitsConverter = Montage.create(Converter, {
         }
     },
 
-    // revert celsius to fahrenheit
     revert: {
         value: function(value) {
             console.log("revert string to unit ", value);
diff --git a/js/components/converter/string-value-converter.js b/js/components/converter/string-value-converter.js
index 28d7dd29..f397f731 100644
--- a/js/components/converter/string-value-converter.js
+++ b/js/components/converter/string-value-converter.js
@@ -9,7 +9,6 @@ var Montage = require("montage").Montage,
 
 exports.StringValueConverter = Montage.create(Converter, {
 
-    // convert fahrenheit to celsius (showing our non-metric heritage here)
     convert: {
         value: function(value) {
             console.log(value);
@@ -18,7 +17,6 @@ exports.StringValueConverter = Montage.create(Converter, {
         }
     },
 
-    // revert celsius to fahrenheit
     revert: {
         value: function(value) {
             console.log("revert string to value ", value);
diff --git a/js/components/layout/bread-crumb.reel/bread-crumb.js b/js/components/layout/bread-crumb.reel/bread-crumb.js
index 49dbe3cb..ac131f2c 100755
--- a/js/components/layout/bread-crumb.reel/bread-crumb.js
+++ b/js/components/layout/bread-crumb.reel/bread-crumb.js
@@ -9,21 +9,44 @@ var Montage = require("montage/core/core").Montage,
 
 exports.Breadcrumb = Montage.create(Component, {
 
-    disabled: {
-        value: true
+    _currentDocument: {
+        enumerable: false,
+        value: null
     },
 
-    handleOpenDocument: {
-        value: function(){
-            this.disabled = false;
+    currentDocument: {
+        enumerable: false,
+        get: function() {
+            return this._currentDocument;
+        },
+        set: function(value) {
+            if (value === this._currentDocument) {
+                return;
+            }
+
+            this._currentDocument = value;
+
+            if(!value) {
+                this.disabled = true;
+            } else {
+                this.disabled = this._currentDocument.currentView !== "design";
+            }
+
         }
     },
 
-    handleCloseDocument: {
-        value: function(){
-            if(!this.application.ninja.documentController.activeDocument && this.application.ninja.currentDocument.currentView !== "code") {
-                this.disabled = true;
-                this.application.ninja.currentSelectedContainer = (this.application.ninja.currentDocument ? this.application.ninja.currentDocument.model.documentRoot : null);
+
+    _disabled: {
+        value: true
+    },
+
+    disabled: {
+        get: function() {
+            return this._disabled;
+        },
+        set: function(value) {
+            if(value !== this._disabled) {
+                this._disabled = value;
             }
         }
     },
@@ -50,8 +73,6 @@ exports.Breadcrumb = Montage.create(Component, {
 
     prepareForDraw: {
         value: function() {
-            this.eventManager.addEventListener("openDocument", this, false);
-            this.eventManager.addEventListener("closeDocument", this, false);
             this.breadcrumbBt.addEventListener("action", this, false);
         }
     },
@@ -65,7 +86,7 @@ exports.Breadcrumb = Montage.create(Component, {
 
             parentNode = this.container;
 
-            while(parentNode !== this.application.ninja.currentDocument.model.documentRoot) {
+            while(parentNode !== this.currentDocument.model.documentRoot) {
                 this.containerElements.unshift({"node": parentNode, "nodeUuid":parentNode.uuid, "label": parentNode.nodeName});
                 parentNode = parentNode.parentNode;
             }
@@ -87,6 +108,7 @@ exports.Breadcrumb = Montage.create(Component, {
                 this.containerElements.pop();
             }
 
+            // TODO: This is bound 2 ways, update the internal property
             this.application.ninja.currentSelectedContainer = this.containerElements[i].node;
         }
     }
diff --git a/js/components/layout/document-bar.reel/document-bar.html b/js/components/layout/document-bar.reel/document-bar.html
index 760186ba..a35b5590 100755
--- a/js/components/layout/document-bar.reel/document-bar.html
+++ b/js/components/layout/document-bar.reel/document-bar.html
@@ -37,11 +37,7 @@
                     "element": {"#": "disabledCondition"}
                 },
                 "bindings": {
-                    "condition": {
-                        "boundObject": {"@": "owner"},
-                        "boundObjectPropertyPath": "disabled",
-                        "oneway": true
-                    }
+                    "condition": {"<-": "@owner.disabled"}
                 }
             },
 
diff --git a/js/components/layout/document-bar.reel/document-bar.js b/js/components/layout/document-bar.reel/document-bar.js
index 56b61f1d..1cb0bd90 100755
--- a/js/components/layout/document-bar.reel/document-bar.js
+++ b/js/components/layout/document-bar.reel/document-bar.js
@@ -9,13 +9,64 @@ var Component = require("montage/ui/component").Component;
 
 exports.DocumentBar = Montage.create(Component, {
 
-    designView: { value: null, enumerable: false},
-    codeView: { value: null, enumerable: false},
-    zoomControl: { value: null, enumerable: false },
-    _type: { enumerable: false, value: null },
+    _currentDocument: {
+        enumerable: false,
+        value: null
+    },