
/*
 * selector should be the jquery selector that contains your images
 * this is probably going to be a ul
 * which should contain lis with imgs in them
 *
 * time is a number of milliseconds between fades
 * defaults to 3000 (3 seconds)
 */

var imagefade_current = 0;
var imagefade_interval = 0;
var imagefade_selector = 0;

function imagefade(selector, time) {

	time = time || 3000;	
	imagefade_selector = selector;
	
	var jQ = jQuery.noConflict();
	
	// wrapper to help with positioning
	var wrapper = '<div style="position: relative;"></div>';
	jQ(imagefade_selector).wrap(wrapper);

	// clone first, put it on the end
	jQ(imagefade_selector).append(jQ(imagefade_selector + ' li:first').clone());
	
	// set positioning
	jQ(imagefade_selector + ' li').each(function(i) {
		jQ(this).css('z-index', 100 - i);
		jQ(this).css('position', 'absolute');
	});
		
	// okgo
	jQ(imagefade_selector).addClass('fading');
	imagefade_interval = setInterval(imagefade_go, time);

}

function imagefade_go() {

	var jQ = jQuery.noConflict();
	
	var kids = jQ(imagefade_selector + ' li').length;

	jQ(imagefade_selector + ' li:eq(' + imagefade_current.toString() + ')').fadeOut(1000, function() {
	
		imagefade_current++;

		// did we just fade to the last slide?		
		if (imagefade_current + 1 >= kids) {
	
			// on the last slide
			
			// turn the first one back on RIGHT NOW
			jQ(imagefade_selector + ' li:first').fadeIn(0, function() {
			
				// when that's done, turn all the others back on, too
				jQ(imagefade_selector + ' li:gt(0)').fadeIn(0);
				imagefade_current = 0;
			
			});
		}
	
	});
	
}
