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

Unified Diff: polymer_1.2.3/bower_components/iron-menu-behavior/iron-menu-behavior.html

Issue 1581713003: [third_party] add polymer 1.2.3 (Closed) Base URL: https://chromium.googlesource.com/infra/third_party/npm_modules.git@master
Patch Set: 1.2.3 Created 4 years, 11 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 side-by-side diff with in-line comments
Download patch
Index: polymer_1.2.3/bower_components/iron-menu-behavior/iron-menu-behavior.html
diff --git a/polymer_1.0.4/bower_components/iron-menu-behavior/iron-menu-behavior.html b/polymer_1.2.3/bower_components/iron-menu-behavior/iron-menu-behavior.html
similarity index 52%
copy from polymer_1.0.4/bower_components/iron-menu-behavior/iron-menu-behavior.html
copy to polymer_1.2.3/bower_components/iron-menu-behavior/iron-menu-behavior.html
index aa58c7fe6b558d93cb116d3c733147afdbf5265e..b97006114737b84dd69fcbe2c97d3e3281635809 100644
--- a/polymer_1.0.4/bower_components/iron-menu-behavior/iron-menu-behavior.html
+++ b/polymer_1.2.3/bower_components/iron-menu-behavior/iron-menu-behavior.html
@@ -26,9 +26,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
/**
* Returns the currently focused item.
- *
- * @attribute focusedItem
- * @type Object
+ * @type {?Object}
*/
focusedItem: {
observer: '_focusedItemChanged',
@@ -40,9 +38,6 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
* The attribute to use on menu items to look up the item title. Typing the first
* letter of an item when the menu is open focuses that item. If unset, `textContent`
* will be used.
- *
- * @attribute attrForItemTitle
- * @type String
*/
attrForItemTitle: {
type: String
@@ -60,17 +55,58 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
listeners: {
'focus': '_onFocus',
- 'keydown': '_onKeydown'
+ 'keydown': '_onKeydown',
+ 'iron-items-changed': '_onIronItemsChanged'
},
keyBindings: {
'up': '_onUpKey',
'down': '_onDownKey',
'esc': '_onEscKey',
- 'enter': '_onEnterKey',
'shift+tab:keydown': '_onShiftTabDown'
},
+ attached: function() {
+ this._resetTabindices();
+ },
+
+ /**
+ * Selects the given value. If the `multi` property is true, then the selected state of the
+ * `value` will be toggled; otherwise the `value` will be selected.
+ *
+ * @param {string} value the value to select.
+ */
+ select: function(value) {
+ if (this._defaultFocusAsync) {
+ this.cancelAsync(this._defaultFocusAsync);
+ this._defaultFocusAsync = null;
+ }
+ var item = this._valueToItem(value);
+ if (item && item.hasAttribute('disabled')) return;
+ this._setFocusedItem(item);
+ Polymer.IronMultiSelectableBehaviorImpl.select.apply(this, arguments);
+ },
+
+ /**
+ * Resets all tabindex attributes to the appropriate value based on the
+ * current selection state. The appropriate value is `0` (focusable) for
+ * the default selected item, and `-1` (not keyboard focusable) for all
+ * other items.
+ */
+ _resetTabindices: function() {
+ var selectedItem = this.multi ? (this.selectedItems && this.selectedItems[0]) : this.selectedItem;
+
+ this.items.forEach(function(item) {
+ item.setAttribute('tabindex', item === selectedItem ? '0' : '-1');
+ }, this);
+ },
+
+ /**
+ * Sets appropriate ARIA based on whether or not the menu is meant to be
+ * multi-selectable.
+ *
+ * @param {boolean} multi True if the menu should be multi-selectable.
+ */
_updateMultiselectable: function(multi) {
if (multi) {
this.setAttribute('aria-multiselectable', 'true');
@@ -79,32 +115,68 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
}
},
- _onShiftTabDown: function() {
- var oldTabIndex;
-
- Polymer.IronMenuBehaviorImpl._shiftTabPressed = true;
+ /**
+ * Given a KeyboardEvent, this method will focus the appropriate item in the
+ * menu (if there is a relevant item, and it is possible to focus it).
+ *
+ * @param {KeyboardEvent} event A KeyboardEvent.
+ */
+ _focusWithKeyboardEvent: function(event) {
+ for (var i = 0, item; item = this.items[i]; i++) {
+ var attr = this.attrForItemTitle || 'textContent';
+ var title = item[attr] || item.getAttribute(attr);
- oldTabIndex = this.getAttribute('tabindex');
+ if (title && title.trim().charAt(0).toLowerCase() === String.fromCharCode(event.keyCode).toLowerCase()) {
+ this._setFocusedItem(item);
+ break;
+ }
+ }
+ },
- this.setAttribute('tabindex', '-1');
+ /**
+ * Focuses the previous item (relative to the currently focused item) in the
+ * menu.
+ */
+ _focusPrevious: function() {
+ var length = this.items.length;
+ var index = (Number(this.indexOf(this.focusedItem)) - 1 + length) % length;
+ this._setFocusedItem(this.items[index]);
+ },
- this.async(function() {
- this.setAttribute('tabindex', oldTabIndex);
- Polymer.IronMenuBehaviorImpl._shiftTabPressed = false;
- // Note: polymer/polymer#1305
- }, 1);
+ /**
+ * Focuses the next item (relative to the currently focused item) in the
+ * menu.
+ */
+ _focusNext: function() {
+ var index = (Number(this.indexOf(this.focusedItem)) + 1) % this.items.length;
+ this._setFocusedItem(this.items[index]);
},
+ /**
+ * Mutates items in the menu based on provided selection details, so that
+ * all items correctly reflect selection state.
+ *
+ * @param {Element} item An item in the menu.
+ * @param {boolean} isSelected True if the item should be shown in a
+ * selected state, otherwise false.
+ */
_applySelection: function(item, isSelected) {
if (isSelected) {
item.setAttribute('aria-selected', 'true');
} else {
item.removeAttribute('aria-selected');
}
-
Polymer.IronSelectableBehavior._applySelection.apply(this, arguments);
},
+ /**
+ * Discretely updates tabindex values among menu items as the focused item
+ * changes.
+ *
+ * @param {Element} focusedItem The element that is currently focused.
+ * @param {?Element} old The last element that was considered focused, if
+ * applicable.
+ */
_focusedItemChanged: function(focusedItem, old) {
old && old.setAttribute('tabindex', '-1');
if (focusedItem) {
@@ -113,93 +185,126 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
}
},
- select: function(value) {
- if (this._defaultFocusAsync) {
- this.cancelAsync(this._defaultFocusAsync);
- this._defaultFocusAsync = null;
+ /**
+ * A handler that responds to mutation changes related to the list of items
+ * in the menu.
+ *
+ * @param {CustomEvent} event An event containing mutation records as its
+ * detail.
+ */
+ _onIronItemsChanged: function(event) {
+ var mutations = event.detail;
+ var mutation;
+ var index;
+
+ for (index = 0; index < mutations.length; ++index) {
+ mutation = mutations[index];
+
+ if (mutation.addedNodes.length) {
+ this._resetTabindices();
+ break;
+ }
}
- var item = this._valueToItem(value);
- this._setFocusedItem(item);
- Polymer.IronMultiSelectableBehaviorImpl.select.apply(this, arguments);
},
+ /**
+ * Handler that is called when a shift+tab keypress is detected by the menu.
+ *
+ * @param {CustomEvent} event A key combination event.
+ */
+ _onShiftTabDown: function(event) {
+ var oldTabIndex = this.getAttribute('tabindex');
+
+ Polymer.IronMenuBehaviorImpl._shiftTabPressed = true;
+
+ this._setFocusedItem(null);
+
+ this.setAttribute('tabindex', '-1');
+
+ this.async(function() {
+ this.setAttribute('tabindex', oldTabIndex);
+ Polymer.IronMenuBehaviorImpl._shiftTabPressed = false;
+ // NOTE(cdata): polymer/polymer#1305
+ }, 1);
+ },
+
+ /**
+ * Handler that is called when the menu receives focus.
+ *
+ * @param {FocusEvent} event A focus event.
+ */
_onFocus: function(event) {
if (Polymer.IronMenuBehaviorImpl._shiftTabPressed) {
+ // do not focus the menu itself
return;
}
- // do not focus the menu itself
+
this.blur();
+
// clear the cached focus item
- this._setFocusedItem(null);
this._defaultFocusAsync = this.async(function() {
// focus the selected item when the menu receives focus, or the first item
// if no item is selected
var selectedItem = this.multi ? (this.selectedItems && this.selectedItems[0]) : this.selectedItem;
+
+ this._setFocusedItem(null);
+
if (selectedItem) {
this._setFocusedItem(selectedItem);
} else {
this._setFocusedItem(this.items[0]);
}
- // async 100ms to wait for `select` to get called from `_itemActivate`
- }, 100);
+ // async 1ms to wait for `select` to get called from `_itemActivate`
+ }, 1);
},
- _onUpKey: function() {
+ /**
+ * Handler that is called when the up key is pressed.
+ *
+ * @param {CustomEvent} event A key combination event.
+ */
+ _onUpKey: function(event) {
// up and down arrows moves the focus
this._focusPrevious();
},
- _onDownKey: function() {
+ /**
+ * Handler that is called when the down key is pressed.
+ *
+ * @param {CustomEvent} event A key combination event.
+ */
+ _onDownKey: function(event) {
this._focusNext();
},
- _onEscKey: function() {
+ /**
+ * Handler that is called when the esc key is pressed.
+ *
+ * @param {CustomEvent} event A key combination event.
+ */
+ _onEscKey: function(event) {
// esc blurs the control
this.focusedItem.blur();
},
- _onEnterKey: function(event) {
- // enter activates the item unless it is disabled
- this._activateFocused(event.detail.keyboardEvent);
- },
-
+ /**
+ * Handler that is called when a keydown event is detected.
+ *
+ * @param {KeyboardEvent} event A keyboard event.
+ */
_onKeydown: function(event) {
- if (this.keyboardEventMatchesKeys(event, 'up down esc enter')) {
- return;
- }
-
- // all other keys focus the menu item starting with that character
- this._focusWithKeyboardEvent(event);
- },
-
- _focusWithKeyboardEvent: function(event) {
- for (var i = 0, item; item = this.items[i]; i++) {
- var attr = this.attrForItemTitle || 'textContent';
- var title = item[attr] || item.getAttribute(attr);
- if (title && title.trim().charAt(0).toLowerCase() === String.fromCharCode(event.keyCode).toLowerCase()) {
- this._setFocusedItem(item);
- break;
- }
- }
- },
-
- _activateFocused: function(event) {
- if (!this.focusedItem.hasAttribute('disabled')) {
- this._activateHandler(event);
+ if (!this.keyboardEventMatchesKeys(event, 'up down esc')) {
+ // all other keys focus the menu item starting with that character
+ this._focusWithKeyboardEvent(event);
}
+ event.stopPropagation();
},
- _focusPrevious: function() {
- var length = this.items.length;
- var index = (Number(this.indexOf(this.focusedItem)) - 1 + length) % length;
- this._setFocusedItem(this.items[index]);
- },
-
- _focusNext: function() {
- var index = (Number(this.indexOf(this.focusedItem)) + 1) % this.items.length;
- this._setFocusedItem(this.items[index]);
+ // override _activateHandler
+ _activateHandler: function(event) {
+ Polymer.IronSelectableBehavior._activateHandler.call(this, event);
+ event.stopPropagation();
}
-
};
Polymer.IronMenuBehaviorImpl._shiftTabPressed = false;

Powered by Google App Engine
This is Rietveld 408576698