// Promo Fade
$(document).ready( function() {
	/**
	 * 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.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

// ========================================================= */

(function($) {

	// 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 );
		}
	};
})(jQuery);