Merge "ApiSandbox: Move labels outside progress bars"
[lhc/web/wiklou.git] / resources / src / mediawiki.special.apisandbox / apisandbox.js
index 19eac98..631a5c6 100644 (file)
                                        break;
 
                                case 'namespace':
-                                       // eslint-disable-next-line jquery/no-map-util
+                                       // eslint-disable-next-line no-jquery/no-map-util
                                        items = $.map( mw.config.get( 'wgFormattedNamespaces' ), function ( name, ns ) {
                                                if ( ns === '0' ) {
                                                        name = mw.message( 'blanknamespace' ).text();
                 * @return {OO.ui.MenuOptionWidget[]} Each item's data should be an OO.ui.FieldLayout
                 */
                formatRequest: function ( displayParams, rawParams ) {
-                       var jsonInput,
+                       var jsonLayout,
                                items = [
                                        new OO.ui.MenuOptionWidget( {
                                                label: Util.parseMsg( 'apisandbox-request-format-url-label' ),
-                                               data: new OO.ui.FieldLayout(
-                                                       new OO.ui.TextInputWidget( {
-                                                               readOnly: true,
-                                                               value: mw.util.wikiScript( 'api' ) + '?' + $.param( displayParams )
-                                                       } ), {
-                                                               label: Util.parseMsg( 'apisandbox-request-url-label' )
-                                                       }
-                                               )
+                                               data: new mw.widgets.CopyTextLayout( {
+                                                       label: Util.parseMsg( 'apisandbox-request-url-label' ),
+                                                       copyText: mw.util.wikiScript( 'api' ) + '?' + $.param( displayParams )
+                                               } )
                                        } ),
                                        new OO.ui.MenuOptionWidget( {
                                                label: Util.parseMsg( 'apisandbox-request-format-json-label' ),
-                                               data: new OO.ui.FieldLayout(
-                                                       jsonInput = new OO.ui.MultilineTextInputWidget( {
+                                               data: jsonLayout = new mw.widgets.CopyTextLayout( {
+                                                       label: Util.parseMsg( 'apisandbox-request-json-label' ),
+                                                       copyText: JSON.stringify( displayParams, null, '\t' ),
+                                                       multiline: true,
+                                                       textInput: {
                                                                classes: [ 'mw-apisandbox-textInputCode' ],
-                                                               readOnly: true,
                                                                autosize: true,
-                                                               maxRows: 6,
-                                                               value: JSON.stringify( displayParams, null, '\t' )
-                                                       } ), {
-                                                               label: Util.parseMsg( 'apisandbox-request-json-label' )
+                                                               maxRows: 6
                                                        }
-                                               ).on( 'toggle', function ( visible ) {
+                                               ).on( 'toggle', function ( visible ) {
                                                        if ( visible ) {
                                                                // Call updatePosition instead of adjustSize
                                                                // because the latter has weird caching
                                                                // behavior and the former bypasses it.
-                                                               jsonInput.updatePosition();
+                                                               jsonLayout.textInput.updatePosition();
                                                        }
                                                } )
                                        } )
                        // OO.ui.ButtonWidget doesn't take focus itself (T128054)
                        $focus = $( '#mw-apisandbox-ui' ).find( document.activeElement );
                        if ( $focus.length ) {
-                               // eslint-disable-next-line jquery/no-event-shorthand
                                $focus[ 0 ].blur();
                        }
 
                                progressLoading = false;
                                $progressText = $( '<span>' ).text( mw.message( 'apisandbox-sending-request' ).text() );
                                progress = new OO.ui.ProgressBarWidget( {
-                                       progress: false,
-                                       $content: $progressText
+                                       progress: false
                                } );
 
                                $result = $( '<div>' )
-                                       .append( progress.$element );
+                                       .append( $progressText, progress.$element );
 
                                resultPage = page = new OO.ui.PageLayout( '|results|', { expanded: false } );
                                page.setupOutlineItem = function () {
                }
 
                toRemove = {};
-               // eslint-disable-next-line jquery/no-each-util
+               // eslint-disable-next-line no-jquery/no-each-util
                $.each( this.templatedItemsCache, function ( k, el ) {
                        if ( el.widget.isElementAttached() ) {
                                toRemove[ k ] = el;
                                        }
                                } else {
                                        newVars = {};
-                                       // eslint-disable-next-line jquery/no-each-util
+                                       // eslint-disable-next-line no-jquery/no-each-util
                                        $.each( p.vars, function ( k, v ) {
                                                newVars[ k ] = v.replace( placeholder, value );
                                        } );
                };
                while ( toProcess.length ) {
                        p = toProcess.shift();
-                       // eslint-disable-next-line jquery/no-each-util
+                       // eslint-disable-next-line no-jquery/no-each-util
                        $.each( p.vars, doProcess );
                }
 
-               // eslint-disable-next-line jquery/no-map-util
+               // eslint-disable-next-line no-jquery/no-map-util
                toRemove = $.map( toRemove, function ( el, name ) {
                        delete that.widgets[ name ];
                        return [ el.widgetField, el.helpField ];
                        };
 
                this.$element.empty()
-                       .append( new OO.ui.ProgressBarWidget( {
-                               progress: false,
-                               text: mw.message( 'apisandbox-loading', this.displayText ).text()
-                       } ).$element );
+                       .append(
+                               document.createTextNode(
+                                       mw.message( 'apisandbox-loading', this.displayText ).text()
+                               ),
+                               new OO.ui.ProgressBarWidget( { progress: false } ).$element
+                       );
 
                Util.fetchModuleInfo( this.apiModule )
                        .done( function ( pi ) {
                                }
 
                                that.deprecatedItemsFieldset = new OO.ui.FieldsetLayout().addItems( deprecatedItems ).toggle( false );
-                               // eslint-disable-next-line jquery/no-animate-toggle
                                tmp = $( '<fieldset>' )
                                        .toggle( !that.deprecatedItemsFieldset.isEmpty() )
                                        .append(
                if ( this.paramInfo === null ) {
                        return [];
                } else {
-                       // eslint-disable-next-line jquery/no-map-util
+                       // eslint-disable-next-line no-jquery/no-map-util
                        promises = $.map( this.widgets, function ( widget ) {
                                return widget.apiCheckValid();
                        } );
                if ( this.paramInfo === null ) {
                        this.loadFromQueryParams = params;
                } else {
-                       // eslint-disable-next-line jquery/no-each-util
+                       // eslint-disable-next-line no-jquery/no-each-util
                        $.each( this.widgets, function ( name, widget ) {
                                var v = Object.prototype.hasOwnProperty.call( params, name ) ? params[ name ] : undefined;
                                widget.setApiValue( v );
         * @param {Object} displayParams Write query parameters for display into this object
         */
        ApiSandbox.PageLayout.prototype.getQueryParams = function ( params, displayParams ) {
-               // eslint-disable-next-line jquery/no-each-util
+               // eslint-disable-next-line no-jquery/no-each-util
                $.each( this.widgets, function ( name, widget ) {
                        var value = widget.getApiValue();
                        if ( value !== undefined ) {
         */
        ApiSandbox.PageLayout.prototype.getSubpages = function () {
                var ret = [];
-               // eslint-disable-next-line jquery/no-each-util
+               // eslint-disable-next-line no-jquery/no-each-util
                $.each( this.widgets, function ( name, widget ) {
                        var submodules, i;
                        if ( typeof widget.getSubmodules === 'function' ) {