WordPress.org

Make WordPress Core

Changeset 22821


Ignore:
Timestamp:
11/22/2012 11:46:03 AM (8 years ago)
Author:
koopersmith
Message:

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.

Location:
trunk/wp-includes
Files:
3 edited

Legend:

Unmodified
Added
Removed
  • trunk/wp-includes/css/media-views.css

    r22818 r22821  
    884884}
    885885
    886 .upload-flash-bypass {
    887     font-size: 12px;
    888 }
    889 
    890886.region-content.uploader-inline {
    891887    margin: 20px;
     
    906902
    907903.uploader-inline h3 {
    908     display: none;
    909904    font-size: 20px;
     905    line-height: 28px;
    910906    font-weight: 200;
    911907    margin-bottom: 1.6em;
    912908}
    913909
    914 .supports-drag-drop .uploader-inline h3 {
    915     display: block;
     910.uploader-inline .drop-instructions {
     911    display: none;
     912}
     913
     914.supports-drag-drop .uploader-inline .drop-instructions {
     915    display: block;
     916}
     917
     918.uploader-inline p {
     919    font-size: 12px;
    916920}
    917921
  • trunk/wp-includes/js/media-views.js

    r22818 r22821  
    11001100                });
    11011101            }
     1102
     1103            // Force the uploader off if the upload limit has been exceeded or
     1104            // if the browser isn't supported.
     1105            if ( wp.Uploader.limitExceeded || ! wp.Uploader.browser.supported )
     1106                this.options.uploader = false;
    11021107
    11031108            // Initialize window-wide uploader.
     
    17861791            this.controller = this.options.controller;
    17871792
    1788             if ( ! this.options.$browser )
     1793            if ( ! this.options.$browser && this.controller.uploader )
    17891794                this.options.$browser = this.controller.uploader.$browser;
    1790 
    1791             // Track uploading attachments.
    1792             wp.Uploader.queue.on( 'add remove reset change:percent', this.renderUploadProgress, this );
    1793         },
    1794 
    1795         dispose: function() {
    1796             wp.Uploader.queue.off( null, null, this );
    1797             media.View.prototype.dispose.apply( this, arguments );
    1798             return this;
    1799         },
    1800 
    1801         render: function() {
     1795        },
     1796
     1797        ready: function() {
    18021798            var $browser = this.options.$browser,
    18031799                $placeholder;
    18041800
    1805             this.renderUploadProgress();
    1806             this.$el.html( this.template( this.options ) );
    1807 
    1808             $placeholder = this.$('.browser');
    1809             $browser.detach().text( $placeholder.text() );
    1810             $browser[0].className = $placeholder[0].className;
    1811             $placeholder.replaceWith( $browser.show() );
    1812 
    1813             this.$bar = this.$('.media-progress-bar div');
    1814 
    1815             this.views.render();
    1816             return this;
    1817         },
    1818 
    1819         renderUploadProgress: function() {
    1820             var queue = wp.Uploader.queue;
    1821 
    1822             this.$el.toggleClass( 'uploading', !! queue.length );
    1823 
    1824             if ( ! this.$bar || ! queue.length )
    1825                 return;
    1826 
    1827             this.$bar.width( ( queue.reduce( function( memo, attachment ) {
    1828                 if ( attachment.get('uploading') )
    1829                     return memo + ( attachment.get('percent') || 0 );
    1830                 else
    1831                     return memo + 100;
    1832             }, 0 ) / queue.length ) + '%' );
     1801            if ( this.controller.uploader ) {
     1802                $placeholder = this.$('.browser');
     1803                $browser.detach().text( $placeholder.text() );
     1804                $browser[0].className = $placeholder[0].className;
     1805                $placeholder.replaceWith( $browser.show() );
     1806            }
     1807
     1808            return this;
    18331809        }
    18341810    });
  • trunk/wp-includes/media.php

    r22819 r22821  
    12721272            'supported' => _device_can_upload(),
    12731273        ),
     1274        'limitExceeded' => is_multisite() && ! is_upload_space_available()
    12741275    );
    12751276
     
    14851486    <script type="text/html" id="tmpl-uploader-inline">
    14861487        <div class="uploader-inline-content">
     1488        <?php if ( ! _device_can_upload() ) : ?>
     1489            <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>
     1490        <?php elseif ( is_multisite() && ! is_upload_space_available() ) : ?>
     1491            <h3><?php _e( 'Upload Limit Exceeded' ); ?></h3>
     1492            <?php do_action( 'upload_ui_over_quota' ); ?>
     1493
     1494        <?php else : ?>
    14871495            <div class="upload-ui">
    1488                 <h3><?php _e( 'Drop files anywhere to upload' ); ?></h3>
     1496                <h3 class="drop-instructions"><?php _e( 'Drop files anywhere to upload' ); ?></h3>
    14891497                <a href="#" class="browser button button-hero"><?php _e( 'Select Files' ); ?></a>
    14901498            </div>
     
    14941502                <?php do_action( 'pre-plupload-upload-ui' ); ?>
    14951503                <?php do_action( 'post-plupload-upload-ui' ); ?>
     1504
     1505                <?php
     1506                $upload_size_unit = $max_upload_size = wp_max_upload_size();
     1507                $byte_sizes = array( 'KB', 'MB', 'GB' );
     1508
     1509                for ( $u = -1; $upload_size_unit > 1024 && $u < count( $byte_sizes ) - 1; $u++ ) {
     1510                    $upload_size_unit /= 1024;
     1511                }
     1512
     1513                if ( $u < 0 ) {
     1514                    $upload_size_unit = 0;
     1515                    $u = 0;
     1516                } else {
     1517                    $upload_size_unit = (int) $upload_size_unit;
     1518                }
     1519
     1520                ?>
     1521
     1522                <p class="max-upload-size"><?php
     1523                    printf( __( 'Maximum upload file size: %d%s.' ), esc_html($upload_size_unit), esc_html($byte_sizes[$u]) );
     1524                ?></p>
     1525
     1526                <?php if ( ( $GLOBALS['is_IE'] || $GLOBALS['is_opera']) && $max_upload_size > 100 * 1024 * 1024 ) : ?>
     1527                    <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>
     1528                <?php endif; ?>
     1529
    14961530                <?php do_action( 'post-upload-ui' ); ?>
    14971531            </div>
     1532        <?php endif; ?>
    14981533        </div>
    14991534    </script>
Note: See TracChangeset for help on using the changeset viewer.