resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.RclTargetPageWidget.js

   1 ( function ( mw ) {
   2         /**
   3          * Widget to select and display target page on Special:RecentChangesLinked (AKA Related Changes)
   4          *
   5          * @extends OO.ui.Widget
   6          *
   7          * @constructor
   8          * @param {mw.rcfilters.Controller} controller
   9          * @param {mw.rcfilters.dm.FilterItem} targetPageModel
  10          * @param {Object} [config] Configuration object
  11          */
  12         mw.rcfilters.ui.RclTargetPageWidget = function MwRcfiltersUiRclTargetPageWidget(
  13                 controller, targetPageModel, config
  14         ) {
  15                 config = config || {};
  16
  17                 // Parent
  18                 mw.rcfilters.ui.RclTargetPageWidget.parent.call( this, config );
  19
  20                 this.controller = controller;
  21                 this.model = targetPageModel;
  22
  23                 this.titleSearch = new mw.widgets.TitleInputWidget( {
  24                         validate: false,
  25                         placeholder: mw.msg( 'rcfilters-target-page-placeholder' ),
  26                         showImages: true,
  27                         showDescriptions: true
  28                 } );
  29
  30                 // Events
  31                 this.model.connect( this, { update: 'updateUiBasedOnModel' } );
  32
  33                 this.titleSearch.$input.on( {
  34                         blur: this.onLookupInputBlur.bind( this )
  35                 } );
  36
  37                 this.titleSearch.lookupMenu.connect( this, {
  38                         choose: 'onLookupMenuItemChoose'
  39                 } );
  40
  41                 // Initialize
  42                 this.$element
  43                         .addClass( 'mw-rcfilters-ui-rclTargetPageWidget' )
  44                         .append( this.titleSearch.$element );
  45
  46                 this.updateUiBasedOnModel();
  47         };
  48
  49         /* Initialization */
  50
  51         OO.inheritClass( mw.rcfilters.ui.RclTargetPageWidget, OO.ui.Widget );
  52
  53         /* Methods */
  54
  55         /**
  56          * Respond to the user choosing a title
  57          */
  58         mw.rcfilters.ui.RclTargetPageWidget.prototype.onLookupMenuItemChoose = function () {
  59                 this.titleSearch.$input.blur();
  60         };
  61
  62         /**
  63          * Respond to titleSearch $input blur
  64          */
  65         mw.rcfilters.ui.RclTargetPageWidget.prototype.onLookupInputBlur = function () {
  66                 this.controller.setTargetPage( this.titleSearch.getQueryValue() );
  67         };
  68
  69         /**
  70          * Respond to the model being updated
  71          */
  72         mw.rcfilters.ui.RclTargetPageWidget.prototype.updateUiBasedOnModel = function () {
  73                 this.titleSearch.setValue( this.model.getValue() );
  74         };
  75 }( mediaWiki ) );