function fadeAllImages() {
	
	if( window.initRotateArgs )
		initRotate.apply(this, window.initRotateArgs);
		
	if( window.initManualRotateArgs ) {
		initManualRotate.apply(this, window.initManualRotateArgs );
		$('#main .details').append('<input type="button" value="NEXT IMAGE &gt;" class="button" id="next_image" />');
		$('#next_image').bind('click', function() { document.startRotate(); });
	}

	$('img:not(.nofade)').each( function() { // for each img

		$(this).css({opacity: 0.0}) // set the img opacity to transparent
			.bind('load readystatechange', function(e) { // bind to the load and readystatechange events
				setTimeout( function() { // wait a moment after the img is done loading to prevent glitching
					$(e.target).animate({opacity: 1.0}, 510); // fade the img to opaque
				}, 100);
			});

		this.src = this.src; // give ie another chance to trigger event handlers for the img

	});

	$('input#name').focus();
	
}

function initRotate(containerId) {

	$containerId = $(containerId);
	if( $containerId.length < 1 )
		return;

	var argIndex = 2;
	var argCount = arguments.length;
	var rotateArgs = arguments;
	if( argCount < 3 )
		return;  // nothing to rotate

	$containerId.html(
		'<div><img src="' + rotateArgs[argIndex - 1] + '" alt="" /></div>' +
		'<div><img src="' + rotateArgs[argIndex] + '" alt="" class="nofade" /></div>'
	);

	$containerId.find('div').css({position:'absolute', top:0, right:0});
	var bottom = $containerId.find('div:eq(0)');
	var top = $containerId.find('div:eq(1)');

	top.css({opacity:0.0});

	setInterval(function() {
		top.stop().css({opacity: 0, visibility:'visible'}).animate({opacity: 1.0}, 1250, function() {
			argIndex = (argIndex < (argCount - 1) ? argIndex + 1 : 1);  // advance or reset the index
			bottom.find('img:eq(0)').attr('src', top.find('img:eq(0)').attr('src') );  // copy the top image to the bottom
			top.css({opacity: 0.0, visibility:'hidden'});  // hide the top image
			top.find('img:eq(0)').attr('src', rotateArgs[ argIndex ]);  // preload the next image into the hidden top container
		});
	}, 5000);

}

function initManualRotate(containerId) {

	$containerId = $(containerId);
	if( $containerId.length < 1 )
		return;

	var argIndex = 2;
	var argCount = arguments.length;
	var rotateArgs = arguments;
	if( argCount < 3 )
		return;  // nothing to rotate

	$containerId.html(
		'<div><img src="' + rotateArgs[argIndex - 1] + '" alt="" /></div>' +
		'<div><img src="' + rotateArgs[argIndex] + '" alt="" class="nofade" /></div>'
	);

	$containerId.find('div').css({position:'absolute', top:0, right:0});
	var bottom = $containerId.find('div:eq(0)');	
	var top = $containerId.find('div:eq(1)');	

	top.css({opacity:0.0});

	document.startRotate = function startRotate() {
		top.stop().animate({opacity: 1.0}, 500, function() {
			argIndex = (argIndex < (argCount - 1) ? argIndex + 1 : 1);  // advance or reset the index
			bottom.find('img:eq(0)').attr('src', top.find('img:eq(0)').attr('src') );  // copy the top image to the bottom
			top.css({opacity: 0.0});  // hide the top image
			top.find('img:eq(0)').attr('src', rotateArgs[ argIndex ]);  // preload the next image into the hidden top container
		});
	};

}