OLD | NEW |
1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2012 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 selection controller that is to be used with lists. This is | 7 * Creates a selection controller that is to be used with lists. This is |
8 * implemented for vertical lists but changing the behavior for horizontal | 8 * implemented for vertical lists but changing the behavior for horizontal |
9 * lists or icon views is a matter of overriding {@code getIndexBefore}, | 9 * lists or icon views is a matter of overriding {@code getIndexBefore}, |
10 * {@code getIndexAfter}, {@code getIndexAbove} as well as | 10 * {@code getIndexAfter}, {@code getIndexAbove} as well as |
(...skipping 159 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
170 } | 170 } |
171 | 171 |
172 sm.endChange(); | 172 sm.endChange(); |
173 }, | 173 }, |
174 | 174 |
175 /** | 175 /** |
176 * Called by the view when it receives a keydown event. | 176 * Called by the view when it receives a keydown event. |
177 * @param {Event} e The keydown event. | 177 * @param {Event} e The keydown event. |
178 */ | 178 */ |
179 handleKeyDown: function(e) { | 179 handleKeyDown: function(e) { |
180 var SPACE_KEY_CODE = 32; | |
181 var tagName = e.target.tagName; | 180 var tagName = e.target.tagName; |
182 // If focus is in an input field of some kind, only handle navigation keys | 181 // If focus is in an input field of some kind, only handle navigation keys |
183 // that aren't likely to conflict with input interaction (e.g., text | 182 // that aren't likely to conflict with input interaction (e.g., text |
184 // editing, or changing the value of a checkbox or select). | 183 // editing, or changing the value of a checkbox or select). |
185 if (tagName == 'INPUT') { | 184 if (tagName == 'INPUT') { |
186 var inputType = e.target.type; | 185 var inputType = e.target.type; |
187 // Just protect space (for toggling) for checkbox and radio. | 186 // Just protect space (for toggling) for checkbox and radio. |
188 if (inputType == 'checkbox' || inputType == 'radio') { | 187 if (inputType == 'checkbox' || inputType == 'radio') { |
189 if (e.keyCode == SPACE_KEY_CODE) | 188 if (e.key == ' ') |
190 return; | 189 return; |
191 // Protect all but the most basic navigation commands in anything else. | 190 // Protect all but the most basic navigation commands in anything else. |
192 } else if (e.keyIdentifier != 'Up' && e.keyIdentifier != 'Down') { | 191 } else if (e.key != 'ArrowUp' && e.key != 'ArrowDown') { |
193 return; | 192 return; |
194 } | 193 } |
195 } | 194 } |
196 // Similarly, don't interfere with select element handling. | 195 // Similarly, don't interfere with select element handling. |
197 if (tagName == 'SELECT') | 196 if (tagName == 'SELECT') |
198 return; | 197 return; |
199 | 198 |
200 var sm = this.selectionModel; | 199 var sm = this.selectionModel; |
201 var newIndex = -1; | 200 var newIndex = -1; |
202 var leadIndex = sm.leadIndex; | 201 var leadIndex = sm.leadIndex; |
203 var prevent = true; | 202 var prevent = true; |
204 | 203 |
205 // Ctrl/Meta+A | 204 // Ctrl/Meta+A |
206 if (sm.multiple && e.keyCode == 65 && | 205 if (sm.multiple && e.keyCode == 65 && |
207 (cr.isMac && e.metaKey || !cr.isMac && e.ctrlKey)) { | 206 (cr.isMac && e.metaKey || !cr.isMac && e.ctrlKey)) { |
208 sm.selectAll(); | 207 sm.selectAll(); |
209 e.preventDefault(); | 208 e.preventDefault(); |
210 return; | 209 return; |
211 } | 210 } |
212 | 211 |
213 // Space | 212 if (e.key == ' ') { |
214 if (e.keyCode == SPACE_KEY_CODE) { | |
215 if (leadIndex != -1) { | 213 if (leadIndex != -1) { |
216 var selected = sm.getIndexSelected(leadIndex); | 214 var selected = sm.getIndexSelected(leadIndex); |
217 if (e.ctrlKey || !selected) { | 215 if (e.ctrlKey || !selected) { |
218 sm.setIndexSelected(leadIndex, !selected || !sm.multiple); | 216 sm.setIndexSelected(leadIndex, !selected || !sm.multiple); |
219 return; | 217 return; |
220 } | 218 } |
221 } | 219 } |
222 } | 220 } |
223 | 221 |
224 switch (e.keyIdentifier) { | 222 switch (e.key) { |
225 case 'Home': | 223 case 'Home': |
226 newIndex = this.getFirstIndex(); | 224 newIndex = this.getFirstIndex(); |
227 break; | 225 break; |
228 case 'End': | 226 case 'End': |
229 newIndex = this.getLastIndex(); | 227 newIndex = this.getLastIndex(); |
230 break; | 228 break; |
231 case 'Up': | 229 case 'ArrowUp': |
232 newIndex = leadIndex == -1 ? | 230 newIndex = leadIndex == -1 ? |
233 this.getLastIndex() : this.getIndexAbove(leadIndex); | 231 this.getLastIndex() : this.getIndexAbove(leadIndex); |
234 break; | 232 break; |
235 case 'Down': | 233 case 'ArrowDown': |
236 newIndex = leadIndex == -1 ? | 234 newIndex = leadIndex == -1 ? |
237 this.getFirstIndex() : this.getIndexBelow(leadIndex); | 235 this.getFirstIndex() : this.getIndexBelow(leadIndex); |
238 break; | 236 break; |
239 case 'Left': | 237 case 'ArrowLeft': |
240 case 'MediaPreviousTrack': | 238 case 'MediaPreviousTrack': |
241 newIndex = leadIndex == -1 ? | 239 newIndex = leadIndex == -1 ? |
242 this.getLastIndex() : this.getIndexBefore(leadIndex); | 240 this.getLastIndex() : this.getIndexBefore(leadIndex); |
243 break; | 241 break; |
244 case 'Right': | 242 case 'ArrowRight': |
245 case 'MediaNextTrack': | 243 case 'MediaNextTrack': |
246 newIndex = leadIndex == -1 ? | 244 newIndex = leadIndex == -1 ? |
247 this.getFirstIndex() : this.getIndexAfter(leadIndex); | 245 this.getFirstIndex() : this.getIndexAfter(leadIndex); |
248 break; | 246 break; |
249 default: | 247 default: |
250 prevent = false; | 248 prevent = false; |
251 } | 249 } |
252 | 250 |
253 if (newIndex != -1) { | 251 if (newIndex != -1) { |
254 sm.beginChange(); | 252 sm.beginChange(); |
(...skipping 24 matching lines...) Expand all Loading... |
279 if (prevent) | 277 if (prevent) |
280 e.preventDefault(); | 278 e.preventDefault(); |
281 } | 279 } |
282 } | 280 } |
283 }; | 281 }; |
284 | 282 |
285 return { | 283 return { |
286 ListSelectionController: ListSelectionController | 284 ListSelectionController: ListSelectionController |
287 }; | 285 }; |
288 }); | 286 }); |
OLD | NEW |