OLD | NEW |
1 // Copyright (c) 2011 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2011 The Chromium Authors. All rights reserved. |
2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
4 | 4 |
5 cr.define('cr.ui', function() { | 5 cr.define('cr.ui', function() { |
6 /** | 6 /** |
7 * Creates a new button element. The repeating button behaves like a | 7 * Creates a new button element. The repeating button behaves like a |
8 * keyboard button, which auto-repeats if held. This button is designed | 8 * keyboard button, which auto-repeats if held. This button is designed |
9 * for use with controls such as brightness and volume adjustment buttons. | 9 * for use with controls such as brightness and volume adjustment buttons. |
10 * @constructor | 10 * @constructor |
11 * @extends {HTMLButtonElement} | 11 * @extends {HTMLButtonElement} |
12 */ | 12 */ |
13 var RepeatingButton = cr.ui.define('button'); | 13 var RepeatingButton = cr.ui.define('button'); |
14 | 14 |
15 /** | 15 /** |
16 * DOM Events that may be fired by the Repeating button. | 16 * DOM Events that may be fired by the Repeating button. |
17 */ | 17 */ |
18 RepeatingButton.Event = { | 18 RepeatingButton.Event = {BUTTON_HELD: 'buttonHeld'}; |
19 BUTTON_HELD: 'buttonHeld' | |
20 }; | |
21 | 19 |
22 RepeatingButton.prototype = { | 20 RepeatingButton.prototype = { |
23 __proto__: HTMLButtonElement.prototype, | 21 __proto__: HTMLButtonElement.prototype, |
24 | 22 |
25 /** | 23 /** |
26 * Delay in milliseconds before the first repeat trigger of the button | 24 * Delay in milliseconds before the first repeat trigger of the button |
27 * held action. | 25 * held action. |
28 * @type {number} | 26 * @type {number} |
29 * @private | 27 * @private |
30 */ | 28 */ |
(...skipping 66 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
97 // initial delay and repeat interval. | 95 // initial delay and repeat interval. |
98 this.buttonHeld_(); | 96 this.buttonHeld_(); |
99 var self = this; | 97 var self = this; |
100 var armRepeaterCallback = function() { | 98 var armRepeaterCallback = function() { |
101 // In the event of a click/tap operation, this button has already been | 99 // In the event of a click/tap operation, this button has already been |
102 // released by the time this timeout triggers. Test to ensure that the | 100 // released by the time this timeout triggers. Test to ensure that the |
103 // button is still being held (i.e. clearTimeout has not been called). | 101 // button is still being held (i.e. clearTimeout has not been called). |
104 if (typeof self.armRepeaterCallbackId_ != 'undefined') { | 102 if (typeof self.armRepeaterCallbackId_ != 'undefined') { |
105 self.armRepeaterCallbackId_ = undefined; | 103 self.armRepeaterCallbackId_ = undefined; |
106 self.buttonHeld_(); | 104 self.buttonHeld_(); |
107 self.intervalCallbackId_ = setInterval(self.buttonHeld_.bind(self), | 105 self.intervalCallbackId_ = setInterval( |
108 self.holdRepeatIntervalTime_); | 106 self.buttonHeld_.bind(self), self.holdRepeatIntervalTime_); |
109 } | 107 } |
110 }; | 108 }; |
111 this.armRepeaterCallbackId_ = setTimeout(armRepeaterCallback, | 109 this.armRepeaterCallbackId_ = |
112 this.holdDelayTime_); | 110 setTimeout(armRepeaterCallback, this.holdDelayTime_); |
113 }, | 111 }, |
114 | 112 |
115 /** | 113 /** |
116 * Called when the user releases this button. | 114 * Called when the user releases this button. |
117 * @param {!Event} e The triggered event. | 115 * @param {!Event} e The triggered event. |
118 * @private | 116 * @private |
119 */ | 117 */ |
120 buttonUp_: function(e) { | 118 buttonUp_: function(e) { this.clearTimeout_(); }, |
121 this.clearTimeout_(); | |
122 }, | |
123 | 119 |
124 /** | 120 /** |
125 * Resets the interval callback. | 121 * Resets the interval callback. |
126 * @private | 122 * @private |
127 */ | 123 */ |
128 clearTimeout_: function() { | 124 clearTimeout_: function() { |
129 if (typeof this.armRepeaterCallbackId_ != 'undefined') { | 125 if (typeof this.armRepeaterCallbackId_ != 'undefined') { |
130 clearTimeout(this.armRepeaterCallbackId_); | 126 clearTimeout(this.armRepeaterCallbackId_); |
131 this.armRepeaterCallbackId_ = undefined; | 127 this.armRepeaterCallbackId_ = undefined; |
132 } | 128 } |
133 if (typeof this.intervalCallbackId_ != 'undefined') { | 129 if (typeof this.intervalCallbackId_ != 'undefined') { |
134 clearInterval(this.intervalCallbackId_); | 130 clearInterval(this.intervalCallbackId_); |
135 this.intervalCallbackId_ = undefined; | 131 this.intervalCallbackId_ = undefined; |
136 } | 132 } |
137 }, | 133 }, |
138 | 134 |
139 /** | 135 /** |
140 * Dispatches the action associated with keeping this button pressed. | 136 * Dispatches the action associated with keeping this button pressed. |
141 * @private | 137 * @private |
142 */ | 138 */ |
143 buttonHeld_: function() { | 139 buttonHeld_: function() { |
144 cr.dispatchSimpleEvent(this, RepeatingButton.Event.BUTTON_HELD); | 140 cr.dispatchSimpleEvent(this, RepeatingButton.Event.BUTTON_HELD); |
145 }, | 141 }, |
146 | 142 |
147 /** | 143 /** |
148 * Getter for the initial delay before repeating. | 144 * Getter for the initial delay before repeating. |
149 * @type {number} The delay in milliseconds. | 145 * @type {number} The delay in milliseconds. |
150 */ | 146 */ |
151 get repeatDelay() { | 147 get repeatDelay() { return this.holdDelayTime_; }, |
152 return this.holdDelayTime_; | |
153 }, | |
154 | 148 |
155 /** | 149 /** |
156 * Setter for the initial delay before repeating. | 150 * Setter for the initial delay before repeating. |
157 * @type {number} The delay in milliseconds. | 151 * @type {number} The delay in milliseconds. |
158 */ | 152 */ |
159 set repeatDelay(delay) { | 153 set repeatDelay(delay) { this.holdDelayTime_ = delay; }, |
160 this.holdDelayTime_ = delay; | |
161 }, | |
162 | 154 |
163 /** | 155 /** |
164 * Getter for the repeat interval. | 156 * Getter for the repeat interval. |
165 * @type {number} The repeat interval in milliseconds. | 157 * @type {number} The repeat interval in milliseconds. |
166 */ | 158 */ |
167 get repeatInterval() { | 159 get repeatInterval() { return this.holdRepeatIntervalTime_; }, |
168 return this.holdRepeatIntervalTime_; | |
169 }, | |
170 | 160 |
171 /** | 161 /** |
172 * Setter for the repeat interval. | 162 * Setter for the repeat interval. |
173 * @type {number} The interval in milliseconds. | 163 * @type {number} The interval in milliseconds. |
174 */ | 164 */ |
175 set repeatInterval(delay) { | 165 set repeatInterval(delay) { this.holdRepeatIntervalTime_ = delay; } |
176 this.holdRepeatIntervalTime_ = delay; | |
177 } | |
178 }; | 166 }; |
179 | 167 |
180 return { | 168 return {RepeatingButton: RepeatingButton}; |
181 RepeatingButton: RepeatingButton | |
182 }; | |
183 }); | 169 }); |
184 | |
OLD | NEW |