diff options
author | Pierre Frisch | 2011-12-22 07:25:50 -0800 |
---|---|---|
committer | Valerio Virgillito | 2012-01-27 11:18:17 -0800 |
commit | b89a7ee8b956c96a1dcee995ea840feddc5d4b27 (patch) | |
tree | 0f3136ab0ecdbbbed6a83576581af0a53124d6f1 /js/components/ui/property-control.reel/property-control.js | |
parent | 2401f05d1f4b94d45e4568b81fc73e67b969d980 (diff) | |
download | ninja-b89a7ee8b956c96a1dcee995ea840feddc5d4b27.tar.gz |
First commit of Ninja to ninja-internal
Signed-off-by: Valerio Virgillito <rmwh84@motorola.com>
Diffstat (limited to 'js/components/ui/property-control.reel/property-control.js')
-rw-r--r-- | js/components/ui/property-control.reel/property-control.js | 238 |
1 files changed, 238 insertions, 0 deletions
diff --git a/js/components/ui/property-control.reel/property-control.js b/js/components/ui/property-control.reel/property-control.js new file mode 100644 index 00000000..586d2e9a --- /dev/null +++ b/js/components/ui/property-control.reel/property-control.js | |||
@@ -0,0 +1,238 @@ | |||
1 | /* <copyright> | ||
2 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | ||
3 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | ||
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | ||
5 | </copyright> */ | ||
6 | |||
7 | var Montage = require("montage/core/core").Montage, | ||
8 | Component = require("montage/ui/component").Component, | ||
9 | HotText = require("js/components/hottext").HotText, | ||
10 | HotTextUnit = require("js/components/hottextunit").HotTextUnit, | ||
11 | Slider = require("js/components/slider").Slider, | ||
12 | Button = require("js/components/button").Button, | ||
13 | Checkbox = require("js/components/checkbox").Checkbox, | ||
14 | Combobox = require("js/components/combobox").Combobox, | ||
15 | TextField = require("js/components/TextField").TextField, | ||
16 | ColorChip = require("js/components/ui/color-chip").ColorChip, | ||
17 | FileInput = require("js/components/ui/file-input").FileInput, | ||
18 | InputGroup = require("js/components/ui/input-group").InputGroup; | ||
19 | |||
20 | var PropertyControl = exports.PropertyControl = Montage.create(Component, { | ||
21 | |||
22 | _labelField: { | ||
23 | enumerable: true, | ||
24 | serializable: true, | ||
25 | value: null | ||
26 | }, | ||
27 | |||
28 | labelField: { | ||
29 | enumerable: true, | ||
30 | serializable: true, | ||
31 | get: function () { | ||
32 | return this._labelField; | ||
33 | }, | ||
34 | set: function (value) { | ||
35 | if (value !== this._labelField) { | ||
36 | this._labelField = value; | ||
37 | this.needsDraw = true; | ||
38 | } | ||
39 | } | ||
40 | }, | ||
41 | |||
42 | _control: { | ||
43 | enumerable: true, | ||
44 | value: null | ||
45 | }, | ||
46 | |||
47 | // set this to the getter of each control type's "value" accessor, | ||
48 | // which could be value, selected, color, checked, etc. | ||
49 | _prop: { | ||
50 | enumerable: true, | ||
51 | value: "" | ||
52 | }, | ||
53 | |||
54 | _controlField: { | ||
55 | enumerable: true, | ||
56 | value: null | ||
57 | }, | ||
58 | |||
59 | controlField: { | ||
60 | enumerable: true, | ||
61 | serializable: true, | ||
62 | get: function () { | ||
63 | return this._controlField; | ||
64 | }, | ||
65 | set: function (value) { | ||
66 | if (value !== this._controlField) { | ||
67 | this._controlField = value; | ||
68 | } | ||
69 | } | ||
70 | }, | ||
71 | |||
72 | _label: { | ||
73 | enumerable: false, | ||
74 | value: "Label:" | ||
75 | }, | ||
76 | |||
77 | label: { | ||
78 | enumerable: true, | ||
79 | serializable: true, | ||
80 | get: function () { | ||
81 | return this._label; | ||
82 | }, | ||
83 | set: function (value) { | ||
84 | if (value !== this._label) { | ||
85 | this._label = value + ":"; | ||
86 | this.needsDraw = true; | ||
87 | } | ||
88 | } | ||
89 | }, | ||
90 | |||
91 | _controlType: { | ||
92 | enumerable: false, | ||
93 | value: null | ||
94 | }, | ||
95 | |||
96 | controlType: { | ||
97 | enumerable: true, | ||
98 | serializable: true, | ||
99 | get: function () { | ||
100 | return this._controlType; | ||
101 | }, | ||
102 | set: function (value) { | ||
103 | if (value !== this._controlType) { | ||
104 | this._controlType = value; | ||
105 | } | ||
106 | } | ||
107 | }, | ||
108 | |||
109 | _data: { | ||
110 | enumerable: false, | ||
111 | value: null | ||
112 | }, | ||
113 | |||
114 | data: { | ||
115 | enumerable: true, | ||
116 | serializable: true, | ||
117 | get: function () { | ||
118 | return this._data; | ||
119 | }, | ||
120 | set: function (data) { | ||
121 | if (data !== this._data) { | ||
122 | this._data = data; | ||
123 | this.label = data.label; | ||
124 | this.controlType = data.controlType; | ||
125 | this.needsDraw = true; | ||
126 | } | ||
127 | } | ||
128 | }, | ||
129 | |||
130 | didDraw :{ | ||
131 | value: function() { | ||
132 | var defaults = this._data.defaults; | ||
133 | for(var n in defaults) | ||
134 | { | ||
135 | this._control[n] = defaults[n]; | ||
136 | } | ||
137 | |||
138 | this._control.needsDraw = true; | ||
139 | } | ||
140 | }, | ||
141 | |||
142 | handleEvent: | ||
143 | { | ||
144 | value:function(event) | ||
145 | { | ||
146 | this._dispatchPropEvent(event); | ||
147 | } | ||
148 | }, | ||
149 | |||
150 | _dispatchPropEvent: { | ||
151 | value: function(event) { | ||
152 | var propEvent = document.createEvent("CustomEvent"); | ||
153 | if(event.type === "changing") | ||
154 | { | ||
155 | propEvent.initEvent("propertyChanging", true, true); | ||
156 | propEvent.type = "propertyChanging"; | ||
157 | } | ||
158 | else | ||
159 | { | ||
160 | propEvent.initEvent("propertyChange", true, true); | ||
161 | propEvent.type = "propertyChange"; | ||
162 | } | ||
163 | propEvent.propertyLabel = this.label; | ||
164 | propEvent.propertyValue = event.currentTarget[this._prop]; | ||
165 | propEvent.propertyEvent = event; | ||
166 | |||
167 | this.dispatchEvent(propEvent); | ||
168 | } | ||
169 | }, | ||
170 | |||
171 | prepareForDraw: { | ||
172 | value: function() { | ||
173 | this._labelField.innerHTML = this._label; | ||
174 | |||
175 | switch(this._controlType) | ||
176 | { | ||
177 | case "HotText": | ||
178 | this._control = HotText.create(); | ||
179 | this._control.addEventListener("change", this, false); | ||
180 | this._control.addEventListener("changing", this, false); | ||
181 | this._prop = "value"; | ||
182 | break; | ||
183 | case "HotTextUnit": | ||
184 | this._control = HotTextUnit.create(); | ||
185 | this._control.addEventListener("change", this, false); | ||
186 | this._control.addEventListener("changing", this, false); | ||
187 | this._prop = "value"; | ||
188 | break; | ||
189 | case "Slider": | ||
190 | this._control = Slider.create(); | ||
191 | this._control.addEventListener("change", this, false); | ||
192 | this._control.addEventListener("changing", this, false); | ||
193 | this._prop = "value"; | ||
194 | break; | ||
195 | case "Button": | ||
196 | this._control = Button.create(); | ||
197 | this._control.addEventListener("action", this, false); | ||
198 | this._prop = "value"; | ||
199 | break; | ||
200 | case "ColorChip": | ||
201 | this._control = ColorChip.create(); | ||
202 | this._control.addEventListener("change", this, false); | ||
203 | this._prop = "color"; | ||
204 | break; | ||
205 | case "TextField": | ||
206 | this._control = TextField.create(); | ||
207 | this._control.addEventListener("change", this, false); | ||
208 | this._prop = "text"; | ||
209 | break; | ||
210 | case "Checkbox": | ||
211 |