| OLD | NEW |
| 1 <!-- | 1 <!-- |
| 2 @license | 2 @license |
| 3 Copyright (c) 2015 The Polymer Project Authors. All rights reserved. | 3 Copyright (c) 2015 The Polymer Project Authors. All rights reserved. |
| 4 This code may only be used under the BSD style license found at http://polymer.g
ithub.io/LICENSE.txt | 4 This code may only be used under the BSD style license found at http://polymer.g
ithub.io/LICENSE.txt |
| 5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt | 5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt |
| 6 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt | 6 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt |
| 7 Code distributed by Google as part of the polymer project is also | 7 Code distributed by Google as part of the polymer project is also |
| 8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN
TS.txt | 8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN
TS.txt |
| 9 --> | 9 --> |
| 10 | 10 |
| (...skipping 163 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 174 * keyEvent.key = @ | 174 * keyEvent.key = @ |
| 175 * To get 2 returned, set noSpecialChars = true | 175 * To get 2 returned, set noSpecialChars = true |
| 176 * To get @ returned, set noSpecialChars = false | 176 * To get @ returned, set noSpecialChars = false |
| 177 */ | 177 */ |
| 178 function normalizedKeyForEvent(keyEvent, noSpecialChars) { | 178 function normalizedKeyForEvent(keyEvent, noSpecialChars) { |
| 179 // Fall back from .key, to .keyIdentifier, to .keyCode, and then to | 179 // Fall back from .key, to .keyIdentifier, to .keyCode, and then to |
| 180 // .detail.key to support artificial keyboard events. | 180 // .detail.key to support artificial keyboard events. |
| 181 return transformKey(keyEvent.key, noSpecialChars) || | 181 return transformKey(keyEvent.key, noSpecialChars) || |
| 182 transformKeyIdentifier(keyEvent.keyIdentifier) || | 182 transformKeyIdentifier(keyEvent.keyIdentifier) || |
| 183 transformKeyCode(keyEvent.keyCode) || | 183 transformKeyCode(keyEvent.keyCode) || |
| 184 transformKey(keyEvent.detail.key, noSpecialChars) || ''; | 184 transformKey(keyEvent.detail ? keyEvent.detail.key : keyEvent.detail, no
SpecialChars) || ''; |
| 185 } | 185 } |
| 186 | 186 |
| 187 function keyComboMatchesEvent(keyCombo, event) { | 187 function keyComboMatchesEvent(keyCombo, event) { |
| 188 // For combos with modifiers we support only alpha-numeric keys | 188 // For combos with modifiers we support only alpha-numeric keys |
| 189 var keyEvent = normalizedKeyForEvent(event, keyCombo.hasModifiers); | 189 var keyEvent = normalizedKeyForEvent(event, keyCombo.hasModifiers); |
| 190 return keyEvent === keyCombo.key && | 190 return keyEvent === keyCombo.key && |
| 191 (!keyCombo.hasModifiers || ( | 191 (!keyCombo.hasModifiers || ( |
| 192 !!event.shiftKey === !!keyCombo.shiftKey && | 192 !!event.shiftKey === !!keyCombo.shiftKey && |
| 193 !!event.ctrlKey === !!keyCombo.ctrlKey && | 193 !!event.ctrlKey === !!keyCombo.ctrlKey && |
| 194 !!event.altKey === !!keyCombo.altKey && | 194 !!event.altKey === !!keyCombo.altKey && |
| (...skipping 34 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 229 }); | 229 }); |
| 230 } | 230 } |
| 231 | 231 |
| 232 /** | 232 /** |
| 233 * `Polymer.IronA11yKeysBehavior` provides a normalized interface for proces
sing | 233 * `Polymer.IronA11yKeysBehavior` provides a normalized interface for proces
sing |
| 234 * keyboard commands that pertain to [WAI-ARIA best practices](http://www.w3
.org/TR/wai-aria-practices/#kbd_general_binding). | 234 * keyboard commands that pertain to [WAI-ARIA best practices](http://www.w3
.org/TR/wai-aria-practices/#kbd_general_binding). |
| 235 * The element takes care of browser differences with respect to Keyboard ev
ents | 235 * The element takes care of browser differences with respect to Keyboard ev
ents |
| 236 * and uses an expressive syntax to filter key presses. | 236 * and uses an expressive syntax to filter key presses. |
| 237 * | 237 * |
| 238 * Use the `keyBindings` prototype property to express what combination of k
eys | 238 * Use the `keyBindings` prototype property to express what combination of k
eys |
| 239 * will trigger the event to fire. | 239 * will trigger the callback. A key binding has the format |
| 240 * `"KEY+MODIFIER:EVENT": "callback"` (`"KEY": "callback"` or |
| 241 * `"KEY:EVENT": "callback"` are valid as well). Some examples: |
| 240 * | 242 * |
| 241 * Use the `key-event-target` attribute to set up event handlers on a specif
ic | 243 * keyBindings: { |
| 244 * 'space': '_onKeydown', // same as 'space:keydown' |
| 245 * 'shift+tab': '_onKeydown', |
| 246 * 'enter:keypress': '_onKeypress', |
| 247 * 'esc:keyup': '_onKeyup' |
| 248 * } |
| 249 * |
| 250 * The callback will receive with an event containing the following informat
ion in `event.detail`: |
| 251 * |
| 252 * _onKeydown: function(event) { |
| 253 * console.log(event.detail.combo); // KEY+MODIFIER, e.g. "shift+tab" |
| 254 * console.log(event.detail.key); // KEY only, e.g. "tab" |
| 255 * console.log(event.detail.event); // EVENT, e.g. "keydown" |
| 256 * console.log(event.detail.keyboardEvent); // the original KeyboardE
vent |
| 257 * } |
| 258 * |
| 259 * Use the `keyEventTarget` attribute to set up event handlers on a specific |
| 242 * node. | 260 * node. |
| 243 * The `keys-pressed` event will fire when one of the key combinations set w
ith the | 261 * |
| 244 * `keys` property is pressed. | 262 * See the [demo source code](https://github.com/PolymerElements/iron-a11y-k
eys-behavior/blob/master/demo/x-key-aware.html) |
| 263 * for an example. |
| 245 * | 264 * |
| 246 * @demo demo/index.html | 265 * @demo demo/index.html |
| 247 * @polymerBehavior | 266 * @polymerBehavior |
| 248 */ | 267 */ |
| 249 Polymer.IronA11yKeysBehavior = { | 268 Polymer.IronA11yKeysBehavior = { |
| 250 properties: { | 269 properties: { |
| 251 /** | 270 /** |
| 252 * The HTMLElement that will be firing relevant KeyboardEvents. | 271 * The EventTarget that will be firing relevant KeyboardEvents. Set it t
o |
| 272 * `null` to disable the listeners. |
| 273 * @type {?EventTarget} |
| 253 */ | 274 */ |
| 254 keyEventTarget: { | 275 keyEventTarget: { |
| 255 type: Object, | 276 type: Object, |
| 256 value: function() { | 277 value: function() { |
| 257 return this; | 278 return this; |
| 258 } | 279 } |
| 259 }, | 280 }, |
| 260 | 281 |
| 261 /** | 282 /** |
| 262 * If true, this property will cause the implementing element to | 283 * If true, this property will cause the implementing element to |
| (...skipping 18 matching lines...) Expand all Loading... |
| 281 value: function() { | 302 value: function() { |
| 282 return {}; | 303 return {}; |
| 283 } | 304 } |
| 284 } | 305 } |
| 285 }, | 306 }, |
| 286 | 307 |
| 287 observers: [ | 308 observers: [ |
| 288 '_resetKeyEventListeners(keyEventTarget, _boundKeyHandlers)' | 309 '_resetKeyEventListeners(keyEventTarget, _boundKeyHandlers)' |
| 289 ], | 310 ], |
| 290 | 311 |
| 312 |
| 313 /** |
| 314 * To be used to express what combination of keys will trigger the relati
ve |
| 315 * callback. e.g. `keyBindings: { 'esc': '_onEscPressed'}` |
| 316 * @type {Object} |
| 317 */ |
| 291 keyBindings: {}, | 318 keyBindings: {}, |
| 292 | 319 |
| 293 registered: function() { | 320 registered: function() { |
| 294 this._prepKeyBindings(); | 321 this._prepKeyBindings(); |
| 295 }, | 322 }, |
| 296 | 323 |
| 297 attached: function() { | 324 attached: function() { |
| 298 this._listenKeyEventListeners(); | 325 this._listenKeyEventListeners(); |
| 299 }, | 326 }, |
| 300 | 327 |
| (...skipping 87 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 388 | 415 |
| 389 _resetKeyEventListeners: function() { | 416 _resetKeyEventListeners: function() { |
| 390 this._unlistenKeyEventListeners(); | 417 this._unlistenKeyEventListeners(); |
| 391 | 418 |
| 392 if (this.isAttached) { | 419 if (this.isAttached) { |
| 393 this._listenKeyEventListeners(); | 420 this._listenKeyEventListeners(); |
| 394 } | 421 } |
| 395 }, | 422 }, |
| 396 | 423 |
| 397 _listenKeyEventListeners: function() { | 424 _listenKeyEventListeners: function() { |
| 425 if (!this.keyEventTarget) { |
| 426 return; |
| 427 } |
| 398 Object.keys(this._keyBindings).forEach(function(eventName) { | 428 Object.keys(this._keyBindings).forEach(function(eventName) { |
| 399 var keyBindings = this._keyBindings[eventName]; | 429 var keyBindings = this._keyBindings[eventName]; |
| 400 var boundKeyHandler = this._onKeyBindingEvent.bind(this, keyBindings); | 430 var boundKeyHandler = this._onKeyBindingEvent.bind(this, keyBindings); |
| 401 | 431 |
| 402 this._boundKeyHandlers.push([this.keyEventTarget, eventName, boundKeyH
andler]); | 432 this._boundKeyHandlers.push([this.keyEventTarget, eventName, boundKeyH
andler]); |
| 403 | 433 |
| 404 this.keyEventTarget.addEventListener(eventName, boundKeyHandler); | 434 this.keyEventTarget.addEventListener(eventName, boundKeyHandler); |
| 405 }, this); | 435 }, this); |
| 406 }, | 436 }, |
| 407 | 437 |
| (...skipping 45 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 453 cancelable: true | 483 cancelable: true |
| 454 }); | 484 }); |
| 455 this[handlerName].call(this, event); | 485 this[handlerName].call(this, event); |
| 456 if (event.defaultPrevented) { | 486 if (event.defaultPrevented) { |
| 457 keyboardEvent.preventDefault(); | 487 keyboardEvent.preventDefault(); |
| 458 } | 488 } |
| 459 } | 489 } |
| 460 }; | 490 }; |
| 461 })(); | 491 })(); |
| 462 </script> | 492 </script> |
| OLD | NEW |