Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(89)

Side by Side Diff: chrome/browser/resources/chromeos/quick_unlock/pin_keyboard.js

Issue 2302483003: Pin keyboard improvements. (Closed)
Patch Set: Fixed patch set 1 errors. Created 4 years, 3 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
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
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
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
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
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 });
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698