Media: Make friends with media_upload_form. Adds notices for browser incompatibility, upload limits, maximum file size, and large file issues to the uploader. fixes #22243, see #22186, #21390.
git-svn-id: https://develop.svn.wordpress.org/trunk@22821 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Daryl Koopersmith
parent
0c83571904
commit
99def3ec51
|
|
@ -883,10 +883,6 @@ a.media-modal-close {
|
|||
display: block;
|
||||
}
|
||||
|
||||
.upload-flash-bypass {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.region-content.uploader-inline {
|
||||
margin: 20px;
|
||||
padding: 20px;
|
||||
|
|
@ -905,16 +901,24 @@ a.media-modal-close {
|
|||
}
|
||||
|
||||
.uploader-inline h3 {
|
||||
display: none;
|
||||
font-size: 20px;
|
||||
line-height: 28px;
|
||||
font-weight: 200;
|
||||
margin-bottom: 1.6em;
|
||||
}
|
||||
|
||||
.supports-drag-drop .uploader-inline h3 {
|
||||
.uploader-inline .drop-instructions {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.supports-drag-drop .uploader-inline .drop-instructions {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.uploader-inline p {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.uploader-inline .media-progress-bar {
|
||||
display: none;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1100,6 +1100,11 @@
|
|||
});
|
||||
}
|
||||
|
||||
// Force the uploader off if the upload limit has been exceeded or
|
||||
// if the browser isn't supported.
|
||||
if ( wp.Uploader.limitExceeded || ! wp.Uploader.browser.supported )
|
||||
this.options.uploader = false;
|
||||
|
||||
// Initialize window-wide uploader.
|
||||
if ( this.options.uploader ) {
|
||||
this.uploader = new media.view.UploaderWindow({
|
||||
|
|
@ -1785,51 +1790,22 @@
|
|||
initialize: function() {
|
||||
this.controller = this.options.controller;
|
||||
|
||||
if ( ! this.options.$browser )
|
||||
if ( ! this.options.$browser && this.controller.uploader )
|
||||
this.options.$browser = this.controller.uploader.$browser;
|
||||
|
||||
// Track uploading attachments.
|
||||
wp.Uploader.queue.on( 'add remove reset change:percent', this.renderUploadProgress, this );
|
||||
},
|
||||
|
||||
dispose: function() {
|
||||
wp.Uploader.queue.off( null, null, this );
|
||||
media.View.prototype.dispose.apply( this, arguments );
|
||||
return this;
|
||||
},
|
||||
|
||||
render: function() {
|
||||
ready: function() {
|
||||
var $browser = this.options.$browser,
|
||||
$placeholder;
|
||||
|
||||
this.renderUploadProgress();
|
||||
this.$el.html( this.template( this.options ) );
|
||||
|
||||
if ( this.controller.uploader ) {
|
||||
$placeholder = this.$('.browser');
|
||||
$browser.detach().text( $placeholder.text() );
|
||||
$browser[0].className = $placeholder[0].className;
|
||||
$placeholder.replaceWith( $browser.show() );
|
||||
}
|
||||
|
||||
this.$bar = this.$('.media-progress-bar div');
|
||||
|
||||
this.views.render();
|
||||
return this;
|
||||
},
|
||||
|
||||
renderUploadProgress: function() {
|
||||
var queue = wp.Uploader.queue;
|
||||
|
||||
this.$el.toggleClass( 'uploading', !! queue.length );
|
||||
|
||||
if ( ! this.$bar || ! queue.length )
|
||||
return;
|
||||
|
||||
this.$bar.width( ( queue.reduce( function( memo, attachment ) {
|
||||
if ( attachment.get('uploading') )
|
||||
return memo + ( attachment.get('percent') || 0 );
|
||||
else
|
||||
return memo + 100;
|
||||
}, 0 ) / queue.length ) + '%' );
|
||||
}
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -1271,6 +1271,7 @@ function wp_plupload_default_settings() {
|
|||
'mobile' => wp_is_mobile(),
|
||||
'supported' => _device_can_upload(),
|
||||
),
|
||||
'limitExceeded' => is_multisite() && ! is_upload_space_available()
|
||||
);
|
||||
|
||||
$script = 'var _wpPluploadSettings = ' . json_encode( $settings ) . ';';
|
||||
|
|
@ -1484,8 +1485,15 @@ function wp_print_media_templates( $attachment ) {
|
|||
|
||||
<script type="text/html" id="tmpl-uploader-inline">
|
||||
<div class="uploader-inline-content">
|
||||
<?php if ( ! _device_can_upload() ) : ?>
|
||||
<h3><?php _e('The web browser on your device cannot be used to upload files. You may be able to use the <a href="http://wordpress.org/extend/mobile/">native app for your device</a> instead.'); ?></h3>
|
||||
<?php elseif ( is_multisite() && ! is_upload_space_available() ) : ?>
|
||||
<h3><?php _e( 'Upload Limit Exceeded' ); ?></h3>
|
||||
<?php do_action( 'upload_ui_over_quota' ); ?>
|
||||
|
||||
<?php else : ?>
|
||||
<div class="upload-ui">
|
||||
<h3><?php _e( 'Drop files anywhere to upload' ); ?></h3>
|
||||
<h3 class="drop-instructions"><?php _e( 'Drop files anywhere to upload' ); ?></h3>
|
||||
<a href="#" class="browser button button-hero"><?php _e( 'Select Files' ); ?></a>
|
||||
</div>
|
||||
|
||||
|
|
@ -1493,8 +1501,35 @@ function wp_print_media_templates( $attachment ) {
|
|||
<?php do_action( 'pre-upload-ui' ); ?>
|
||||
<?php do_action( 'pre-plupload-upload-ui' ); ?>
|
||||
<?php do_action( 'post-plupload-upload-ui' ); ?>
|
||||
|
||||
<?php
|
||||
$upload_size_unit = $max_upload_size = wp_max_upload_size();
|
||||
$byte_sizes = array( 'KB', 'MB', 'GB' );
|
||||
|
||||
for ( $u = -1; $upload_size_unit > 1024 && $u < count( $byte_sizes ) - 1; $u++ ) {
|
||||
$upload_size_unit /= 1024;
|
||||
}
|
||||
|
||||
if ( $u < 0 ) {
|
||||
$upload_size_unit = 0;
|
||||
$u = 0;
|
||||
} else {
|
||||
$upload_size_unit = (int) $upload_size_unit;
|
||||
}
|
||||
|
||||
?>
|
||||
|
||||
<p class="max-upload-size"><?php
|
||||
printf( __( 'Maximum upload file size: %d%s.' ), esc_html($upload_size_unit), esc_html($byte_sizes[$u]) );
|
||||
?></p>
|
||||
|
||||
<?php if ( ( $GLOBALS['is_IE'] || $GLOBALS['is_opera']) && $max_upload_size > 100 * 1024 * 1024 ) : ?>
|
||||
<p class="big-file-warning"><?php _e('Your browser has some limitations uploading large files with the multi-file uploader. Please use the browser uploader for files over 100MB.'); ?></p>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php do_action( 'post-upload-ui' ); ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</script>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue