Effects.*: Updating Effect Method API to avoid duplicating the queue …

…call - Fixes #7318 - Add the queue functions to $.fn.effect()
jquery · Jun 21, 2011 · 1c1a3b1 · 1c1a3b1
1 parent fb210ae
commit 1c1a3b1
Show file tree

Hide file tree

Showing 14 changed files with 785 additions and 814 deletions.
diff --git a/ui/jquery.effects.blind.js b/ui/jquery.effects.blind.js
@@ -12,73 +12,69 @@
  */
 (function( $, undefined ) {
 
-var rvertical = /up|down|vertical/;
-var rpositivemotion = /up|left|vertical|horizontal/;
+var rvertical = /up|down|vertical/,
+	rpositivemotion = /up|left|vertical|horizontal/;
 
-$.effects.effect.blind = function( o ) {
+$.effects.effect.blind = function( o, next ) {
+	// Create element
+	var el = $( this ),
+		props = [ "position", "top", "bottom", "left", "right", "height", "width" ],
+		mode = $.effects.setMode( el, o.mode || "hide" ),
+		direction = o.direction || "up",
+		vertical = rvertical.test( direction ),
+		ref = vertical ? "height" : "width",
+		ref2 = vertical ? "top" : "left",
+		motion = rpositivemotion.test( direction ),
+		animation = {},
+		show = mode === "show",
+		wrapper, distance;
 
-	return this.queue( function() {
-
-		// Create element
-		var el = $( this ),
-			props = [ "position", "top", "bottom", "left", "right", "height", "width" ],
-			mode = $.effects.setMode( el, o.mode || "hide" ),
-			direction = o.direction || "up",
-			vertical = rvertical.test( direction ),
-			ref = vertical ? "height" : "width",
-			ref2 = vertical ? "top" : "left",
-			motion = rpositivemotion.test( direction ),
-			animation = {},
-			wrapper, distance;
+	// if already wrapped, the wrapper's properties are my property. #6245
+	if ( el.parent().is( ".ui-effects-wrapper" ) ) {
+		$.effects.save( el.parent(), props );
+	} else {
+		$.effects.save( el, props );
+	}
+	el.show(); 
+	wrapper = $.effects.createWrapper( el ).css({ 
+		overflow: "hidden"
+	});
 
-		// if already wrapped, the wrapper's properties are my property. #6245
-		if ( el.parent().is( ".ui-effects-wrapper" ) ) {
-			$.effects.save( el.parent(), props );
-		} else {
-			$.effects.save( el, props );
-		}
-		el.show(); 
-		wrapper = $.effects.createWrapper( el ).css({ 
-			overflow: "hidden"
-		});
+	distance = wrapper[ ref ]();
 
-		distance = wrapper[ ref ]();
+	animation[ ref ] = ( mode === "show" ? distance : 0 );
+	if ( !motion ) {
+		el
+			.css( vertical ? "bottom" : "right", 0 )
+			.css( vertical ? "top" : "left", "" )
+			.css({ position: "absolute" });
+		animation[ ref2 ] = ( mode === "show" ) ? 0 : distance;
+	}
 
-		animation[ ref ] = ( mode === "show" ? distance : 0 );
-		if ( !motion ) {
-			el
-				.css( vertical ? "bottom" : "right", 0 )
-				.css( vertical ? "top" : "left", "" )
-				.css({ position: "absolute" });
-			animation[ ref2 ] = ( mode === "show" ) ? 0 : distance;
+	// start at 0 if we are showing
+	if ( mode === "show" ) {
+		wrapper.css( ref, 0 );
+		if ( ! motion ) {
+			wrapper.css( ref2, distance );
 		}
+	}
 
-		// start at 0 if we are showing
-		if ( mode == "show" ) {
-			wrapper.css( ref, 0 );
-			if ( ! motion ) {
-				wrapper.css( ref2, distance );
+	// Animate
+	wrapper.animate( animation, {
+		duration: o.duration,
+		easing: o.easing,
+		queue: false,
+		complete: function() {
+			if ( mode == "hide" ) {
+				el.hide();
 			}
-		}
-
-		// Animate
-		wrapper.animate( animation, {
-			duration: o.duration,
-			easing: o.easing,
-			queue: false,
-			complete: function() {
-				if ( mode == "hide" ) {
-					el.hide();
-				}
-				$.effects.restore( el, props ); 
-				$.effects.removeWrapper( el );
-				if ( $.isFunction( o.complete ) ) {
-					o.complete.apply( el[ 0 ], arguments );
-				}
-				el.dequeue();
+			$.effects.restore( el, props ); 
+			$.effects.removeWrapper( el );
+			if ( $.isFunction( o.complete ) ) {
+				o.complete.apply( el[ 0 ], arguments );
 			}
-		});
-
+			next();
+		}
 	});
 
 };

diff --git a/ui/jquery.effects.bounce.js b/ui/jquery.effects.bounce.js
@@ -12,108 +12,104 @@
  */
 (function( $, undefined ) {
 
-$.effects.effect.bounce = function(o) {
-
-	return this.queue( function( next ) {
-		var el = $( this ), 
-			props = [ "position", "top", "bottom", "left", "right", "height", "width" ],
-
-			// defaults:
-			mode = $.effects.setMode( el, o.mode || "effect" ),
-			hide = mode === "hide",
-			show = mode === "show",
-			direction = o.direction || "up", 
-			distance = o.distance,
-			times = o.times || 5,
-
-			// number of internal animations
-			anims = times * 2 + ( show || hide ? 1 : 0 ),
-			speed = o.duration / anims,
-			easing = o.easing,
-
-			// utility:
-			ref = ( direction === "up" || direction === "down" ) ? "top" : "left",
-			motion = ( direction === "up" || direction === "left" ), 
-			i,
-			upAnim,
-			downAnim,
-
-			// we will need to re-assemble the queue to stack our animations in place
-			queue = el.queue(),
-			queuelen = queue.length;
-
-		// Avoid touching opacity to prevent clearType and PNG issues in IE	
-		if ( show || hide ) {
-			props.push( "opacity" );
-		} 
-
-		$.effects.save( el, props ); 
-		el.show(); 
-		$.effects.createWrapper( el ); // Create Wrapper
-
-		// default distance for the BIGGEST bounce is the outer Distance / 3
-		if ( !distance ) {
-			distance = el[ ref === "top" ? "outerHeight" : "outerWidth" ]() / 3;
-		}
-
-		if ( show ) {
-			downAnim = { opacity: 1 };
-			downAnim[ ref ] = 0;
-
-			// if we are showing, force opacity 0 and set the initial position
-			// then do the "first" animation
-			el.css( "opacity", 0 )
-				.css( ref, motion ? -distance*2 : distance*2 )
-				.animate( downAnim, speed, easing );
-		}
-
-		// start at the smallest distance if we are hiding
-		if ( hide ) {
-			distance = distance / Math.pow( 2, times - 1 );
-		}
-
-		downAnim = {};
+$.effects.effect.bounce = function( o, next ) {
+	var el = $( this ), 
+		props = [ "position", "top", "bottom", "left", "right", "height", "width" ],
+
+		// defaults:
+		mode = $.effects.setMode( el, o.mode || "effect" ),
+		hide = mode === "hide",
+		show = mode === "show",
+		direction = o.direction || "up", 
+		distance = o.distance,
+		times = o.times || 5,
+
+		// number of internal animations
+		anims = times * 2 + ( show || hide ? 1 : 0 ),
+		speed = o.duration / anims,
+		easing = o.easing,
+
+		// utility:
+		ref = ( direction === "up" || direction === "down" ) ? "top" : "left",
+		motion = ( direction === "up" || direction === "left" ), 
+		i,
+		upAnim,
+		downAnim,
+
+		// we will need to re-assemble the queue to stack our animations in place
+		queue = el.queue(),
+		queuelen = queue.length;
+
+	// Avoid touching opacity to prevent clearType and PNG issues in IE	
+	if ( show || hide ) {
+		props.push( "opacity" );
+	} 
+
+	$.effects.save( el, props ); 
+	el.show(); 
+	$.effects.createWrapper( el ); // Create Wrapper
+
+	// default distance for the BIGGEST bounce is the outer Distance / 3
+	if ( !distance ) {
+		distance = el[ ref === "top" ? "outerHeight" : "outerWidth" ]() / 3;
+	}
+
+	if ( show ) {
+		downAnim = { opacity: 1 };
 		downAnim[ ref ] = 0;
-		// Bounces up/down/left/right then back to 0 -- times * 2 animations happen here
-		for ( i = 0; i < times; i++ ) {
-			upAnim = {};
-			upAnim[ ref ] = ( motion ? "-=" : "+=" ) + distance;
-
-			el.animate( upAnim, speed, easing )
-				.animate( downAnim, speed, easing );
-
-			distance = hide ? distance * 2 : distance / 2;
-		}
 
-		// Last Bounce when Hiding
+		// if we are showing, force opacity 0 and set the initial position
+		// then do the "first" animation
+		el.css( "opacity", 0 )
+			.css( ref, motion ? -distance*2 : distance*2 )
+			.animate( downAnim, speed, easing );
+	}
+
+	// start at the smallest distance if we are hiding
+	if ( hide ) {
+		distance = distance / Math.pow( 2, times - 1 );
+	}
+
+	downAnim = {};
+	downAnim[ ref ] = 0;
+	// Bounces up/down/left/right then back to 0 -- times * 2 animations happen here
+	for ( i = 0; i < times; i++ ) {
+		upAnim = {};
+		upAnim[ ref ] = ( motion ? "-=" : "+=" ) + distance;
+
+		el.animate( upAnim, speed, easing )
+			.animate( downAnim, speed, easing );
+
+		distance = hide ? distance * 2 : distance / 2;
+	}
+
+	// Last Bounce when Hiding
+	if ( hide ) {
+		upAnim = { opacity: 0 };
+		upAnim[ ref ] = ( motion ? "-=" : "+=" ) + distance;
+
+		el.animate( upAnim, speed, easing );
+	}
+
+	el.queue( function( next ) {
 		if ( hide ) {
-			upAnim = { opacity: 0 };
-			upAnim[ ref ] = ( motion ? "-=" : "+=" ) + distance;
-
-			el.animate( upAnim, speed, easing );
+			el.hide();
 		}
-
-		el.queue( function( next ) {
-			if ( hide ) {
-				el.hide();
-			}
-			$.effects.restore( el, props );
-			$.effects.removeWrapper( el );
-			if ( o.complete ) {
-				o.complete.apply( el[ 0 ] );
-			}
-			next();
-		});
-
-		// inject all the animations we just queued to be first in line (after "inprogress")
-		if ( queuelen > 1) {
-			queue.splice.apply( queue,
-				[ 1, 0 ].concat( queue.splice( queuelen, anims + 1 ) ) );
+		$.effects.restore( el, props );
+		$.effects.removeWrapper( el );
+		if ( o.complete ) {
+			o.complete.apply( el[ 0 ] );
 		}
 		next();
-
 	});
 
+	// inject all the animations we just queued to be first in line (after "inprogress")
+	if ( queuelen > 1) {
+		queue.splice.apply( queue,
+			[ 1, 0 ].concat( queue.splice( queuelen, anims + 1 ) ) );
+	}
+	next();
+
 };
 
 })(jQuery);