Trevor Parscal has uploaded a new change for review.

  https://gerrit.wikimedia.org/r/71558


Change subject: Search widget key commands
......................................................................

Search widget key commands

Objective:

* Enable navigating search results using keyboard up and down keys
* Bubble up query input enter events

Changes:

ve.ui.SearchWidget.js
* Route query input events to emit
* Add handler for keydown events
* Support navigating through the list of results using vertical arrow keys

Change-Id: Ia2e4b27075a8ab2e29a69294e9f7847e8f5a3f83
---
M modules/ve/ui/widgets/ve.ui.SearchWidget.js
1 file changed, 22 insertions(+), 1 deletion(-)


  git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/VisualEditor 
refs/changes/58/71558/1

diff --git a/modules/ve/ui/widgets/ve.ui.SearchWidget.js 
b/modules/ve/ui/widgets/ve.ui.SearchWidget.js
index 5cd3a8b..b335cca 100644
--- a/modules/ve/ui/widgets/ve.ui.SearchWidget.js
+++ b/modules/ve/ui/widgets/ve.ui.SearchWidget.js
@@ -35,8 +35,9 @@
        this.$results = this.$$( '<div>' );
 
        // Events
-       this.query.connect( this, { 'change': 'onQueryChange' } );
+       this.query.connect( this, { 'change': 'onQueryChange', 'enter': [ 
'emit', 'enter' ] } );
        this.results.connect( this, { 'select': 'onResultsSelect' } );
+       this.query.$.on( 'keydown', ve.bind( this.onQueryKeydown, this ) );
 
        // Initialization
        this.$query
@@ -61,9 +62,29 @@
  * @param {Object|null} item Item data or null if no item is selected
  */
 
+/**
+ * @event enter
+ */
+
 /* Methods */
 
 /**
+ * Handle query key down events.
+ *
+ * @method
+ * @param {jQuery.Event} e Key down event
+ */
+ve.ui.SearchWidget.prototype.onQueryKeydown = function ( e ) {
+       var selectedItem,
+               dir = e.which === ve.Keys.DOWN ? 1 : ( e.which === ve.Keys.UP ? 
-1 : 0 );
+
+       if ( dir ) {
+               selectedItem = this.results.getSelectedItem();
+               this.results.selectItem( 
this.results.getRelativeSelectableItem( selectedItem, dir ) );
+       }
+};
+
+/**
  * Handle select widget select events.
  *
  * Clears existing results. Subclasses should repopulate items according to 
new query.

-- 
To view, visit https://gerrit.wikimedia.org/r/71558
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings

Gerrit-MessageType: newchange
Gerrit-Change-Id: Ia2e4b27075a8ab2e29a69294e9f7847e8f5a3f83
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/VisualEditor
Gerrit-Branch: master
Gerrit-Owner: Trevor Parscal <[email protected]>

_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits

Reply via email to