var currentBanner = 0, bannerTimer, delay = 7000;

$(document).ready(function() {
	initMainBanners();
});

initMainBanners = function() {
	for (var i = 0; i < $("div#banners div.banner").length; i++) {
		$("div#circles ul").append('<li><a href="javascript:void(0)" onclick="swap(' + i + ');"></a></li>');
	}
	
	$("div#circles ul li a").eq(currentBanner).addClass('selected');
	$("div#banners div.banner a").hover(function() { 
		clearTimeout(bannerTimer);
		$(this).find('img').attr('src', $(this).find('img').attr('src').replace(".jpg", "-mouseover.jpg"));
	}, function() {
		bannerTimer = setTimeout(nextBanner, delay);
		$(this).find('img').attr('src', $(this).find('img').attr('src').replace("-mouseover.jpg", ".jpg"));
	});
	
	$("div#banners div.banner").eq(currentBanner).delay(600).animate({
		left: 0
	}, 600, function() {
		bannerTimer = setTimeout(nextBanner, delay);
	});
}

swap = function(index) {
	swapBanner(currentBanner, index);
}

swapNext = function() {
	swapBanner(currentBanner, currentBanner < $("div#banners div.banner").length - 1 ? ++currentBanner : 0);
}

swapPrevious = function() {
	swapBanner(currentBanner, currentBanner == 0 ? $("div#banners div.banner").length - 1 : --currentBanner);
}

nextBanner = function() {
	swapBanner(currentBanner, currentBanner < $("div#banners div.banner").length - 1 ? ++currentBanner : 0);
}

swapBanner = function(a, b) {
	clearTimeout(bannerTimer);
	
	$("div#circles ul li a").eq(a).removeClass('selected');
	$("div#circles ul li a").eq(b).addClass('selected');
	
	var ab = $("div#banners div.banner").eq(a);
	var bb = $("div#banners div.banner").eq(b);
	var p = [-918, 918];
	
	if (a > b)
		p = [918, -918];
	
	currentBanner = b;
	
	$(ab).animate({
		left: p[0]
	}, 600);
	
	bb.css('left', p[1]);
	$(bb).animate({
		left: 0
	}, 600, function() {
		bannerTimer = setTimeout(nextBanner, delay);
	});
}