Merge "Add possibility to filter for log_action in all core logs"
[lhc/web/wiklou.git] / resources / src / mediawiki / mediawiki.Upload.BookletLayout.js
index c8d64b9..6af0edf 100644 (file)
@@ -1,4 +1,5 @@
-( function ( $, mw ) {
+/*global moment*/
+( function ( $, mw, moment ) {
 
        /**
         * mw.Upload.BookletLayout encapsulates the process of uploading a file
 
        /* Events */
 
+       /**
+        * Progress events for the uploaded file
+        *
+        * @event fileUploadProgress
+        * @param {number} progress In percentage
+        * @param {Object} duration Duration object from `moment.duration()`
+        */
+
        /**
         * The file has finished uploading
         *
         * file object.
         *
         * @protected
+        * @fires fileUploadProgress
         * @fires fileUploaded
         * @return {jQuery.Promise}
         */
        mw.Upload.BookletLayout.prototype.uploadFile = function () {
                var deferred = $.Deferred(),
+                       startTime = new Date(),
                        layout = this,
                        file = this.getFile();
 
 
                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() );
                        // really be an error...
                        var errorMessage = layout.getErrorMessageForStateDetails();
                        deferred.reject( errorMessage );
+               }, function ( progress ) {
+                       var elapsedTime = new Date() - startTime,
+                               estimatedTotalTime = ( 1 / progress ) * elapsedTime,
+                               estimatedRemainingTime = moment.duration( estimatedTotalTime - elapsedTime );
+                       layout.emit( 'fileUploadProgress', progress, estimatedRemainingTime );
                } );
 
                // If there is an error in uploading, come back to the upload page
                                );
                        }
 
-                       message = mw.message( 'api-error-' + error.code );
-                       if ( !message.exists() ) {
-                               message = mw.message( 'api-error-unknownerror', JSON.stringify( stateDetails ) );
+                       if ( error.code === 'protectedpage' ) {
+                               message = mw.message( 'protectedpagetext' );
+                       } else {
+                               message = mw.message( 'api-error-' + error.code );
+                               if ( !message.exists() ) {
+                                       message = mw.message( 'api-error-unknownerror', JSON.stringify( stateDetails ) );
+                               }
                        }
                        return new OO.ui.Error(
                                $( '<p>' ).append( message.parseDom() ),
                                        $( '<p>' ).msg( 'fileexists', 'File:' + warnings.exists ),
                                        { recoverable: false }
                                );
+                       } else if ( warnings[ 'exists-normalized' ] !== undefined ) {
+                               return new OO.ui.Error(
+                                       $( '<p>' ).msg( 'fileexists', 'File:' + warnings[ 'exists-normalized' ] ),
+                                       { recoverable: false }
+                               );
                        } else if ( warnings[ 'page-exists' ] !== undefined ) {
                                return new OO.ui.Error(
                                        $( '<p>' ).msg( 'filepageexists', 'File:' + warnings[ 'page-exists' ] ),
                                        $( '<p>' ).msg( 'api-error-duplicate-archive', 1 ),
                                        { recoverable: false }
                                );
+                       } else if ( warnings[ 'was-deleted' ] !== undefined ) {
+                               return new OO.ui.Error(
+                                       $( '<p>' ).msg( 'api-error-was-deleted' ),
+                                       { recoverable: false }
+                               );
                        } else if ( warnings.badfilename !== undefined ) {
                                // Change the name if the current name isn't acceptable
                                // TODO This might not really be the best place to do this
         * @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.progressBarWidget = new OO.ui.ProgressBarWidget( {
+                       progress: 0
+               } );
+               this.filePreview.$element.append( this.progressBarWidget.$element );
+
                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.on( 'fileUploadProgress', function ( progress ) {
+                       this.progressBarWidget.setProgress( progress * 100 );
+               }.bind( this ) );
 
                this.filenameWidget.on( 'change', this.onInfoFormChange.bind( this ) );
                this.descriptionWidget.on( 'change', this.onInfoFormChange.bind( this ) );
         */
        mw.Upload.BookletLayout.prototype.clear = function () {
                this.selectFileWidget.setValue( null );
+               this.progressBarWidget.setProgress( 0 );
                this.filenameWidget.setValue( null ).setValidityFlag( true );
                this.descriptionWidget.setValue( null ).setValidityFlag( true );
                this.filenameUsageWidget.setValue( null );
        };
 
-}( jQuery, mediaWiki ) );
+}( jQuery, mediaWiki, moment ) );