| OLD | NEW |
| 1 | 1 |
| 2 <!--- | 2 <!--- |
| 3 | 3 |
| 4 This README is automatically generated from the comments in these files: | 4 This README is automatically generated from the comments in these files: |
| 5 iron-a11y-keys-behavior.html | 5 iron-a11y-keys-behavior.html |
| 6 | 6 |
| 7 Edit those files, and our readme bot will duplicate them over here! | 7 Edit those files, and our readme bot will duplicate them over here! |
| 8 Edit this file, and the bot will squash your changes :) | 8 Edit this file, and the bot will squash your changes :) |
| 9 | 9 |
| 10 The bot does some handling of markdown. Please file a bug if it does the wrong | 10 The bot does some handling of markdown. Please file a bug if it does the wrong |
| 11 thing! https://github.com/PolymerLabs/tedium/issues | 11 thing! https://github.com/PolymerLabs/tedium/issues |
| 12 | 12 |
| 13 --> | 13 --> |
| 14 | 14 |
| 15 [](https://travis-ci.org/PolymerElements/iron-a11y-keys-behavior
) | 15 [](https://travis-ci.org/PolymerElements/iron-a11y-keys-behavior
) |
| 16 | 16 |
| 17 _[Demo and API docs](https://elements.polymer-project.org/elements/iron-a11y-key
s-behavior)_ | 17 _[Demo and API docs](https://elements.polymer-project.org/elements/iron-a11y-key
s-behavior)_ |
| 18 | 18 |
| 19 | 19 |
| 20 ##Polymer.IronA11yKeysBehavior | 20 ##Polymer.IronA11yKeysBehavior |
| 21 | 21 |
| 22 `Polymer.IronA11yKeysBehavior` provides a normalized interface for processing | 22 `Polymer.IronA11yKeysBehavior` provides a normalized interface for processing |
| 23 keyboard commands that pertain to [WAI-ARIA best practices](http://www.w3.org/TR
/wai-aria-practices/#kbd_general_binding). | 23 keyboard commands that pertain to [WAI-ARIA best practices](http://www.w3.org/TR
/wai-aria-practices/#kbd_general_binding). |
| 24 The element takes care of browser differences with respect to Keyboard events | 24 The element takes care of browser differences with respect to Keyboard events |
| 25 and uses an expressive syntax to filter key presses. | 25 and uses an expressive syntax to filter key presses. |
| 26 | 26 |
| 27 Use the `keyBindings` prototype property to express what combination of keys | 27 Use the `keyBindings` prototype property to express what combination of keys |
| 28 will trigger the event to fire. | 28 will trigger the callback. A key binding has the format |
| 29 `"KEY+MODIFIER:EVENT": "callback"` (`"KEY": "callback"` or |
| 30 `"KEY:EVENT": "callback"` are valid as well). Some examples: |
| 29 | 31 |
| 30 Use the `key-event-target` attribute to set up event handlers on a specific | 32 ```javascript |
| 33 keyBindings: { |
| 34 'space': '_onKeydown', // same as 'space:keydown' |
| 35 'shift+tab': '_onKeydown', |
| 36 'enter:keypress': '_onKeypress', |
| 37 'esc:keyup': '_onKeyup' |
| 38 } |
| 39 ``` |
| 40 |
| 41 The callback will receive with an event containing the following information in
`event.detail`: |
| 42 |
| 43 ```javascript |
| 44 _onKeydown: function(event) { |
| 45 console.log(event.detail.combo); // KEY+MODIFIER, e.g. "shift+tab" |
| 46 console.log(event.detail.key); // KEY only, e.g. "tab" |
| 47 console.log(event.detail.event); // EVENT, e.g. "keydown" |
| 48 console.log(event.detail.keyboardEvent); // the original KeyboardEvent |
| 49 } |
| 50 ``` |
| 51 |
| 52 Use the `keyEventTarget` attribute to set up event handlers on a specific |
| 31 node. | 53 node. |
| 32 The `keys-pressed` event will fire when one of the key combinations set with the | 54 |
| 33 `keys` property is pressed. | 55 See the [demo source code](https://github.com/PolymerElements/iron-a11y-keys-beh
avior/blob/master/demo/x-key-aware.html) |
| 56 for an example. |
| 34 | 57 |
| 35 | 58 |
| OLD | NEW |