* @return {jQuery.Promise} Promise resolved when everything is initialized
*/
mw.Upload.BookletLayout.prototype.initialize = function () {
- var
- apiPromise,
- booklet = this,
- deferred = $.Deferred();
+ var booklet = this;
this.clear();
this.upload = this.createUpload();
this.setPage( 'upload' );
- apiPromise = this.upload.apiPromise || $.Deferred().resolve( this.upload.api );
- apiPromise.done( function ( api ) {
- // If the user can't upload anything, don't give them the option to.
- api.getUserInfo().done( function ( userInfo ) {
- if ( userInfo.rights.indexOf( 'upload' ) === -1 ) {
- // TODO Use a better error message when not all logged-in users can upload
- booklet.getPage( 'upload' ).$element.msg( 'api-error-mustbeloggedin' );
- }
- } ).always( function () {
- deferred.resolve();
- } );
- } );
-
- return deferred.promise();
+ return this.upload.getApi().then(
+ function ( api ) {
+ // If the user can't upload anything, don't give them the option to.
+ return api.getUserInfo().then(
+ function ( userInfo ) {
+ if ( userInfo.rights.indexOf( 'upload' ) === -1 ) {
+ // TODO Use a better error message when not all logged-in users can upload
+ booklet.getPage( 'upload' ).$element.msg( 'api-error-mustbeloggedin' );
+ }
+ return $.Deferred().resolve();
+ },
+ function () {
+ return $.Deferred().resolve();
+ }
+ );
+ },
+ function ( errorMsg ) {
+ booklet.getPage( 'upload' ).$element.msg( errorMsg );
+ return $.Deferred().resolve();
+ }
+ );
};
/**
this.setPage( 'info' );
- if ( this.shouldRecordBucket ) {
- this.upload.bucket = this.bucket;
- }
-
this.upload.setFile( file );
// The original file name might contain invalid characters, so use our sanitized one
this.upload.setFilename( this.getFilename() );
warnings = stateDetails.upload && stateDetails.upload.warnings;
if ( state === mw.Upload.State.ERROR ) {
+ if ( !error ) {
+ // If there's an 'exception' key, this might be a timeout, or other connection problem
+ return new OO.ui.Error(
+ $( '<p>' ).msg( 'api-error-unknownerror', JSON.stringify( stateDetails ) ),
+ { recoverable: false }
+ );
+ }
+
// HACK We should either have a hook here to allow TitleBlacklist to handle this, or just have
// TitleBlacklist produce sane error messages that can be displayed without arcane knowledge
if ( error.info === 'TitleBlacklist prevents this title from being created' ) {
// HACK Apparently the only reliable way to determine whether TitleBlacklist was involved
return new OO.ui.Error(
- $( '<p>' ).html(
- // HACK TitleBlacklist doesn't have a sensible message, this one is from UploadWizard
- mw.message( 'api-error-blacklisted' ).parse()
- ),
+ // HACK TitleBlacklist doesn't have a sensible message, this one is from UploadWizard
+ $( '<p>' ).msg( 'api-error-blacklisted' ),
{ recoverable: false }
);
}
message = mw.message( 'api-error-unknownerror', JSON.stringify( stateDetails ) );
}
return new OO.ui.Error(
- $( '<p>' ).html(
- message.parse()
- ),
+ $( '<p>' ).append( message.parseDom() ),
{ recoverable: false }
);
}
);
} else {
return new OO.ui.Error(
- $( '<p>' ).html(
- // Let's get all the help we can if we can't pin point the error
- mw.message( 'api-error-unknown-warning', JSON.stringify( stateDetails ) ).parse()
- ),
+ // Let's get all the help we can if we can't pin point the error
+ $( '<p>' ).msg( 'api-error-unknown-warning', JSON.stringify( stateDetails ) ),
{ recoverable: false }
);
}
* @return {OO.ui.FormLayout}
*/
mw.Upload.BookletLayout.prototype.renderUploadForm = function () {
- var fieldset;
+ var fieldset,
+ layout = this;
- this.selectFileWidget = new OO.ui.SelectFileWidget();
- fieldset = new OO.ui.FieldsetLayout( { label: mw.msg( 'upload-form-label-select-file' ) } );
+ this.selectFileWidget = new OO.ui.SelectFileWidget( {
+ showDropTarget: true
+ } );
+ fieldset = new OO.ui.FieldsetLayout();
fieldset.addItems( [ this.selectFileWidget ] );
this.uploadForm = new OO.ui.FormLayout( { items: [ fieldset ] } );
// Validation
this.selectFileWidget.on( 'change', this.onUploadFormChange.bind( this ) );
+ this.selectFileWidget.on( 'change', function () {
+ layout.updateFilePreview();
+ } );
+
return this.uploadForm;
};
+ /**
+ * Updates the file preview on the info form when a file is added.
+ *
+ * @protected
+ */
+ mw.Upload.BookletLayout.prototype.updateFilePreview = function () {
+ this.selectFileWidget.loadAndGetImageUrl().done( function ( url ) {
+ this.filePreview.$element.find( 'p' ).remove();
+ this.filePreview.$element.css( 'background-image', 'url(' + url + ')' );
+ this.infoForm.$element.addClass( 'mw-upload-bookletLayout-hasThumbnail' );
+ }.bind( this ) ).fail( function () {
+ this.filePreview.$element.find( 'p' ).remove();
+ if ( this.selectFileWidget.getValue() ) {
+ this.filePreview.$element.append(
+ $( '<p>' ).text( this.selectFileWidget.getValue().name )
+ );
+ }
+ this.filePreview.$element.css( 'background-image', '' );
+ this.infoForm.$element.removeClass( 'mw-upload-bookletLayout-hasThumbnail' );
+ }.bind( this ) );
+ };
+
/**
* Handle change events to the upload form
*
mw.Upload.BookletLayout.prototype.renderInfoForm = function () {
var fieldset;
+ this.filePreview = new OO.ui.Widget( {
+ classes: [ 'mw-upload-bookletLayout-filePreview' ]
+ } );
this.filenameWidget = new OO.ui.TextInputWidget( {
indicator: 'required',
required: true,
help: mw.msg( 'upload-form-label-infoform-description-tooltip' )
} )
] );
- this.infoForm = new OO.ui.FormLayout( { items: [ fieldset ] } );
+ this.infoForm = new OO.ui.FormLayout( {
+ classes: [ 'mw-upload-bookletLayout-infoForm' ],
+ items: [ this.filePreview, fieldset ]
+ } );
this.filenameWidget.on( 'change', this.onInfoFormChange.bind( this ) );
this.descriptionWidget.on( 'change', this.onInfoFormChange.bind( this ) );