( function ( $, mw, OO ) {
'use strict';
var ApiSandbox, Util, WidgetMethods, Validators,
- $content, panel, booklet, oldhash, windowManager, fullscreenButton,
+ $content, panel, booklet, oldhash, windowManager,
formatDropdown,
api = new mw.Api(),
bookletPages = [],
init: function () {
var $toolbar;
- ApiSandbox.isFullscreen = false;
-
$content = $( '#mw-apisandbox' );
windowManager = new OO.ui.WindowManager();
errorAlert: new OO.ui.MessageDialog()
} );
- fullscreenButton = new OO.ui.ButtonWidget( {
- label: mw.message( 'apisandbox-fullscreen' ).text(),
- title: mw.message( 'apisandbox-fullscreen-tooltip' ).text()
- } ).on( 'click', ApiSandbox.toggleFullscreen );
-
$toolbar = $( '<div>' )
.addClass( 'mw-apisandbox-toolbar' )
.append(
- fullscreenButton.$element,
new OO.ui.ButtonWidget( {
label: mw.message( 'apisandbox-submit' ).text(),
flags: [ 'primary', 'progressive' ]
);
booklet = new OO.ui.BookletLayout( {
+ expanded: false,
outlined: true,
autoFocus: false
} );
ApiSandbox.updateUI();
}
- // If the hashchange event exists, use it. Otherwise, fake it.
- // And, of course, IE has to be dumb.
- if ( 'onhashchange' in window &&
- ( document.documentMode === undefined || document.documentMode >= 8 )
- ) {
- $( window ).on( 'hashchange', ApiSandbox.loadFromHash );
- } else {
- setInterval( function () {
- if ( oldhash !== location.hash ) {
- ApiSandbox.loadFromHash();
- }
- }, 1000 );
- }
+ $( window ).on( 'hashchange', ApiSandbox.loadFromHash );
$content
.empty()
.append( $toolbar )
.append( panel.$element )
);
-
- $( window ).on( 'resize', ApiSandbox.resizePanel );
-
- ApiSandbox.resizePanel();
- },
-
- /**
- * Toggle "fullscreen" mode
- */
- toggleFullscreen: function () {
- var $body = $( document.body ),
- $ui = $( '#mw-apisandbox-ui' );
-
- ApiSandbox.isFullscreen = !ApiSandbox.isFullscreen;
-
- $body.toggleClass( 'mw-apisandbox-fullscreen', ApiSandbox.isFullscreen );
- $ui.toggleClass( 'mw-body-content', ApiSandbox.isFullscreen );
- if ( ApiSandbox.isFullscreen ) {
- fullscreenButton.setLabel( mw.message( 'apisandbox-unfullscreen' ).text() );
- fullscreenButton.setTitle( mw.message( 'apisandbox-unfullscreen-tooltip' ).text() );
- OO.ui.getDefaultOverlay().prepend( $ui );
- } else {
- fullscreenButton.setLabel( mw.message( 'apisandbox-fullscreen' ).text() );
- fullscreenButton.setTitle( mw.message( 'apisandbox-fullscreen-tooltip' ).text() );
- $content.append( $ui );
- }
- ApiSandbox.resizePanel();
- },
-
- /**
- * Set the height of the panel based on the current viewport.
- */
- resizePanel: function () {
- var height = $( window ).height(),
- contentTop = $content.offset().top;
-
- if ( ApiSandbox.isFullscreen ) {
- height -= panel.$element.offset().top - $( '#mw-apisandbox-ui' ).offset().top;
- panel.$element.height( height - 1 );
- } else {
- // Subtract the height of the intro text
- height -= panel.$element.offset().top - contentTop;
-
- panel.$element.height( height - 10 );
- $( window ).scrollTop( contentTop - 5 );
- }
},
/**
deferreds = [],
paramsAreForced = !!params,
displayParams = {},
+ tokenWidgets = [],
checkPages = [ pages.main ];
// Blur any focused widget before submit, because
params = {};
while ( checkPages.length ) {
page = checkPages.shift();
- deferreds.push( page.apiCheckValid() );
+ if ( page.tokenWidget ) {
+ tokenWidgets.push( page.tokenWidget );
+ }
+ deferreds = deferreds.concat( page.apiCheckValid() );
page.getQueryParams( params, displayParams );
subpages = page.getSubpages();
for ( i = 0; i < subpages.length; i++ ) {
}
$.when.apply( $, deferreds ).done( function () {
- var formatItems, menu, selectedLabel;
+ var formatItems, menu, selectedLabel, deferred, actions, errorCount;
+
+ // Count how many times `value` occurs in `array`.
+ function countValues( value, array ) {
+ var count, i;
+ count = 0;
+ for ( i = 0; i < array.length; i++ ) {
+ if ( array[ i ] === value ) {
+ count++;
+ }
+ }
+ return count;
+ }
- if ( $.inArray( false, arguments ) !== -1 ) {
- windowManager.openWindow( 'errorAlert', {
- title: Util.parseMsg( 'apisandbox-submit-invalid-fields-title' ),
- message: Util.parseMsg( 'apisandbox-submit-invalid-fields-message' ),
- actions: [
- {
- action: 'accept',
- label: OO.ui.msg( 'ooui-dialog-process-dismiss' ),
- flags: 'primary'
+ errorCount = countValues( false, arguments );
+ if ( errorCount > 0 ) {
+ actions = [
+ {
+ action: 'accept',
+ label: OO.ui.msg( 'ooui-dialog-process-dismiss' ),
+ flags: 'primary'
+ }
+ ];
+ if ( tokenWidgets.length ) {
+ // Check all token widgets' validity separately
+ deferred = $.when.apply( $, tokenWidgets.map( function ( w ) {
+ return w.apiCheckValid();
+ } ) );
+
+ deferred.done( function () {
+ // If only the tokens are invalid, offer to fix them
+ var tokenErrorCount = countValues( false, arguments );
+ if ( tokenErrorCount === errorCount ) {
+ delete actions[ 0 ].flags;
+ actions.push( {
+ action: 'fix',
+ label: mw.message( 'apisandbox-results-fixtoken' ).text(),
+ flags: 'primary'
+ } );
}
- ]
+ } );
+ } else {
+ deferred = $.Deferred().resolve();
+ }
+ deferred.always( function () {
+ windowManager.openWindow( 'errorAlert', {
+ title: Util.parseMsg( 'apisandbox-submit-invalid-fields-title' ),
+ message: Util.parseMsg( 'apisandbox-submit-invalid-fields-message' ),
+ actions: actions
+ } ).closed.then( function ( data ) {
+ if ( data && data.action === 'fix' ) {
+ ApiSandbox.fixTokenAndResend();
+ }
+ } );
} );
return;
}
$result = $( '<div>' )
.append( progress.$element );
- resultPage = page = new OO.ui.PageLayout( '|results|' );
+ resultPage = page = new OO.ui.PageLayout( '|results|', { expanded: false } );
page.setupOutlineItem = function () {
this.outlineItem.setLabel( mw.message( 'apisandbox-results' ).text() );
};
* @param {Object} [config] Configuration options
*/
ApiSandbox.PageLayout = function ( config ) {
- config = $.extend( { prefix: '' }, config );
+ config = $.extend( { prefix: '', expanded: false }, config );
this.displayText = config.key;
this.apiModule = config.path;
this.prefix = config.prefix;
/**
* Check that all widgets on the page are in a valid state.
*
- * @return {boolean}
+ * @return {jQuery.Promise[]} One promise for each widget, resolved with `false` if invalid
*/
ApiSandbox.PageLayout.prototype.apiCheckValid = function () {
- var that = this;
+ var promises, that = this;
if ( this.paramInfo === null ) {
- return $.Deferred().resolve( false ).promise();
+ return [];
} else {
- return $.when.apply( $, $.map( this.widgets, function ( widget ) {
+ promises = $.map( this.widgets, function ( widget ) {
return widget.apiCheckValid();
- } ) ).then( function () {
+ } );
+ $.when.apply( $, promises ).then( function () {
that.apiIsValid = $.inArray( false, arguments ) === -1;
if ( that.getOutlineItem() ) {
that.getOutlineItem().setIcon( that.apiIsValid || suppressErrors ? null : 'alert' );
that.apiIsValid || suppressErrors ? '' : mw.message( 'apisandbox-alert-page' ).plain()
);
}
- return $.Deferred().resolve( that.apiIsValid ).promise();
} );
+ return promises;
}
};