var sInterval;
var sInterval2 = null;

$(document).ready(function() {
	// handlerForCollapsing();
	animateSlides();
});

// Add listener on all "ul#slider > li" elements
function handlerForCollapsing()
{
	var oDiv = $("ul#slider li");
	removeHandlerForCollapsing( oDiv );
	oDiv.click(function(event)
	{
		expandSlide( $(this) );
		clearInterval(sInterval);
		animateSlides() ;
	});
}

 

// Expand slide
function expandSlide( it ) {

	var sClass = it.attr('class');
	var oExpandedSlide = $("ul#slider li.expanded");
	//alert( sClass );
	if ( sClass == 'collapsed' ) {

		sInterval2 = setInterval(function(){ move2(it, oExpandedSlide); },10);
		
		// Raise P font size
		var oP = $("p", it);
		//oP.css("fontSize", "3.6em");
		oP.animate({fontSize: "3.6em", marginTop: "0.1em"}, 300 );
		
		// Reduce P font size
		var oPExpanded = $("p", oExpandedSlide);
		oPExpanded.css("fontSize", "1.3em");
		oPExpanded.css("marginTop", "0.5em");
		//oPExpanded.animate({fontSize: "1.4em", marginTop: "0.5em"}, 300 );
		
	}

}

// Remove listener of the open slide
function removeHandlerForCollapsing( it )            { it.unbind("click"); }

// Return the position of the expanded slide
function getPosition( it ) {

	var sClass = it.attr('class');
	var current;

	$("ul#slider li").each(function(i){
		if ( $(this).attr('class') == sClass ) {
			current = i;
		}
	});
	return (current + 1);

}

 
// Return the slide next to the expanded slide
function getNext( it, nbSlide ) {
	var sPos = getPosition(it);
	return ( sPos == nbSlide ) ? 1 : (sPos + 1);
}

 

function move () 
{
	if (sInterval2 == null)
	{ 
		var oExpandedSlide	= $("ul#slider li.expanded");
		var nbSlide			= $("ul#slider li").length;
		var sNext			= getNext(oExpandedSlide, nbSlide);
		var sNextId			= "slide_"+sNext;
		var oNextSlide		= $("ul#slider li#"+sNextId);

		expandSlide( oNextSlide );
	}

}

 

 
// function move2
function move2 ( it, oExpandedSlide ) {
	
	var iDelta = 8;
	oExpandedSlide.css("width", parseInt(oExpandedSlide.css("width"))-iDelta);
	it.css("width", parseInt(it.css("width"))+iDelta);

	if ( parseInt(it.css("width")) == 268 )
	{
		clearInterval( sInterval2 );
		sInterval2 = null;

		/** SLIDE TO EXPAND *********/
		// Show Image pack
		var oImgPack = $("span.illusPack", it);
		oImgPack.animate({opacity: "1"}, 900 );

		// Show link "find out more" 
		var oLinkMore = $("a.more", it);
		//oLinkMore.fadeIn(900);
		oLinkMore.animate({opacity: "1"}, 900 );

		/** SLIDE TO COLLAPSE *********/
		// Hide Image pack
		var oImgPackExpanded = $("span.illusPack", oExpandedSlide);
		oImgPackExpanded.animate({opacity: "0"}, 900 );

		// Hide link "find out more"
		var oLinkMoreExpanded = $("a.more", oExpandedSlide);
		//oLinkMoreExpanded.fadeOut(900);
		oLinkMoreExpanded.animate({opacity: "0"}, 900 );
	}

	// Change class
	it.attr('class', 'expanded');
	oExpandedSlide.attr('class', 'collapsed');

}

 

// Animate slide
function animateSlides() {sInterval = setInterval('move();',5000);}

// Function pause
function pause(milliseconds) {
        var dt = new Date();
        while ((new Date()) - dt <= milliseconds) { /* Do nothing */ }
}