aboutsummaryrefslogtreecommitdiff
path: root/js/panels/Components
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/Components')
-rw-r--r--js/panels/Components/Components.xml28
-rw-r--r--js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.html39
-rw-r--r--js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js328
3 files changed, 255 insertions, 140 deletions
diff --git a/js/panels/Components/Components.xml b/js/panels/Components/Components.xml
deleted file mode 100644
index b3056330..00000000
--- a/js/panels/Components/Components.xml
+++ /dev/null
@@ -1,28 +0,0 @@
1<?xml version="1.0" encoding="ISO-8859-1"?>
2<tree id="Components">
3 <folder id="montageComponents" label="Montage Components">
4 <leaf id="Button" label="Button" />
5 <leaf id="Checkbox" label="Checkbox" />
6 <leaf id="DynamicText" label="Dynamic Text" />
7 <leaf id="FlowController" label="FlowController" />
8 <leaf id="HotText" label="HotText" />
9 <leaf id="HotTextUnit" label="HotTextUnit" />
10 <leaf id="ImageContainer" label="Image Container" />
11 <leaf id="Progress" label="Progress" />
12 <leaf id="Scrollview" label="Scrollview" />
13 <leaf id="Slider" label="Slider" />
14 <leaf id="TextArea" label="TextArea" />
15 <leaf id="Textfield" label="Textfield" />
16 <leaf id="Toggle" label="Toggle" />
17 </folder>
18 <folder id="metaComponents" label="Meta Components">
19 <leaf id="Condition" label="Condition" />
20 <leaf id="Repetition" label="Repetition" />
21 <leaf id="Slot" label="Slot" />
22 <leaf id="Substitution" label="Substitution" />
23 </folder>
24 <folder id="htmlPresets" label="HTML Components">
25 <leaf id="html_button" label="Button" />
26 <leaf id="html_input" label="Text Input" />
27 </folder>
28</tree> \ No newline at end of file
diff --git a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.html b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.html
index df104ecc..6d7c8a2c 100644
--- a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.html
+++ b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.html
@@ -15,8 +15,41 @@
15 "module": "js/panels/Components/ComponentsPanelBase.reel", 15 "module": "js/panels/Components/ComponentsPanelBase.reel",
16 "name": "ComponentsPanelBase", 16 "name": "ComponentsPanelBase",
17 "properties": { 17 "properties": {
18 "element": {"#": "components_panel"} 18 "element": {"#": "components_panel"},
19 "controller": {"@": "componentsTree"}
19 } 20 }
21 },
22
23 "componentsController" : {
24 "module": "js/components/controllers/tree-controller",
25 "name": "TreeController",
26 "properties" : {
27 "branchKey" : "children",
28 "labelKey" : "text",
29 "delegate": {"@": "owner" }
30 },
31 "bindings": {
32 "content": {
33 "boundObject": {"@": "owner"},
34 "boundObjectPropertyPath": "components"
35 }
36 }
37 },
38
39 "componentsTree" : {
40 "module" : "js/components/treeview/treeview.reel",
41 "name" : "Treeview",
42 "properties" : {
43 "element" : {"#": "componentsContainer"},
44 "branchComponent" : {"@": "branch" },
45 "contentController": {"@": "componentsController"},
46 "showRoot" : false
47 }
48 },
49
50 "branch" : {
51 "module" : "js/components/treeview/ninja-branch.reel",
52 "name" : "Branch"
20 } 53 }
21 } 54 }
22 </script> 55 </script>
@@ -25,9 +58,7 @@
25 <body> 58 <body>
26 59
27 <div id="components_panel" class="components_panel"> 60 <div id="components_panel" class="components_panel">
28 <div class="treeHolder"> 61 <div id="componentsContainer"></div>
29 <ul id="comp_tree"></ul>
30 </div>
31 </div> 62 </div>
32 63
33 </body> 64 </body>
diff --git a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js
index 41afefa5..7e5a76ee 100644
--- a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js
+++ b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js
@@ -4,142 +4,254 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
4(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. 4(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5</copyright> */ 5</copyright> */
6 6
7var Montage = require("montage/core/core").Montage, 7var Montage = require("montage/core/core").Montage,
8 Component = require("montage/ui/component").Component, 8 Component = require("montage/ui/component").Component,
9 NJUtils = require("js/lib/NJUtils").NJUtils; 9 NJUtils = require("js/lib/NJUtils").NJUtils;
10
11var treeControlModule = require("js/components/tree.reel");
12var PIData = require("js/data/pi/pi-data").PiData;
13
14String.prototype.capitalizeFirstChar = function() {
15 return this.charAt(0).toUpperCase() + this.slice(1);
16};
10 17
11var treeControlModule = require("js/components/tree.reel");
12 18
13var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component, { 19var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component, {
14 _hasFocus: { 20
15 enumerable: false, 21 components: {
16 value: false 22 value: {
23 "text": "styles",
24 "children": [
25 {
26 "text": "Montage Components",
27 "children": [
28 {
29 "text": "Button",
30 "dataFile" : "node_modules/components-data/button.json",
31 "component": "button"
32 },
33 {
34 "text": "Textfield",
35 "dataFile" : "node_modules/components-data/textfield.json",
36 "component": "textfield"
37 }
38 ]
39 }
40 ]
41 }
42 },
43
44 componentsData: {
45 value: {}
46 },
47
48 componentsToLoad: {
49 value: null
50 },
51
52 componentsLoaded: {
53 value: 0
17 }, 54 },
18 prepareForDraw: {
19 enumerable: false,
20 value: function() {
21 var treeHolderDiv = document.getElementById("comp_tree");
22 var componentsTree = treeControlModule.Tree.create();
23 componentsTree.element = treeHolderDiv;
24 componentsTree.dataProvider = this._loadXMLDoc("js/panels/Components/Components.xml");
25 componentsTree.needsDraw = true;
26 55
27 this.eventManager.addEventListener( "executeAddComponent", this, false); 56 dragComponent: {
28 } 57 value: null
29 }, 58 },
30 willDraw: {
31 enumerable: false,
32 value: function() {
33 59
34 } 60 dragPosition: {
61 value: null
35 }, 62 },
36 draw: {
37 enumerable: false,
38 value: function() {
39 63
40 } 64 centerStage: {
65 value: null
41 }, 66 },
42 67
43 _loadXMLDoc: { 68
44 value:function(dname) { 69 /*********************************************************************
45 if (window.XMLHttpRequest) { 70 * Components Tree and Model Creation
46 xhttp = new XMLHttpRequest(); 71 *********************************************************************/
72
73 didCreate: {
74 value: function() {
75 // Setup the drop delegate
76 this.application.ninja.dragDropMediator.dropDelegate = this;
77 // Loop through the component and load the JSON data for them
78 this._loadComponents();
79 }
80 },
81
82 // Load all the data files for each component