Merge branch 'mw-1.26'

1 files changed, 239 insertions, 79 deletions

diff --git a/vendor/oojs/oojs-ui/demos/pages/dialogs.js b/vendor/oojs/oojs-ui/demos/pages/dialogs.js
index 6e9da3f8..ff3b0bbd 100644
--- a/vendor/oojs/oojs-ui/demos/pages/dialogs.js
+++ b/vendor/oojs/oojs-ui/demos/pages/dialogs.js
@@ -6,7 +6,7 @@ OO.ui.Demo.static.pages.dialogs = function ( demo ) {
 		windowManager = new OO.ui.WindowManager();
 
 	function SimpleDialog( config ) {
-		SimpleDialog.super.call( this, config );
+		SimpleDialog.parent.call( this, config );
 	}
 	OO.inheritClass( SimpleDialog, OO.ui.Dialog );
 	SimpleDialog.static.title = 'Simple dialog';
@@ -14,7 +14,7 @@ OO.ui.Demo.static.pages.dialogs = function ( demo ) {
 		var closeButton,
 			dialog = this;
 
-		SimpleDialog.super.prototype.initialize.apply( this, arguments );
+		SimpleDialog.parent.prototype.initialize.apply( this, arguments );
 		this.content = new OO.ui.PanelLayout( { padded: true, expanded: false } );
 		this.content.$element.append( '<p>Dialog content</p>' );
 
@@ -33,16 +33,17 @@ OO.ui.Demo.static.pages.dialogs = function ( demo ) {
 	};
 
 	function ProcessDialog( config ) {
-		ProcessDialog.super.call( this, config );
+		ProcessDialog.parent.call( this, config );
 	}
 	OO.inheritClass( ProcessDialog, OO.ui.ProcessDialog );
 	ProcessDialog.static.title = 'Process dialog';
 	ProcessDialog.static.actions = [
 		{ action: 'save', label: 'Done', flags: [ 'primary', 'progressive' ] },
-		{ action: 'cancel', label: 'Cancel', flags: 'safe' }
+		{ action: 'cancel', label: 'Cancel', flags: 'safe' },
+		{ action: 'other', label: 'Other', flags: 'other' }
 	];
 	ProcessDialog.prototype.initialize = function () {
-		ProcessDialog.super.prototype.initialize.apply( this, arguments );
+		ProcessDialog.parent.prototype.initialize.apply( this, arguments );
 		this.content = new OO.ui.PanelLayout( { padded: true, expanded: false } );
 		this.content.$element.append( '<p>Dialog content</p>' );
 		this.$body.append( this.content.$element );
@@ -54,23 +55,32 @@ OO.ui.Demo.static.pages.dialogs = function ( demo ) {
 				dialog.close( { action: action } );
 			} );
 		}
-		return ProcessDialog.super.prototype.getActionProcess.call( this, action );
+		return ProcessDialog.parent.prototype.getActionProcess.call( this, action );
 	};
 	ProcessDialog.prototype.getBodyHeight = function () {
 		return this.content.$element.outerHeight( true );
 	};
 
+	function FramelessProcessDialog( config ) {
+		FramelessProcessDialog.parent.call( this, config );
+	}
+	OO.inheritClass( FramelessProcessDialog, ProcessDialog );
+	FramelessProcessDialog.static.actions = OO.copy( FramelessProcessDialog.static.actions );
+	FramelessProcessDialog.static.actions.forEach( function ( action ) {
+		action.framed = false;
+	} );
+
 	function SearchWidgetDialog( config ) {
-		SearchWidgetDialog.super.call( this, config );
+		SearchWidgetDialog.parent.call( this, config );
 		this.broken = false;
 	}
 	OO.inheritClass( SearchWidgetDialog, OO.ui.ProcessDialog );
 	SearchWidgetDialog.static.title = 'Search widget dialog';
 	SearchWidgetDialog.prototype.initialize = function () {
-		SearchWidgetDialog.super.prototype.initialize.apply( this, arguments );
-		var i,
-			items = [],
-			searchWidget = new OO.ui.SearchWidget();
+		var i, items, searchWidget;
+		SearchWidgetDialog.parent.prototype.initialize.apply( this, arguments );
+		items = [];
+		searchWidget = new OO.ui.SearchWidget();
 		for ( i = 1; i <= 20; i++ ) {
 			items.push( new OO.ui.OptionWidget( { data: i, label: 'Item ' + i } ) );
 		}
@@ -92,7 +102,7 @@ OO.ui.Demo.static.pages.dialogs = function ( demo ) {
 	};
 
 	function BrokenDialog( config ) {
-		BrokenDialog.super.call( this, config );
+		BrokenDialog.parent.call( this, config );
 		this.broken = false;
 	}
 	OO.inheritClass( BrokenDialog, OO.ui.ProcessDialog );
@@ -106,7 +116,7 @@ OO.ui.Demo.static.pages.dialogs = function ( demo ) {
 		return 250;
 	};
 	BrokenDialog.prototype.initialize = function () {
-		BrokenDialog.super.prototype.initialize.apply( this, arguments );
+		BrokenDialog.parent.prototype.initialize.apply( this, arguments );
 		this.content = new OO.ui.PanelLayout( { padded: true } );
 		this.fieldset = new OO.ui.FieldsetLayout( {
 			label: 'Dialog with error handling', icon: 'alert'
@@ -120,13 +130,13 @@ OO.ui.Demo.static.pages.dialogs = function ( demo ) {
 		this.$body.append( this.content.$element );
 	};
 	BrokenDialog.prototype.getSetupProcess = function ( data ) {
-		return BrokenDialog.super.prototype.getSetupProcess.call( this, data )
+		return BrokenDialog.parent.prototype.getSetupProcess.call( this, data )
 			.next( function () {
 				this.broken = true;
 			}, this );
 	};
 	BrokenDialog.prototype.getActionProcess = function ( action ) {
-		return BrokenDialog.super.prototype.getActionProcess.call( this, action )
+		return BrokenDialog.parent.prototype.getActionProcess.call( this, action )
 			.next( function () {
 				return 1000;
 			}, this )
@@ -147,20 +157,22 @@ OO.ui.Demo.static.pages.dialogs = function ( demo ) {
 					// Return a promise to remaing pending while closing
 					return closing;
 				}
-				return BrokenDialog.super.prototype.getActionProcess.call( this, action );
+				return BrokenDialog.parent.prototype.getActionProcess.call( this, action );
 			}, this );
 	};
 
 	function SamplePage( name, config ) {
-		config = $.extend( { label: 'Sample page', icon: 'Sample icon' }, config );
+		config = $.extend( { label: 'Sample page' }, config );
 		OO.ui.PageLayout.call( this, name, config );
 		this.label = config.label;
 		this.icon = config.icon;
-		this.$element.text( this.label );
+		if ( this.$element.is( ':empty' ) ) {
+			this.$element.text( this.label );
+		}
 	}
 	OO.inheritClass( SamplePage, OO.ui.PageLayout );
 	SamplePage.prototype.setupOutlineItem = function ( outlineItem ) {
-		SamplePage.super.prototype.setupOutlineItem.call( this, outlineItem );
+		SamplePage.parent.prototype.setupOutlineItem.call( this, outlineItem );
 		this.outlineItem
 			.setMovable( true )
 			.setRemovable( true )
@@ -169,7 +181,7 @@ OO.ui.Demo.static.pages.dialogs = function ( demo ) {
 	};
 
 	function BookletDialog( config ) {
-		BookletDialog.super.call( this, config );
+		BookletDialog.parent.call( this, config );
 	}
 	OO.inheritClass( BookletDialog, OO.ui.ProcessDialog );
 	BookletDialog.static.title = 'Booklet dialog';
@@ -181,9 +193,10 @@ OO.ui.Demo.static.pages.dialogs = function ( demo ) {
 		return 250;
 	};
 	BookletDialog.prototype.initialize = function () {
-		BookletDialog.super.prototype.initialize.apply( this, arguments );
+		var dialog;
+		BookletDialog.parent.prototype.initialize.apply( this, arguments );
 
-		var dialog = this;
+		dialog = this;
 
 		function changePage( direction ) {
 			var pageIndex = dialog.pages.indexOf( dialog.bookletLayout.getCurrentPage() );
@@ -232,14 +245,14 @@ OO.ui.Demo.static.pages.dialogs = function ( demo ) {
 				this.close( { action: action } );
 			}, this );
 		}
-		return BookletDialog.super.prototype.getActionProcess.call( this, action );
+		return BookletDialog.parent.prototype.getActionProcess.call( this, action );
 	};
 	BookletDialog.prototype.onBookletLayoutSet = function ( page ) {
 		page.$element.append( this.navigationField.$element );
 	};
 
 	function OutlinedBookletDialog( config ) {
-		OutlinedBookletDialog.super.call( this, config );
+		OutlinedBookletDialog.parent.call( this, config );
 	}
 	OO.inheritClass( OutlinedBookletDialog, OO.ui.ProcessDialog );
 	OutlinedBookletDialog.static.title = 'Booklet dialog';
@@ -251,7 +264,7 @@ OO.ui.Demo.static.pages.dialogs = function ( demo ) {
 		return 250;
 	};
 	OutlinedBookletDialog.prototype.initialize = function () {
-		OutlinedBookletDialog.super.prototype.initialize.apply( this, arguments );
+		OutlinedBookletDialog.parent.prototype.initialize.apply( this, arguments );
 		this.bookletLayout = new OO.ui.BookletLayout( {
 			outlined: true
 		} );
@@ -273,32 +286,26 @@ OO.ui.Demo.static.pages.dialogs = function ( demo ) {
 				this.close( { action: action } );
 			}, this );
 		}
-		return OutlinedBookletDialog.super.prototype.getActionProcess.call( this, action );
+		return OutlinedBookletDialog.parent.prototype.getActionProcess.call( this, action );
 	};
 	OutlinedBookletDialog.prototype.onBookletLayoutSet = function ( page ) {
 		this.setSize( page.getName() );
 	};
 	OutlinedBookletDialog.prototype.getSetupProcess = function ( data ) {
-		return OutlinedBookletDialog.super.prototype.getSetupProcess.call( this, data )
+		return OutlinedBookletDialog.parent.prototype.getSetupProcess.call( this, data )
 			.next( function () {
 				this.bookletLayout.setPage( this.getSize() );
 			}, this );
 	};
 
 	function SampleCard( name, config ) {
-		config = $.extend( { label: 'Sample card' }, config );
 		OO.ui.CardLayout.call( this, name, config );
-		this.label = config.label;
 		this.$element.text( this.label );
 	}
 	OO.inheritClass( SampleCard, OO.ui.CardLayout );
-	SampleCard.prototype.setupTabItem = function ( tabItem ) {
-		SampleCard.super.prototype.setupTabItem.call( this, tabItem );
-		this.tabItem.setLabel( this.label );
-	};
 
 	function IndexedDialog( config ) {
-		IndexedDialog.super.call( this, config );
+		IndexedDialog.parent.call( this, config );
 	}
 	OO.inheritClass( IndexedDialog, OO.ui.ProcessDialog );
 	IndexedDialog.static.title = 'Index dialog';
@@ -310,7 +317,7 @@ OO.ui.Demo.static.pages.dialogs = function ( demo ) {
 		return 250;
 	};
 	IndexedDialog.prototype.initialize = function () {
-		IndexedDialog.super.prototype.initialize.apply( this, arguments );
+		IndexedDialog.parent.prototype.initialize.apply( this, arguments );
 		this.indexLayout = new OO.ui.IndexLayout();
 		this.cards = [
 			new SampleCard( 'first', { label: 'One' } ),
@@ -330,11 +337,11 @@ OO.ui.Demo.static.pages.dialogs = function ( demo ) {
 				this.close( { action: action } );
 			}, this );
 		}
-		return IndexedDialog.super.prototype.getActionProcess.call( this, action );
+		return IndexedDialog.parent.prototype.getActionProcess.call( this, action );
 	};
 
 	function MenuDialog( config ) {
-		MenuDialog.super.call( this, config );
+		MenuDialog.parent.call( this, config );
 	}
 	OO.inheritClass( MenuDialog, OO.ui.ProcessDialog );
 	MenuDialog.static.title = 'Menu dialog';
@@ -346,47 +353,49 @@ OO.ui.Demo.static.pages.dialogs = function ( demo ) {
 		return 350;
 	};
 	MenuDialog.prototype.initialize = function () {
-		MenuDialog.super.prototype.initialize.apply( this, arguments );
-		var menuLayout = new OO.ui.MenuLayout(),
-			positionField = new OO.ui.FieldLayout(
-				new OO.ui.ButtonSelectWidget( {
-					items: [
-						new OO.ui.ButtonOptionWidget( {
-							data: 'before',
-							label: 'Before'
-						} ),
-						new OO.ui.ButtonOptionWidget( {
-							data: 'after',
-							label: 'After'
-						} ),
-						new OO.ui.ButtonOptionWidget( {
-							data: 'top',
-							label: 'Top'
-						} ),
-						new OO.ui.ButtonOptionWidget( {
-							data: 'bottom',
-							label: 'Bottom'
-						} )
-					]
-				} ).on( 'select', function ( item ) {
-					menuLayout.setMenuPosition( item.getData() );
-				} ),
-				{
-					label: 'Menu position',
-					align: 'top'
-				}
-			),
-			showField = new OO.ui.FieldLayout(
-				new OO.ui.ToggleSwitchWidget( { value: true } ).on( 'change', function ( value ) {
-					menuLayout.toggleMenu( value );
-				} ),
-				{
-					label: 'Show menu',
-					align: 'top'
-				}
-			),
-			menuPanel = new OO.ui.PanelLayout( { padded: true, expanded: true, scrollable: true } ),
-			contentPanel = new OO.ui.PanelLayout( { padded: true, expanded: true, scrollable: true } );
+		var menuLayout, positionField, showField, menuPanel, contentPanel;
+		MenuDialog.parent.prototype.initialize.apply( this, arguments );
+
+		menuLayout = new OO.ui.MenuLayout();
+		positionField = new OO.ui.FieldLayout(
+			new OO.ui.ButtonSelectWidget( {
+				items: [
+					new OO.ui.ButtonOptionWidget( {
+						data: 'before',
+						label: 'Before'
+					} ),
+					new OO.ui.ButtonOptionWidget( {
+						data: 'after',
+						label: 'After'
+					} ),
+					new OO.ui.ButtonOptionWidget( {
+						data: 'top',
+						label: 'Top'
+					} ),
+					new OO.ui.ButtonOptionWidget( {
+						data: 'bottom',
+						label: 'Bottom'
+					} )
+				]
+			} ).on( 'select', function ( item ) {
+				menuLayout.setMenuPosition( item.getData() );
+			} ),
+			{
+				label: 'Menu position',
+				align: 'top'
+			}
+		);
+		showField = new OO.ui.FieldLayout(
+			new OO.ui.ToggleSwitchWidget( { value: true } ).on( 'change', function ( value ) {
+				menuLayout.toggleMenu( value );
+			} ),
+			{
+				label: 'Show menu',
+				align: 'top'
+			}
+		);
+		menuPanel = new OO.ui.PanelLayout( { padded: true, expanded: true, scrollable: true } );
+		contentPanel = new OO.ui.PanelLayout( { padded: true, expanded: true, scrollable: true } );
 
 		menuLayout.$menu.append(
 			menuPanel.$element.append( 'Menu panel' )
@@ -406,7 +415,144 @@ OO.ui.Demo.static.pages.dialogs = function ( demo ) {
 				this.close( { action: action } );
 			}, this );
 		}
-		return MenuDialog.super.prototype.getActionProcess.call( this, action );
+		return MenuDialog.parent.prototype.getActionProcess.call( this, action );
+	};
+
+	function ExampleLookupTextInputWidget( config ) {
+		config = config || {};
+		this.items = config.items || [];
+		OO.ui.TextInputWidget.call( this, config );
+		OO.ui.mixin.LookupElement.call( this, config );
+	}
+	OO.inheritClass( ExampleLookupTextInputWidget, OO.ui.TextInputWidget );
+	OO.mixinClass( ExampleLookupTextInputWidget, OO.ui.mixin.LookupElement );
+	ExampleLookupTextInputWidget.prototype.getLookupRequest = function () {
+		return $.Deferred().resolve( [] ).promise( { abort: function () {} } );
+	};
+	ExampleLookupTextInputWidget.prototype.getLookupCacheDataFromResponse = function () {
+		return [];
+	};
+	ExampleLookupTextInputWidget.prototype.getLookupMenuOptionsFromData = function () {
+		return this.items;
+	};
+
+	function DialogWithDropdowns( config ) {
+		DialogWithDropdowns.parent.call( this, config );
+	}
+	OO.inheritClass( DialogWithDropdowns, OO.ui.ProcessDialog );
+	DialogWithDropdowns.static.title = 'Dialog with dropdowns ($overlay test)';
+	DialogWithDropdowns.static.actions = [
+		{ action: 'save', label: 'Done', flags: [ 'primary', 'progressive' ] },
+		{ action: 'cancel', label: 'Cancel', flags: 'safe' }
+	];
+	DialogWithDropdowns.prototype.getBodyHeight = function () {
+		return 250;
+	};
+	DialogWithDropdowns.prototype.initialize = function () {
+		var $spacer = $( '<div>' ).height( 150 );
+		DialogWithDropdowns.parent.prototype.initialize.apply( this, arguments );
+		this.bookletLayout = new OO.ui.BookletLayout( {
+			outlined: true
+		} );
+		this.pages = [
+			new SamplePage( 'info', {
+				label: 'Information',
+				icon: 'info',
+				content: [
+					'This is a test of various kinds of dropdown menus and their $overlay config option. ',
+					'Entries without any icon use a correctly set $overlay and their menus should be able to extend outside of this small dialog. ',
+					'Entries with the ', new OO.ui.IconWidget( { icon: 'alert' } ), ' icon do not, and their menus should be clipped to the dialog\'s boundaries. ',
+					'All dropdown menus should stick to the widget proper, even when scrolling while the menu is open.'
+				]
+			} ),
+			new SamplePage( 'dropdown', {
+				label: 'DropdownWidget',
+				content: [ $spacer.clone(), new OO.ui.DropdownWidget( {
+					$overlay: this.$overlay,
+					menu: {
+						items: this.makeItems()
+					}
+				} ), $spacer.clone() ]
+			} ),
+			new SamplePage( 'dropdown2', {
+				label: 'DropdownWidget',
+				icon: 'alert',
+				content: [ $spacer.clone(), new OO.ui.DropdownWidget( {
+					menu: {
+						items: this.makeItems()
+					}
+				} ), $spacer.clone() ]
+			} ),
+			new SamplePage( 'combobox', {
+				label: 'ComboBoxWidget',
+				content: [ $spacer.clone(), new OO.ui.ComboBoxWidget( {
+					$overlay: this.$overlay,
+					menu: {
+						items: this.makeItems()
+					}
+				} ), $spacer.clone() ]
+			} ),
+			new SamplePage( 'combobox2', {
+				label: 'ComboBoxWidget',
+				icon: 'alert',
+				content: [ $spacer.clone(), new OO.ui.ComboBoxWidget( {
+					menu: {
+						items: this.makeItems()
+					}
+				} ), $spacer.clone() ]
+			} ),
+			new SamplePage( 'lookup', {
+				label: 'LookupElement',
+				content: [ $spacer.clone(), new ExampleLookupTextInputWidget( {
+					$overlay: this.$overlay,
+					items: this.makeItems()
+				} ), $spacer.clone() ]
+			} ),
+			new SamplePage( 'lookup2', {
+				label: 'LookupElement',
+				icon: 'alert',
+				content: [ $spacer.clone(), new ExampleLookupTextInputWidget( {
+					items: this.makeItems()
+				} ), $spacer.clone() ]
+			} ),
+			new SamplePage( 'capsule', {
+				label: 'CapsuleMultiSelectWidget',
+				content: [ $spacer.clone(), new OO.ui.CapsuleMultiSelectWidget( {
+					$overlay: this.$overlay,
+					menu: {
+						items: this.makeItems()
+					}
+				} ), $spacer.clone() ]
+			} ),
+			new SamplePage( 'capsule2', {
+				label: 'CapsuleMultiSelectWidget',
+				icon: 'alert',
+				content: [ $spacer.clone(), new OO.ui.CapsuleMultiSelectWidget( {
+					menu: {
+						items: this.makeItems()
+					}
+				} ), $spacer.clone() ]
+			} )
+		];
+		this.bookletLayout.addPages( this.pages );
+		this.$body.append( this.bookletLayout.$element );
+	};
+	DialogWithDropdowns.prototype.makeItems = function () {
+		return [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 ].map( function ( val ) {
+			return new OO.ui.MenuOptionWidget( {
+				data: val,
+				label: String( val )
+			} );
+		} );
+	};
+
+	DialogWithDropdowns.prototype.getActionProcess = function ( action ) {
+		if ( action ) {
+			return new OO.ui.Process( function () {
+				this.close( { action: action } );
+			}, this );
+		}
+		return DialogWithDropdowns.parent.prototype.getActionProcess.call( this, action );
 	};
 
 	config = [
@@ -451,6 +597,13 @@ OO.ui.Demo.static.pages.dialogs = function ( demo ) {
 			}
 		},
 		{
+			name: 'Process dialog (frameless buttons)',
+			dialogClass: FramelessProcessDialog,
+			config: {
+				size: 'medium'
+			}
+		},
+		{
 			name: 'Process dialog (full)',
 			dialogClass: ProcessDialog,
 			config: {
@@ -500,6 +653,13 @@ OO.ui.Demo.static.pages.dialogs = function ( demo ) {
 			}
 		},
 		{
+			name: 'Dialog with dropdowns ($overlay test)',
+			dialogClass: DialogWithDropdowns,
+			config: {
+				size: 'large'
+			}
+		},
+		{
 			name: 'Message dialog (generic)',
 			dialogClass: OO.ui.MessageDialog,
 			data: {