/**
 * 
 */

function banners(element)
{
	var wrapper   = $(element);
	var container = $(element).find('ul');
	var itemWidth = 960;
	var itemCount = container.find('li').size();
	var current   = 1;
	
	var itemNumber = 1;
	container.find('li').each(function(){
		$(this).attr({number: itemNumber});
		itemNumber++;
	});
	
	wrapper.css({
		position: 'relative',
	});
	
	container.css({
		position: 'absolute',
		top: '0px', left: '0px',
		width: itemWidth * itemCount,
	});
	
	function moveSlider()
	{
		if(current < itemCount)
		{
			var position = container.position();
			container.animate({
				left: position.left - itemWidth,
			});
			current++;
		}
		else
		{
			container.animate({
				left: 0,
			});
			current = 1;
		}
		
		setTimeout(function(){
			// animate in sidebar
			var sidebar = container.find('li[number='+current+'] div.overlay');
			if(sidebar.html() != '')
			{
				sidebar.show().animate({right: 0}, 500).delay(10500).animate({right: -200});
			}
		}, 1000);
	}
	
	setInterval(moveSlider, 12000);
}