2 files changed, 36 insertions, 4 deletions

diff --git a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.html b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.html
index df104ecc..1e040e35 100644
--- a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.html
+++ b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.html
@@ -11,6 +11,17 @@
 
         <script type="text/montage-serialization">
         {
+            "componentController": {
+                "module": "montage/ui/controller/array-controller",
+                "name": "ArrayController",
+                "bindings": {
+                    "content": {
+                        "boundObject": {"@": "owner"},
+                        "boundObjectPropertyPath": "components"
+                    }
+                }
+            },
+
             "owner": {
                 "module": "js/panels/Components/ComponentsPanelBase.reel",
                 "name": "ComponentsPanelBase",
diff --git a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js
index 58a798d8..9b5b755c 100644
--- a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js
+++ b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js
@@ -11,10 +11,25 @@ var Montage = require("montage/core/core").Montage,
 var treeControlModule = require("js/components/tree.reel");
 
 var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component, {
-    _hasFocus: {
-        enumerable: false,
-        value: false
+
+    components: {
+        value: null
+    },
+
+    didCreate: {
+        value: function() {
+            this._loadComponents();
+        }
+    },
+
+    _loadComponents: {
+        value: function() {
+            this.photos = [
+                {component: "Button", data: "montage/ui/button.reel/button.json"}
+            ];
+        }
     },
+
     prepareForDraw: {
         enumerable: false,
         value: function() {
@@ -57,7 +72,7 @@ var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component
                 componentEl.setAttribute("type", "button");
                 //componentEl.innerHTML = "Button";
 
-                componentInstance = this.application.ninja.currentDocument._window.addComponent(componentEl, {type: componentType, path: "montage/ui/button.reel", name: "Button"});
+                componentInstance = this.application.ninja.currentDocument._window.addComponent(componentEl, {type: componentType, path: "montage/ui/button.reel", name: "Button"}, this.callback);
 
 
             }else if(componentType == "Checkbox"){
@@ -140,5 +155,11 @@ var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component
 
 
         }
+    },
+
+    callback: {
+        value: function() {
+            console.log("the callback");
+        }
     }
 });
\ No newline at end of file