diff options
Diffstat (limited to 'node_modules/montage/ui/button.reel/button.js')
-rw-r--r--[-rwxr-xr-x] | node_modules/montage/ui/button.reel/button.js | 655 |
1 files changed, 165 insertions, 490 deletions
diff --git a/node_modules/montage/ui/button.reel/button.js b/node_modules/montage/ui/button.reel/button.js index 60bca109..51f4c011 100755..100644 --- a/node_modules/montage/ui/button.reel/button.js +++ b/node_modules/montage/ui/button.reel/button.js | |||
@@ -3,20 +3,13 @@ | |||
3 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<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. | 4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. |
5 | </copyright> */ | 5 | </copyright> */ |
6 | /** | ||
7 | @module "montage/ui/button.reel" | ||
8 | @requires montage/core/core | ||
9 | @requires montage/ui/component | ||
10 | */ | ||
11 | var Montage = require("montage").Montage, | 6 | var Montage = require("montage").Montage, |
12 | Component = require("ui/component").Component; | 7 | Component = require("ui/component").Component, |
13 | 8 | NativeControl = require("ui/native-control").NativeControl; | |
14 | /** | 9 | /** |
15 | @class module:"montage/ui/button.reel".Button | 10 | * The Text input |
16 | @classdesc Button component implementation. Turns any div element into a multi-state labeled button. | ||
17 | @extends module:montage/ui/component.Component | ||
18 | */ | 11 | */ |
19 | exports.Button = Montage.create(Component,/** @lends module:"montage/ui/button.reel".Button# */ { | 12 | var Button = exports.Button = Montage.create(NativeControl, { |
20 | 13 | ||
21 | /** | 14 | /** |
22 | Description TODO | 15 | Description TODO |
@@ -45,69 +38,11 @@ exports.Button = Montage.create(Component,/** @lends module:"montage/ui/button.r | |||
45 | } | 38 | } |
46 | }, | 39 | }, |
47 | 40 | ||
48 | /** | ||
49 | Description TODO | ||
50 | @private | ||
51 | */ | ||
52 | _busy: { | ||
53 | enumerable: false, | ||
54 | value: false | ||
55 | }, | ||
56 | |||
57 | /** | ||
58 | Description TODO | ||
59 | @type {Function} | ||
60 | @default {Boolean} false | ||
61 | */ | ||
62 | busy: { | ||
63 | get: function () { | ||
64 | return this._busy; | ||
65 | }, | ||
66 | set: function (value) { | ||
67 | if ((value === true) && (!this._disabled)) { | ||
68 | this._busy = true; | ||
69 | } else { | ||
70 | this._busy = false; | ||
71 | } | ||
72 | this.needsDraw = true; | ||
73 | } | ||
74 | }, | ||
75 | |||
76 | /** | ||
77 | Description TODO | ||
78 | @private | ||
79 | */ | ||
80 | _disabled: { | ||
81 | enumerable: false, | ||
82 | value: false | ||
83 | }, | ||
84 | |||
85 | /** | ||
86 | Description TODO | ||
87 | @type {Function} | ||
88 | @default {Boolean} false | ||
89 | */ | ||
90 | disabled: { | ||
91 | get: function () { | ||
92 | return this._disabled; | ||
93 | }, | ||
94 | set: function (value) { | ||
95 | if (value === true) { | ||
96 | this._disabled = true; | ||
97 | this.busy = false; | ||
98 | } else { | ||
99 | this._disabled = false; | ||
100 | } | ||
101 | this.needsDraw = true; | ||
102 | } | ||
103 | }, | ||
104 | |||
105 | //TODO we should prefer positive properties like enabled vs disabled, get rid of disabled | 41 | //TODO we should prefer positive properties like enabled vs disabled, get rid of disabled |
106 | |||
107 | enabled: { | 42 | enabled: { |
108 | dependencies: ["disabled"], | 43 | dependencies: ["disabled"], |
109 | get: function () { | 44 | get: function () { |
110 | return !!this._disabled; | 45 | return !this._disabled; |
111 | }, | 46 | }, |
112 | set: function (value) { | 47 | set: function (value) { |
113 | this.disabled = !value; | 48 | this.disabled = !value; |
@@ -115,56 +50,6 @@ exports.Button = Montage.create(Component,/** @lends module:"montage/ui/button.r | |||
115 | }, | 50 | }, |
116 | 51 | ||
117 | /** | 52 | /** |
118 | * When behavior is toggle, @link http://www.w3.org/TR/wai-aria/states_and_properties#aria-pressed | ||
119 | * the pressed property contains the equivalent of the aria-pressed attribute: "true"||"false"||"mixed" | ||
120 | * @private | ||
121 | */ | ||
122 | _pressed: { | ||
123 | value: "false", | ||
124 | enumerable: false | ||
125 | }, | ||
126 | /** | ||
127 | Description TODO | ||
128 | @type {Function} | ||
129 | @default {Boolean} "false" | ||
130 | */ | ||
131 | pressed: { | ||
132 | get: function() { | ||
133 | return this._pressed; | ||
134 | }, | ||
135 | set: function(value) { | ||
136 | if (value !== this._pressed) { | ||
137 | this._pressed = value; | ||
138 | this.needsDraw = true; | ||
139 | } | ||
140 | } | ||
141 | }, | ||
142 | /** | ||
143 | * Used when a button is associated with an input tag. For buttons, the title comes from it's value attribute. | ||
144 | * If the value property is undefined, it will be initialized from the button's input element if the element is an input type. | ||
145 | * @private | ||
146 | */ | ||
147 | _value: { | ||
148 | enumerable: false, | ||
149 | value: undefined | ||
150 | }, | ||
151 | /** | ||
152 | Description TODO | ||
153 | @type {Function} | ||
154 | @default undefined | ||
155 | */ | ||
156 | value: { | ||
157 | serializable: true, | ||
158 | get: function () { | ||
159 | return this._value; | ||
160 | }, | ||
161 | set: function (value) { | ||
162 | this._value = value; | ||
163 | this.needsDraw = true; | ||
164 | } | ||
165 | }, | ||
166 | |||
167 | /** | ||
168 | The Montage converted used to convert or format values displayed by this Button instance. | 53 | The Montage converted used to convert or format values displayed by this Button instance. |
169 | @type {Property} | 54 | @type {Property} |
170 | @default null | 55 | @default null |
@@ -174,141 +59,63 @@ exports.Button = Montage.create(Component,/** @lends module:"montage/ui/button.r | |||
174 | }, | 59 | }, |
175 | 60 | ||
176 | /** | 61 | /** |
177 | * @private | 62 | Stores the node that contains this button's value. Only used for |
178 | */ | 63 | non-`<input>` elements. |
179 | _title: { | 64 | @private |
180 | enumerable: false, | ||
181 | value: undefined | ||
182 | }, | ||
183 | /** | ||
184 | Description Text to show in the tooltip displayed by hovering over this button | ||
185 | @type {Function} | ||
186 | @default undefined | ||
187 | */ | ||
188 | title: { | ||
189 | serializable: true, | ||
190 | get: function () { | ||
191 | return this._title; | ||
192 | }, | ||
193 | set: function (value) { | ||
194 | this._title = value; | ||
195 | this.needsDraw = true; | ||
196 | } | ||
197 | }, | ||
198 | |||
199 | /** | ||
200 | Description TODO | ||
201 | @private | ||
202 | */ | ||
203 | _valueNode: {value:undefined, enumerable: false}, | ||
204 | |||
205 | /** | ||
206 | Used when a button is associate with an input tag.<br> | ||
207 | For buttons, the title comes from it's value attribute.<br> | ||
208 | valueActive, if set, is used when the button is in active state (mousedown / touchstart). | ||
209 | @type {String} | ||
210 | @default undefined | ||
211 | */ | 65 | */ |
212 | valueActive: { | 66 | _labelNode: {value:undefined, enumerable: false}, |
213 | serializable: true, | ||
214 | value: undefined | ||
215 | }, | ||
216 | |||
217 | /** | ||
218 | Description TODO | ||
219 | @private | ||
220 | */ | ||
221 | _valueNodeActiveNode: {value:undefined, enumerable: false}, | ||
222 | |||
223 | 67 | ||
68 | _label: { value: undefined, enumerable: false }, | ||
224 | /** | 69 | /** |
225 | Used when a button is associate with an input tag.<br> | 70 | The label for the button. |
226 | For buttons, the title comes from its value attribute.<br> | ||
227 | When behavior is toggle, @link http://www.w3.org/TR/wai-aria/states_and_properties#aria-pressed the button has multiple states and may need different titles for that.<br> | ||
228 | So, pressedValue would contain the value to use when pressed is true. | ||