Robmoen has uploaded a new change for review.

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


Change subject: Affordances for MenuWidget to be optionally focusable.
......................................................................

Affordances for MenuWidget to be optionally focusable.

* ve.ui.MenuWidget.js
MenuWidget no longer creates an embeded input element by default.
In the case of no configured input element, we bind the keydown
handler to window with addEventListner while using the useCapture
flag.  This nicely prevents elements lower in the dom from triggering
( document node ) Supported in IE9 and above and all modern browsers.

* ve.ui.ListAction.js
Since MenuWidget is no longer stealing focus from the surface,
we no longer need to restore focus after a list item conversion.
This is the end goal, as browsers like Chrome like to scroll to
the top of elements that gain focus.

Bug: 50792
Change-Id: I5b6969bca1a58b040708f8ac9d3dc8b07ddf9e6b
---
M modules/ve/ui/actions/ve.ui.FormatAction.js
M modules/ve/ui/widgets/ve.ui.MenuWidget.js
2 files changed, 37 insertions(+), 12 deletions(-)


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

diff --git a/modules/ve/ui/actions/ve.ui.FormatAction.js 
b/modules/ve/ui/actions/ve.ui.FormatAction.js
index fbd5c6c..0d5c6b7 100644
--- a/modules/ve/ui/actions/ve.ui.FormatAction.js
+++ b/modules/ve/ui/actions/ve.ui.FormatAction.js
@@ -68,10 +68,6 @@
        }
        selection = fragmentForSelection.getRange();
 
-       // Since format dropdown tool is a focusable menu, documentNode has 
lost focus.
-       // Restore focus to documentNode so that firefox will display the 
cursor after conversion.
-       this.surface.view.documentView.documentNode.$[0].focus();
-
        txs = ve.dm.Transaction.newFromContentBranchConversion( doc, selection, 
type, attributes );
        surfaceModel.change( txs, selection );
 };
diff --git a/modules/ve/ui/widgets/ve.ui.MenuWidget.js 
b/modules/ve/ui/widgets/ve.ui.MenuWidget.js
index a0b7daa..ed9de08 100644
--- a/modules/ve/ui/widgets/ve.ui.MenuWidget.js
+++ b/modules/ve/ui/widgets/ve.ui.MenuWidget.js
@@ -24,19 +24,14 @@
 
        // Properties
        this.newItems = [];
-       this.$input = config.input ? config.input.$input : this.$$( '<input>' );
+       this.$input = config.input ? config.input.$input : null;
        this.$previousFocus = null;
        this.isolated = !config.input;
        this.visible = false;
-
-       // Events
-       this.$input.on( 'keydown', ve.bind( this.onKeyDown, this ) );
+       this.keydownHandler = ve.bind( this.onKeyDown, this );
 
        // Initialization
        this.$.hide().addClass( 've-ui-menuWidget' );
-       if ( !config.input ) {
-               this.$.append( this.$input );
-       }
 };
 
 /* Inheritance */
@@ -78,6 +73,8 @@
                                break;
                }
                if ( handled ) {
+                       e.preventDefault();
+                       e.stopPropagation();
                        return false;
                }
        }
@@ -91,6 +88,34 @@
  */
 ve.ui.MenuWidget.prototype.isVisible = function () {
        return this.visible;
+};
+
+
+/**
+ * Bind keydown listener
+ *
+ * @method
+ */
+ve.ui.MenuWidget.prototype.bindKeydownListener = function () {
+       if ( this.$input ) {
+               this.$input.on( 'keydown', this.keydownHandler );
+       } else {
+               // Capture menu navigation keys
+               window.addEventListener( 'keydown', this.keydownHandler, true );
+       }
+};
+
+/**
+ * Unbind keydown listener
+ *
+ * @method
+ */
+ve.ui.MenuWidget.prototype.unbindKeydownListener = function () {
+       if ( this.$input ) {
+               this.$input.off( 'keydown' );
+       } else {
+               window.removeEventListener( 'keydown', this.keydownHandler, 
true );
+       }
 };
 
 /**
@@ -161,8 +186,10 @@
        if ( this.items.length ) {
                this.$.show();
                this.visible = true;
+               this.bindKeydownListener();
+
                // Change focus to enable keyboard navigation
-               if ( this.isolated && !this.$input.is( ':focus' ) ) {
+               if ( this.isolated && this.$input && !this.$input.is( ':focus' 
) ) {
                        this.$previousFocus = this.$$( ':focus' );
                        this.$input.focus();
                }
@@ -186,6 +213,8 @@
 ve.ui.MenuWidget.prototype.hide = function () {
        this.$.hide();
        this.visible = false;
+       this.unbindKeydownListener();
+
        if ( this.isolated && this.$previousFocus ) {
                this.$previousFocus.focus();
                this.$previousFocus = null;

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

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

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

Reply via email to