diff options
Diffstat (limited to 'node_modules/montage-user/ui/button.reel')
-rw-r--r-- | node_modules/montage-user/ui/button.reel/button.js | 416 | ||||
-rw-r--r-- | node_modules/montage-user/ui/button.reel/button.json | 16 |
2 files changed, 432 insertions, 0 deletions
diff --git a/node_modules/montage-user/ui/button.reel/button.js b/node_modules/montage-user/ui/button.reel/button.js new file mode 100644 index 00000000..51f4c011 --- /dev/null +++ b/node_modules/montage-user/ui/button.reel/button.js | |||
@@ -0,0 +1,416 @@ | |||
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 | var Montage = require("montage").Montage, | ||
7 | Component = require("ui/component").Component, | ||
8 | NativeControl = require("ui/native-control").NativeControl; | ||
9 | /** | ||
10 | * The Text input | ||
11 | */ | ||
12 | var Button = exports.Button = Montage.create(NativeControl, { | ||
13 | |||
14 | /** | ||
15 | Description TODO | ||
16 | @private | ||
17 | */ | ||
18 | _preventFocus: { | ||
19 | enumerable: false, | ||
20 | value: false | ||
21 | }, | ||
22 | |||
23 | /** | ||
24 | Description TODO | ||
25 | @type {Function} | ||
26 | @default {Boolean} false | ||
27 | */ | ||
28 | preventFocus: { | ||
29 | get: function () { | ||
30 | return this._preventFocus; | ||
31 | }, | ||
32 | set: function (value) { | ||
33 | if (value === true) { | ||
34 | this._preventFocus = true; | ||
35 | } else { | ||
36 | this._preventFocus = false; | ||
37 | } | ||
38 | } | ||
39 | }, | ||
40 | |||
41 | //TODO we should prefer positive properties like enabled vs disabled, get rid of disabled | ||
42 | enabled: { | ||
43 | dependencies: ["disabled"], | ||
44 | get: function () { | ||
45 | return !this._disabled; | ||
46 | }, | ||
47 | set: function (value) { | ||
48 | this.disabled = !value; | ||
49 | } | ||
50 | }, | ||
51 | |||
52 | /** | ||
53 | The Montage converted used to convert or format values displayed by this Button instance. | ||
54 | @type {Property} | ||
55 | @default null | ||
56 | */ | ||
57 | converter: { | ||
58 | value: null | ||
59 | }, | ||
60 | |||
61 | /** | ||
62 | Stores the node that contains this button's value. Only used for | ||
63 | non-`<input>` elements. | ||
64 | @private | ||
65 | */ | ||
66 | _labelNode: {value:undefined, enumerable: false}, | ||
67 | |||
68 | _label: { value: undefined, enumerable: false }, | ||
69 | /** | ||
70 | The label for the button. | ||
71 | |||
72 | In an `<input>` element this is the value property. On any other element | ||
73 | (including `<button>`) this is the first child node which is a text node. | ||
74 | If one isn't found it will be created. | ||
75 | |||
76 | @type {Property} | ||
77 | @default {String} element value | ||
78 | */ | ||
79 | label: { | ||
80 | get: function() { | ||
81 | return this._label; | ||
82 | }, | ||
83 | set: function(value) { | ||
84 | if (value && value.length > 0 && this.converter) { | ||
85 | try { | ||
86 | value = this.converter.convert(value); | ||
87 | if (this.error) { | ||
88 | this.error = null; | ||
89 | } | ||
90 | } catch(e) { | ||
91 | // unable to convert - maybe error | ||
92 | this.error = e; | ||
93 | } | ||
94 | } | ||
95 | |||
96 | this._label = value; | ||
97 | if (this._isInputElement) { | ||
98 | this._value = value; | ||
99 | } | ||
100 | |||
101 | this.needsDraw = true; | ||
102 | } | ||
103 | }, | ||
104 | |||
105 | /** | ||
106 | True when the button is being interacted with, either through mouse click or | ||
107 | touch event. | ||
108 | @private | ||
109 | */ | ||
110 | _active: { | ||
111 | enumerable: false, | ||
112 | value: false | ||
113 | }, | ||
114 | |||
115 | /** | ||
116 | Description TODO | ||
117 | @type {Function} | ||
118 | @default {Boolean} false | ||
119 | */ | ||
120 | active: { | ||
121 | get: function() { | ||
122 | return this._active; | ||
123 | }, | ||
124 | set: function(value) { | ||
125 | this._active = value; | ||
126 | this.needsDraw = true; | ||
127 | } | ||
128 | }, | ||
129 | |||
130 | // Low-level event listeners | ||
131 | |||
132 | /** | ||
133 | Description TODO | ||
134 | @function | ||
135 | @param {Event} event The handleMousedown event | ||
136 | */ | ||
137 | handleMousedown: { | ||
138 | value: function(event) { | ||
139 | if (this._observedPointer !== null) { | ||
140 | return; | ||
141 | } | ||
142 | if (!this._disabled) { | ||
143 | this._startInteraction("mouse"); | ||
144 | } | ||
145 | |||
146 | event.preventDefault(); | ||
147 | |||
148 | if (!this._preventFocus) { | ||
149 | this._element.focus(); | ||
150 | } | ||
151 | } | ||
152 | }, | ||
153 | /** | ||
154 | Description TODO | ||
155 | @function | ||
156 | @param {Event} event The handleMouseup event | ||
157 | */ | ||
158 | handleMouseup: { | ||
159 | value: function(event) { | ||
160 | this._interpretInteraction(event); | ||
161 | } | ||
162 | }, | ||
163 | |||
164 | /** | ||
165 | Description TODO | ||
166 | @function | ||
167 | @param {Event} event The handleTouchstart event | ||
168 | */ | ||
169 | handleTouchstart: { | ||
170 | value: function(event) { | ||
171 | if (this._observedPointer !== null) { | ||
172 | return; | ||
173 | } | ||
174 | if (!this._disabled) { | ||
175 | this._startInteraction(event.changedTouches[0].identifier); | ||
176 | } | ||
177 | |||
178 | // NOTE preventingDefault disables the magnifying class | ||
179 | // sadly it also disables double tapping on the button to zoom... | ||
180 | event.preventDefault(); | ||
181 | |||
182 | if (!this._preventFocus) { | ||
183 | this._element.focus(); | ||
184 | } | ||
185 | } | ||
186 | }, | ||
187 | /** | ||
188 | Description TODO | ||
189 | @function | ||
190 | @param {Event} event The handleTouchend event | ||
191 | */ | ||
192 | handleTouchend: { | ||
193 | value: function(event) { | ||
194 | var i = 0, changedTouchCount = event.changedTouches.length; | ||
195 | |||
196 | for (; i < changedTouchCount; i++) { | ||
197 | if (event.changedTouches[i].identifier === this._observedPointer) { | ||
198 | this._interpretInteraction(event); | ||
199 | return; | ||
200 | } | ||
201 | } | ||
202 | |||
203 | } | ||
204 | }, | ||
205 | /** | ||
206 | Description TODO | ||
207 | @function | ||
208 | @param {Event} event The handleTouchcancel event | ||
209 | */ | ||
210 | handleTouchcancel: { | ||
211 | value: function(event) { | ||
212 | var i = 0, changedTouchCount = event.changedTouches.length; | ||
213 | |||
214 | for (; i < changedTouchCount; i++) { | ||
215 | if (event.changedTouches[i].identifier === this._observedPointer) { | ||
216 | this._endInteraction(); | ||
217 | return; | ||
218 | } | ||
219 | } | ||
220 | |||
221 | } | ||
222 | }, | ||
223 | |||
224 | /** | ||
225 | If we have to surrender the pointer we are no longer active. This wi |