From e3d3e0869db1aa8eee2ea350fe5699d45498f453 Mon Sep 17 00:00:00 2001 From: Ed Sanders Date: Wed, 4 Mar 2020 15:07:42 +0000 Subject: [PATCH] Move checkbox widget creation to mw.libs.ve So this can be used other VE API users (e.g. DiscussionTools). Bug: T245222 Change-Id: I1e0e9bb9da53a62f8a20126e579dcd6300bd2376 --- .../init/targets/ve.init.mw.ArticleTarget.js | 58 +++-------------- .../preinit/ve.init.mw.ArticleTargetLoader.js | 62 +++++++++++++++++++ .../ui/styles/dialogs/ve.ui.MWSaveDialog.css | 4 +- 3 files changed, 73 insertions(+), 51 deletions(-) diff --git a/modules/ve-mw/init/targets/ve.init.mw.ArticleTarget.js b/modules/ve-mw/init/targets/ve.init.mw.ArticleTarget.js index 9540fa2d5f..0d9163d58e 100644 --- a/modules/ve-mw/init/targets/ve.init.mw.ArticleTarget.js +++ b/modules/ve-mw/init/targets/ve.init.mw.ArticleTarget.js @@ -397,8 +397,7 @@ ve.init.mw.ArticleTarget.prototype.loadSuccess = function ( response ) { * loadSuccess(). If false, either that loadFail() has been called or we're retrying via load(). */ ve.init.mw.ArticleTarget.prototype.parseMetadata = function ( response ) { - var aboutDoc, docRevIdMatches, docRevId, - name, options, accesskey, title, $label, checkbox, + var aboutDoc, docRevIdMatches, docRevId, checkboxes, data = response ? ( response.visualeditor || response.visualeditoredit ) : null; if ( !data ) { @@ -454,54 +453,15 @@ ve.init.mw.ArticleTarget.prototype.parseMetadata = function ( response ) { this.retriedRevIdConflict = false; } - this.checkboxFields = []; - this.checkboxesByName = {}; + checkboxes = mw.libs.ve.targetLoader.createCheckboxFields( this.checkboxesDef ); + this.checkboxFields = checkboxes.checkboxFields; + this.checkboxesByName = checkboxes.checkboxesByName; - if ( this.checkboxesDef ) { - for ( name in this.checkboxesDef ) { - options = this.checkboxesDef[ name ]; - - accesskey = null; - title = null; - // The messages documented below are just the ones defined in core. - // Extensions may add other checkboxes. - if ( options.tooltip ) { - // The following messages are used here: - // * accesskey-minoredit - // * accesskey-watch - accesskey = mw.message( 'accesskey-' + options.tooltip ).text(); - // The following messages are used here: - // * tooltip-minoredit - // * tooltip-watch - title = mw.message( 'tooltip-' + options.tooltip ).text(); - } - if ( options[ 'title-message' ] ) { - // Not used in core - // eslint-disable-next-line mediawiki/msg-doc - title = mw.message( options[ 'title-message' ] ).text(); - } - // The following messages are used here: - // * minoredit - // * watchthis - $label = $( '' ).append( mw.message( options[ 'label-message' ] ).parseDom() ); - ve.targetLinksToNewWindow( $label[ 0 ] ); - - checkbox = new OO.ui.CheckboxInputWidget( { - accessKey: accesskey, - selected: options.default, - classes: [ 've-ui-mwSaveDialog-checkbox-' + name ] - } ); - - this.checkboxFields.push( - new OO.ui.FieldLayout( checkbox, { - align: 'inline', - label: $label.contents(), - title: title - } ) - ); - this.checkboxesByName[ name ] = checkbox; - } - } + this.checkboxFields.forEach( function ( field ) { + // TODO: This method should be upstreamed or moved so that targetLoader + // can use it safely. + ve.targetLinksToNewWindow( field.$label[ 0 ] ); + } ); return true; }; diff --git a/modules/ve-mw/preinit/ve.init.mw.ArticleTargetLoader.js b/modules/ve-mw/preinit/ve.init.mw.ArticleTargetLoader.js index 8d21335e56..4d57e09ba3 100644 --- a/modules/ve-mw/preinit/ve.init.mw.ArticleTargetLoader.js +++ b/modules/ve-mw/preinit/ve.init.mw.ArticleTargetLoader.js @@ -103,6 +103,68 @@ } ); }, + /** + * Creates an OOUI checkbox inside an inline field layout + * + * @param {Object[]} checkboxesDef Checkbox definitions from the API + * @return {Object} Result object with checkboxFields (OO.ui.FieldLayout[]) and + * checkboxesByName (keyed object of OO.ui.CheckboxInputWidget). + */ + createCheckboxFields: function ( checkboxesDef ) { + var checkboxFields = [], + checkboxesByName = {}; + + if ( checkboxesDef ) { + Object.keys( checkboxesDef ).forEach( function ( name ) { + var $label, checkbox, + options = checkboxesDef[ name ], + accesskey = null, + title = null; + + // The messages documented below are just the ones defined in core. + // Extensions may add other checkboxes. + if ( options.tooltip ) { + // The following messages are used here: + // * accesskey-minoredit + // * accesskey-watch + accesskey = mw.message( 'accesskey-' + options.tooltip ).text(); + // The following messages are used here: + // * tooltip-minoredit + // * tooltip-watch + title = mw.message( 'tooltip-' + options.tooltip ).text(); + } + if ( options[ 'title-message' ] ) { + // Not used in core + // eslint-disable-next-line mediawiki/msg-doc + title = mw.message( options[ 'title-message' ] ).text(); + } + // The following messages are used here: + // * minoredit + // * watchthis + $label = $( '' ).append( mw.message( options[ 'label-message' ] ).parseDom() ); + + checkbox = new OO.ui.CheckboxInputWidget( { + accessKey: accesskey, + selected: options.default, + classes: [ 've-ui-mwSaveDialog-checkbox-' + name ] + } ); + + checkboxFields.push( + new OO.ui.FieldLayout( checkbox, { + align: 'inline', + label: $label.contents(), + title: title + } ) + ); + checkboxesByName[ name ] = checkbox; + } ); + } + return { + checkboxFields: checkboxFields, + checkboxesByName: checkboxesByName + }; + }, + /** * Request the page data and various metadata from the MediaWiki API (which will use * Parsoid or RESTBase). diff --git a/modules/ve-mw/ui/styles/dialogs/ve.ui.MWSaveDialog.css b/modules/ve-mw/ui/styles/dialogs/ve.ui.MWSaveDialog.css index 1f8755c8d7..0b9dae7671 100644 --- a/modules/ve-mw/ui/styles/dialogs/ve.ui.MWSaveDialog.css +++ b/modules/ve-mw/ui/styles/dialogs/ve.ui.MWSaveDialog.css @@ -41,12 +41,12 @@ padding: 0.7em 0.7em 0 0.7em; } -.ve-ui-mwSaveDialog-checkboxes .oo-ui-fieldLayout { +.ve-ui-mwSaveDialog-checkboxes > .oo-ui-fieldLayout { display: inline-block; margin: 0 1.5em 0 0; } -.ve-ui-mwSaveDialog-checkboxes .oo-ui-fieldLayout:last-child { +.ve-ui-mwSaveDialog-checkboxes > .oo-ui-fieldLayout:last-child { margin-right: 0; }