Smooth out some display and race condition issues with the media modal loading spinner. props kadamwhite, gcorne. see #24859.

git-svn-id: https://develop.svn.wordpress.org/trunk@27516 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Helen Hou-Sandi 2014-03-12 21:06:30 +00:00
parent 395b466fb7
commit 5f936ab3dd
1 changed files with 22 additions and 14 deletions

View File

@ -5205,13 +5205,22 @@
}, },
scroll: function() { scroll: function() {
var view = this,
toolbar;
// @todo: is this still necessary? // @todo: is this still necessary?
if ( ! this.$el.is(':visible') ) { if ( ! this.$el.is(':visible') ) {
return; return;
} }
if ( this.collection.hasMore() && this.el.scrollHeight < this.el.scrollTop + ( this.el.clientHeight * this.options.refreshThreshold ) ) { if ( this.collection.hasMore() && this.el.scrollHeight < this.el.scrollTop + ( this.el.clientHeight * this.options.refreshThreshold ) ) {
this.collection.more().done( this.scroll ); toolbar = this.views.parent.toolbar;
toolbar.get('spinner').show();
this.collection.more().done(function() {
view.scroll();
toolbar.get('spinner').hide();
});
} }
} }
}, { }, {
@ -5451,16 +5460,6 @@
this.collection.on( 'add remove reset', this.updateContent, this ); this.collection.on( 'add remove reset', this.updateContent, this );
}, },
toggleSpinner: function( state ) {
if ( state ) {
this.spinnerTimeout = _.delay(function( view ) {
view.toolbar.get( 'spinner' ).show();
}, 600, this );
} else {
this.toolbar.get( 'spinner' ).hide();
clearTimeout( this.spinnerTimeout );
}
},
/** /**
* @returns {wp.media.view.AttachmentsBrowser} Returns itself to allow chaining * @returns {wp.media.view.AttachmentsBrowser} Returns itself to allow chaining
*/ */
@ -5525,12 +5524,12 @@
} }
if ( ! this.collection.length ) { if ( ! this.collection.length ) {
this.toggleSpinner( true ); this.toolbar.get( 'spinner' ).show();
this.collection.more().done(function() { this.collection.more().done(function() {
if ( ! view.collection.length ) { if ( ! view.collection.length ) {
view.createUploader(); view.createUploader();
} }
view.toggleSpinner( false ); view.toolbar.get( 'spinner' ).hide();
}); });
} }
}, },
@ -6764,14 +6763,23 @@
media.view.Spinner = media.View.extend({ media.view.Spinner = media.View.extend({
tagName: 'span', tagName: 'span',
className: 'spinner', className: 'spinner',
spinnerTimeout: false,
delay: 400,
show: function() { show: function() {
this.$el.show(); if ( ! this.spinnerTimeout ) {
this.spinnerTimeout = _.delay(function( $el ) {
$el.show();
}, this.delay, this.$el );
}
return this; return this;
}, },
hide: function() { hide: function() {
this.$el.hide(); this.$el.hide();
this.spinnerTimeout = clearTimeout( this.spinnerTimeout );
return this; return this;
} }
}); });