/** - * @class Ext.KeyNav - *+ +Provides a convenient wrapper for normalized keyboard navigation. KeyNav allows you to bind - * navigation keys to function calls that will get called when the keys are pressed, providing an easy - * way to implement custom navigation schemes for any UI component.
- *The following are all of the possible keys that can be implemented: enter, left, right, up, down, tab, esc, - * pageUp, pageDown, del, home, end. Usage:
-- * @constructor - * @param {Mixed} el The element to bind to - * @param {Object} config The config - */ -Ext.KeyNav = function(el, config){ - this.el = Ext.get(el); - Ext.apply(this, config); - if(!this.disabled){ - this.disabled = true; - this.enable(); + + + + +-var nav = new Ext.KeyNav("my-element", { - "left" : function(e){ - this.moveLeft(e.ctrlKey); - }, - "right" : function(e){ - this.moveRight(e.ctrlKey); - }, - "enter" : function(e){ - this.save(); - }, - scope : this -}); -The source code + + + + + + +* @class Ext.menu.KeyNav + * @private + */ +Ext.define('Ext.menu.KeyNav', { + extend: 'Ext.util.KeyNav', + + requires: ['Ext.FocusManager'], + + constructor: function(menu) { + var me = this; + + me.menu = menu; + me.callParent([menu.el, { + down: me.down, + enter: me.enter, + esc: me.escape, + left: me.left, + right: me.right, + space: me.enter, + tab: me.tab, + up: me.up + }]); + }, + + down: function(e) { + var me = this, + fi = me.menu.focusedItem; + + if (fi && e.getKey() == Ext.EventObject.DOWN && me.isWhitelisted(fi)) { + return true; } + me.focusNextItem(1); }, - // private - doRelay : function(e, h, hname){ - return h.call(this.scope || this, e); + enter: function(e) { + var menu = this.menu, + focused = menu.focusedItem; + + if (menu.activeItem) { + menu.onClick(e); + } else if (focused && focused.isFormField) { + // prevent stopEvent being called + return true; + } }, - // possible handlers - enter : false, - left : false, - right : false, - up : false, - down : false, - tab : false, - esc : false, - pageUp : false, - pageDown : false, - del : false, - home : false, - end : false, - - // quick lookup hash - keyToHandler : { - 37 : "left", - 39 : "right", - 38 : "up", - 40 : "down", - 33 : "pageUp", - 34 : "pageDown", - 46 : "del", - 36 : "home", - 35 : "end", - 13 : "enter", - 27 : "esc", - 9 : "tab" + escape: function(e) { + Ext.menu.Manager.hideAll(); }, - - stopKeyUp: function(e) { - var k = e.getKey(); - if (k >= 37 && k <= 40) { - // *** bugfix - safari 2.x fires 2 keyup events on cursor keys - // *** (note: this bugfix sacrifices the "keyup" event originating from keyNav elements in Safari 2) - e.stopEvent(); + focusNextItem: function(step) { + var menu = this.menu, + items = menu.items, + focusedItem = menu.focusedItem, + startIdx = focusedItem ? items.indexOf(focusedItem) : -1, + idx = startIdx + step; + + while (idx != startIdx) { + if (idx < 0) { + idx = items.length - 1; + } else if (idx >= items.length) { + idx = 0; + } + + var item = items.getAt(idx); + if (menu.canActivateItem(item)) { + menu.setActiveItem(item); + break; + } + idx += step; } }, - - /** - * Destroy this KeyNav (this is the same as calling disable). - */ - destroy: function(){ - this.disable(); + + isWhitelisted: function(item) { + return Ext.FocusManager.isWhitelisted(item); }, - /** - * Enable this KeyNav - */ - enable: function() { - if (this.disabled) { - if (Ext.isSafari2) { - // call stopKeyUp() on "keyup" event - this.el.on('keyup', this.stopKeyUp, this); - } + left: function(e) { + var menu = this.menu, + fi = menu.focusedItem, + ai = menu.activeItem; + + if (fi && this.isWhitelisted(fi)) { + return true; + } - this.el.on(this.isKeydown()? 'keydown' : 'keypress', this.relay, this); - this.disabled = false; + menu.hide(); + if (menu.parentMenu) { + menu.parentMenu.focus(); } }, - /** - * Disable this KeyNav - */ - disable: function() { - if (!this.disabled) { - if (Ext.isSafari2) { - // remove "keyup" event handler - this.el.un('keyup', this.stopKeyUp, this); - } + right: function(e) { + var menu = this.menu, + fi = menu.focusedItem, + ai = menu.activeItem, + am; + + if (fi && this.isWhitelisted(fi)) { + return true; + } - this.el.un(this.isKeydown()? 'keydown' : 'keypress', this.relay, this); - this.disabled = true; + if (ai) { + am = menu.activeItem.menu; + if (am) { + ai.expandMenu(0); + Ext.defer(function() { + am.setActiveItem(am.items.getAt(0)); + }, 25); + } } }, - - /** - * Convenience function for setting disabled/enabled by boolean. - * @param {Boolean} disabled - */ - setDisabled : function(disabled){ - this[disabled ? "disable" : "enable"](); + + tab: function(e) { + var me = this; + + if (e.shiftKey) { + me.up(e); + } else { + me.down(e); + } }, - - // private - isKeydown: function(){ - return this.forceKeyDown || Ext.EventManager.useKeydown; + + up: function(e) { + var me = this, + fi = me.menu.focusedItem; + + if (fi && e.getKey() == Ext.EventObject.UP && me.isWhitelisted(fi)) { + return true; + } + me.focusNextItem(-1); } -}; -- - \ No newline at end of file +});