var interval;

$(document).ready(function() {
	numbers = '';
	c = 0;
	$('#header-pics li').each(function(i){
		if ($(this).hasClass("active"))
			numbers += '<li id="number-'+c+'" class="active" rel="image-'+c+'" onclick="thisSlide(this);">'+(c+1)+'</li>';
		else
			numbers += '<li id="number-'+c+'" rel="image-'+c+'" onclick="thisSlide(this);">'+(c+1)+'</li>';
		c++;
	});
	numbers = '<ul id="header-numbers">' + numbers + '</div>';
	main = $('#hbig_right').html();
	$('#hbig_right').html(main + numbers);
	
	interval = setInterval( "nextSlide()", 5000 );
});

function thisSlide(tli) {
	if (! $(tli).hasClass('active')) {
		clearInterval(interval);
		
		$('#header-pics li.active').fadeOut(function(){
				$('#'+$(tli).attr('rel')).fadeIn( function(){
						$('#'+$('#header-pics li.active').attr('rel')).removeClass('active');
						$(tli).addClass('active');
						
						$('#header-pics li.active').removeClass('active');
						$('#'+$(tli).attr('rel')).addClass('active');
						interval = setInterval( "nextSlide()", 5000 );
					});
			});
	}
}

function nextSlide() {
	current = $('#header-pics li.active').attr('id');
	next_id = parseInt(current.replace('image-', ''))+1;
	
	if ($('#image-'+next_id).length == 0) {
		next_id = 0;
	}
	clearInterval(interval);
	$('#header-pics li.active').fadeOut(function(){
		$('#image-'+next_id).fadeIn( function(){
				$('#'+$('#header-pics li.active').attr('rel')).removeClass('active');
				$('#number-'+next_id).addClass('active');
				
				$('#header-pics li.active').removeClass('active');
				$('#image-'+next_id).addClass('active');
				interval = setInterval( "nextSlide()", 5000 );
			});
	});
}