This dialog uses an action set (continue, help, cancel, back) configured with modes. This is edit mode. Click \\'help\\' to see help mode.
' );\n * this.panel2 = new OO.ui.PanelLayout( { padded: true, expanded: false } );\n * this.panel2.$element.append( 'This is help mode. Only the \\'back\\' action widget is configured to be visible here. Click \\'back\\' to return to \\'edit\\' mode.
' );\n * this.stackLayout = new OO.ui.StackLayout( {\n * items: [ this.panel1, this.panel2 ]\n * } );\n * this.$body.append( this.stackLayout.$element );\n * };\n * MyProcessDialog.prototype.getSetupProcess = function ( data ) {\n * return MyProcessDialog.parent.prototype.getSetupProcess.call( this, data )\n * .next( function () {\n * this.actions.setMode( 'edit' );\n * }, this );\n * };\n * MyProcessDialog.prototype.getActionProcess = function ( action ) {\n * if ( action === 'help' ) {\n * this.actions.setMode( 'help' );\n * this.stackLayout.setItem( this.panel2 );\n * } else if ( action === 'back' ) {\n * this.actions.setMode( 'edit' );\n * this.stackLayout.setItem( this.panel1 );\n * } else if ( action === 'continue' ) {\n * var dialog = this;\n * return new OO.ui.Process( function () {\n * dialog.close();\n * } );\n * }\n * return MyProcessDialog.parent.prototype.getActionProcess.call( this, action );\n * };\n * MyProcessDialog.prototype.getBodyHeight = function () {\n * return this.panel1.$element.outerHeight( true );\n * };\n * var windowManager = new OO.ui.WindowManager();\n * $( 'body' ).append( windowManager.$element );\n * var dialog = new MyProcessDialog( {\n * size: 'medium'\n * } );\n * windowManager.addWindows( [ dialog ] );\n * windowManager.openWindow( dialog );\n *\n * [1]: https://www.mediawiki.org/wiki/OOjs_UI/Windows/Process_Dialogs#Action_sets\n *\n * @abstract\n * @class\n * @mixins OO.EventEmitter\n *\n * @constructor\n * @param {Object} [config] Configuration options\n */\nOO.ui.ActionSet = function OoUiActionSet( config ) {\n\t// Configuration initialization\n\tconfig = config || {};\n\n\t// Mixin constructors\n\tOO.EventEmitter.call( this );\n\n\t// Properties\n\tthis.list = [];\n\tthis.categories = {\n\t\tactions: 'getAction',\n\t\tflags: 'getFlags',\n\t\tmodes: 'getModes'\n\t};\n\tthis.categorized = {};\n\tthis.special = {};\n\tthis.others = [];\n\tthis.organized = false;\n\tthis.changing = false;\n\tthis.changed = false;\n};\n/* eslint-enable no-unused-vars */\n\n/* Setup */\n\nOO.mixinClass( OO.ui.ActionSet, OO.EventEmitter );\n\n/* Static Properties */\n\n/**\n * Symbolic name of the flags used to identify special actions. Special actions are displayed in the\n * header of a {@link OO.ui.ProcessDialog process dialog}.\n * See the [OOjs UI documentation on MediaWiki][2] for more information and examples.\n *\n * [2]:https://www.mediawiki.org/wiki/OOjs_UI/Windows/Process_Dialogs\n *\n * @abstract\n * @static\n * @inheritable\n * @property {string}\n */\nOO.ui.ActionSet.static.specialFlags = [ 'safe', 'primary' ];\n\n/* Events */\n\n/**\n * @event click\n *\n * A 'click' event is emitted when an action is clicked.\n *\n * @param {OO.ui.ActionWidget} action Action that was clicked\n */\n\n/**\n * @event add\n *\n * An 'add' event is emitted when actions are {@link #method-add added} to the action set.\n *\n * @param {OO.ui.ActionWidget[]} added Actions added\n */\n\n/**\n * @event remove\n *\n * A 'remove' event is emitted when actions are {@link #method-remove removed}\n * or {@link #clear cleared}.\n *\n * @param {OO.ui.ActionWidget[]} added Actions removed\n */\n\n/**\n * @event change\n *\n * A 'change' event is emitted when actions are {@link #method-add added}, {@link #clear cleared},\n * or {@link #method-remove removed} from the action set or when the {@link #setMode mode} is changed.\n *\n */\n\n/* Methods */\n\n/**\n * Handle action change events.\n *\n * @private\n * @fires change\n */\nOO.ui.ActionSet.prototype.onActionChange = function () {\n\tthis.organized = false;\n\tif ( this.changing ) {\n\t\tthis.changed = true;\n\t} else {\n\t\tthis.emit( 'change' );\n\t}\n};\n\n/**\n * Check if an action is one of the special actions.\n *\n * @param {OO.ui.ActionWidget} action Action to check\n * @return {boolean} Action is special\n */\nOO.ui.ActionSet.prototype.isSpecial = function ( action ) {\n\tvar flag;\n\n\tfor ( flag in this.special ) {\n\t\tif ( action === this.special[ flag ] ) {\n\t\t\treturn true;\n\t\t}\n\t}\n\n\treturn false;\n};\n\n/**\n * Get action widgets based on the specified filter: ‘actions’, ‘flags’, ‘modes’, ‘visible’,\n * or ‘disabled’.\n *\n * @param {Object} [filters] Filters to use, omit to get all actions\n * @param {string|string[]} [filters.actions] Actions that action widgets must have\n * @param {string|string[]} [filters.flags] Flags that action widgets must have (e.g., 'safe')\n * @param {string|string[]} [filters.modes] Modes that action widgets must have\n * @param {boolean} [filters.visible] Action widgets must be visible\n * @param {boolean} [filters.disabled] Action widgets must be disabled\n * @return {OO.ui.ActionWidget[]} Action widgets matching all criteria\n */\nOO.ui.ActionSet.prototype.get = function ( filters ) {\n\tvar i, len, list, category, actions, index, match, matches;\n\n\tif ( filters ) {\n\t\tthis.organize();\n\n\t\t// Collect category candidates\n\t\tmatches = [];\n\t\tfor ( category in this.categorized ) {\n\t\t\tlist = filters[ category ];\n\t\t\tif ( list ) {\n\t\t\t\tif ( !Array.isArray( list ) ) {\n\t\t\t\t\tlist = [ list ];\n\t\t\t\t}\n\t\t\t\tfor ( i = 0, len = list.length; i < len; i++ ) {\n\t\t\t\t\tactions = this.categorized[ category ][ list[ i ] ];\n\t\t\t\t\tif ( Array.isArray( actions ) ) {\n\t\t\t\t\t\tmatches.push.apply( matches, actions );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t// Remove by boolean filters\n\t\tfor ( i = 0, len = matches.length; i < len; i++ ) {\n\t\t\tmatch = matches[ i ];\n\t\t\tif (\n\t\t\t\t( filters.visible !== undefined && match.isVisible() !== filters.visible ) ||\n\t\t\t\t( filters.disabled !== undefined && match.isDisabled() !== filters.disabled )\n\t\t\t) {\n\t\t\t\tmatches.splice( i, 1 );\n\t\t\t\tlen--;\n\t\t\t\ti--;\n\t\t\t}\n\t\t}\n\t\t// Remove duplicates\n\t\tfor ( i = 0, len = matches.length; i < len; i++ ) {\n\t\t\tmatch = matches[ i ];\n\t\t\tindex = matches.lastIndexOf( match );\n\t\t\twhile ( index !== i ) {\n\t\t\t\tmatches.splice( index, 1 );\n\t\t\t\tlen--;\n\t\t\t\tindex = matches.lastIndexOf( match );\n\t\t\t}\n\t\t}\n\t\treturn matches;\n\t}\n\treturn this.list.slice();\n};\n\n/**\n * Get 'special' actions.\n *\n * Special actions are the first visible action widgets with special flags, such as 'safe' and 'primary'.\n * Special flags can be configured in subclasses by changing the static #specialFlags property.\n *\n * @return {OO.ui.ActionWidget[]|null} 'Special' action widgets.\n */\nOO.ui.ActionSet.prototype.getSpecial = function () {\n\tthis.organize();\n\treturn $.extend( {}, this.special );\n};\n\n/**\n * Get 'other' actions.\n *\n * Other actions include all non-special visible action widgets.\n *\n * @return {OO.ui.ActionWidget[]} 'Other' action widgets\n */\nOO.ui.ActionSet.prototype.getOthers = function () {\n\tthis.organize();\n\treturn this.others.slice();\n};\n\n/**\n * Set the mode (e.g., ‘edit’ or ‘view’). Only {@link OO.ui.ActionWidget#modes actions} configured\n * to be available in the specified mode will be made visible. All other actions will be hidden.\n *\n * @param {string} mode The mode. Only actions configured to be available in the specified\n * mode will be made visible.\n * @chainable\n * @fires toggle\n * @fires change\n */\nOO.ui.ActionSet.prototype.setMode = function ( mode ) {\n\tvar i, len, action;\n\n\tthis.changing = true;\n\tfor ( i = 0, len = this.list.length; i < len; i++ ) {\n\t\taction = this.list[ i ];\n\t\taction.toggle( action.hasMode( mode ) );\n\t}\n\n\tthis.organized = false;\n\tthis.changing = false;\n\tthis.emit( 'change' );\n\n\treturn this;\n};\n\n/**\n * Set the abilities of the specified actions.\n *\n * Action widgets that are configured with the specified actions will be enabled\n * or disabled based on the boolean values specified in the `actions`\n * parameter.\n *\n * @param {Object.Popup contents.
Popup contents.
Popup contents.
' ),\n\t * padded: true\n\t * }\n\t * } );\n\t * ...\n\t * };\n\t *\n\t * @property {jQuery}\n\t */\n\tthis.$overlay = $( 'A simple dialog window. Press \\'Esc\\' to close.
' );\n * this.$body.append( this.content.$element );\n * };\n * MyDialog.prototype.getBodyHeight = function () {\n * return this.content.$element.outerHeight( true );\n * };\n * var myDialog = new MyDialog( {\n * size: 'medium'\n * } );\n * // Create and append a window manager, which opens and closes the window.\n * var windowManager = new OO.ui.WindowManager();\n * $( 'body' ).append( windowManager.$element );\n * windowManager.addWindows( [ myDialog ] );\n * // Open the window!\n * windowManager.openWindow( myDialog );\n *\n * [1]: https://www.mediawiki.org/wiki/OOjs_UI/Windows/Dialogs\n *\n * @abstract\n * @class\n * @extends OO.ui.Window\n * @mixins OO.ui.mixin.PendingElement\n *\n * @constructor\n * @param {Object} [config] Configuration options\n */\nOO.ui.Dialog = function OoUiDialog( config ) {\n\t// Parent constructor\n\tOO.ui.Dialog.parent.call( this, config );\n\n\t// Mixin constructors\n\tOO.ui.mixin.PendingElement.call( this );\n\n\t// Properties\n\tthis.actions = new OO.ui.ActionSet();\n\tthis.attachedActions = [];\n\tthis.currentAction = null;\n\tthis.onDialogKeyDownHandler = this.onDialogKeyDown.bind( this );\n\n\t// Events\n\tthis.actions.connect( this, {\n\t\tclick: 'onActionClick',\n\t\tchange: 'onActionsChange'\n\t} );\n\n\t// Initialization\n\tthis.$element\n\t\t.addClass( 'oo-ui-dialog' )\n\t\t.attr( 'role', 'dialog' );\n};\n\n/* Setup */\n\nOO.inheritClass( OO.ui.Dialog, OO.ui.Window );\nOO.mixinClass( OO.ui.Dialog, OO.ui.mixin.PendingElement );\n\n/* Static Properties */\n\n/**\n * Symbolic name of dialog.\n *\n * The dialog class must have a symbolic name in order to be registered with OO.Factory.\n * Please see the [OOjs UI documentation on MediaWiki] [3] for more information.\n *\n * [3]: https://www.mediawiki.org/wiki/OOjs_UI/Windows/Window_managers\n *\n * @abstract\n * @static\n * @inheritable\n * @property {string}\n */\nOO.ui.Dialog.static.name = '';\n\n/**\n * The dialog title.\n *\n * The title can be specified as a plaintext string, a {@link OO.ui.mixin.LabelElement Label} node, or a function\n * that will produce a Label node or string. The title can also be specified with data passed to the\n * constructor (see #getSetupProcess). In this case, the static value will be overridden.\n *\n * @abstract\n * @static\n * @inheritable\n * @property {jQuery|string|Function}\n */\nOO.ui.Dialog.static.title = '';\n\n/**\n * An array of configured {@link OO.ui.ActionWidget action widgets}.\n *\n * Actions can also be specified with data passed to the constructor (see #getSetupProcess). In this case, the static\n * value will be overridden.\n *\n * [2]: https://www.mediawiki.org/wiki/OOjs_UI/Windows/Process_Dialogs#Action_sets\n *\n * @static\n * @inheritable\n * @property {Object[]}\n */\nOO.ui.Dialog.static.actions = [];\n\n/**\n * Close the dialog when the 'Esc' key is pressed.\n *\n * @static\n * @abstract\n * @inheritable\n * @property {boolean}\n */\nOO.ui.Dialog.static.escapable = true;\n\n/* Methods */\n\n/**\n * Handle frame document key down events.\n *\n * @private\n * @param {jQuery.Event} e Key down event\n */\nOO.ui.Dialog.prototype.onDialogKeyDown = function ( e ) {\n\tvar actions;\n\tif ( e.which === OO.ui.Keys.ESCAPE && this.constructor.static.escapable ) {\n\t\tthis.executeAction( '' );\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\t} else if ( e.which === OO.ui.Keys.ENTER && ( e.ctrlKey || e.metaKey ) ) {\n\t\tactions = this.actions.get( { flags: 'primary', visible: true, disabled: false } );\n\t\tif ( actions.length > 0 ) {\n\t\t\tthis.executeAction( actions[ 0 ].getAction() );\n\t\t\te.preventDefault();\n\t\t\te.stopPropagation();\n\t\t}\n\t}\n};\n\n/**\n * Handle action click events.\n *\n * @private\n * @param {OO.ui.ActionWidget} action Action that was clicked\n */\nOO.ui.Dialog.prototype.onActionClick = function ( action ) {\n\tif ( !this.isPending() ) {\n\t\tthis.executeAction( action.getAction() );\n\t}\n};\n\n/**\n * Handle actions change event.\n *\n * @private\n */\nOO.ui.Dialog.prototype.onActionsChange = function () {\n\tthis.detachActions();\n\tif ( !this.isClosing() ) {\n\t\tthis.attachActions();\n\t}\n};\n\n/**\n * Get the set of actions used by the dialog.\n *\n * @return {OO.ui.ActionSet}\n */\nOO.ui.Dialog.prototype.getActions = function () {\n\treturn this.actions;\n};\n\n/**\n * Get a process for taking action.\n *\n * When you override this method, you can create a new OO.ui.Process and return it, or add additional\n * accept steps to the process the parent method provides using the {@link OO.ui.Process#first 'first'}\n * and {@link OO.ui.Process#next 'next'} methods of OO.ui.Process.\n *\n * @param {string} [action] Symbolic name of action\n * @return {OO.ui.Process} Action process\n */\nOO.ui.Dialog.prototype.getActionProcess = function ( action ) {\n\treturn new OO.ui.Process()\n\t\t.next( function () {\n\t\t\tif ( !action ) {\n\t\t\t\t// An empty action always closes the dialog without data, which should always be\n\t\t\t\t// safe and make no changes\n\t\t\t\tthis.close();\n\t\t\t}\n\t\t}, this );\n};\n\n/**\n * @inheritdoc\n *\n * @param {Object} [data] Dialog opening data\n * @param {jQuery|string|Function|null} [data.title] Dialog title, omit to use\n * the {@link #static-title static title}\n * @param {Object[]} [data.actions] List of configuration options for each\n * {@link OO.ui.ActionWidget action widget}, omit to use {@link #static-actions static actions}.\n */\nOO.ui.Dialog.prototype.getSetupProcess = function ( data ) {\n\tdata = data || {};\n\n\t// Parent method\n\treturn OO.ui.Dialog.parent.prototype.getSetupProcess.call( this, data )\n\t\t.next( function () {\n\t\t\tvar config = this.constructor.static,\n\t\t\t\tactions = data.actions !== undefined ? data.actions : config.actions,\n\t\t\t\ttitle = data.title !== undefined ? data.title : config.title;\n\n\t\t\tthis.title.setLabel( title ).setTitle( title );\n\t\t\tthis.actions.add( this.getActionWidgets( actions ) );\n\n\t\t\tthis.$element.on( 'keydown', this.onDialogKeyDownHandler );\n\t\t}, this );\n};\n\n/**\n * @inheritdoc\n */\nOO.ui.Dialog.prototype.getTeardownProcess = function ( data ) {\n\t// Parent method\n\treturn OO.ui.Dialog.parent.prototype.getTeardownProcess.call( this, data )\n\t\t.first( function () {\n\t\t\tthis.$element.off( 'keydown', this.onDialogKeyDownHandler );\n\n\t\t\tthis.actions.clear();\n\t\t\tthis.currentAction = null;\n\t\t}, this );\n};\n\n/**\n * @inheritdoc\n */\nOO.ui.Dialog.prototype.initialize = function () {\n\t// Parent method\n\tOO.ui.Dialog.parent.prototype.initialize.call( this );\n\n\t// Properties\n\tthis.title = new OO.ui.LabelWidget();\n\n\t// Initialization\n\tthis.$content.addClass( 'oo-ui-dialog-content' );\n\tthis.$element.attr( 'aria-labelledby', this.title.getElementId() );\n\tthis.setPendingElement( this.$head );\n};\n\n/**\n * Get action widgets from a list of configs\n *\n * @param {Object[]} actions Action widget configs\n * @return {OO.ui.ActionWidget[]} Action widgets\n */\nOO.ui.Dialog.prototype.getActionWidgets = function ( actions ) {\n\tvar i, len, widgets = [];\n\tfor ( i = 0, len = actions.length; i < len; i++ ) {\n\t\twidgets.push(\n\t\t\tnew OO.ui.ActionWidget( actions[ i ] )\n\t\t);\n\t}\n\treturn widgets;\n};\n\n/**\n * Attach action actions.\n *\n * @protected\n */\nOO.ui.Dialog.prototype.attachActions = function () {\n\t// Remember the list of potentially attached actions\n\tthis.attachedActions = this.actions.get();\n};\n\n/**\n * Detach action actions.\n *\n * @protected\n * @chainable\n */\nOO.ui.Dialog.prototype.detachActions = function () {\n\tvar i, len;\n\n\t// Detach all actions that may have been previously attached\n\tfor ( i = 0, len = this.attachedActions.length; i < len; i++ ) {\n\t\tthis.attachedActions[ i ].$element.detach();\n\t}\n\tthis.attachedActions = [];\n};\n\n/**\n * Execute an action.\n *\n * @param {string} action Symbolic name of action to execute\n * @return {jQuery.Promise} Promise resolved when action completes, rejected if it fails\n */\nOO.ui.Dialog.prototype.executeAction = function ( action ) {\n\tthis.pushPending();\n\tthis.currentAction = action;\n\treturn this.getActionProcess( action ).execute()\n\t\t.always( this.popPending.bind( this ) );\n};\n","/**\n * MessageDialogs display a confirmation or alert message. By default, the rendered dialog box\n * consists of a header that contains the dialog title, a body with the message, and a footer that\n * contains any {@link OO.ui.ActionWidget action widgets}. The MessageDialog class is the only type\n * of {@link OO.ui.Dialog dialog} that is usually instantiated directly.\n *\n * There are two basic types of message dialogs, confirmation and alert:\n *\n * - **confirmation**: the dialog title describes what a progressive action will do and the message provides\n * more details about the consequences.\n * - **alert**: the dialog title describes which event occurred and the message provides more information\n * about why the event occurred.\n *\n * The MessageDialog class specifies two actions: ‘accept’, the primary\n * action (e.g., ‘ok’) and ‘reject,’ the safe action (e.g., ‘cancel’). Both will close the window,\n * passing along the selected action.\n *\n * For more information and examples, please see the [OOjs UI documentation on MediaWiki][1].\n *\n * @example\n * // Example: Creating and opening a message dialog window.\n * var messageDialog = new OO.ui.MessageDialog();\n *\n * // Create and append a window manager.\n * var windowManager = new OO.ui.WindowManager();\n * $( 'body' ).append( windowManager.$element );\n * windowManager.addWindows( [ messageDialog ] );\n * // Open the window.\n * windowManager.openWindow( messageDialog, {\n * title: 'Basic message dialog',\n * message: 'This is the message'\n * } );\n *\n * [1]: https://www.mediawiki.org/wiki/OOjs_UI/Windows/Message_Dialogs\n *\n * @class\n * @extends OO.ui.Dialog\n *\n * @constructor\n * @param {Object} [config] Configuration options\n */\nOO.ui.MessageDialog = function OoUiMessageDialog( config ) {\n\t// Parent constructor\n\tOO.ui.MessageDialog.parent.call( this, config );\n\n\t// Properties\n\tthis.verticalActionLayout = null;\n\n\t// Initialization\n\tthis.$element.addClass( 'oo-ui-messageDialog' );\n};\n\n/* Setup */\n\nOO.inheritClass( OO.ui.MessageDialog, OO.ui.Dialog );\n\n/* Static Properties */\n\n/**\n * @static\n * @inheritdoc\n */\nOO.ui.MessageDialog.static.name = 'message';\n\n/**\n * @static\n * @inheritdoc\n */\nOO.ui.MessageDialog.static.size = 'small';\n\n/**\n * Dialog title.\n *\n * The title of a confirmation dialog describes what a progressive action will do. The\n * title of an alert dialog describes which event occurred.\n *\n * @static\n * @inheritable\n * @property {jQuery|string|Function|null}\n */\nOO.ui.MessageDialog.static.title = null;\n\n/**\n * The message displayed in the dialog body.\n *\n * A confirmation message describes the consequences of a progressive action. An alert\n * message describes why an event occurred.\n *\n * @static\n * @inheritable\n * @property {jQuery|string|Function|null}\n */\nOO.ui.MessageDialog.static.message = null;\n\n/**\n * @static\n * @inheritdoc\n */\nOO.ui.MessageDialog.static.actions = [\n\t// Note that OO.ui.alert() and OO.ui.confirm() rely on these.\n\t{ action: 'accept', label: OO.ui.deferMsg( 'ooui-dialog-message-accept' ), flags: 'primary' },\n\t{ action: 'reject', label: OO.ui.deferMsg( 'ooui-dialog-message-reject' ), flags: 'safe' }\n];\n\n/* Methods */\n\n/**\n * @inheritdoc\n */\nOO.ui.MessageDialog.prototype.setManager = function ( manager ) {\n\tOO.ui.MessageDialog.parent.prototype.setManager.call( this, manager );\n\n\t// Events\n\tthis.manager.connect( this, {\n\t\tresize: 'onResize'\n\t} );\n\n\treturn this;\n};\n\n/**\n * Handle window resized events.\n *\n * @private\n */\nOO.ui.MessageDialog.prototype.onResize = function () {\n\tvar dialog = this;\n\tdialog.fitActions();\n\t// Wait for CSS transition to finish and do it again :(\n\tsetTimeout( function () {\n\t\tdialog.fitActions();\n\t}, 300 );\n};\n\n/**\n * Toggle action layout between vertical and horizontal.\n *\n * @private\n * @param {boolean} [value] Layout actions vertically, omit to toggle\n * @chainable\n */\nOO.ui.MessageDialog.prototype.toggleVerticalActionLayout = function ( value ) {\n\tvalue = value === undefined ? !this.verticalActionLayout : !!value;\n\n\tif ( value !== this.verticalActionLayout ) {\n\t\tthis.verticalActionLayout = value;\n\t\tthis.$actions\n\t\t\t.toggleClass( 'oo-ui-messageDialog-actions-vertical', value )\n\t\t\t.toggleClass( 'oo-ui-messageDialog-actions-horizontal', !value );\n\t}\n\n\treturn this;\n};\n\n/**\n * @inheritdoc\n */\nOO.ui.MessageDialog.prototype.getActionProcess = function ( action ) {\n\tif ( action ) {\n\t\treturn new OO.ui.Process( function () {\n\t\t\tthis.close( { action: action } );\n\t\t}, this );\n\t}\n\treturn OO.ui.MessageDialog.parent.prototype.getActionProcess.call( this, action );\n};\n\n/**\n * @inheritdoc\n *\n * @param {Object} [data] Dialog opening data\n * @param {jQuery|string|Function|null} [data.title] Description of the action being confirmed\n * @param {jQuery|string|Function|null} [data.message] Description of the action's consequence\n * @param {string} [data.size] Symbolic name of the dialog size, see OO.ui.Window\n * @param {Object[]} [data.actions] List of OO.ui.ActionOptionWidget configuration options for each\n * action item\n */\nOO.ui.MessageDialog.prototype.getSetupProcess = function ( data ) {\n\tdata = data || {};\n\n\t// Parent method\n\treturn OO.ui.MessageDialog.parent.prototype.getSetupProcess.call( this, data )\n\t\t.next( function () {\n\t\t\tthis.title.setLabel(\n\t\t\t\tdata.title !== undefined ? data.title : this.constructor.static.title\n\t\t\t);\n\t\t\tthis.message.setLabel(\n\t\t\t\tdata.message !== undefined ? data.message : this.constructor.static.message\n\t\t\t);\n\t\t\tthis.size = data.size !== undefined ? data.size : this.constructor.static.size;\n\t\t}, this );\n};\n\n/**\n * @inheritdoc\n */\nOO.ui.MessageDialog.prototype.getReadyProcess = function ( data ) {\n\tdata = data || {};\n\n\t// Parent method\n\treturn OO.ui.MessageDialog.parent.prototype.getReadyProcess.call( this, data )\n\t\t.next( function () {\n\t\t\t// Focus the primary action button\n\t\t\tvar actions = this.actions.get();\n\t\t\tactions = actions.filter( function ( action ) {\n\t\t\t\treturn action.getFlags().indexOf( 'primary' ) > -1;\n\t\t\t} );\n\t\t\tif ( actions.length > 0 ) {\n\t\t\t\tactions[ 0 ].focus();\n\t\t\t}\n\t\t}, this );\n};\n\n/**\n * @inheritdoc\n */\nOO.ui.MessageDialog.prototype.getBodyHeight = function () {\n\tvar bodyHeight, oldOverflow,\n\t\t$scrollable = this.container.$element;\n\n\toldOverflow = $scrollable[ 0 ].style.overflow;\n\t$scrollable[ 0 ].style.overflow = 'hidden';\n\n\tOO.ui.Element.static.reconsiderScrollbars( $scrollable[ 0 ] );\n\n\tbodyHeight = this.text.$element.outerHeight( true );\n\t$scrollable[ 0 ].style.overflow = oldOverflow;\n\n\treturn bodyHeight;\n};\n\n/**\n * @inheritdoc\n */\nOO.ui.MessageDialog.prototype.setDimensions = function ( dim ) {\n\tvar $scrollable = this.container.$element;\n\tOO.ui.MessageDialog.parent.prototype.setDimensions.call( this, dim );\n\n\t// Twiddle the overflow property, otherwise an unnecessary scrollbar will be produced.\n\t// Need to do it after transition completes (250ms), add 50ms just in case.\n\tsetTimeout( function () {\n\t\tvar oldOverflow = $scrollable[ 0 ].style.overflow,\n\t\t\tactiveElement = document.activeElement;\n\n\t\t$scrollable[ 0 ].style.overflow = 'hidden';\n\n\t\tOO.ui.Element.static.reconsiderScrollbars( $scrollable[ 0 ] );\n\n\t\t// Check reconsiderScrollbars didn't destroy our focus, as we\n\t\t// are doing this after the ready process.\n\t\tif ( activeElement && activeElement !== document.activeElement && activeElement.focus ) {\n\t\t\tactiveElement.focus();\n\t\t}\n\n\t\t$scrollable[ 0 ].style.overflow = oldOverflow;\n\t}, 300 );\n\n\treturn this;\n};\n\n/**\n * @inheritdoc\n */\nOO.ui.MessageDialog.prototype.initialize = function () {\n\t// Parent method\n\tOO.ui.MessageDialog.parent.prototype.initialize.call( this );\n\n\t// Properties\n\tthis.$actions = $( 'This is a process dialog window. The header contains the title and two buttons: \\'Cancel\\' (a safe action) on the left and \\'Done\\' (a primary action) on the right.
' );\n * this.$body.append( this.content.$element );\n * };\n * MyProcessDialog.prototype.getActionProcess = function ( action ) {\n * var dialog = this;\n * if ( action ) {\n * return new OO.ui.Process( function () {\n * dialog.close( { action: action } );\n * } );\n * }\n * return MyProcessDialog.parent.prototype.getActionProcess.call( this, action );\n * };\n *\n * var windowManager = new OO.ui.WindowManager();\n * $( 'body' ).append( windowManager.$element );\n *\n * var dialog = new MyProcessDialog();\n * windowManager.addWindows( [ dialog ] );\n * windowManager.openWindow( dialog );\n *\n * [1]: https://www.mediawiki.org/wiki/OOjs_UI/Windows/Process_Dialogs\n *\n * @abstract\n * @class\n * @extends OO.ui.Dialog\n *\n * @constructor\n * @param {Object} [config] Configuration options\n */\nOO.ui.ProcessDialog = function OoUiProcessDialog( config ) {\n\t// Parent constructor\n\tOO.ui.ProcessDialog.parent.call( this, config );\n\n\t// Properties\n\tthis.fitOnOpen = false;\n\n\t// Initialization\n\tthis.$element.addClass( 'oo-ui-processDialog' );\n};\n\n/* Setup */\n\nOO.inheritClass( OO.ui.ProcessDialog, OO.ui.Dialog );\n\n/* Methods */\n\n/**\n * Handle dismiss button click events.\n *\n * Hides errors.\n *\n * @private\n */\nOO.ui.ProcessDialog.prototype.onDismissErrorButtonClick = function () {\n\tthis.hideErrors();\n};\n\n/**\n * Handle retry button click events.\n *\n * Hides errors and then tries again.\n *\n * @private\n */\nOO.ui.ProcessDialog.prototype.onRetryButtonClick = function () {\n\tthis.hideErrors();\n\tthis.executeAction( this.currentAction );\n};\n\n/**\n * @inheritdoc\n */\nOO.ui.ProcessDialog.prototype.initialize = function () {\n\t// Parent method\n\tOO.ui.ProcessDialog.parent.prototype.initialize.call( this );\n\n\t// Properties\n\tthis.$navigation = $( '