Merge "Add missing @group Database tags in tests"

[lhc/web/wiklou.git] / resources / src / mediawiki.rcfilters / ui / mw.rcfilters.ui.FilterWrapperWidget.js

diff --git a/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.FilterWrapperWidget.js b/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.FilterWrapperWidget.js
index dc3cfe5..1fba18c 100644 (file)
--- a/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.FilterWrapperWidget.js
+++ b/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.FilterWrapperWidget.js
@@ -13,6 +13,7 @@
         * @cfg {jQuery} [$overlay] A jQuery object serving as overlay for popups
         */
        mw.rcfilters.ui.FilterWrapperWidget = function MwRcfiltersUiFilterWrapperWidget( controller, model, config ) {
+               var $footer = $( '<div>' );
                config = config || {};
 
                // Parent
@@ -33,6 +34,16 @@
                        }
                );
 
+               $footer.append(
+                       new OO.ui.ButtonWidget( {
+                               framed: false,
+                               icon: 'feedback',
+                               flags: [ 'progressive' ],
+                               label: mw.msg( 'rcfilters-filterlist-feedbacklink' ),
+                               href: 'https://www.mediawiki.org/wiki/Help_talk:New_filters_for_edit_review'
+                       } ).$element
+               );
+
                this.textInput = new OO.ui.TextInputWidget( {
                        classes: [ 'mw-rcfilters-ui-filterWrapperWidget-search' ],
                        icon: 'search',
@@ -43,8 +54,10 @@
                        $overlay: this.$overlay,
                        popup: {
                                $content: this.filterPopup.$element,
+                               $footer: $footer,
                                classes: [ 'mw-rcfilters-ui-filterWrapperWidget-popup' ],
-                               width: 650
+                               width: 650,
+                               hideWhenOutOfView: false
                        }
                } );
 
@@ -54,7 +67,8 @@
                        itemUpdate: 'onModelItemUpdate'
                } );
                this.textInput.connect( this, {
-                       change: 'onTextInputChange'
+                       change: 'onTextInputChange',
+                       enter: 'onTextInputEnter'
                } );
                this.capsule.connect( this, { capsuleItemClick: 'onCapsuleItemClick' } );
                this.capsule.popup.connect( this, { toggle: 'onCapsulePopupToggle' } );
@@ -94,10 +108,17 @@
         */
        mw.rcfilters.ui.FilterWrapperWidget.prototype.onCapsulePopupToggle = function ( isVisible ) {
                if ( !isVisible ) {
-                       this.filterPopup.resetSelection();
-                       this.capsule.resetSelection();
+                       if ( !this.textInput.getValue() ) {
+                               // Only reset selection if we are not filtering
+                               this.filterPopup.resetSelection();
+                               this.capsule.resetSelection();
+                       }
                } else {
                        this.scrollToTop( this.capsule.$element, 10 );
+                       if ( !this.filterPopup.getSelectedFilter() ) {
+                               // No selection, scroll the popup list to top
+                               setTimeout( function () { this.capsule.popup.$body.scrollTop( 0 ); }.bind( this ), 0 );
+                       }
                }
        };
 
@@ -107,13 +128,30 @@
         * @param {string} newValue Current value
         */
        mw.rcfilters.ui.FilterWrapperWidget.prototype.onTextInputChange = function ( newValue ) {
-               this.filterPopup.resetSelection();
-
                // Filter the results
                this.filterPopup.filter( this.model.findMatches( newValue ) );
+
+               if ( !newValue ) {
+                       // If the value is empty, we didn't actually
+                       // filter anything. the filter method will run
+                       // and show all, but then will select the
+                       // top item - but in this case, no selection
+                       // should be made.
+                       this.filterPopup.resetSelection();
+               }
                this.capsule.popup.clip();
        };
 
+       /**
+        * Respond to text input enter event
+        */
+       mw.rcfilters.ui.FilterWrapperWidget.prototype.onTextInputEnter = function () {
+               var filter = this.filterPopup.getSelectedFilter();
+
+               // Toggle the filter
+               this.controller.toggleFilterSelect( filter );
+       };
+
        /**
         * Respond to model update event and set up the available filters to choose
         * from.
@@ -137,7 +175,9 @@
         * any actual interaction with the system resets the selection state of any item.
         */
        mw.rcfilters.ui.FilterWrapperWidget.prototype.onModelItemUpdate = function () {
-               this.filterPopup.resetSelection();
+               if ( !this.textInput.getValue() ) {
+                       this.filterPopup.resetSelection();
+               }
        };
 
        /**
@@ -150,11 +190,12 @@
         */
        mw.rcfilters.ui.FilterWrapperWidget.prototype.scrollToTop = function ( $element, marginFromTop ) {
                var container = OO.ui.Element.static.getClosestScrollableContainer( $element[ 0 ], 'y' ),
-                       pos = OO.ui.Element.static.getRelativePosition( $element, $( container ) );
+                       pos = OO.ui.Element.static.getRelativePosition( $element, $( container ) ),
+                       containerScrollTop = $( container ).is( 'body, html' ) ? 0 : $( container ).scrollTop();
 
                // Scroll to item
                $( container ).animate( {
-                       scrollTop: $( container ).scrollTop() + pos.top + ( marginFromTop || 0 )
+                       scrollTop: containerScrollTop + pos.top - ( marginFromTop || 0 )
                } );
        };
 }( mediaWiki ) );