/*!
- * OOUI v0.33.0
+ * OOUI v0.33.3
* https://www.mediawiki.org/wiki/OOUI
*
* Copyright 2011–2019 OOUI Team and other contributors.
* Released under the MIT license
* http://oojs.mit-license.org
*
- * Date: 2019-06-27T03:27:26Z
+ * Date: 2019-07-16T21:33:36Z
*/
( function ( OO ) {
* MyProcessDialog.static.name = 'myProcessDialog';
* // An action set that uses modes ('edit' and 'help' mode, in this example).
* MyProcessDialog.static.actions = [
- * { action: 'continue', modes: 'edit', label: 'Continue',
- * flags: [
- * 'primary', 'progressive'
- * ] },
+ * {
+ * action: 'continue',
+ * modes: 'edit',
+ * label: 'Continue',
+ * flags: [ 'primary', 'progressive' ]
+ * },
* { action: 'help', modes: 'edit', label: 'Help' },
* { modes: 'edit', label: 'Cancel', flags: 'safe' },
* { action: 'back', modes: 'help', label: 'Back', flags: 'safe' }
compatOpening.notify( { state: 'ready' } );
lifecycle.deferreds.opened.resolve( data );
compatOpening.resolve( manager.compatOpened.promise(), data );
+ manager.togglePreventIosScrolling( true );
}, function () {
lifecycle.deferreds.opened.reject();
compatOpening.reject();
compatOpened = manager.compatOpened;
manager.compatOpened = null;
compatOpened.resolve( compatClosing.promise(), data );
+ manager.togglePreventIosScrolling( false );
setTimeout( function () {
win.hold( data ).then( function () {
compatClosing.notify( { state: 'hold' } );
return this;
};
+/**
+ * Prevent scrolling of the document on iOS devices that don't respect `body { overflow: hidden; }`.
+ *
+ * This function is called when the window is opened (ready), and so the background is covered up,
+ * and the user won't see that we're doing weird things to the scroll position.
+ *
+ * @private
+ * @param {boolean} on
+ * @chainable
+ * @return {OO.ui.WindowManager} The manager, for chaining
+ */
+OO.ui.WindowManager.prototype.togglePreventIosScrolling = function ( on ) {
+ var
+ isIos = /ipad|iphone|ipod/i.test( navigator.userAgent ),
+ $body = $( this.getElementDocument().body ),
+ scrollableRoot = OO.ui.Element.static.getRootScrollableElement( $body[ 0 ] ),
+ stackDepth = $body.data( 'windowManagerGlobalEvents' ) || 0;
+
+ // Only if this is the first/last WindowManager (see #toggleGlobalEvents)
+ if ( !isIos || stackDepth !== 1 ) {
+ return this;
+ }
+
+ if ( on ) {
+ // We can't apply this workaround for non-fullscreen dialogs, because the user would see the
+ // scroll position change. If they have content that needs scrolling, you're out of luck…
+ // Always remember the scroll position in case dialog is closed with different size.
+ this.iosOrigScrollPosition = scrollableRoot.scrollTop;
+ if ( this.getCurrentWindow().getSize() === 'full' ) {
+ $body.add( $body.parent() ).addClass( 'oo-ui-windowManager-ios-modal-ready' );
+ }
+ } else {
+ // Always restore ability to scroll in case dialog was opened with different size.
+ $body.add( $body.parent() ).removeClass( 'oo-ui-windowManager-ios-modal-ready' );
+ if ( this.getCurrentWindow().getSize() === 'full' ) {
+ scrollableRoot.scrollTop = this.iosOrigScrollPosition;
+ }
+ }
+ return this;
+};
+
/**
* Bind or unbind global events for scrolling.
*
( Array.isArray( config.flags ) && config.flags.indexOf( flag ) !== -1 );
}
- // Default to unframed.
- config = $.extend( { framed: false }, config );
+ config = $.extend( { framed: true }, config );
if ( checkFlag( 'close' ) ) {
// Change close buttons to icon only.
$.extend( config, {
icon: 'close',
invisibleLabel: true
} );
- } else if ( OO.ui.isMobile() && checkFlag( 'back' ) ) {
+ } else if ( checkFlag( 'back' ) ) {
// Change back buttons to icon only.
$.extend( config, {
icon: 'previous',
navigationWidth = size.width - 20;
}
- safeWidth = this.$safeActions.is( ':visible' ) ? this.$safeActions.width() : 0;
- primaryWidth = this.$primaryActions.is( ':visible' ) ? this.$primaryActions.width() : 0;
+ safeWidth = this.$safeActions.width();
+ primaryWidth = this.$primaryActions.width();
biggerWidth = Math.max( safeWidth, primaryWidth );
labelWidth = this.title.$element.width();
- if ( 2 * biggerWidth + labelWidth < navigationWidth ) {
+ if ( !OO.ui.isMobile() && 2 * biggerWidth + labelWidth < navigationWidth ) {
// We have enough space to center the label
leftWidth = rightWidth = biggerWidth;
} else {