Ticket #22628: 22628.2.diff

wp-includes/css/media-views.css

@@ -721 +721 @@
         margin-top: 10px;
 }
 
-.attachments-browser .attachments {
+.attachments-browser .attachments,
+.attachments-browser .uploader-inline {
         position: absolute;
         top: 50px;
         left: 0;
@@ -926 +927 @@
         display: block;
 }
 
-.region-content.uploader-inline {
+.media-frame .uploader-inline {
         margin: 20px;
         padding: 20px;
         text-align: center;
@@ -1368 +1369 @@
         }
 
         .attachments-browser .attachments,
+        .attachments-browser .uploader-inline,
         .attachments-browser .media-toolbar {
                 right: 180px;
         }

wp-includes/js/media-views.js

@@ -262 +262 @@
                         describe:   false,
                         toolbar:    'main-attachments',
                         sidebar:    'settings',
+                        content:    'browse',
                         searchable: true,
                         filterable: false,
                         uploads:    true
@@ -304 +305 @@
 
                         selection.on( 'add remove reset', this.refreshSelection, this );
 
-                        this._updateEmpty();
-                        library.on( 'add remove reset', this._updateEmpty, this );
-                        this.on( 'change:empty', this.refresh, this );
                         this.refresh();
-
-
                         this.on( 'insert', this._insertDisplaySettings, this );
                 },
 
                 deactivate: function() {
-                        this.off( 'change:empty', this.refresh, this );
-                        this.get('library').off( 'add remove reset', this._updateEmpty, this );
-
                         // Unbind all event handlers that use this state as the context
                         // from the selection.
                         this.get('selection').off( null, null, this );
@@ -334 +327 @@
                         this.resetDisplays();
                 },
 
-                content: function() {
-                        var frame = this.frame;
-
-                        if ( this.get('empty') ) {
-                                // Attempt to fetch any Attachments we don't already have.
-                                this.get('library').more();
-
-                                // In the meantime, render an inline uploader.
-                                frame.content.mode('upload');
-                        } else {
-                                // Browse our library of attachments.
-                                frame.content.mode('browse');
-                        }
-                },
-
                 refresh: function() {
-                        this.frame.$el.toggleClass( 'hide-toolbar', this.get('empty') );
                         this.content();
                         this.refreshSelection();
                 },
@@ -389 +366 @@
                         setUserSetting( 'urlbutton', display.link );
                 },
 
-                _updateEmpty: function() {
-                        var library = this.get('library'),
-                                props = library.props;
-
-                        // If we're filtering the library, bail.
-                        if ( this.get('filterable') && ( props.get('type') || props.get('parent') ) )
-                                return;
-
-                        this.set( 'empty', ! library.length && ! library.props.get('search') );
-                },
-
                 refreshSelection: function() {
                         var selection = this.get('selection'),
                                 mode = this.frame.content.mode();
@@ -1302 +1268 @@
                 browseContent: function() {
                         var state = this.state();
 
+                        this.$el.removeClass('hide-toolbar');
+
                         // Browse our library of attachments.
                         this.content.view( new media.view.AttachmentsBrowser({
                                 controller: this,
@@ -3010 +2978 @@
                         });
 
                         this.createToolbar();
-                        this.createAttachments();
+                        this.updateContent();
                         this.createSidebar();
+
+                        this.collection.on( 'add remove reset', this.updateContent, this );
                 },
 
                 dispose: function() {
@@ -3059 +3029 @@
                         }
                 },
 
+                updateContent: function() {
+                        var view = this;
+
+                        if( ! this.attachments )
+                                this.createAttachments();
+
+                        if ( ! this.collection.length ) {
+                                this.collection.more().done( function() {
+                                        if ( ! view.collection.length )
+                                                view.createUploader();
+                                });
+                        }
+                },
+
+                createUploader: function() {
+                        if ( this.attachments ) {
+                                this.attachments.remove();
+                                delete this.attachments;
+                        }
+
+                        this.uploader = new media.view.UploaderInline({
+                                controller: this.controller
+                        });
+
+                        this.views.add( this.uploader );
+                },
+
                 createAttachments: function() {
+                        if ( this.uploader ) {
+                                this.uploader.remove();
+                                delete this.uploader;
+                        }
+
                         this.attachments = new media.view.Attachments({
                                 controller: this.controller,
                                 collection: this.collection,