addLoadEvent(function()
{
	if ($("tabs") == "undefined")
	{
		return;
	}

	var tabs = $("tabs").getElementsByTagName("A");
	for (var i = 0; i < tabs.length; i++)
	{
		connect(tabs[i], "onclick", showVisual);
	}
});

function showVisual(e)
{
	e.stop();

	/* stop any looping, we'll restart */
	stopCarousel();

	var tab = e.src();

	/* remove active class from tabs */
	var tabs = $("tabs").getElementsByTagName("A");
	for (var i = 0; i < tabs.length; i++)
	{
		if (tabs[i] == tab)
		{
			/* add active class to current tab and div */
			addElementClass(tabs[i], "active");
			addElementClass("visual"+(i+1), "active");

			/* show visual */
			appear("visual"+(i+1), { "duration": 0.4, "delay": 0.3, "beforeStart": resetCarousel, "afterFinish": function(){ getElementsByTagAndClassName("DIV", "active", $("visual"))[0].style.opacity = 1.0; startCarousel(); } });
		}
		else
		{
			/* remove active class (if any) */
			removeElementClass(tabs[i], "active");
			removeElementClass("visual"+(i+1), "active");

			/* fade oud the visual */
			fade("visual"+(i+1), { "duration": 0.3 });
		}
	}
} // function showVisual


/*
 * CAROUSEL
 */

window._carouselTimeout = null;

function startCarousel()
{
	/* find active visual */
	parentDiv = getElementsByTagAndClassName("DIV", "active", $("visual"))[0];
	
	var carousel = getElementsByTagAndClassName("DIV", "image-carousel", parentDiv);
	if (carousel.length == 1)
	{
		/* start looping */
		window._carouselTimeout = window.setTimeout(function(){ switchCarouselImage(parentDiv, 0); }, 3000);
	}
}

function resetCarousel()
{
	/* find active visual */
	parentDiv = getElementsByTagAndClassName("DIV", "active", $("visual"))[0];

	/* reset images */
	var carousel = getElementsByTagAndClassName("DIV", "image-carousel", parentDiv);
	if (carousel.length == 1)
	{
		var images = carousel[0].getElementsByTagName("IMG");
		for (var i = 0; i < images.length; i++)
		{
			if (i == 0)
			{
				images[i].style.display = "block";
				setOpacity(images[i], 1.0);
			}
			else
			{
				images[i].style.display = "none";
			}
		}

		/* reset bullet */
		setActiveBulletCarousel(parentDiv, 0);
	}
}

function stopCarousel()
{
	window.clearTimeout(window._carouselTimeout);
}

function switchCarouselImage(parentDiv, imgIndex)
{
	var images = getElementsByTagAndClassName("DIV", "image-carousel", parentDiv)[0].getElementsByTagName("IMG");
	if (images.length > 1)
	{
		/* fade out image i */
		fade(images[imgIndex], { "duration": 0.3 });

		/* get next image */
		imgIndex++;
		if (imgIndex >= images.length) imgIndex = 0;

		/* mark next bullet as active */
		setActiveBulletCarousel(parentDiv, imgIndex);

		/* show next image */
		appear(images[imgIndex], { "duration": 0.3, "delay": 0.3 });

		/* loop */
		window._carouselTimeout = window.setTimeout(function(){ switchCarouselImage(parentDiv, imgIndex); }, 3000 + 1000);
	}
}

function setActiveBulletCarousel(parentDiv, index)
{
	var bullets = getElementsByTagAndClassName("DIV", "image-carousel-buttons", parentDiv)[0].getElementsByTagName("IMG");
	for (var i = 0; i < bullets.length; i++)
	{
		if (i == index)
		{
			bullets[i].src = '/data/images/1/2/3/9/carousel-bullet-active.png';
		}
		else
		{
			bullets[i].src = '/data/images/1/2/4/0/carousel-bullet-inactive.png';
		}
	}
}