ve.ui.MWMetaDialog: Wait for each page to set up (especially 'category')

The initial value for the categories field is set asynchronously
(after potentially querying the MediaWiki API about the categories).

This caused the existing categories to "pop in" after the dialog was
opened (if you were on a slow network and it took more than 250ms to
query their information).

Additionally, it caused the "Apply" button to always be enabled if the 
page had any categories on it (since the categories field was still
empty when extractSettings() was executed).

Bug: T207719
Change-Id: I46475a1eead91707edb8efe8cb7221a734818e16
This commit is contained in:
Bartosz Dziewoński 2018-10-30 19:53:43 +01:00
parent f0d30ad59f
commit b5e430a3fc
4 changed files with 18 additions and 5 deletions

View file

@ -215,6 +215,7 @@ ve.ui.MWMetaDialog.prototype.getSetupProcess = function ( data ) {
return ve.ui.MWMetaDialog.super.prototype.getSetupProcess.call( this, data )
.next( function () {
var surfaceModel = this.getFragment().getSurface(),
promises = [],
selectWidget = this.bookletLayout.outlineSelectWidget,
visualOnlyPages = [ 'categories', 'settings', 'advancedSettings', 'languages' ],
isSource = ve.init.target.getSurface().getMode() === 'source';
@ -231,10 +232,12 @@ ve.ui.MWMetaDialog.prototype.getSetupProcess = function ( data ) {
surfaceModel.pushStaging();
// Let each page set itself up ('languages' page doesn't need this yet)
this.categoriesPage.setup( surfaceModel.metaList, data );
this.settingsPage.setup( surfaceModel.metaList, data );
this.advancedSettingsPage.setup( surfaceModel.metaList, data );
promises.push( this.categoriesPage.setup( surfaceModel.metaList, data ) );
promises.push( this.settingsPage.setup( surfaceModel.metaList, data ) );
promises.push( this.advancedSettingsPage.setup( surfaceModel.metaList, data ) );
return $.when.apply( $, promises );
}, this )
.next( function () {
if ( data.page && this.bookletLayout.getPage( data.page ) ) {
// HACK: Prevent the setPage() call from focussing stuff in the selected page. For the
// 'categories' page, this causes a dropdown to appear, and if it's done in the setup

View file

@ -195,6 +195,7 @@ ve.ui.MWAdvancedSettingsPage.prototype.onNewSectionEditLinkOptionChange = functi
*
* @param {ve.dm.MetaList} metaList Meta list
* @param {Object} [data] Dialog setup data
* @return {jQuery.Promise}
*/
ve.ui.MWAdvancedSettingsPage.prototype.setup = function ( metaList ) {
var indexingField, indexingOption, indexingType,
@ -232,6 +233,8 @@ ve.ui.MWAdvancedSettingsPage.prototype.setup = function ( metaList ) {
var isSelected = !!advancedSettingsPage.getMetaItem( this.metaName );
this.fieldLayout.getField().setSelected( isSelected );
} );
return $.Deferred().resolve().promise();
};
/**

View file

@ -241,9 +241,11 @@ ve.ui.MWCategoriesPage.prototype.getCategoryItemForInsertion = function ( item,
*
* @param {ve.dm.MetaList} metaList Meta list
* @param {Object} [data] Dialog setup data
* @return {jQuery.Promise}
*/
ve.ui.MWCategoriesPage.prototype.setup = function ( metaList ) {
var defaultSortKeyItem,
promise,
page = this;
this.metaList = metaList;
@ -254,7 +256,7 @@ ve.ui.MWCategoriesPage.prototype.setup = function ( metaList ) {
defaultSortKeyItem = this.getDefaultSortKeyItem();
this.categoryWidget.addItems( this.getCategoryItems() );
promise = this.categoryWidget.addItems( this.getCategoryItems() );
this.defaultSortInput.setValue(
defaultSortKeyItem ? defaultSortKeyItem.getAttribute( 'content' ) : ''
@ -265,6 +267,8 @@ ve.ui.MWCategoriesPage.prototype.setup = function ( metaList ) {
setTimeout( function () {
page.categoryWidget.fitInput();
}, OO.ui.theme.getDialogTransitionDuration() );
return promise;
};
/**

View file

@ -254,6 +254,7 @@ ve.ui.MWSettingsPage.prototype.getMetaItem = function ( name ) {
*
* @param {ve.dm.MetaList} metaList Meta list
* @param {Object} [data] Dialog setup data
* @return {jQuery.Promise}
*/
ve.ui.MWSettingsPage.prototype.setup = function ( metaList ) {
var tableOfContentsMetaItem, tableOfContentsField, tableOfContentsMode,
@ -285,6 +286,8 @@ ve.ui.MWSettingsPage.prototype.setup = function ( metaList ) {
var isSelected = !!settingsPage.getMetaItem( this.metaName );
this.fieldLayout.getField().setSelected( isSelected );
} );
return $.Deferred().resolve().promise();
};
/**