Special:Contributions: Open "To date" widget after selecting a "From date"

Add a 'deactivate' event to DateInputWidget, with a boolean indicating
whether the deactivation occurred because the user chose a date.
Also consolidate some of the code handling this case into the deactivate()
method.

Bug: T120733
Change-Id: Ia56cc28b400a0bc051dff79b2d3870a8954137a6

diff --git a/resources/src/mediawiki.special/mediawiki.special.contributions.js b/resources/src/mediawiki.special/mediawiki.special.contributions.js
index 3f34951..f65a257 100644 (file)
--- a/resources/src/mediawiki.special/mediawiki.special.contributions.js
+++ b/resources/src/mediawiki.special/mediawiki.special.contributions.js
@@ -1,7 +1,12 @@
-/* jshint -W024*/
 ( function ( mw, $ ) {
        $( function () {
-               mw.widgets.DateInputWidget.static.infuse( 'mw-date-start' );
-               mw.widgets.DateInputWidget.static.infuse( 'mw-date-end' );
+               var startInput = mw.widgets.DateInputWidget.static.infuse( 'mw-date-start' ),
+                       endInput = mw.widgets.DateInputWidget.static.infuse( 'mw-date-end' );
+
+               startInput.on( 'deactivate', function ( userSelected ) {
+                       if ( userSelected ) {
+                               endInput.focus();
+                       }
+               } );
        } );
 }( mediaWiki, jQuery ) );

diff --git a/resources/src/mediawiki.widgets/mw.widgets.DateInputWidget.js b/resources/src/mediawiki.widgets/mw.widgets.DateInputWidget.js
index d41a147..ce9cf36 100644 (file)
--- a/resources/src/mediawiki.widgets/mw.widgets.DateInputWidget.js
+++ b/resources/src/mediawiki.widgets/mw.widgets.DateInputWidget.js
@@ -243,6 +243,16 @@
        OO.inheritClass( mw.widgets.DateInputWidget, OO.ui.TextInputWidget );
        OO.mixinClass( mw.widgets.DateInputWidget, OO.ui.mixin.IndicatorElement );
 
+       /* Events */
+
+       /**
+        * Fired when the widget is deactivated (i.e. the calendar is closed). This can happen because
+        * the user selected a value, or because the user blurred the widget.
+        *
+        * @event deactivate
+        * @param {boolean} userSelected Whether the deactivation happened because the user selected a value
+        */
+
        /* Methods */
 
        /**
@@ -387,13 +397,23 @@
         * Deactivate this input field for data entry. Closes the calendar and hides the text field.
         *
         * @private
+        * @param {boolean} [userSelected] Whether we are deactivating because the user selected a value
         */
-       mw.widgets.DateInputWidget.prototype.deactivate = function () {
+       mw.widgets.DateInputWidget.prototype.deactivate = function ( userSelected ) {
                this.$element.removeClass( 'mw-widget-dateInputWidget-active' );
                this.$handle.show();
                this.textInput.toggle( false );
                this.calendar.toggle( false );
                this.setValidityFlag();
+
+               if ( userSelected ) {
+                       // Prevent focusing the handle from reopening the calendar
+                       this.closing = true;
+                       this.$handle.focus();
+                       this.closing = false;
+               }
+
+               this.emit( 'deactivate', !!userSelected );
        };
 
        /**
@@ -542,13 +562,7 @@
         */
        mw.widgets.DateInputWidget.prototype.onCalendarKeyPress = function ( e ) {
                if ( !this.isDisabled() && e.which === OO.ui.Keys.ENTER ) {
-                       // Prevent focusing the handle from reopening the calendar
-                       this.closing = true;
-
-                       this.deactivate();
-                       this.$handle.focus();
-
-                       this.closing = false;
+                       this.deactivate( true );
                        return false;
                }
        };
@@ -569,13 +583,7 @@
                                $( e.target ).hasClass( 'mw-widget-calendarWidget-month' )
                        )
                ) {
-                       // Prevent focusing the handle from reopening the calendar
-                       this.closing = true;
-
-                       this.deactivate();
-                       this.$handle.focus();
-
-                       this.closing = false;
+                       this.deactivate( true );
                        return false;
                }
        };
@@ -586,13 +594,7 @@
         * @private
         */
        mw.widgets.DateInputWidget.prototype.onEnter = function () {
-               // Prevent focusing the handle from reopening the calendar
-               this.closing = true;
-
-               this.deactivate();
-               this.$handle.focus();
-
-               this.closing = false;
+               this.deactivate( true );
        };
 
        /**