// Promo Fade

(function($) {
/* =========================================================



// jquery.customfade.js



// Date: 2008-12-03

// Company: Fellowship Church

// Author: Corin Schedler

// Mail: corin.gs@gmail.com

// Web: http://www.fellowshipchurch.com



// based on the work of Torsten Baldes http://medienfreunde.com



// elements = promoid = main promotion element. should be an

// absolutely positioned set of any block level elements

// TODO: slide animation for promos don't work correctly



// selectors = selectorid = 'clickers' that switch between

// elements manually. doesn't matter what they are, but there

// has to be corresponding selectors for every element.



// selectors.length == elements.length



// ========================================================= */
	// This is totally bad form, could be fixed.

	var settings = {

			'promoid': 'promo',

			'selectorid': 'promoselector',

			'promoanimation': 'fade',

			'timeout': 4500,

			'speed': 'slow',

			'go': 'true',

			'timeoutname': 'promotimeout'

	};



	$.fn.promofade = function(options) {

		settings.promoid = $(this).attr("id");



		return this.each(function() {   

			$.promofade(this, options);

		});

	};



	$.promofade = function(container, options) {



		if ( options ) {

			$.extend( settings, options );

		}



		var elements = $("#" + settings.promoid).children();

		var selectors = $("#" + settings.selectorid).children();



		if ( elements.length != selectors.length ) { alert("Selector length does not match."); }



		if ( settings.go == 'true' )

		{

			settings.timeoutname = setTimeout(function() {

        			$.promofade.next(elements, selectors, 1, 0);

                	}, settings.timeout);

		} else {

			clearTimeout( settings.timeoutname );

		}

	};



	$.promofade.next = function( elements, selectors, current, last ) {



		if ( settings.promoanimation == 'fade' )

		{

			$(elements[last]).fadeOut( settings.speed );

			$(elements[current]).fadeIn( settings.speed );

			$(elements[last]).hide();

		} else if ( settings.promoanimation == 'slide' ) {

			// This creates a 'slide gap', where they havent crossed yet, causing a blank spot

			// TODO: fix!

			$(elements[last]).slideUp( settings.speed );

			$(elements[current]).slideDown( settings.speed );

		}



		$(selectors[last]).removeClass("on");

		$(selectors[current]).addClass("on");

		

		// They are both the same length so we only calculate for one

		if ( (current + 1) < elements.length ) {

			current = current + 1;

			last = current - 1;

		} else {

			current = 0;

			last = elements.length - 1;

		}



		if ( settings.go == 'true' )

		{

			settings.timeoutname = setTimeout( function() {

				$.promofade.next( elements, selectors, current, last );

			}, settings.timeout );

		} else {

			clearTimeout( settings.timeoutname );

		}

	};
	
	/**

	 * customfade.jquery.js promo image fader

	 * The promo images fade in sync with the promo selector boxes

	 */

	var selectoron = function() {



		// Disable the fade timer

		$("#fader").promofade({

			'go': 'false'

		});



		// Disable old selector and enable clicked one

		$("li.on").removeClass("on");

		$(this).addClass("on");



		var faderkids = $("#fader").children();

		var selectorcount = 0;



		// This loops all the selectors and enables the correct promo

		// It could get ugly, but there are only four promos

		// TODO: fix?

		$(this).parent().children().each( function() {

			if ( $(this).hasClass("on") )

			{

				$( faderkids[ selectorcount ] ).show();

			} else {

				$( faderkids[ selectorcount ] ).hide();

			}



			selectorcount++;

		});



		return false;

	};





	$("#promolist ul li").click( selectoron );



	$("#fader").promofade({

		//'go': 'false', // Comment this line out if you want transitions

		selectorid: '#promolist ul'

	});

})(jQuery);