var $hb, $slides, $tabs, $graybox, sldTimer;

nextSlide = function(){
	var $curr = $('ul li.active', $tabs);
	var ind = $('ul li', $tabs).index($curr);
	ind = ((parseInt(ind) + 1) > ($('ul li', $tabs).length - 1)) ? 0 : (parseInt(ind) + 1);
	setSlide(ind);
} //EF

setSlide = function(ind){
	
	$('ul li.active', $tabs).removeClass('active');
	$('ul li:eq('+ind+')', $tabs).addClass('active');
	
	$('div:eq('+ind+')', $slides).fadeTo(500, 1);
	$('div:visible', $slides).not(':eq('+ind+')').fadeTo(500, 0);
	
	var $nextTab = $('div:eq('+ind+')', $grayBox);
	
	$grayBox.animate({width: $nextTab.outerWidth() + 'px'}, 350);
	
	$nextTab.fadeTo(500, 1);
	$('.gray-box div:visible', $tabs).not(':eq('+ind+')').fadeTo(500, 0);
	
} //EF

setTimer = function(){
	sldTimer = setInterval(nextSlide, 8500);
} //EF

clearTimer = function(){
	clearInterval(sldTimer);
} //EF

$(document).ready(function(){

	if($('#home-banner #tabs-img div').length > 1){
		$hb = $('#home-banner');
		$slides = $('#tabs-img', $hb);
		$tabs = $('#tabs-control', $hb);
		$grayBox = $('.gray-box', $tabs);
		$grayBox.css('width', $('div:first', $grayBox).outerWidth() + 'px');
		
		
		$('div', $slides).not(':first').fadeTo(0,0);
		$('div', $grayBox).not(':first').fadeTo(0,0);
		$('ul li:first', $tabs).addClass('active');
		
		$('ul li a', $tabs).click(function(e){
			e.preventDefault();
			clearTimer();
			
			var $this = $(this);
			var ind = $('#tabs-control ul li a').index($this);
			
			setSlide(ind);
		});
		
		setTimer();
		
		$hb.bind({
			mouseenter: clearTimer,
			mouseleave: setTimer
		});
		
	}
	
});