jenkins-bot has submitted this change and it was merged.
Change subject: Move showTooManyFilesWarning to the wizard object
......................................................................
Move showTooManyFilesWarning to the wizard object
This was stupid and it made refactoring the upload stuff very difficult
Also moved the handler construction out of the Upload constructor, because
we don't need it until later.
Bonus: Tore out uploadToAdd, which is stupid anyway.
Change-Id: I5357cc9e5bc40528d6f30fd92a5f798194e37b48
---
M resources/controller/uw.controller.Upload.js
M resources/mw.ApiUploadHandler.js
M resources/mw.UploadWizard.js
M resources/mw.UploadWizardPage.js
M resources/mw.UploadWizardUpload.js
M resources/mw.UploadWizardUploadInterface.js
M resources/ui/uw.ui.Upload.js
7 files changed, 150 insertions(+), 107 deletions(-)
Approvals:
Gilles: Looks good to me, approved
jenkins-bot: Verified
diff --git a/resources/controller/uw.controller.Upload.js
b/resources/controller/uw.controller.Upload.js
index 647e43b..0cc6870 100644
--- a/resources/controller/uw.controller.Upload.js
+++ b/resources/controller/uw.controller.Upload.js
@@ -32,10 +32,16 @@
/**
* Updates the upload step data when a file is added or removed.
*/
- UP.updateFileCounts = function ( haveUploads, max, uploadToAdd ) {
- var fewerThanMax = this.uploads.length < max;
+ UP.updateFileCounts = function ( haveUploads, max, uploads ) {
+ var fewerThanMax;
- this.ui.updateFileCounts( haveUploads, fewerThanMax,
uploadToAdd );
+ if ( uploads ) {
+ this.uploads = uploads;
+ }
+
+ fewerThanMax = this.uploads.length < max;
+
+ this.ui.updateFileCounts( haveUploads, fewerThanMax );
};
UP.empty = function () {
diff --git a/resources/mw.ApiUploadHandler.js b/resources/mw.ApiUploadHandler.js
index 1e5dd5f..f35816f 100644
--- a/resources/mw.ApiUploadHandler.js
+++ b/resources/mw.ApiUploadHandler.js
@@ -58,6 +58,7 @@
this.addFormInputIfMissing( 'format', 'jsonfm' );
if ( this.upload.fromURL ) {
+ this.removeFormInputIfPresent( 'file' );
this.addFormInputIfMissing( 'url',
this.upload.providedFile.url );
}
},
@@ -79,6 +80,18 @@
},
/**
+ * Remove a file input if it's there.
+ * @param {string} name
+ */
+ removeFormInputIfPresent: function ( name ) {
+ var $input = this.$form.find( '[name="' + name + '"]' );
+
+ if ( $input.length > 0 ) {
+ $input.remove();
+ }
+ },
+
+ /**
* Add a hidden input to a form if it was not already there.
* @param name the name of the input
* @param value the value of the input
diff --git a/resources/mw.UploadWizard.js b/resources/mw.UploadWizard.js
index f5a8a0e..af41349 100644
--- a/resources/mw.UploadWizard.js
+++ b/resources/mw.UploadWizard.js
@@ -179,8 +179,6 @@
// Hide containers for selecting files
$( '#mwe-upwiz-add-file-container,
#mwe-upwiz-upload-ctrl-flickr-container' ).hide();
- $( wizard.uploadToAdd.ui.div ).hide();
- wizard.uploadToAdd.ui.hideFileInput();
// Add placeholder text to the Flickr URL input field
$flickrInput.placeholder( mw.message(
'mwe-upwiz-flickr-input-placeholder' ).escaped() );
@@ -363,6 +361,8 @@
this.currentStepObject = targetStep;
+ this.updateFileCounts( false );
+
if ( callback ) {
callback();
}
@@ -400,8 +400,24 @@
return false;
}
- upload = new mw.UploadWizardUpload( this,
'#mwe-upwiz-filelist', providedFile )
- .on( 'file-changed', function ( files ) {
+ upload = new mw.UploadWizardUpload( this,
'#mwe-upwiz-filelist' )
+ .on( 'file-changed', function ( upload, files )
{
+ var totalFiles = files.length +
wizard.uploads.length,
+ tooManyFiles = totalFiles >
mw.UploadWizard.config.maxUploads;
+
+ if ( tooManyFiles ) {
+ wizard.showTooManyFilesWarning(
totalFiles );
+ upload.resetFileInput();
+ return;
+ }
+
+ upload.checkFile(
+ upload.ui.getFilename(),
+ files,
+ function () {
upload.ui.fileChangedOk(); },
+ function ( code, info ) {
upload.ui.fileChangedError( code, info ); }
+ );
+
uw.eventFlowLogger.logUploadEvent(
'uploads-added', { quantity: files.length } );
} )
@@ -413,7 +429,9 @@
uw.eventFlowLogger.logError( 'file', {
code: code, message: message } );
} );
- this.uploadToAdd = upload;
+ if ( providedFile ) {
+ upload.fill( providedFile );
+ }
// we explicitly move the file input to cover the
upload button
upload.ui.moveFileInputToCover( '#mwe-upwiz-add-file',
'poll' );
@@ -424,6 +442,36 @@
} );
return upload;
+ },
+
+ /**
+ * Shows an error dialog informing the user that some uploads
have been omitted
+ * since they went over the max files limit.
+ * @param filesUploaded integer - the number of files that have
been attempted to upload
+ */
+ showTooManyFilesWarning: function ( filesUploaded ) {
+ var buttons = [
+ {
+ text: mw.message(
'mwe-upwiz-too-many-files-ok' ).escaped(),
+ click: function () {
+
$(this).dialog('destroy').remove();
+ }
+ }
+ ];
+ $( '<div>' )
+ .msg(
+ 'mwe-upwiz-too-many-files-text',
+ mw.UploadWizard.config.maxUploads,
+ filesUploaded
+ )
+ .dialog( {
+ width: 500,
+ zIndex: 200000,
+ autoOpen: true,
+ title: mw.message(
'mwe-upwiz-too-many-files' ).escaped(),
+ modal: true,
+ buttons: buttons
+ } );
},
/**
@@ -755,14 +803,20 @@
*
* TODO in the case of aborting the only upload, we get kicked
back here, but the file input over the add file
* button has been removed. How to get it back into "virginal"
state?
+ *
+ * @param {boolean} autoMoveToFile Whether to move to the file
step if there are no non-empty upload objects.
*/
- updateFileCounts: function () {
+ updateFileCounts: function ( autoMoveToFile ) {
+ if ( autoMoveToFile === undefined ) {
+ autoMoveToFile = true;
+ }
+
// First reset the wizard buttons.
this.ui.hideFileEndButtons();
- this.currentStepObject.updateFileCounts( (
this.uploads.length - this.countEmpties() ) > 0, this.maxUploads,
this.uploadToAdd );
+ this.currentStepObject.updateFileCounts( (
this.uploads.length - this.countEmpties() ) > 0, this.maxUploads, this.uploads
);
- if ( this.uploads.length - this.countEmpties() <= 0 ) {
+ if ( autoMoveToFile && ( this.uploads.length -
this.countEmpties() <= 0 ) ) {
// destroy the flickr interface if it exists
this.flickrInterfaceDestroy();
diff --git a/resources/mw.UploadWizardPage.js b/resources/mw.UploadWizardPage.js
index 782ebd5..eea1b84 100644
--- a/resources/mw.UploadWizardPage.js
+++ b/resources/mw.UploadWizardPage.js
@@ -16,7 +16,6 @@
uploadWizard = new mw.UploadWizard( config );
uploadWizard.createInterface( '#upload-wizard' );
-
};
$( document ).ready( function () {
diff --git a/resources/mw.UploadWizardUpload.js
b/resources/mw.UploadWizardUpload.js
index 788f987..14fc068 100644
--- a/resources/mw.UploadWizardUpload.js
+++ b/resources/mw.UploadWizardUpload.js
@@ -22,14 +22,10 @@
* There is an "empty" fileInput which is invisibly floating above
certain buttons in the interface, like "Add a file". When
* this fileInput gets a file, this upload becomes 'filled'.
*
- * On some browsers, the user may select multiple files. So upon such a
'filled' event, we add the first File to this Upload, and
- * then create other UploadWizardUpload objects from the individual
Files, using the optional providedFile parameter.
- *
* @param {UploadWizard} wizard
* @param {HTMLDivElement} filesDiv - where we will dump our the
interfaces for uploads
- * @param {File} providedFile - optional; only used on browsers which
support FileAPI.
*/
- function UploadWizardUpload( wizard, filesDiv, providedFile ) {
+ function UploadWizardUpload( wizard, filesDiv ) {
var upload = this;
oo.EventEmitter.call( this );
@@ -47,17 +43,9 @@
this.mimetype = undefined;
this.extension = undefined;
this.filename = undefined;
- this.providedFile = providedFile;
this.file = undefined;
this.ignoreWarning = {};
this.fromURL = false;
-
- // check to see if the File is being uplaoded from a 3rd party
URL.
- if ( this.providedFile ) {
- if ( this.providedFile.fromURL ) {
- this.fromURL = true;
- }
- }
this.fileKey = undefined;
@@ -66,9 +54,9 @@
this.detailsWeight = 1; // default all same
// details
- this.ui = new mw.UploadWizardUploadInterface( this, filesDiv,
providedFile )
+ this.ui = new mw.UploadWizardUploadInterface( this, filesDiv )
.connect( this, {
- 'file-changed': [ 'emit', 'file-changed' ],
+ 'file-changed': [ 'emit', 'file-changed',
upload ],
'filename-accepted': [ 'emit',
'filename-accepted' ]
} )
@@ -82,11 +70,6 @@
upload.emit( 'filled' );
} );
-
- // handler -- usually ApiUploadHandler
- // this.handler = new (
mw.UploadWizard.config.uploadHandlerClass )( this );
- // this.handler = new mw.MockUploadHandler( this );
- this.handler = this.getUploadHandler();
}
oo.inheritClass( UploadWizardUpload, oo.EventEmitter );
@@ -99,8 +82,32 @@
// increments with each upload
UWUP.count = 0;
+ /**
+ * Manually fill the file input with a file.
+ * @param {File} providedFile
+ */
+ UWUP.fill = function ( providedFile ) {
+ // check to see if the File is being uplaoded from a 3rd party
URL.
+ if ( providedFile ) {
+ this.providedFile = providedFile;
+
+ if ( providedFile.fromURL ) {
+ this.fromURL = true;
+ }
+
+ this.ui.fill( providedFile );
+ }
+ };
+
UWUP.acceptDeed = function () {
this.deed.applyDeed( this );
+ };
+
+ /**
+ * Reset file input.
+ */
+ UWUP.resetFileInput = function () {
+ this.ui.resetFileInput();
};
/**
@@ -124,6 +131,9 @@
}
this.setTransportProgress(0.0);
//this.ui.start();
+
+ // handler -- usually ApiUploadHandler
+ this.handler = this.getUploadHandler();
this.handler.start();
};
@@ -386,7 +396,7 @@
* @param {function (String, Mixed)} callback when filename or contents
in error. Signature of string code, mixed info
* @param {function ()} callback when resetting FileInput
*/
- UWUP.checkFile = function ( filename, files, fileNameOk, fileNameErr,
resetFileInput ) {
+ UWUP.checkFile = function ( filename, files, fileNameOk, fileNameErr ) {
var totalSize, duplicate, extension, hasError, errorIndex,
actualMaxSize, binReader,
upload = this,
@@ -394,8 +404,7 @@
// Check if filename is acceptable
// TODO sanitize filename
- basename = this.getBasename( filename ),
- tooManyFiles = files.length +
this.wizard.uploads.length > mw.UploadWizard.config.maxUploads;
+ basename = this.getBasename( filename );
function finishCallback() {
if ( upload && upload.ui ) {
@@ -403,12 +412,6 @@
} else {
setTimeout( finishCallback, 200 );
}
- }
-
- if ( tooManyFiles ) {
- this.showTooManyFilesWarning( files.length +
this.wizard.uploads.length );
- resetFileInput();
- return;
}
if ( files.length > 1 ) {
@@ -594,36 +597,6 @@
zIndex: 200000,
autoOpen: true,
title: mw.message( 'mwe-upwiz-file-too-large'
).escaped(),
- modal: true,
- buttons: buttons
- } );
- };
-
- /**
- * Shows an error dialog informing the user that some uploads have been
omitted
- * since they went over the max files limit.
- * @param filesUploaded integer - the number of files that have been
attempted to upload
- */
- UWUP.showTooManyFilesWarning = function ( filesUploaded ) {
- var buttons = [
- {
- text: mw.message( 'mwe-upwiz-too-many-files-ok'
).escaped(),
- click: function () {
- $(this).dialog('destroy').remove();
- }
- }
- ];
- $( '<div></div>' )
- .msg(
- 'mwe-upwiz-too-many-files-text',
- mw.UploadWizard.config.maxUploads,
- filesUploaded
- )
- .dialog( {
- width: 500,
- zIndex: 200000,
- autoOpen: true,
- title: mw.message( 'mwe-upwiz-too-many-files'
).escaped(),
modal: true,
buttons: buttons
} );
diff --git a/resources/mw.UploadWizardUploadInterface.js
b/resources/mw.UploadWizardUploadInterface.js
index 01de51d..d541c33 100644
--- a/resources/mw.UploadWizardUploadInterface.js
+++ b/resources/mw.UploadWizardUploadInterface.js
@@ -6,17 +6,14 @@
* Create an interface fragment corresponding to a file input, suitable
for Upload Wizard.
* @param upload
* @param div to insert file interface
- * @param providedFile a File object that this ui component should use
(optional)
*/
- function UploadWizardUploadInterface( upload, filesDiv, providedFile ) {
+ function UploadWizardUploadInterface( upload, filesDiv ) {
var $preview,
ui = this;
oo.EventEmitter.call( this );
this.upload = upload;
-
- this.providedFile = providedFile;
// may need to collaborate with the particular upload type
sometimes
// for the interface, as well as the uploadwizard. OY.
@@ -119,16 +116,24 @@
mw.UploadWizard.config.thumbnailMaxHeight,
true
);
-
- if ( providedFile ) {
- // if a file is already present, trigger the change
event immediately.
- this.$fileInputCtrl.trigger( 'change', { isFake: true }
);
- }
}
oo.inheritClass( UploadWizardUploadInterface, oo.EventEmitter );
UIP = UploadWizardUploadInterface.prototype;
+
+ /**
+ * Manually fill the file input with a file.
+ * @param {File} providedFile
+ */
+ UIP.fill = function ( providedFile ) {
+ if ( providedFile ) {
+ this.providedFile = providedFile;
+
+ // if a file is already present, trigger the change
event immediately.
+ this.$fileInputCtrl.trigger( 'change' );
+ }
+ };
/**
* Things to do to this interface once we start uploading
@@ -273,23 +278,18 @@
UIP.initFileInputCtrl = function () {
var ui = this;
- this.$fileInputCtrl.change( function ( e, eventData ) {
- var files = ui.getFiles();
-
- if ( !eventData || !eventData.isFake ) {
- ui.emit( 'file-changed', files );
- }
+ this.$fileInputCtrl.change( function () {
+ ui.emit( 'file-changed', ui.getFiles() );
ui.clearErrors();
-
- ui.upload.checkFile(
- ui.getFilename(),
- files,
- function () { ui.fileChangedOk(); },
- function ( code, info ) { ui.fileChangedError(
code, info ); },
- function () { ui.$fileInputCtrl.get(0).value =
''; }
- );
} );
+ };
+
+ /**
+ * Reset file input to have no value.
+ */
+ UIP.resetFileInput = function () {
+ this.$fileInputCtrl.get( 0 ).value = '';
};
/**
@@ -522,7 +522,15 @@
};
UIP.showFilenameError = function ( $text ) {
- uw.eventFlowLogger.logError( 'file', { code: 'filename',
message: $text.text() } );
+ var msgText;
+
+ if ( $text instanceof jQuery ) {
+ msgText = $text.text();
+ } else {
+ msgText = $text;
+ }
+
+ uw.eventFlowLogger.logError( 'file', { code: 'filename',
message: msgText } );
$( '<div>' )
.html( $text )
.dialog({
diff --git a/resources/ui/uw.ui.Upload.js b/resources/ui/uw.ui.Upload.js
index fa29610..bbf3492 100644
--- a/resources/ui/uw.ui.Upload.js
+++ b/resources/ui/uw.ui.Upload.js
@@ -59,9 +59,8 @@
* Updates the interface based on the number of uploads.
* @param {boolean} haveUploads Whether there are any uploads at all.
* @param {boolean} fewerThanMax Whether we can add more uploads.
- * @param {mw.UploadWizardUpload} uploadToAdd The last upload object
added to the interface, if any.
*/
- UP.updateFileCounts = function ( haveUploads, fewerThanMax, uploadToAdd
) {
+ UP.updateFileCounts = function ( haveUploads, fewerThanMax ) {
this.$fileList.toggleClass( 'mwe-upwiz-filled-filelist',
haveUploads );
this.$addFile.add( this.$flickrAddFile ).toggleClass(
'mwe-upwiz-add-files-n', haveUploads );
this.$addFileContainer.toggleClass( 'mwe-upwiz-add-files-0',
!haveUploads );
@@ -98,16 +97,7 @@
.add( this.$flickrAddFile )
.button( 'option', 'disabled', !fewerThanMax );
- if ( uploadToAdd ) {
- // allow an "add another upload" button only if we
aren't at max
- if ( fewerThanMax ) {
- $( uploadToAdd.ui.div ).show();
- uploadToAdd.ui.moveFileInputToCover(
'#mwe-upwiz-add-file', 'resize' );
- } else {
- $( uploadToAdd.ui.div ).hide();
- uploadToAdd.ui.hideFileInput();
- }
- }
+ this.$fileList.find( '.mwe-upwiz-file:not(.filled)
.mwe-upwiz-file-input' ).prop( 'disabled', !fewerThanMax );
};
/**
--
To view, visit https://gerrit.wikimedia.org/r/170343
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: I5357cc9e5bc40528d6f30fd92a5f798194e37b48
Gerrit-PatchSet: 16
Gerrit-Project: mediawiki/extensions/UploadWizard
Gerrit-Branch: master
Gerrit-Owner: MarkTraceur <[email protected]>
Gerrit-Reviewer: Gergő Tisza <[email protected]>
Gerrit-Reviewer: Gilles <[email protected]>
Gerrit-Reviewer: MarkTraceur <[email protected]>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
