OLD | NEW |
---|---|
1 // Copyright 2016 The Chromium Authors. All rights reserved. | 1 // Copyright 2016 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 /** | 5 /** |
6 * @fileoverview | 6 * @fileoverview |
7 * 'pin-keyboard' is a keyboard that can be used to enter PINs or more generally | 7 * 'pin-keyboard' is a keyboard that can be used to enter PINs or more generally |
8 * numeric values. | 8 * numeric values. |
9 * | 9 * |
10 * Properties: | 10 * Properties: |
(...skipping 35 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
46 type: Boolean, | 46 type: Boolean, |
47 value: false | 47 value: false |
48 }, | 48 }, |
49 | 49 |
50 /** The value stored in the keyboard's input element. */ | 50 /** The value stored in the keyboard's input element. */ |
51 value: { | 51 value: { |
52 type: String, | 52 type: String, |
53 notify: true, | 53 notify: true, |
54 value: '', | 54 value: '', |
55 observer: 'onPinValueChange_' | 55 observer: 'onPinValueChange_' |
56 }, | |
57 | |
58 /** | |
59 * The intervalID used for the backspace button set/clear interval. | |
60 */ | |
61 intervalId_: { | |
jdufault
2016/09/01 16:40:11
repeatClearIntervalId_?
sammiequon
2016/09/02 17:24:55
Done.
| |
62 type: Number, | |
63 value: 0 | |
64 }, | |
65 | |
66 /** | |
67 * When the backspace button is held down, it repeatly clears the last | |
68 * character of the input value every intervalMs. | |
69 */ | |
70 intervalMs_: { | |
jdufault
2016/09/01 16:40:11
Make this a constant value defined at the top of t
sammiequon
2016/09/02 17:24:55
Done.
| |
71 type: Number, | |
72 value: 250 | |
56 } | 73 } |
57 }, | 74 }, |
58 | 75 |
59 /** | 76 /** |
60 * Gets the container holding the password field. | 77 * Gets the container holding the password field. |
61 * @type {!HTMLInputElement} | 78 * @type {!HTMLInputElement} |
62 */ | 79 */ |
63 get inputElement() { | 80 get inputElement() { |
64 return this.$$('#pin-input'); | 81 return this.$$('#pin-input'); |
65 }, | 82 }, |
(...skipping 24 matching lines...) Expand all Loading... | |
90 * @param {string} value | 107 * @param {string} value |
91 * @param {string} previous | 108 * @param {string} previous |
92 */ | 109 */ |
93 onPinValueChange_: function(value, previous) { | 110 onPinValueChange_: function(value, previous) { |
94 if (value != previous) | 111 if (value != previous) |
95 this.fire('pin-change', { pin: value }); | 112 this.fire('pin-change', { pin: value }); |
96 }, | 113 }, |
97 | 114 |
98 /** | 115 /** |
99 * Called when the user wants to erase the last character of the entered | 116 * Called when the user wants to erase the last character of the entered |
100 * PIN value. | 117 * PIN value. |
101 */ | 118 */ |
102 onPinClear_: function() { | 119 onPinClear_: function() { |
103 this.value = this.value.substring(0, this.value.length - 1); | 120 this.value = this.value.substring(0, this.value.length - 1); |
104 }, | 121 }, |
105 | 122 |
123 /** | |
124 * Called when the user presses the backspace button. Starts a interval | |
125 * callback to repeatedly clear the last pin value until the interval is | |
126 * cleared. | |
127 * @private | |
128 */ | |
129 onBackspaceMouseDown_: function() { | |
130 this.onPinClear_(); | |
131 this.intervalId_ = setInterval(function() { | |
132 this.async(function() { this.onPinClear_(); }, 1); | |
jdufault
2016/09/01 16:40:11
Remove the this.async call if you're still using s
sammiequon
2016/09/02 17:24:55
Done.
| |
133 }.bind(this), this.intervalMs_); | |
134 }, | |
135 | |
136 /** | |
137 * Called when the user unpresses the backspace button. Stops the interval | |
138 * callback. | |
139 * @private | |
140 */ | |
141 onBackspaceMouseUpLeave_: function() { | |
142 clearInterval(this.intervalId_); | |
143 }, | |
144 | |
106 /** Called when a key event is pressed while the input element has focus. */ | 145 /** Called when a key event is pressed while the input element has focus. */ |
107 onInputKeyDown_: function(event) { | 146 onInputKeyDown_: function(event) { |
108 // Up/down pressed, swallow the event to prevent the input value from | 147 // Up/down pressed, swallow the event to prevent the input value from |
109 // being incremented or decremented. | 148 // being incremented or decremented. |
110 if (event.keyCode == 38 || event.keyCode == 40) { | 149 if (event.keyCode == 38 || event.keyCode == 40) { |
111 event.preventDefault(); | 150 event.preventDefault(); |
112 return; | 151 return; |
113 } | 152 } |
114 | 153 |
115 // Enter pressed. | 154 // Enter pressed. |
(...skipping 20 matching lines...) Expand all Loading... | |
136 }, | 175 }, |
137 | 176 |
138 /** | 177 /** |
139 * Called when a key press event is fired while the number button is focused. | 178 * Called when a key press event is fired while the number button is focused. |
140 * Ideally we would want to pass focus back to the input element, but the we | 179 * Ideally we would want to pass focus back to the input element, but the we |
141 * cannot or the virtual keyboard will keep poping up. | 180 * cannot or the virtual keyboard will keep poping up. |
142 * @param {Event} event Keypress Event object. | 181 * @param {Event} event Keypress Event object. |
143 * @private | 182 * @private |
144 */ | 183 */ |
145 onKeyPress_: function(event) { | 184 onKeyPress_: function(event) { |
185 // If the active element is the input element, the input element itself will | |
186 // handle the keypresses, so we do not handle them here. | |
187 if (this.shadowRoot.activeElement == this.inputElement) | |
188 return; | |
189 | |
146 var code = event.keyCode; | 190 var code = event.keyCode; |
147 | 191 |
148 // Enter pressed. | 192 // Enter pressed. |
149 if (code == 13) { | 193 if (code == 13) { |
150 this.firePinSubmitEvent_(); | 194 this.firePinSubmitEvent_(); |
151 event.preventDefault(); | 195 event.preventDefault(); |
152 return; | 196 return; |
153 } | 197 } |
154 | 198 |
155 this.value += String.fromCharCode(code); | 199 this.value += String.fromCharCode(code); |
(...skipping 38 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
194 // possible. Number.isInteger will verify the value is not a NaN and that it | 238 // possible. Number.isInteger will verify the value is not a NaN and that it |
195 // does not contain decimals. | 239 // does not contain decimals. |
196 // This heuristic will fail for inputs like '1.0'. | 240 // This heuristic will fail for inputs like '1.0'. |
197 // | 241 // |
198 // Since we still support users entering their passwords through the PIN | 242 // Since we still support users entering their passwords through the PIN |
199 // keyboard, we swap the input box to rtl when we think it is a password | 243 // keyboard, we swap the input box to rtl when we think it is a password |
200 // (just numbers), if the document direction is rtl. | 244 // (just numbers), if the document direction is rtl. |
201 return (document.dir == 'rtl') && !Number.isInteger(+password); | 245 return (document.dir == 'rtl') && !Number.isInteger(+password); |
202 }, | 246 }, |
203 }); | 247 }); |
OLD | NEW |