mirror of
https://github.com/WordPress/WordPress.git
synced 2024-09-10 14:48:07 +02:00
See #28510. Built from https://develop.svn.wordpress.org/trunk@31491 git-svn-id: http://core.svn.wordpress.org/trunk@31472 1a063a9b-81f0-0310-95a4-ce76da25c4cd
140 lines
3.1 KiB
JavaScript
140 lines
3.1 KiB
JavaScript
/*globals wp, _ */
|
|
|
|
/**
|
|
* wp.media.view.UploaderStatus
|
|
*
|
|
* An uploader status for on-going uploads.
|
|
*
|
|
* @class
|
|
* @augments wp.media.View
|
|
* @augments wp.Backbone.View
|
|
* @augments Backbone.View
|
|
*/
|
|
var View = require( '../view.js' ),
|
|
UploaderStatusError = require( './status-error.js' ),
|
|
UploaderStatus;
|
|
|
|
UploaderStatus = View.extend({
|
|
className: 'media-uploader-status',
|
|
template: wp.template('uploader-status'),
|
|
|
|
events: {
|
|
'click .upload-dismiss-errors': 'dismiss'
|
|
},
|
|
|
|
initialize: function() {
|
|
this.queue = wp.Uploader.queue;
|
|
this.queue.on( 'add remove reset', this.visibility, this );
|
|
this.queue.on( 'add remove reset change:percent', this.progress, this );
|
|
this.queue.on( 'add remove reset change:uploading', this.info, this );
|
|
|
|
this.errors = wp.Uploader.errors;
|
|
this.errors.reset();
|
|
this.errors.on( 'add remove reset', this.visibility, this );
|
|
this.errors.on( 'add', this.error, this );
|
|
},
|
|
/**
|
|
* @global wp.Uploader
|
|
* @returns {wp.media.view.UploaderStatus}
|
|
*/
|
|
dispose: function() {
|
|
wp.Uploader.queue.off( null, null, this );
|
|
/**
|
|
* call 'dispose' directly on the parent class
|
|
*/
|
|
View.prototype.dispose.apply( this, arguments );
|
|
return this;
|
|
},
|
|
|
|
visibility: function() {
|
|
this.$el.toggleClass( 'uploading', !! this.queue.length );
|
|
this.$el.toggleClass( 'errors', !! this.errors.length );
|
|
this.$el.toggle( !! this.queue.length || !! this.errors.length );
|
|
},
|
|
|
|
ready: function() {
|
|
_.each({
|
|
'$bar': '.media-progress-bar div',
|
|
'$index': '.upload-index',
|
|
'$total': '.upload-total',
|
|
'$filename': '.upload-filename'
|
|
}, function( selector, key ) {
|
|
this[ key ] = this.$( selector );
|
|
}, this );
|
|
|
|
this.visibility();
|
|
this.progress();
|
|
this.info();
|
|
},
|
|
|
|
progress: function() {
|
|
var queue = this.queue,
|
|
$bar = this.$bar;
|
|
|
|
if ( ! $bar || ! queue.length ) {
|
|
return;
|
|
}
|
|
|
|
$bar.width( ( queue.reduce( function( memo, attachment ) {
|
|
if ( ! attachment.get('uploading') ) {
|
|
return memo + 100;
|
|
}
|
|
|
|
var percent = attachment.get('percent');
|
|
return memo + ( _.isNumber( percent ) ? percent : 100 );
|
|
}, 0 ) / queue.length ) + '%' );
|
|
},
|
|
|
|
info: function() {
|
|
var queue = this.queue,
|
|
index = 0, active;
|
|
|
|
if ( ! queue.length ) {
|
|
return;
|
|
}
|
|
|
|
active = this.queue.find( function( attachment, i ) {
|
|
index = i;
|
|
return attachment.get('uploading');
|
|
});
|
|
|
|
this.$index.text( index + 1 );
|
|
this.$total.text( queue.length );
|
|
this.$filename.html( active ? this.filename( active.get('filename') ) : '' );
|
|
},
|
|
/**
|
|
* @param {string} filename
|
|
* @returns {string}
|
|
*/
|
|
filename: function( filename ) {
|
|
return wp.media.truncate( _.escape( filename ), 24 );
|
|
},
|
|
/**
|
|
* @param {Backbone.Model} error
|
|
*/
|
|
error: function( error ) {
|
|
this.views.add( '.upload-errors', new UploaderStatusError({
|
|
filename: this.filename( error.get('file').name ),
|
|
message: error.get('message')
|
|
}), { at: 0 });
|
|
},
|
|
|
|
/**
|
|
* @global wp.Uploader
|
|
*
|
|
* @param {Object} event
|
|
*/
|
|
dismiss: function( event ) {
|
|
var errors = this.views.get('.upload-errors');
|
|
|
|
event.preventDefault();
|
|
|
|
if ( errors ) {
|
|
_.invoke( errors, 'remove' );
|
|
}
|
|
wp.Uploader.errors.reset();
|
|
}
|
|
});
|
|
|
|
module.exports = UploaderStatus;
|