var initialized = false;
var loadComplete = false;
var photos = new Array();

var currentViewMode ='slideshow';
var viewModes = Array();

var current = 0;
var previous = 0;
var next = 0;
var started = false;
var isPaused = false;
var speed = 5;
var transIntId = null;
var inTransition = false;
var infoShowing = null;
var inInfoTransition = false;

// attach onload handler
if (window.addEventListener) {
  window.addEventListener('load',initPortfolio,false);
} else if (window.attachEvent){
  window.attachEvent('onload',initPortfolio );
}

function initPortfolio()
{
	if ( initialized )
		return;
	viewModes['slideshow'] = document.getElementById('SlideShowControl');
	viewModes['list'] = document.getElementById('ListControl');
	viewModes[currentViewMode].className = "CurrentViewMode";
	document.getElementById('Curtain').style.display = 'none'; //added for version 2
	startSlideShow();
	if (photos.length > 0 )
  	{
  		// initialize view mode options
 		document.getElementById('ViewModeOptions').style.display = "block";
 		document.getElementById('SlideShowControls').style.display = "block";
  	}
	initialized = true;
}


function viewMode( mode )
{
	if ( mode == currentViewMode || (mode != "slideshow" && mode != "list") )
		return;

	if ( inTransition )
	{
		setTimeout( function(){eval("viewMode(mode)");}, 100 );
		return;
	}

	if ( mode == 'list' )
	{
		// togglePlayStatus ?
		window.clearInterval( transIntId );
		document.getElementById('PortfolioContainer').style.overflow = "auto";
		for ( var i = 0; i < photos.length; i++ )
			convertPhotoToListView( photos[i] );
		viewModes[currentViewMode].className = "";
		document.getElementById('SlideShowControls').style.display = "none";
	}
	else // mode = 'slideshow'
	{
		document.getElementById('PortfolioContainer').style.overflow = "hidden";
		for ( var i = 0; i < photos.length; i++ )
			convertPhotoToSlide( photos[i] );
		viewModes[currentViewMode].className = "";
		document.getElementById('SlideShowControls').style.display = "block";
		startSlideShow();
	}
	viewModes[mode].className = "CurrentViewMode";
	currentViewMode = mode;
}

function convertPhotoToListView( photo )
{
	photo.className = "PhotoContainerListView";
	photo.style.position = 'relative';
	//photo.style.opacity = '1.0';
	new Effect.Opacity(photo,{duration:0.01,from:0,to:1} );
	photo.style.top = '0px';
	photo.getElementsByTagName('img')[0].style.left = "72px";
	photo.getElementsByTagName('div')[0].style.left = "0";
	
	return;	
}

function convertPhotoToSlide( photo )
{
	photo.className = "PhotoContainer";
	photo.style.position = 'absolute';
	photo.style.top = '0px';
	new Effect.Opacity(photo,{duration:0.01,from:1,to:0} );
	photo.style.zIndex = "9";
	photo.getElementsByTagName('img')[0].style.left = "";
	photo.getElementsByTagName('div')[0].style.left = "-146px";	
	
	return;
}

function populatePhotoArray()
{
 	var divs = document.getElementById("PortfolioContainer").getElementsByTagName('div');
  	for ( var i=0; i < divs.length; i++ )
  	{
  		if ( divs[i].className.indexOf("PhotoContainer") >= 0 )
  			photos[ photos.length ] = divs[i];
  	}
	return;	
}

function photoLoaded(photoId,startShow)
{
	if ( !initialized && startShow )
		initPortfolio();
		
	if ( currentViewMode == 'list' )
		convertPhotoToListView('PhotoContainer'+photoId);
}	

/* SLIDE SHOW CONTROLS */
function startSlideShow()
{
 	//console.log("SlideShow starting...");
	populatePhotoArray();
  	if ( photos.length == 0 )
  		return;
  	current = photos.length - 1;
	next = 0;
	previous = photos.length - 2;
	started = false;
	isPaused = false;
  	nextPhoto();
	transIntId = window.setInterval(nextPhoto,speed*1000);
}
function showProjectInfo( id )
{
	if ( inTransition || inInfoTransition || currentViewMode == 'list' )
		return;
	var i = document.getElementById( 'ProjectInfo'+id );
	var p = document.getElementById( 'Photo'+id );
	if ( i.style.left != "0px" )
	{
		i.style.left = "-146px";
		new Effect.Move(i,{duration: 0.5, x: 146, y: 0} );
		new Effect.Move(p,{duration: 0.5, x: 72, y: 0} );
		infoShowing = id;
		inInfoTransition = true;
		setTimeout( function(){inInfoTransition = false;}, 500 );
		if ( !isPaused )
			togglePlayStatus();
	}
	else
	{
		hideProjectInfo( id );
		if ( isPaused )
			togglePlayStatus();
	}
}

function hideProjectInfo(id)
{
	var i = document.getElementById( 'ProjectInfo'+id );
	var p = document.getElementById( 'Photo'+id );
	if ( i.style.left != "-146px" )
	{
		i.style.left = "0px";
		infoShowing = null;
		inInfoTransition = true;
		new Effect.Move(i,{duration: 0.2, x: -146, y: 0} );
		new Effect.Move(p,{duration: 0.2, x: -72, y: 0} );
		setTimeout( function(){inInfoTransition = false;}, 200 );
	}
}

function togglePlayStatus()
{
	if ( inTransition )
	{
		setTimeout( togglePlayStatus, 100 );
		return;
	}
	var el = document.getElementById('SlideShowPlayControl');

	if ( isPaused )
	{
		isPaused = false;
		nextPhoto();
		transIntId = window.setInterval(nextPhoto,speed*1000);
		el.innerHTML = "Pause";
		el.className = "Playing";
		if (infoShowing)
			hideProjectInfo(infoShowing);
	}
	else
	{
		isPaused = true;
		window.clearInterval(transIntId);
		el.innerHTML = "Play";
		el.className = "Paused";
		if ( !infoShowing )
			showProjectInfo(photos[current].id.substring(14,photos[current].id.length));
	}
}

function skipToNextPhoto()
{
	if ( inTransition )
		return;

	if ( infoShowing )
		hideProjectInfo(infoShowing);
	nextPhoto();

	if ( !isPaused )
	{
		window.clearInterval( transIntId );
		transIntId = window.setInterval(nextPhoto,speed*1000);
	}
	else{
		window.setTimeout( function(){
			showProjectInfo(photos[current].id.substring(14,photos[current].id.length));
		}, 1000 );
	}

}

function skipToPreviousPhoto()
{
	if ( inTransition )
		return;

	if ( infoShowing )
		hideProjectInfo(infoShowing);

	previousPhoto();

	if ( !isPaused )
	{
		window.clearInterval( transIntId );
		transIntId = window.setInterval(nextPhoto,speed*1000);
	}
	else{
		window.setTimeout( function(){
			showProjectInfo(photos[current].id.substring(14,photos[current].id.length));
		}, 1000 );
	}
}


function nextPhoto()
{
	inTransition = true;
	photos[next].style.top = "0";
	photos[next].style.zIndex = "10";
	photos[current].style.zIndex = "9";
	if( started )
	{
		new Effect.Opacity(photos[current], {duration: 1.0,from: 1.0, to: 0.0 } );
	}
	started = true;
	new Effect.Opacity( photos[next], {duration: 1.0,from: 0, to: 1.0 } );

	if ( next == photos.length - 1 )
	{
		previous = photos.length - 2;
		current = photos.length - 1;
		next = 0;
	}
	else
	{
		previous = current;
		current = next;
		next = current + 1;
	}
	setTimeout(function(){inTransition = false;}, 1000 );
}

function previousPhoto()
{
	photos[previous].style.top = "0";
	photos[previous].style.zIndex = "10";
	photos[current].style.zIndex = "9";

	new Effect.Opacity(photos[current], {duration: 1.0,from: 1.0, to: 0.0 } );
	new Effect.Opacity(photos[previous], {duration: 1.0,from: 0, to: 1.0 } );

	if ( previous == 0 )
	{
		previous = photos.length - 1;
		current = 0;
		next = 1;
	}
	else
	{
		next = current;
		current = previous;
		previous -= 1;
	}
	setTimeout(function(){inTransition = false;}, 1000 );
}