var colBBWidth = 72;
var normBBWidth = 617;
var current = 0;
var autoSlider;
var target = current;
var rtl = true;
var autoSliderTerm = 3500;
$(document).ready(function(){
	$('.juiceList img').hover(function(){
		$(this).stop().css({width:43}).animate({width:69},250);
	},function(){
		$(this).stop().animate({width:43},100);
	});
	$('a.billBoard').each(initBB);
	autoSlider = setInterval((function(){ 
		if ( target == 4 ) { rtl = false } else if (target == 0) { rtl = true }
		if ( !rtl ) {
			target--;
			
		} else {
			target++;
		}

		
		
		$('a.billBoard').eq(target).trigger('autoSlide');
		
	}),autoSliderTerm)
});

function initBB(bb) {
	pos = $('a.billBoard').index(this);
	offset = (colBBWidth*4)-(pos*colBBWidth);
	if (pos != current) {
		$(this).css({right:offset-6,width:colBBWidth}).addClass('billBoardC');
	} else {
		$(this).css({right:offset,width:normBBWidth})
	}
	$(this).css({zIndex:pos+1})
	$('a.billBoardC').hover(fadeOut,fadeIn).click(function(){slide(this);clearTimeout(autoSlider); return false;});
	$('a.billBoard').bind('autoSlide',function(){slide(this)})
	
}
function fadeOut() { 
	pos = $('a.billBoard').index(this);
	image = $(this).find('.image');
	if (pos > current) {
		$(this).animate({width:colBBWidth+10},100)
	} else {
		$('a.billBoard').eq(pos+1).animate({width:normBBWidth-10},100)
	}
	image.stop().css({opacity:1})
}
function fadeIn() { 
	pos = $('a.billBoard').index(this);
	image = $(this).find('.image');
	if (pos > current) {
		$(this).stop().animate({width:colBBWidth},100)
	} else {
		$('a.billBoard').eq(pos+1).stop().animate({width:normBBWidth},100)
	}
	image.stop().animate({opacity:0.6})
}
function slide(b) {
	pos = $('a.billBoard').index(b);
	bb = $(b);
	if (pos != current) {
		if (current<pos) {
			for (i=current+1;i<pos;i++){
				$('a.billBoard').eq(i).stop().animate({width:normBBWidth})
			}
		} else {
			for (i=current;i>pos;i--){
				$('a.billBoard').eq(i).stop().animate({width:colBBWidth})
			}
		}
		
		bb.find('span.mat').animate({top:192},300);
		bb.stop().animate({width:normBBWidth}).unbind().bind('autoSlide',function(){slide(this)}).removeClass('billBoardC').find('.image').css({opacity:1});
		$('a.billBoard').eq(current).find('span.mat').animate({top:276},300);
		$('a.billBoard').eq(current).hover(fadeOut,fadeIn).click(function(){slide(this);clearTimeout(autoSlider); return false;}).find('.image').animate({opacity:0.7},200).addClass('billBoardC');
	}
	current = pos;
	return false;
}
