Effects.*: Style Guidance

Author: gnarf

ui/jquery.effects.blind.js

@@ -11,7 +11,7 @@
  *	jquery.effects.core.js
  */
 (function( $, undefined ) {
-	
+
 var rvertical = /up|down|vertical/,
 	rpositivemotion = /up|left|vertical|horizontal/;
 
@@ -35,24 +35,24 @@ $.effects.effect.blind = function( o, next ) {
 	} else {
 		$.effects.save( el, props );
 	}
-	el.show(); 
-	wrapper = $.effects.createWrapper( el ).css({ 
+	el.show();
+	wrapper = $.effects.createWrapper( el ).css({
 		overflow: "hidden"
 	});
 
 	distance = wrapper[ ref ]();
 
-	animation[ ref ] = ( mode === "show" ? distance : 0 );
+	animation[ ref ] = 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[ ref2 ] = show ? 0 : distance;
 	}
 
 	// start at 0 if we are showing
-	if ( mode === "show" ) {
+	if ( show ) {
 		wrapper.css( ref, 0 );
 		if ( ! motion ) {
 			wrapper.css( ref2, distance );
@@ -65,10 +65,10 @@ $.effects.effect.blind = function( o, next ) {
 		easing: o.easing,
 		queue: false,
 		complete: function() {
-			if ( mode == "hide" ) {
+			if ( mode === "hide" ) {
 				el.hide();
 			}
-			$.effects.restore( el, props ); 
+			$.effects.restore( el, props );
 			$.effects.removeWrapper( el );
 			if ( $.isFunction( o.complete ) ) {
 				o.complete.apply( el[ 0 ], arguments );

ui/jquery.effects.bounce.js

@@ -61,7 +61,7 @@ $.effects.effect.bounce = function( o, next ) {
 		// 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 )
+			.css( ref, motion ? -distance * 2 : distance * 2 )
 			.animate( downAnim, speed, easing );
 	}
 

ui/jquery.effects.drop.js

@@ -17,11 +17,12 @@ $.effects.effect.drop = function( o, next ) {
 	var el = $( this ), 
 		props = [ "position", "top", "bottom", "left", "right", "opacity", "height", "width" ],
 		mode = $.effects.setMode( el, o.mode || "hide" ),
+		show = mode === "show",
 		direction = o.direction || "left",
-		ref = ( direction == "up" || direction == "down" ) ? "top" : "left",
-		motion = ( direction == "up" || direction == "left" ) ? "pos" : "neg",
+		ref = ( direction === "up" || direction === "down" ) ? "top" : "left",
+		motion = ( direction === "up" || direction === "left" ) ? "pos" : "neg",
 		animation = {
-			opacity: mode == "show" ? 1 : 0
+			opacity: show ? 1 : 0
 		},
 		distance;
 
@@ -32,14 +33,17 @@ $.effects.effect.drop = function( o, next ) {
 
 	distance = o.distance || el[ ref == "top" ? "outerHeight": "outerWidth" ]({ margin: true }) / 2;
 
-	if ( mode == "show" ) {
+	if ( show ) {
 		el
 			.css( "opacity", 0 )
 			.css( ref, motion == "pos" ? -distance : distance );
 	}
 
 	// Animation
-	animation[ ref ] = ((mode == "show") ? (motion == "pos" ? "+=" : "-=") : (motion == "pos" ? "-=" : "+=")) + distance;
+	animation[ ref ] = ( show ? 
+		( motion === "pos" ? "+=" : "-=" ) : 
+		( motion === "pos" ? "-=" : "+=" ) ) 
+		+ distance;
 
 	// Animate
 	el.animate( animation, { 
@@ -50,7 +54,7 @@ $.effects.effect.drop = function( o, next ) {
 			mode == "hide" && el.hide();
 			$.effects.restore( el, props ); 
 			$.effects.removeWrapper( el ); 
-			$.isFunction( o.complete ) && o.complete.apply(this, arguments);
+			$.isFunction( o.complete ) && o.complete.apply( this, arguments );
 			next();
 		}
 	});

ui/jquery.effects.explode.js

@@ -14,11 +14,11 @@
 
 $.effects.effect.explode = function( o, next ) {
 
-	var rows = o.pieces ? Math.round(Math.sqrt(o.pieces)) : 3,
+	var rows = o.pieces ? Math.round( Math.sqrt( o.pieces ) ) : 3,
 		cells = rows,
 		el = $( this ),
 		mode = $.effects.setMode( el, o.mode || "hide" ),
-		show = ( mode == "show" ),
+		show = mode === "show",
 
 		// show and then visibility:hidden the element before calculating offset
 		offset = el.show().css( "visibility", "hidden" ).offset(),

ui/jquery.effects.fold.js

@@ -16,15 +16,18 @@ $.effects.effect.fold = function( o, next ) {
 
 	// Create element
 	var el = $( this ),
-		props = ["position","top","bottom","left","right","height","width"],
-		mode = $.effects.setMode(el, o.mode || "hide"),
+		props = [ "position", "top", "bottom", "left", "right", "height", "width" ],
+		mode = $.effects.setMode( el, o.mode || "hide" ),
+		show = mode === "show",
+		hide = mode === "hide",
 		size = o.size || 15,
-		percent = /([0-9]+)%/.exec(size),
+		percent = /([0-9]+)%/.exec( size ),
 		horizFirst = !!o.horizFirst,
-		widthFirst = ((mode == "show") != horizFirst),
-		ref = widthFirst ? ["width", "height"] : ["height", "width"],
+		widthFirst = show != horizFirst,
+		ref = widthFirst ? [ "width", "height" ] : [ "height", "width" ],
 		duration = o.duration / 2,
-		wrapper, distance;
+		wrapper, distance,
+		animation1 = {}, animation2 = {};
 
 	$.effects.save( el, props );
 	el.show();
@@ -38,29 +41,34 @@ $.effects.effect.fold = function( o, next ) {
 		[ wrapper.height(), wrapper.width() ];
 
 	if ( percent ) {
-		size = parseInt( percent[ 1 ], 10 ) / 100 * distance[ ( mode == "hide") ? 0 : 1 ];
+		size = parseInt( percent[ 1 ], 10 ) / 100 * distance[ hide ? 0 : 1 ];
 	}
-	mode == "show" && wrapper.css( horizFirst ? {
+	if ( show ) {
+		wrapper.css( horizFirst ? {
 			height: 0,
 			width: size
 		} : {
 			height: size,
 			width: 0
 		});
+	}
 
 	// Animation
-	var animation1 = {}, animation2 = {};
-	animation1[ ref[ 0 ] ] = mode == "show" ? distance[ 0 ] : size;
-	animation2[ ref[ 1 ] ] = mode == "show" ? distance[ 1 ] : 0;
+	animation1[ ref[ 0 ] ] = show ? distance[ 0 ] : size;
+	animation2[ ref[ 1 ] ] = show ? distance[ 1 ] : 0;
 
 	// Animate
 	wrapper
 		.animate( animation1, duration, o.easing )
 		.animate( animation2, duration, o.easing, function() {
-			(mode == "hide") && el.hide();
+			if ( hide ) {
+				el.hide();
+			}
 			$.effects.restore( el, props );
 			$.effects.removeWrapper( el );
-			jQuery.isFunction(o.complete) && o.complete.apply( el[ 0 ], arguments );
+			if ( $.isFunction( o.complete ) ) {
+				o.complete.apply( el[ 0 ], arguments );
+			}
 			next();
 		});
 

ui/jquery.effects.highlight.js

@@ -20,7 +20,7 @@ $.effects.effect.highlight = function( o, next ) {
 			backgroundColor: elem.css( "backgroundColor" )
 		};
 
-	if (mode == "hide") {
+	if (mode === "hide") {
 		animation.opacity = 0;
 	}
 
@@ -37,10 +37,13 @@ $.effects.effect.highlight = function( o, next ) {
 			duration: o.duration,
 			easing: o.easing,
 			complete: function() {
-				(mode == "hide" && elem.hide());
+				if ( mode === "hide" ) {
+					elem.hide();
+				}
 				$.effects.restore( elem, props );
-				(mode == "show" && !$.support.opacity && this.style.removeAttribute( "filter" ));
-				jQuery.isFunction(o.complete) && o.complete.apply(this, arguments);
+				if ( $.isFunction( o.complete) ) {
+					o.complete.apply( this, arguments );
+				}
 				next();
 			}
 		});

ui/jquery.effects.scale.js

@@ -24,6 +24,7 @@ function compFunction( el, complete, next ) {
 $.effects.effect.puff = function( o, next ) {
 	var elem = $( this ),
 		mode = $.effects.setMode( elem, o.mode || "hide" ),
+		hide = mode === "hide",
 		percent = parseInt( o.percent, 10 ) || 150,
 		factor = percent / 100,
 		original = { 
@@ -37,8 +38,8 @@ $.effects.effect.puff = function( o, next ) {
 		fade: true,
 		mode: mode,
 		complete: compFunction( this, o.complete, next ),
-		percent: mode == "hide" ? percent : 100,
-		from: mode == "hide"
+		percent: hide ? percent : 100,
+		from: hide
 			? original
 			: {
 				height: original.height * factor,

ui/jquery.effects.shake.js

@@ -23,7 +23,7 @@ $.effects.effect.shake = function( o, next ) {
 		anims = times * 2 + 1,
 		speed = o.duration,
 		ref = (direction == "up" || direction == "down") ? "top" : "left",
-		motion = (direction == "up" || direction == "left") ? "pos" : "neg",
+		positiveMotion = (direction == "up" || direction == "left"),
 		animation = {},
 		animation1 = {},
 		animation2 = {},
@@ -39,9 +39,9 @@ $.effects.effect.shake = function( o, next ) {
 	$.effects.createWrapper( el );
 
 	// Animation
-	animation[ ref ] = ( motion == "pos" ? "-=" : "+=" ) + distance;
-	animation1[ ref ] = ( motion == "pos" ? "+=" : "-=" ) + distance * 2;
-	animation2[ ref ] = ( motion == "pos" ? "-=" : "+=" ) + distance * 2;
+	animation[ ref ] = ( positiveMotion ? "-=" : "+=" ) + distance;
+	animation1[ ref ] = ( positiveMotion ? "+=" : "-=" ) + distance * 2;
+	animation2[ ref ] = ( positiveMotion ? "-=" : "+=" ) + distance * 2;
 
 	// Animate
 	el.animate( animation, speed, o.easing );
@@ -59,7 +59,9 @@ $.effects.effect.shake = function( o, next ) {
 			}
 			$.effects.restore( el, props );
 			$.effects.removeWrapper( el );
-			$.isFunction( o.complete ) && o.complete.apply( this, arguments );
+			if ( $.isFunction( o.complete ) ) {
+				o.complete.apply( this, arguments );
+			}
 			next();
 		});
 

ui/jquery.effects.slide.js

@@ -18,32 +18,33 @@ $.effects.effect.slide = function( o, next ) {
 	var el = $( this ),
 		props = [ "position", "top", "bottom", "left", "right", "width", "height" ],
 		mode = $.effects.setMode( el, o.mode || "show" ),
+		show = mode === "show",
 		direction = o.direction || "left",
 		ref = (direction == "up" || direction == "down") ? "top" : "left",
-		motion = (direction == "up" || direction == "left") ? "pos" : "neg",
+		positiveMotion = (direction == "up" || direction == "left"),
 		distance,
 		animation = {},
 		size;
 
 	// Adjust
 	$.effects.save( el, props );
 	el.show();
-	distance = o.distance || el[ ref == "top" ? "outerHeight" : "outerWidth" ]({ 
+	distance = o.distance || el[ ref === "top" ? "outerHeight" : "outerWidth" ]({ 
 		margin: true
 	});
 
 	$.effects.createWrapper( el ).css({
 		overflow: "hidden"
 	});
 
-	if (mode == "show") {
-		el.css( ref, motion == "pos" ? (isNaN(distance) ? "-" + distance : -distance) : distance );
+	if ( show ) {
+		el.css( ref, positiveMotion ? (isNaN(distance) ? "-" + distance : -distance) : distance );
 	}
 
 	// Animation
-	animation[ ref ] = ( mode == "show" ? 
-		(motion == "pos" ? "+=" : "-=") : 
-		(motion == "pos" ? "-=" : "+=")) 
+	animation[ ref ] = ( show ? 
+		( positiveMotion ? "+=" : "-=") : 
+		( positiveMotion ? "-=" : "+=")) 
 		+ distance;
 
 	// Animate
@@ -52,12 +53,14 @@ $.effects.effect.slide = function( o, next ) {
 		duration: o.duration, 
 		easing: o.easing, 
 		complete: function() {
-			if ( mode == "hide" ) {
+			if ( mode === "hide" ) {
 				el.hide(); 
 			}
 			$.effects.restore( el, props );
 			$.effects.removeWrapper( el );
-			$.isFunction(o.complete) && o.complete.apply( this, arguments ); 
+			if ( $.isFunction( o.complete ) ) {
+				o.complete.apply( this, arguments ); 
+			}
 			next();
 		}
 	});

ui/jquery.effects.transfer.js

@@ -39,7 +39,9 @@ $.effects.effect.transfer = function( o, next ) {
 			})
 			.animate( animation, o.duration, o.easing, function() {
 				transfer.remove();
-				$.isFunction( o.complete ) && o.complete.apply(elem[0], arguments);
+				if ( $.isFunction( o.complete ) ) {
+					o.complete.apply( elem[0], arguments );
+				}
 				next();
 			});
 };