diff options
Diffstat (limited to 'js/panels/Components')
3 files changed, 212 insertions, 58 deletions
diff --git a/js/panels/Components/Components.xml b/js/panels/Components/Components.xml index b3056330..e076602e 100644 --- a/js/panels/Components/Components.xml +++ b/js/panels/Components/Components.xml | |||
@@ -2,27 +2,5 @@ | |||
2 | <tree id="Components"> | 2 | <tree id="Components"> |
3 | <folder id="montageComponents" label="Montage Components"> | 3 | <folder id="montageComponents" label="Montage Components"> |
4 | <leaf id="Button" label="Button" /> | 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> | 5 | </folder> |
28 | </tree> \ No newline at end of file | 6 | </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..1e040e35 100644 --- a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.html +++ b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.html | |||
@@ -11,6 +11,17 @@ | |||
11 | 11 | ||
12 | <script type="text/montage-serialization"> | 12 | <script type="text/montage-serialization"> |
13 | { | 13 | { |
14 | "componentController": { | ||
15 | "module": "montage/ui/controller/array-controller", | ||
16 | "name": "ArrayController", | ||
17 | "bindings": { | ||
18 | "content": { | ||
19 | "boundObject": {"@": "owner"}, | ||
20 | "boundObjectPropertyPath": "components" | ||
21 | } | ||
22 | } | ||
23 | }, | ||
24 | |||
14 | "owner": { | 25 | "owner": { |
15 | "module": "js/panels/Components/ComponentsPanelBase.reel", | 26 | "module": "js/panels/Components/ComponentsPanelBase.reel", |
16 | "name": "ComponentsPanelBase", | 27 | "name": "ComponentsPanelBase", |
diff --git a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js index 41afefa5..51822150 100644 --- a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js +++ b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js | |||
@@ -4,17 +4,122 @@ 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 | ||
7 | var Montage = require("montage/core/core").Montage, | 7 | var 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 | 10 | ||
11 | var treeControlModule = require("js/components/tree.reel"); | 11 | var treeControlModule = require("js/components/tree.reel"); |
12 | var PIData = require("js/data/pi/pi-data").PiData; | ||
12 | 13 | ||
13 | var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component, { | 14 | var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component, { |
14 | _hasFocus: { | 15 | |
15 | enumerable: false, | 16 | components: { |
16 | value: false | 17 | value: null |
18 | }, | ||
19 | |||
20 | _testButtonJson: { | ||
21 | value: { | ||
22 | "component": "button", | ||
23 | |||
24 | "module": "montage/ui/button.reel", | ||
25 | |||
26 | "name": "Button", | ||
27 | |||
28 | "properties": [ | ||
29 | { | ||
30 | "name": "label", | ||
31 | "type": "string", | ||
32 | "default": "Button" | ||
33 | }, | ||
34 | { | ||
35 | "name": "enabled", | ||
36 | "type": "boolean", | ||
37 | "default": "true" | ||
38 | } | ||
39 | ] | ||
40 | } | ||
41 | }, | ||
42 | |||
43 | didCreate: { | ||
44 | value: function() { | ||
45 | this._loadComponents(); | ||
46 | |||
47 | // var req = new XMLHttpRequest(); | ||
48 | // req.identifier = "searchRequest"; | ||
49 | // req.open("GET", url); | ||
50 | // req.addEventListener("load", this, false); | ||
51 | // req.addEventListener("error", this, false); | ||
52 | // req.send(); | ||
53 | |||
54 | } | ||
55 | }, | ||
56 | |||
57 | _loadComponents: { | ||
58 | value: function() { | ||
59 | this.components = [ | ||
60 | {name: "Button", data: "node_modules/components-data/button.json"}, | ||
61 | {name: "Textfield", data: "node_modules/components-data/textfield.json"} | ||
62 | ]; | ||
63 | |||
64 | // Build the PI objects for each component | ||
65 | for(var i = 0, component; component = this.components[i]; i++) { | ||
66 | var req = new XMLHttpRequest(); | ||
67 | //req.identifier = "searchRequest"; | ||
68 | req.open("GET", component.data); | ||
69 | req.addEventListener("load", this, false); | ||
70 | req.addEventListener("error", this, false); | ||
71 | req.send(); | ||
72 | |||
73 | /* | ||
74 | var piIdentifier = component.name + "Pi"; | ||
75 | var piObj = []; | ||
76 | var section = {}; | ||
77 | |||
78 | |||
79 | section.label = component.name + " Properties"; | ||
80 | section.Section = []; | ||
81 | |||
82 | for(var j = 0, props; props = this._testButtonJson.properties[j]; j++) { | ||
83 | var row = {}; | ||
84 | row.type = this.getControlType(props.type); | ||
85 | row.id = props.name; | ||
86 | row.prop = props.name; | ||
87 | row.defaultValue = props["default"]; | ||
88 | row.label = props.name; | ||
89 | |||
90 | section.Section.push([row]); | ||
91 | } | ||
92 | |||
93 | PIData[piIdentifier] = []; | ||
94 | PIData[piIdentifier].push(section); | ||
95 | */ | ||
96 | |||
97 | } | ||
98 | |||
99 | } | ||
100 | }, | ||
101 | |||
102 | handleLoad: { | ||
103 | value: function(evt) { | ||
104 | var response = JSON.parse(evt.target.responseText); | ||
105 | console.log(response); | ||
106 | |||
107 | } | ||
108 | }, | ||
109 | |||
110 | getControlType: { | ||
111 | value: function(type) { | ||
112 | switch(type) { | ||
113 | case "string": | ||
114 | return "textbox"; | ||
115 | case "boolean": | ||
116 | return "checkbox"; | ||
117 | default: | ||
118 | alert("Conversion not implemented for ", type); | ||
119 | } | ||
120 | } | ||
17 | }, | 121 | }, |
122 | |||
18 | prepareForDraw: { | 123 | prepareForDraw: { |
19 | enumerable: false, | 124 | enumerable: false, |
20 | value: function() { | 125 | value: function() { |
@@ -27,18 +132,6 @@ var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component | |||
27 | this.eventManager.addEventListener( "executeAddComponent", this, false); | 132 | this.eventManager.addEventListener( "executeAddComponent", this, false); |
28 | } | 133 | } |
29 | }, | 134 | }, |
30 | willDraw: { | ||
31 | enumerable: false, | ||
32 | value: function() { | ||
33 | |||
34 | } | ||
35 | }, | ||
36 | draw: { | ||
37 | enumerable: false, | ||
38 | value: function() { | ||
39 | |||