/*
home page scrolling news items
*/

//------------------------------------------------------
//------------------------------------------------------

//used with array.sort to compare id's
function compare(a, b)
{	//for numeric
	//return parseInt(a.id) - parseInt(b.id);
	
	//for alphabetic
	if(a.id < b.id)
	{	return -1;}
	if(b.id < a.id)
	{	return 1;}
	else
	{	return 0;}
}

//------------------------------------------------------
//------------------------------------------------------

//container: newsItemsContainer
//item will be placed inside: hiddenItems
//then moved to: scrollDiv 

//------------------------------------------------------
//------------------------------------------------------

//mootools domready or load
window.addEvent('load', function(){

	//page elements
	var periodical;
	
	//periodical speed
	var moveSpeed = 4000;
	
	//returns an array initial items from their class
	var newsItemsArr = $$('div.newsItemHidden');
	newsItemsArr.sort(compare);
	
	//function variables	
	var removeCounter = 0;
	
	//---------------------------------------
	//---------------------------------------
	//loop through news items
	var removeAddItems = function()
	{
		//--------------------------------
		//loop through 4 elements
		if(removeCounter > 3)
		{	removeCounter = 0;
		}
		
		//--------------------------------
		//get the current element and remove
		var currentEl = "newsItemId" + removeCounter; //always 0, 1, 2, or 3
		$(currentEl).remove();
		
		//--------------------------------
		//this sends the correct item to fade out
		if(removeCounter < 3)
		{
			removeItem = removeCounter + 1;
			newNewsItemExpansion(removeCounter, removeItem);
		}
		else
		{
				newNewsItemExpansion(removeCounter, 0);
		}
		
		//--------------------------------
		//increment
		removeCounter++;
		
	}
	
	//---------------------------------------
	//---------------------------------------
	//
	var newNewsItemExpansion = function(id, elementToFade)
	{
		//--------------------------------
		var idOfNewsItem = "newsItemId" + id;
		var fader = 'newsItemId' + elementToFade;
		
		//--------------------------------
		//create new div and set styles
		var newEl = new Element('div', {'class': 'newsItem', 'id': idOfNewsItem});
		newEl.setStyles({
			'height': '0px',
			'margin': 0,
			'text-align': 'left',
			'padding': "0px",
			'overflow': "hidden"
		});
		
		//--------------------------------
		//effects
		var fxFadeOut = $(fader).effect('opacity', {duration: 800, transition: Fx.Transitions.linear});
		var fxExpand = newEl.effect('height', {duration: 1000, transition: Fx.Transitions.linear});
		var fxFade = newEl.effect('opacity').set(0);

		//--------------------------------
		//place the content and rotate
		itemContent = newsItemsArr.shift()
		itemContent.injectInside(newEl);
		newsItemsArr.push(itemContent); 
		
		//--------------------------------
		//inject, fade bottom out, fade top in
		newEl.injectTop($('scrollDiv'));
		
		fxFadeOut.start(0).chain(function(){
			fxExpand.start(52).chain(function(){
				fxFade.start(1);
			});
		});
	}
	//---------------------------------------
	//---------------------------------------
	
	periodical = removeAddItems.periodical(moveSpeed);
	
	//add stop and start event to container div
	$('scrollDiv').addEvents({
		'mouseenter': function()
		{
			$clear(periodical);
		},
		'mouseleave': function()
		{
			periodical = removeAddItems.periodical(moveSpeed);
		}
	});
	
});

//------------------------------------------------------
//------------------------------------------------------