Merge pull request #368 from kborchers/bug_3532_2

Accordion: Stop current hide animation, jump to last animation and calculate percentages for padding in addition to height. Fixes #3532 - Accordion: Activating a panel during animation fails
This commit is contained in:
Scott González 2011-07-20 06:30:51 -07:00
commit e2a9b0c568

View File

@ -12,6 +12,8 @@
* jquery.ui.widget.js * jquery.ui.widget.js
*/ */
(function( $, undefined ) { (function( $, undefined ) {
var lastToggle = {};
// TODO: use ui-accordion-header-active class and fix styling // TODO: use ui-accordion-header-active class and fix styling
$.widget( "ui.accordion", { $.widget( "ui.accordion", {
@ -37,8 +39,6 @@ $.widget( "ui.accordion", {
var self = this, var self = this,
options = self.options; options = self.options;
self.running = false;
self.element.addClass( "ui-accordion ui-widget ui-helper-reset" ); self.element.addClass( "ui-accordion ui-widget ui-helper-reset" );
self.headers = self.element.find( options.header ) self.headers = self.element.find( options.header )
@ -321,8 +321,6 @@ $.widget( "ui.accordion", {
event.preventDefault(); event.preventDefault();
if ( options.disabled || if ( options.disabled ||
// can't switch during an animation
this.running ||
// click on active header, but not collapsible // click on active header, but not collapsible
( clickedIsActive && !options.collapsible ) || ( clickedIsActive && !options.collapsible ) ||
// allow canceling activation // allow canceling activation
@ -363,7 +361,6 @@ $.widget( "ui.accordion", {
toShow = data.newContent, toShow = data.newContent,
toHide = data.oldContent; toHide = data.oldContent;
self.running = true;
function complete() { function complete() {
self._completed( data ); self._completed( data );
} }
@ -384,6 +381,8 @@ $.widget( "ui.accordion", {
animations[ animation ]({ animations[ animation ]({
toShow: toShow, toShow: toShow,
toHide: toHide, toHide: toHide,
prevShow: lastToggle.toShow,
prevHide: lastToggle.toHide,
complete: complete, complete: complete,
down: toShow.length && ( !toHide.length || ( toShow.index() < toHide.index() ) ) down: toShow.length && ( !toHide.length || ( toShow.index() < toHide.index() ) )
}, additional ); }, additional );
@ -414,8 +413,6 @@ $.widget( "ui.accordion", {
var toShow = data.newContent, var toShow = data.newContent,
toHide = data.oldContent; toHide = data.oldContent;
this.running = false;
if ( this.options.heightStyle === "content" ) { if ( this.options.heightStyle === "content" ) {
toShow.add( toHide ).css({ toShow.add( toHide ).css({
height: "", height: "",
@ -437,6 +434,11 @@ $.widget( "ui.accordion", {
$.extend( $.ui.accordion, { $.extend( $.ui.accordion, {
animations: { animations: {
slide: function( options, additions ) { slide: function( options, additions ) {
if ( options.prevShow || options.prevHide ) {
options.prevHide.stop( true, true );
options.toHide = options.prevShow;
}
var showOverflow = options.toShow.css( "overflow" ), var showOverflow = options.toShow.css( "overflow" ),
hideOverflow = options.toHide.css( "overflow" ), hideOverflow = options.toHide.css( "overflow" ),
percentDone = 0, percentDone = 0,
@ -448,6 +450,9 @@ $.extend( $.ui.accordion, {
easing: "swing", easing: "swing",
duration: 300 duration: 300
}, options, additions ); }, options, additions );
lastToggle = options;
if ( !options.toHide.size() ) { if ( !options.toHide.size() ) {
originalWidth = options.toShow[0].style.width; originalWidth = options.toShow[0].style.width;
options.toShow options.toShow
@ -504,10 +509,7 @@ $.extend( $.ui.accordion, {
.filter( ":visible" ) .filter( ":visible" )
.animate( hideProps, { .animate( hideProps, {
step: function( now, settings ) { step: function( now, settings ) {
// only calculate the percent when animating height if ( settings.prop == "height" || settings.prop == "paddingTop" || settings.prop == "paddingBottom" ) {
// IE gets very inconsistent results when animating elements
// with small values, which is common for padding
if ( settings.prop == "height" ) {
percentDone = ( settings.end - settings.start === 0 ) ? 0 : percentDone = ( settings.end - settings.start === 0 ) ? 0 :
( settings.now - settings.start ) / ( settings.end - settings.start ); ( settings.now - settings.start ) / ( settings.end - settings.start );
} }