//  blindmicemedia.com Basic behaviors
//  February 2008
//  
//  Makes use of Prototype 1.6.0 (http://prototypejs.org)
//  and Scriptaculous 1.8.1 (http://script.aculo.us).


/* It is necessary to have the same number in each list */
var imagesList = [	"images/home/viia_id.gif", 
					"images/home/redpouch.gif", 
					"images/home/poshpapoose.gif",
					"images/home/nestea.gif"
					];
var captionsList = [				   
				   	"<span>Above:</span> Print, web, and interactive kiosk materials for Ascent Media's flagship software product, Viia.", 
				   	"<span>Above:</span> Brand identity, e-commerce application, and deployment strategy for Red Pouch.", 
				   	"<span>Above:</span> E-commerce application and online strategy consulting for Posh Papoose, including management tools and marketing.",
					"<span>Above:</span> Interactive advertisements created in collaboration with Lowe Roche for Nestea's Plunge and Play campaign."
				   ];
var linksList = [				   
				   	"portfolio/?pid=ascent_nab2007", 
				   	"portfolio/?pid=redpouch",
				   	"portfolio/?pid=poshpapoose",
					"portfolio/?pid=nestea"
				   ];

// the number of seconds between swap effect and rotations.
var swapDelay = 0.5;
var rotateDelay = swapDelay*2 + 7;
var timerId = 0;

var prevItem = 0;
var nextItem = 0;

function swapImages() {
	var image_top = $$('.sidebar .image_top img').pop();
	var image_bottom = $$('.sidebar .image_bottom img').pop();
	var image_caption = $$('.sidebar .image_caption').pop();
	var image_link = $$('.sidebar .image_link a').pop();
	var image_nav = $$('.sidebar .image_nav a');	
	
	image_nav[prevItem].removeClassName('currentNavItem');
	image_bottom.setAttribute('src', imagesList[nextItem]);
	
	new Effect.Parallel([ 	new Effect.Fade(image_top,{sync:true}), 
							new Effect.Fade(image_caption,{sync:true}), 
							new Effect.Fade(image_link,{sync:true})], 
							{ duration:swapDelay } );
	
	window.setTimeout(function(){

		image_top.setAttribute('src', imagesList[nextItem]);
		//Effect.Appear(image_top, {duration: 0, queue: {position:'end', scope: 'contactScope', limit:4}});
		//Effect.Appear(image_caption, {duration: 0, queue: {position:'end', scope: 'contactScope', limit:4}});
		image_caption.innerHTML = captionsList[nextItem];
		image_link.setAttribute('href', linksList[nextItem]);
		image_nav[nextItem].addClassName('currentNavItem');
		prevItem = nextItem;
	
		new Effect.Parallel([	new Effect.Appear(image_top,{sync:true}),
								new Effect.Appear(image_caption,{sync:true}),
								new Effect.Appear(image_link,{sync:true})],
								{ duration: swapDelay/2 } );
	}, swapDelay*1000);	
}

function swapHomeImages () {	
	nextItem++;
	if (nextItem == imagesList.length) { nextItem = 0; }
	swapImages();
}

function goToImage (targetImage) {
	nextItem = targetImage;
	if (nextItem == imagesList.length) { nextItem = 0; }
	clearInterval(timerId);
	swapImages();
	timerId = setInterval('swapHomeImages()',rotateDelay*1000);
}

			
// the onload event handler that starts the fading.
function rotateHomeImages() {	
	var image_caption = $$('.sidebar .image_caption').pop();
	image_caption.innerHTML = captionsList[nextItem];
	var image_link = $$('.sidebar .image_link a').pop();
	image_link.setAttribute('href', linksList[nextItem]);
	image_link.setAttribute('class', 'image_link');
	
	var image_nav = $$('.sidebar .image_nav').pop();
	
	for (i=0; i<imagesList.length; i++) {
		if (i == nextItem) {
			image_nav.insert({ bottom: '<a href="" class="currentNavItem" onclick="goToImage('+i+'); return false;">' + (i+1) + '</a>' });
		} else {
			image_nav.insert({ bottom: '<a href="" onclick="goToImage('+i+'); return false;">' + (i+1) + '</a>' });
		}
	}
	timerId = setInterval('swapHomeImages()',rotateDelay*1000);
}