| OLD | NEW |
| 1 /** | 1 /** |
| 2 * `Polymer.IronMenuBehavior` implements accessible menu behavior. | 2 * `Polymer.IronMenuBehavior` implements accessible menu behavior. |
| 3 * | 3 * |
| 4 * @demo demo/index.html | 4 * @demo demo/index.html |
| 5 * @polymerBehavior Polymer.IronMenuBehavior | 5 * @polymerBehavior Polymer.IronMenuBehavior |
| 6 */ | 6 */ |
| 7 Polymer.IronMenuBehaviorImpl = { | 7 Polymer.IronMenuBehaviorImpl = { |
| 8 | 8 |
| 9 properties: { | 9 properties: { |
| 10 | 10 |
| (...skipping 205 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 216 * Handler that is called when the menu receives focus. | 216 * Handler that is called when the menu receives focus. |
| 217 * | 217 * |
| 218 * @param {FocusEvent} event A focus event. | 218 * @param {FocusEvent} event A focus event. |
| 219 */ | 219 */ |
| 220 _onFocus: function(event) { | 220 _onFocus: function(event) { |
| 221 if (Polymer.IronMenuBehaviorImpl._shiftTabPressed) { | 221 if (Polymer.IronMenuBehaviorImpl._shiftTabPressed) { |
| 222 // do not focus the menu itself | 222 // do not focus the menu itself |
| 223 return; | 223 return; |
| 224 } | 224 } |
| 225 | 225 |
| 226 // Do not focus the selected tab if the deepest target is part of the |
| 227 // menu element's local DOM and is focusable. |
| 228 var rootTarget = /** @type {?HTMLElement} */( |
| 229 Polymer.dom(event).rootTarget); |
| 230 if (rootTarget !== this && typeof rootTarget.tabIndex !== "undefined" && !
this.isLightDescendant(rootTarget)) { |
| 231 return; |
| 232 } |
| 233 |
| 226 this.blur(); | 234 this.blur(); |
| 227 | 235 |
| 228 // clear the cached focus item | 236 // clear the cached focus item |
| 229 this._defaultFocusAsync = this.async(function() { | 237 this._defaultFocusAsync = this.async(function() { |
| 230 // focus the selected item when the menu receives focus, or the first it
em | 238 // focus the selected item when the menu receives focus, or the first it
em |
| 231 // if no item is selected | 239 // if no item is selected |
| 232 var selectedItem = this.multi ? (this.selectedItems && this.selectedItem
s[0]) : this.selectedItem; | 240 var selectedItem = this.multi ? (this.selectedItems && this.selectedItem
s[0]) : this.selectedItem; |
| 233 | 241 |
| 234 this._setFocusedItem(null); | 242 this._setFocusedItem(null); |
| 235 | 243 |
| 236 if (selectedItem) { | 244 if (selectedItem) { |
| 237 this._setFocusedItem(selectedItem); | 245 this._setFocusedItem(selectedItem); |
| 238 } else { | 246 } else { |
| 239 this._setFocusedItem(this.items[0]); | 247 this._setFocusedItem(this.items[0]); |
| 240 } | 248 } |
| 241 // async 1ms to wait for `select` to get called from `_itemActivate` | 249 // async 1ms to wait for `select` to get called from `_itemActivate` |
| 242 }, 1); | 250 }, 1); |
| 243 }, | 251 }, |
| 244 | 252 |
| 245 /** | 253 /** |
| 246 * Handler that is called when the up key is pressed. | 254 * Handler that is called when the up key is pressed. |
| 247 * | 255 * |
| 248 * @param {CustomEvent} event A key combination event. | 256 * @param {CustomEvent} event A key combination event. |
| 249 */ | 257 */ |
| 250 _onUpKey: function(event) { | 258 _onUpKey: function(event) { |
| 251 // up and down arrows moves the focus | 259 // up and down arrows moves the focus |
| 252 this._focusPrevious(); | 260 this._focusPrevious(); |
| 261 event.detail.keyboardEvent.preventDefault(); |
| 253 }, | 262 }, |
| 254 | 263 |
| 255 /** | 264 /** |
| 256 * Handler that is called when the down key is pressed. | 265 * Handler that is called when the down key is pressed. |
| 257 * | 266 * |
| 258 * @param {CustomEvent} event A key combination event. | 267 * @param {CustomEvent} event A key combination event. |
| 259 */ | 268 */ |
| 260 _onDownKey: function(event) { | 269 _onDownKey: function(event) { |
| 261 this._focusNext(); | 270 this._focusNext(); |
| 271 event.detail.keyboardEvent.preventDefault(); |
| 262 }, | 272 }, |
| 263 | 273 |
| 264 /** | 274 /** |
| 265 * Handler that is called when the esc key is pressed. | 275 * Handler that is called when the esc key is pressed. |
| 266 * | 276 * |
| 267 * @param {CustomEvent} event A key combination event. | 277 * @param {CustomEvent} event A key combination event. |
| 268 */ | 278 */ |
| 269 _onEscKey: function(event) { | 279 _onEscKey: function(event) { |
| 270 // esc blurs the control | 280 // esc blurs the control |
| 271 this.focusedItem.blur(); | 281 this.focusedItem.blur(); |
| (...skipping 20 matching lines...) Expand all Loading... |
| 292 }; | 302 }; |
| 293 | 303 |
| 294 Polymer.IronMenuBehaviorImpl._shiftTabPressed = false; | 304 Polymer.IronMenuBehaviorImpl._shiftTabPressed = false; |
| 295 | 305 |
| 296 /** @polymerBehavior Polymer.IronMenuBehavior */ | 306 /** @polymerBehavior Polymer.IronMenuBehavior */ |
| 297 Polymer.IronMenuBehavior = [ | 307 Polymer.IronMenuBehavior = [ |
| 298 Polymer.IronMultiSelectableBehavior, | 308 Polymer.IronMultiSelectableBehavior, |
| 299 Polymer.IronA11yKeysBehavior, | 309 Polymer.IronA11yKeysBehavior, |
| 300 Polymer.IronMenuBehaviorImpl | 310 Polymer.IronMenuBehaviorImpl |
| 301 ]; | 311 ]; |
| OLD | NEW |