autocomplete-list-keys-debug.js revision 99cf5b59b609b3473c06ad955da3a1553934ab5f
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav GlassYUI.add('autocomplete-list-keys', function(Y) {
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass/**
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan GroveMixes keyboard support into AutoCompleteList. By default, this module is not
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Groveloaded for iOS and Android devices.
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove@module autocomplete
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove@submodule autocomplete-list-keys
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove**/
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass // keyCode constants.
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glassvar KEY_DOWN = 40,
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass KEY_ENTER = 13,
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass KEY_ESC = 27,
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass KEY_TAB = 9,
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass KEY_UP = 38;
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glassfunction ListKeys() {
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass Y.before(this._bindKeys, this, 'bindUI');
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass this._initKeys();
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass}
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav GlassListKeys.prototype = {
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass // -- Lifecycle Methods ----------------------------------------------------
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass /**
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove Initializes keyboard command mappings.
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove @method _initKeys
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove @protected
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove @for AutoCompleteList
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove **/
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass _initKeys: function () {
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass var keys = {},
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass keysVisible = {};
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass // Register keyboard command handlers. _keys contains handlers that will
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass // always be called; _keysVisible contains handlers that will only be
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass // called when the list is visible.
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass keys[KEY_DOWN] = this._keyDown;
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass keysVisible[KEY_ENTER] = this._keyEnter;
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass keysVisible[KEY_ESC] = this._keyEsc;
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass keysVisible[KEY_TAB] = this._keyTab;
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass keysVisible[KEY_UP] = this._keyUp;
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass this._keys = keys;
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass this._keysVisible = keysVisible;
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass },
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
99cf5b59b609b3473c06ad955da3a1553934ab5fRyan Grove destructor: function () {
99cf5b59b609b3473c06ad955da3a1553934ab5fRyan Grove this._unbindKeys();
99cf5b59b609b3473c06ad955da3a1553934ab5fRyan Grove },
99cf5b59b609b3473c06ad955da3a1553934ab5fRyan Grove
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass /**
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove Binds keyboard events.
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove @method _bindKeys
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove @protected
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove **/
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass _bindKeys: function () {
99cf5b59b609b3473c06ad955da3a1553934ab5fRyan Grove this._keyEvents = this._inputNode.on('keydown', this._onInputKey, this);
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass },
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass /**
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove Unbinds keyboard events.
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove @method _unbindKeys
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove @protected
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove **/
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass _unbindKeys: function () {
99cf5b59b609b3473c06ad955da3a1553934ab5fRyan Grove this._keyEvents && this._keyEvents.detach();
99cf5b59b609b3473c06ad955da3a1553934ab5fRyan Grove this._keyEvents = null;
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass },
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass // -- Protected Methods ----------------------------------------------------
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass /**
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove Called when the down arrow key is pressed.
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove @method _keyDown
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove @protected
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove **/
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass _keyDown: function () {
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass if (this.get('visible')) {
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass this._activateNextItem();
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass } else {
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass this.show();
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass }
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass },
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass /**
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove Called when the enter key is pressed.
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove @method _keyEnter
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove @protected
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove **/
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass _keyEnter: function (e) {
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass var item = this.get('activeItem');
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass if (item) {
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass this.selectItem(item, e);
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass } else {
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass // Don't prevent form submission when there's no active item.
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass return false;
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass }
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass },
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass /**
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove Called when the escape key is pressed.
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove @method _keyEsc
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove @protected
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove **/
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass _keyEsc: function () {
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass this.hide();
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass },
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass /**
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove Called when the tab key is pressed.
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove @method _keyTab
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove @protected
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove **/
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass _keyTab: function (e) {
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass var item;
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass if (this.get('tabSelect')) {
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass item = this.get('activeItem');
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass if (item) {
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass this.selectItem(item, e);
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass return true;
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass }
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass }
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass return false;
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass },
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass /**
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove Called when the up arrow key is pressed.
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove @method _keyUp
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove @protected
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove **/
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass _keyUp: function () {
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass this._activatePrevItem();
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass },
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass // -- Protected Event Handlers ---------------------------------------------
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass /**
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove Handles `inputNode` key events.
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove @method _onInputKey
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove @param {EventTarget} e
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove @protected
4bc090583f2a5d4fee80ca7a79a993d4e5ac14ecRyan Grove **/
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass _onInputKey: function (e) {
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass var handler,
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass keyCode = e.keyCode;
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass this._lastInputKey = keyCode;
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass if (this.get('results').length) {
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass handler = this._keys[keyCode];
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass if (!handler && this.get('visible')) {
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass handler = this._keysVisible[keyCode];
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass }
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass if (handler) {
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass // A handler may return false to indicate that it doesn't wish
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass // to prevent the default key behavior.
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass if (handler.call(this, e) !== false) {
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass e.preventDefault();
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass }
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass }
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass }
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass }
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass};
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav GlassY.Base.mix(Y.AutoCompleteList, [ListKeys]);
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass
76ca635d61eb3f9fb7c9d788a44fa8b1690aa138Dav Glass}, '@VERSION@' ,{requires:['autocomplete-list', 'base-build']});