/**
 * HTML Rotator
 * (C) 2009 TriMed Media Group
 * @author mcounts
 */
window.addEvent('domready', function()
{
	//set the default image
	pause = false; //are you pausing?
	activeImage = 'img1';
	activeLink = '1';
	activeBlock = 'block0'
	i = 1;
	var repeat;
	//scalable 
	numportals = $('banner-nav-p').getElements('a').length; //number of portals
	for(l=2;l<=numportals;l++){ //set all but the first article to invisible
		var inactive = 'img'+l;
		var initialise = $(inactive).setStyles({display:'block',opacity: 0});
	}
	//set all other blocks to invisible
	/*
	blockcount = numportals/5;
	for(b=1;b<=blockcount;b++){
		var inactive = 'block'+b;
		var initialise = $(inactive).setStyles({display:'block',opacity: 0});
	}
	*/
	//initialise the default image
	var initialise = $(activeImage).setStyles({display:'block',opacity: 0});	
	new Fx.Tween(initialise, {property: 'opacity'}).set(1);
	$(activeLink).className = "active";
	$(activeBlock).className = "activeb"; //set active block to active
	//event listener
	$('banner-nav-p').getElements('a').addEvent('click', function() 
	{	
		$('banner-nav-p').getElements('li').each(function(el){
			el.getElement('a').className = "";
		});
		$('banner-nav-p').getElements('div').each(function(el){
			el.className = "inactiveb";
		}); //set all blocks to inactive
		this.className = "active";
		activeLink = this.id;
		var newImage = 'img'+this.id;
		i= this.id;
		//set the current block to visible
		currentBlock = (i-1)/5;
		currentBlock = Math.floor(currentBlock);
		currentBlock = 'block'+currentBlock;
		$('banner-nav-p').getElementById(currentBlock).className = "activeb";
		transitionImage(activeImage,newImage);
		pause = true; //we are now paused
		(function(){pause = false;}).delay(7000); //after 7 seconds unpause
	});
	$('next').addEvent('click', function()
	{
		//pause = false;//we always want to transition when the button is clicked
		i=loop2(i, activeLink, activeImage);
		pause = true; //we are now paused
		(function(){pause = false;}).delay(7000); //after 7 seconds unpause
	});
	$('back').addEvent('click', function() 
	{
		if(i == 1){
			i = numportals-1; //goes to 4 when loop is run
		}else{
		i--;
		i--;
		}	
		//pause = false;//we always want to transition when the button is clicked
		i=loop2(i, activeLink, activeImage);
		pause = true; //we are now paused
		(function(){pause = false;}).delay(7000); //after 7 seconds unpause
	});
	//call loop function every n seconds
	repeat = (function(){i=loop(i, activeLink, activeImage);}).periodical(7000);
});

//automate fade 
function loop(i, activeLink, activeImage){
	//if at story 4 then go back to first
	//new Event(e).stop();
	if (pause == false) { //if not paused run this 
		i++;
		numportals = $('banner-nav-p').getElements('a').length; //number of portals
		if (i > numportals) { //if i is the last portal in list go to beginning
			i = 1;
		}
		//scalable cast i as a var from an int
		iLink = String(i);
		$('banner-nav-p').getElements('li').each(function(el){
			el.getElement('a').className = "";
		});
		$('banner-nav-p').getElements('div').each(function(el){
			el.className = "inactiveb";
		});
		var iImage = 'img' + iLink;
		$(iLink).className = "active";
		
		currentBlock = (i - 1) / 5;
		currentBlock = Math.floor(currentBlock);
		currentBlock = 'block' + currentBlock;
		$('banner-nav-p').getElementById(currentBlock).className = "activeb";
		
		activeLink = iLink;
		var newImage = iImage;
		activeImage = activeImage;
		var activeImage = transitionImage(activeImage, newImage);
	}
	return i;
}
function loop2(i, activeLink, activeImage){ //used only when manually transitioning so you dont have to unpause for manual
	//if at story 4 then go back to first
	//new Event(e).stop();
	i++;
	numportals = $('banner-nav-p').getElements('a').length; //number of portals
	if (i > numportals) { //if i is the last portal in list go to beginning
		i = 1;
	}
	//scalable cast i as a var from an int
	iLink = String(i);
	$('banner-nav-p').getElements('li').each(function(el){
		el.getElement('a').className = "";
	});
	$('banner-nav-p').getElements('div').each(function(el){
		el.className = "inactiveb";
	});
	var iImage = 'img' + iLink;
	$(iLink).className = "active";
	currentBlock = (i - 1) / 5;
	currentBlock = Math.floor(currentBlock);
	currentBlock = 'block' + currentBlock;
	$('banner-nav-p').getElementById(currentBlock).className = "activeb";
	activeLink = iLink;
	var newImage = iImage;
	activeImage = activeImage;
	var activeImage = transitionImage(activeImage, newImage);
	return i;
}
function transitionImage(oldImage,newImage)
{
	var fadeOut = function()
	{
		var div = $(oldImage).setStyles({
			opacity: 1
		});
		new Fx.Tween(div, {property: 'opacity'}).start(0);
		fadeIn();
	};
	var fadeIn = function()
	{
		var div2 = $(newImage).setStyles({
			display:'block',
			opacity: 0
		});
		new Fx.Tween(div2, {property: 'opacity'}).start(1);
	};
	if(newImage != activeImage)
	{
		fadeOut();
		activeImage = newImage;		
	}
	return activeImage;
}