20 files changed, 725 insertions, 441 deletions

diff --git a/js/components/layout/document-entry.reel/document-entry.css b/js/components/layout/document-entry.reel/document-entry.css
index 52d08d72..4601974f 100755
--- a/js/components/layout/document-entry.reel/document-entry.css
+++ b/js/components/layout/document-entry.reel/document-entry.css
@@ -4,19 +4,26 @@
  (c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
  </copyright> */
 
+.documentEntry{
+    white-space: nowrap;
+}
+
 .documentEntry span
 {
-    /*display: inline-block;*/
-    white-space: nowrap;
+    display: inline-block;
+    white-space: pre;
     overflow: hidden;
-    text-overflow: ellipsis; /* Causes ... to appear ?? */
+    text-overflow: ellipsis;
     max-width:100px;
+    width:85%;
+    min-width:0px;
 }
 
 .documentEntry img {
     opacity: 0.5; /* 50% */
-    padding-left: 5px;
     width: 12px;
+    max-width:12px;
+    min-width:5px;
     height: 12px;
     -webkit-transition: opacity 0.2s ease;
     transition: opacity 0.2s ease;
diff --git a/js/components/layout/documents-tab.reel/documents-tab.css b/js/components/layout/documents-tab.reel/documents-tab.css
index 689eb777..da00f727 100755
--- a/js/components/layout/documents-tab.reel/documents-tab.css
+++ b/js/components/layout/documents-tab.reel/documents-tab.css
@@ -12,7 +12,6 @@
 }
 
 .openDocuments {
-    float: left;
     height: 25px;
     width: 100%;
     font-size: 12px;
@@ -21,16 +20,20 @@
     padding: 0;
     position: relative;
     text-decoration: none;
+    display: -webkit-box;
+    -webkit-box-orient: horizontal;
+    -webkit-box-pack:start;
+    -webkit-box-align:start;
 }
 
 .openDocuments li {
     border-right: 1px solid black;
     cursor: pointer;
-    display: inline;
-    float: left;
     padding: 0.5em 1em;
-    text-shadow: 1px 1px 1px #000000;
     vertical-align: middle;
+    text-shadow: 1px 1px 1px #000000;
+    -webkit-box-flex: 1;
+    max-width: 115px;
 }
 
 .openDocuments li:hover,
diff --git a/js/components/menu/menu-item.reel/menu-item.js b/js/components/menu/menu-item.reel/menu-item.js
index 64a89a6a..26fc7573 100755
--- a/js/components/menu/menu-item.reel/menu-item.js
+++ b/js/components/menu/menu-item.reel/menu-item.js
@@ -61,6 +61,8 @@ exports.MenuItem = Montage.create(Component, {
 
     prepareForDraw: {
         value: function() {
+            var boundObject = this.application.ninja, strArr = null, i=0;
+
             if(!this.data) return;
 
             if(this.data.separator) {
@@ -82,9 +84,14 @@ exports.MenuItem = Montage.create(Component, {
             }
 
             if(this.data.enabled.boundProperty) {
+
+                boundObject = this.application.ninja[this.data.enabled.boundObj];
+
                 Object.defineBinding(this, "enabled", {
-                  boundObject: this.application.ninja[this.data.enabled.boundObj],
-                  boundObjectPropertyPath: this.data.enabled.boundProperty
+                  boundObject: boundObject,
+                  boundObjectPropertyPath: this.data.enabled.boundProperty,
+                  boundValueMutator: this.data.enabled.boundValueMutator,
+                  oneway : this.data.enabled.oneway
                 });
 
             } else {
@@ -134,7 +141,7 @@ exports.MenuItem = Montage.create(Component, {
 
             if(this.data.radio && this.checked) return;
 
-            if(this.enabled || !this.submenu) {
+            if((this.enabled === true) && (this.submenu === false) ) {
                 if(this.data.action) {
                     NJevent ( this.data.action );
                 } else  if(this.checked !== null) {
diff --git a/js/components/ui/icon-list-basic/icon.reel/icon.css b/js/components/ui/icon-list-basic/icon.reel/icon.css
index 9fb180d2..203db65c 100644
--- a/js/components/ui/icon-list-basic/icon.reel/icon.css
+++ b/js/components/ui/icon-list-basic/icon.reel/icon.css
@@ -35,7 +35,7 @@
 
 .icon .iconLabel{
     margin-top:8px;
-    white-space: nowrap;
+    white-space: pre;
     text-overflow: ellipsis;
     line-height:15px;
     overflow: hidden;
diff --git a/js/components/ui/icon-list-basic/icon.reel/icon.js b/js/components/ui/icon-list-basic/icon.reel/icon.js
index 1ef6e277..7d36bc59 100755
--- a/js/components/ui/icon-list-basic/icon.reel/icon.js
+++ b/js/components/ui/icon-list-basic/icon.reel/icon.js
@@ -86,7 +86,7 @@ var Icon = exports.Icon = Montage.create(Component, {
                 this.metadata = "Name: "+this.icondata.name;
             }
             this.metadata = this.metadata + "<br />" + "Type: "+this.icondata.type;
-            if(this.icondata.size){this.metadata = this.metadata + "<br />" + "Size: "+this.icondata.size;}
+            if(this.icondata.size){this.metadata = this.metadata + "<br />" + "Size: "+this.icondata.size+ " bytes";}
             if(this.icondata.creationDate){this.metadata = this.metadata + "<br />" + "Creation date: "+ this.formatTimestamp(this.icondata.creationDate);}
             if(this.icondata.modifiedDate){this.metadata = this.metadata + "<br />" + "Modified date: "+ this.formatTimestamp(this.icondata.modifiedDate);}
 
diff --git a/js/components/ui/tree-basic/treeItem.reel/treeItem.css b/js/components/ui/tree-basic/treeItem.reel/treeItem.css
index f8e67541..d33404e7 100755
--- a/js/components/ui/tree-basic/treeItem.reel/treeItem.css
+++ b/js/components/ui/tree-basic/treeItem.reel/treeItem.css
@@ -29,7 +29,7 @@
 }
 
 .atreeItem .name{
-    white-space: nowrap;
+    white-space: pre;
     text-overflow:ellipsis;
     line-height:15px;
     overflow: hidden;
diff --git a/js/components/ui/tree-basic/treeItem.reel/treeItem.js b/js/components/ui/tree-basic/treeItem.reel/treeItem.js
index 13e278e9..e9e5c1fb 100755
--- a/js/components/ui/tree-basic/treeItem.reel/treeItem.js
+++ b/js/components/ui/tree-basic/treeItem.reel/treeItem.js
@@ -118,7 +118,7 @@ exports.TreeItem = Montage.create(Component, {
                 this.metadata = "Name: "+this.treeItemData.name;
             }
             this.metadata = this.metadata + "<br />" + "Type: "+this.treeItemData.type;
-            if(this.treeItemData.size){this.metadata = this.metadata + "<br />" + "Size: "+this.treeItemData.size;}
+            if(this.treeItemData.size){this.metadata = this.metadata + "<br />" + "Size: "+this.treeItemData.size+ " bytes";}
             if(this.treeItemData.creationDate){this.metadata = this.metadata + "<br />" + "Creation date: "+ this.formatTimestamp(this.treeItemData.creationDate);}
             if(this.treeItemData.modifiedDate){this.metadata = this.metadata + "<br />" + "Modified date: "+ this.formatTimestamp(this.treeItemData.modifiedDate);}
 
diff --git a/js/controllers/document-controller.js b/js/controllers/document-controller.js
index d5556fa8..a308f191 100755
--- a/js/controllers/document-controller.js
+++ b/js/controllers/document-controller.js
@@ -32,22 +32,30 @@ var DocumentController = exports.DocumentController = Montage.create(Component,