28 files changed, 1349 insertions, 58 deletions

diff --git a/js/components/combobox.reel/combobox.js b/js/components/combobox.reel/combobox.js
index a68a7d6b..3200b01c 100644
--- a/js/components/combobox.reel/combobox.js
+++ b/js/components/combobox.reel/combobox.js
@@ -15,7 +15,7 @@ exports.Combobox = Montage.create(Component, {
     },
 
     _wasSetByCode: {
-        enumerable: false,
+        enumerable: true,
         value: true
     },
 
@@ -27,6 +27,14 @@ exports.Combobox = Montage.create(Component, {
         value: null
     },
 
+    dataField: {
+        value: null
+    },
+
+    dataFunction: {
+        value: null
+    },
+
     _items: {
         value: []
     },
@@ -71,7 +79,27 @@ exports.Combobox = Montage.create(Component, {
                 e.value = this._value;
                 this.dispatchEvent(e);
 
-                this._wasSetByCode = false;
+                this._wasSetByCode = true;
+            }
+        }
+    },
+
+    _enabled: {
+        enumerable: false,
+        value: true
+    },
+
+    enabled: {
+        enumerable: true,
+        serializable: true,
+        get: function() {
+            return this._enabled;
+        },
+        set: function(value) {
+            if(value !== this._enabled)
+            {
+                this._enabled = value;
+                this.needsDraw = true;
             }
         }
     },
@@ -102,7 +130,19 @@ exports.Combobox = Montage.create(Component, {
                 {
                     var current = items[i];
                     optionItem = document.createElement("option");
-                    optionItem.value = current;
+                    if(this.dataFunction)
+                    {
+                        optionItem.value = this.dataFunction(current);
+                    }
+                    else if(this.dataField)
+                    {
+                        optionItem.value = current[this.dataField];
+                    }
+                    else
+                    {
+                        optionItem.value = current;
+                    }
+
                     if(this.labelFunction)
                     {
                         optionItem.innerText = this.labelFunction(current);
@@ -117,6 +157,7 @@ exports.Combobox = Montage.create(Component, {
                     }
                     this.element.appendChild(optionItem);
                 }
+                this.element.disabled = !this._enabled;
             }
         }
     },
@@ -133,6 +174,22 @@ exports.Combobox = Montage.create(Component, {
 
     prepareForDraw: {
         value: function() {
+            if( (this._value === null) && this._items.length )
+            {
+                var current = this._items[0];
+                if(this.dataFunction)
+                {
+                    this.value = this.dataFunction(current);
+                }
+                else if(this.dataField)
+                {
+                    this.value = current[this.dataField];
+                }
+                else
+                {
+                    this.value = current;
+                }
+            }
             this.element.addEventListener("change", this, false);
         }
     }
diff --git a/js/components/controllers/tree-controller.js b/js/components/controllers/tree-controller.js
new file mode 100644
index 00000000..03ef7b9e
--- /dev/null
+++ b/js/components/controllers/tree-controller.js
@@ -0,0 +1,185 @@
+/* <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
+ </copyright> */
+/**
+ @module montage/ui/controller/tree-controller
+ @requires montage/core/core
+ @requires montage/ui/controller/object-controller
+ @requires montage/core/event/mutable-event
+ */
+var Montage = require("montage").Montage,
+    ObjectController = require("montage/ui/controller/object-controller").ObjectController,
+    ArrayController = require("montage/ui/controller/array-controller").ArrayController,
+    MutableEvent = require("montage/core/event/mutable-event").MutableEvent;
+/**
+    TODO: Write description like the array controllers: The ArrayController helps with organizing a hierarchical
+    collection of objects, and managing user selection within that collection.
+    You can assign a TreeController instance as the <code>contentProvider</code> property for a TreeView object.
+    @class module:montage/ui/controller/tree-controller.TreeController
+    @classdesc
+    @extends module:montage/ui/controller/object-controller.ObjectController
+*/
+var TreeController = exports.TreeController = Montage.create(ObjectController, /** @lends module:montage/ui/controller/tree-controller.TreeController# */ {
+
+    rootKey : {
+        value: null
+    },
+
+    branchKey : {
+        value: 'children'
+    },
+
+    _root : {
+        value : null
+    },
+    root : {
+        get: function() {
+            return this._root;
+        },
+        set: function(value) {
+            this._root = value;
+
+            this.initArrayControllers();
+        }
+    },
+
+    rootController: {
+        value: null
+    },
+
+    initArrayControllers : {
+        value: function() {
+            var self = this;
+
+            ///// Recursive function that finds all branch nodes and initializes
+            ///// sets the tree node type to "branch" or "leaf"
+
+            function walk(node, init, depth) {
+                var branch = node[self.branchKey];
+
+                if(branch) {
+                    branch.forEach(function(node) {
+                        walk(node, init, ++depth);