var numSlides = 8;
var sliding = false;
//var slideWidth = 657;
var slideWidth = 822;
//var slideDifferential = 50;
var slideDifferential = 56;
var jumpToSlideId = null;



window.onload = initialize;



function showSlide( e )
{
	e.style.marginLeft = "0px";
	e.style.display = "inline";
}



function hideSlide( e )
{
	e.style.display = "none";
}



function resetLeftBuffer()
{
	showSlide( document.getElementById( "leftBuffer" ) );
	//document.getElementById( "leftBuffer" ).style.marginLeft = "-657px";
	document.getElementById( "leftBuffer" ).style.marginLeft = "-822px";

}



function resetRightBuffer()
{
	showSlide( document.getElementById( "rightBuffer" ) );
}



function setLeftBuffer( e )
{
	document.getElementById( "leftBuffer" ).innerHTML = e.innerHTML;
}

function setRightBuffer( e )
{
	document.getElementById( "rightBuffer" ).innerHTML = e.innerHTML;
}



function highlightLink( e )
{
	for( var i = 0; i < numSlides; i++ )
	{
		document.getElementById( 'nav' + i ).className = "nav";
	}
	e.className = "activeNav";
}



function initialize()
{
	document.getElementById( 'back' ).onclick = clickHandler;
	document.getElementById( 'next' ).onclick = clickHandler;
	
	for( var i = 0; i < numSlides; i++ )
	{
		document.getElementById( 'nav' + i ).onclick = clickHandler;
		document.getElementById( 'nav' + i ).onmouseover = mouseOverHandler;
		document.getElementById( 'nav' + i ).onmouseout = mouseOutHandler;
	}
	
	highlightLink( document.getElementById( 'nav0' ) );
	resetLeftBuffer();
	showSlide( document.getElementById( 'slide0' ) );
	resetRightBuffer();
}



function clickHandler()
{
	if( this == document.getElementById( 'back' ) )
	{
		slideBack();
	}
	else if( this == document.getElementById( 'next' ) )
	{
		slideNext();
	}
	else
	{
		var i = 0;
		while( this != document.getElementById( 'nav' + i ) )
		{
			i++;
		}
		slideTo( i );
	}
}



function mouseOverHandler()
{
	if( this.className != "activeNav" )
		this.className = "hoverNav";
}



function mouseOutHandler()
{
	if( this.className == "hoverNav" )
		this.className = "nav";
}



function getCurrentSlide()
{
	return document.getElementById( 'slide' + getCurrentSlideId() );
}



function getCurrentSlideId()
{
	var i = 0;
	while( document.getElementById( 'slide' + i ).style.display != "inline" )
	{
		i++;
	}
	return i;
}



function slideBack()
{
	if( !sliding )
	{
		var currId = getCurrentSlideId();
		if( currId > 0 )
		{
			sliding = true;
			highlightLink( document.getElementById( "nav" + ( currId - 1 ) ) );
			setLeftBuffer( document.getElementById( "slide" + ( currId - 1 ) ) );
			expandLeftBuffer();
		}
		else
		{
			slideToReverse( numSlides - 1 );
		}
	}
}



function slideNext()
{	
	if( !sliding )
	{
		var currId = getCurrentSlideId();
		if( currId < numSlides - 1 )
		{
			sliding = true;
			highlightLink( document.getElementById( "nav" + ( currId + 1 ) ) );
			setRightBuffer( document.getElementById( "slide" + ( currId + 1 ) ) );
			shrinkCurrentSlide();
		}
		else
		{
			slideToReverse( 0 );
		}
	}
}



function shrinkCurrentSlide()
{
	var currSlide = getCurrentSlide();
	var currSlideId = getCurrentSlideId();
	if( slideDifferential > 2 )
	{
		currSlide.style.marginLeft = ( parseInt( currSlide.style.marginLeft ) - slideDifferential ) + "px";
		slideDifferential -= 2;
		setTimeout( shrinkCurrentSlide, 30 );
	}
	else
	{
		if( parseInt( currSlide.style.marginLeft ) > -slideWidth )
		{
			currSlide.style.marginLeft = ( parseInt( currSlide.style.marginLeft ) - slideDifferential ) + "px";
			setTimeout( shrinkCurrentSlide, 30 );
		}
		else
		{
			slideDifferential = 56;
			resetRightBuffer();
			hideSlide( document.getElementById( "slide" + currSlideId ) );
			showSlide( document.getElementById( "slide" + ( currSlideId + 1 ) ) );
			sliding = false;
		}
	}
}



function expandLeftBuffer()
{
	var currSlide = getCurrentSlide();
	var currSlideId = getCurrentSlideId();
	var leftBuffer = document.getElementById( "leftBuffer" );
	if( slideDifferential > 2 )
	{
		leftBuffer.style.marginLeft = ( parseInt( leftBuffer.style.marginLeft ) + slideDifferential ) + "px";
		slideDifferential -= 2;
		setTimeout( expandLeftBuffer, 30 );
	}
	else
	{
		if( parseInt( leftBuffer.style.marginLeft ) < 0 )
		{
			leftBuffer.style.marginLeft = ( parseInt( leftBuffer.style.marginLeft ) + slideDifferential ) + "px";
			setTimeout( expandLeftBuffer, 30 );
		}
		else
		{
			slideDifferential = 56;
			showSlide( document.getElementById( "slide" + ( currSlideId - 1 ) ) );
			hideSlide( document.getElementById( "slide" + currSlideId ) );
			resetLeftBuffer();
			sliding = false;
		}
	}
}


function slideTo( i )
{
	if( !sliding && i != getCurrentSlideId() )
	{
		var currId = getCurrentSlideId();
		jumpToSlideId = i;
		sliding = true;
		highlightLink( document.getElementById( "nav" + i ) );
		
		if( i < getCurrentSlideId() )
		{
			setLeftBuffer( document.getElementById( "slide" + i ) );
			slideToFromLeft();
		}
		else
		{
			setRightBuffer( document.getElementById( "slide" + i ) );
			slideToFromRight();
		}
	}
}

function slideToReverse( i )
{
	if( !sliding && i != getCurrentSlideId() )
	{
		var currId = getCurrentSlideId();
		jumpToSlideId = i;
		sliding = true;
		highlightLink( document.getElementById( "nav" + i ) );
		
		if( i < getCurrentSlideId() )
		{
			setRightBuffer( document.getElementById( "slide" + i ) );
			slideToFromRight();
		}
		else
		{
			setLeftBuffer( document.getElementById( "slide" + i ) );
			slideToFromLeft();
		}
	}
}




function slideToFromLeft()
{
	var currSlide = getCurrentSlide();
	var currSlideId = getCurrentSlideId();
	var leftBuffer = document.getElementById( "leftBuffer" );
	if( slideDifferential > 2 )
	{
		leftBuffer.style.marginLeft = ( parseInt( leftBuffer.style.marginLeft ) + slideDifferential ) + "px";
		slideDifferential -= 2;
		setTimeout( slideToFromLeft, 30 );
	}
	else
	{
		if( parseInt( leftBuffer.style.marginLeft ) < 0 )
		{
			leftBuffer.style.marginLeft = ( parseInt( leftBuffer.style.marginLeft ) + slideDifferential ) + "px";
			setTimeout( slideToFromLeft, 30 );
		}
		else
		{
			slideDifferential = 56;
			showSlide( document.getElementById( "slide" + jumpToSlideId ) );
			hideSlide( document.getElementById( "slide" + currSlideId ) );
			resetLeftBuffer();
			sliding = false;
		}
	}
}



function slideToFromRight()
{
	var currSlide = getCurrentSlide();
	var currSlideId = getCurrentSlideId();
	if( slideDifferential > 2 )
	{
		currSlide.style.marginLeft = ( parseInt( currSlide.style.marginLeft ) - slideDifferential ) + "px";
		slideDifferential -= 2;
		setTimeout( slideToFromRight, 30 );
	}
	else
	{
		if( parseInt( currSlide.style.marginLeft ) > -slideWidth )
		{
			currSlide.style.marginLeft = ( parseInt( currSlide.style.marginLeft ) - slideDifferential ) + "px";
			setTimeout( slideToFromRight, 30 );
		}
		else
		{
			slideDifferential = 56;
			resetRightBuffer();
			hideSlide( document.getElementById( "slide" + currSlideId ) );
			showSlide( document.getElementById( "slide" + jumpToSlideId ) );
			sliding = false;
		}
	}
}
