/*
 *
 * UNION frontpage slider
 *
 */

var evenWidth 			= 239;  // in px
var activeWidth 		= 384;  // in px
var inactiveWidth 		= 191;  // in px

var hoverSpeed			= 500;  // in ms

var activeDuration 		= 5000; // in ms
var inactiveDuration 	= 4000; // in ms

var fadeInSpeed			= 400;  // in ms
var fadeOutSpeed		= 400;  // in ms
var fadeInBoxDelay		= 300;	// in ms
var fadeOutBoxDelay		= 100;	// in ms


// #################################
var links = new Array;
var currentIndex = 0;
var nextIndex = 0;
var isManual = 0;

var activeInterval = 0;
var inactiveInterval = 0;

var fadeBoxInInterval = 0;
var fadeBoxOutInterval = 0;


$(document).ready( function()
{	
	$('#slider_overlay div.slider_box').hide();
	
	$('#slider_overlay div.slider_box').hover( function()
	{		
		$(this).show();
		
		$('#slider_control a').stop().animate;
		
		joinedLinkRel = "#slider_control a[rel=" + $(this).attr('id') + "]";
		$(joinedLinkRel).addClass('active');
		
		clearTimeout (fadeBoxInInterval);
		clearTimeout (fadeBoxOutInterval);
		clearInterval(activeInterval);
		clearInterval(inactiveInterval);
	},
	function()
	{
		joinedLinkID = $(this).attr('rel');
		leaveSlider($('#' + joinedLinkID), 1);		   
	});

	$('#slider_control a').each( function(index)
	{	
		$(this).addClass('element_' + index);
		
		links.push($(this)); // adds all slider elements in an array (for automatic sliding)
	
		$(this).hover( function()
		{
			enterSlider($(this), 1);	
		},
		function()
		{
			leaveSlider($(this), 1);		
		});		  
	});
	
	currentIndex = links.length-1; // Sets the last element as current one, so slider starts with the next aka first element

	activeInterval = setInterval( 'enterAutomatic()', inactiveDuration ); // starts the automatic slider
});


function enterAutomatic()
{
	clearInterval(activeInterval);
	
	nextIndex = (currentIndex + 1) % links.length;
	nextObject = links[nextIndex];
	
	enterSlider(nextObject, 0);
	
	inactiveInterval = setInterval( 'leaveAutomatic()', activeDuration );
}


function leaveAutomatic()
{
	clearInterval(inactiveInterval);
	
	currentObject = links[currentIndex];
	
	leaveSlider(currentObject, 0);
	
	currentIndex++;
	currentIndex = currentIndex % links.length;
	
	activeInterval = setInterval( 'enterAutomatic()', inactiveDuration );
}


function enterSlider(thisObject, isManual)
{	
	$('#slider_control a').each(function() { $(this).removeClass('active'); });
 	$('#slider_overlay div.slider_box').fadeOut(fadeOutSpeed);
	
	if (isManual)
	{
		for (i = 0; i < links.length; i++)
		{
			if (links[i].attr('class') == thisObject.attr('class'))
				currentIndex = i; // sets hovered object as current object for the automatic slider
		}
		clearInterval(activeInterval); // stops the automatic slider
		clearInterval(inactiveInterval); // stops the automatic slider
	}
			
	thisObject.stop().animate; // avoid animation built-up
	thisObject.addClass('active');
	
	$('#slider_control a').each(function()
	{
		$(this).stop().animate;
		
		if (!$(this).hasClass('active')) // narrow all elements except the active one
			$(this).animate({ width: inactiveWidth }, hoverSpeed, "swing");	
	});
	
	sliderBoxID = thisObject.attr('rel'); // get related box ID
	fadeBoxInInterval = setTimeout( function() { fadeInBox($('#' + sliderBoxID)) }, fadeInBoxDelay);
	
	thisObject.animate({ width: activeWidth }, hoverSpeed, "swing"); // widen active element
}

function leaveSlider(thisObject, isManual)
{
	if (isManual)
		activeInterval = setInterval( 'enterAutomatic()', inactiveDuration ); // starts the slider again
	
	thisObject.stop().animate;
	
	fadeBoxOutInterval = setTimeout('fadeOutBox()', fadeOutBoxDelay);
	
	$('#slider_control a').each( function()
	{
		$(this).stop().animate;
		$(this).removeClass('active');
		$(this).animate({ width: evenWidth }, hoverSpeed, "swing"); // back to initial position
	});
}

function fadeOutBox()
{
	$('#slider_overlay div.slider_box').fadeOut(fadeOutSpeed);	
}

function fadeInBox(boxObject)
{
	boxObject.fadeIn(fadeInSpeed);
}