// JavaScript Document
var arrPhotos = new Array('#photo-1', '#photo-2', '#photo-3', '#photo-4', '#photo-5');
var selectedPhoto = 0;
var transLock = false;

// DOM is ready, let's get started!
$(document).ready(function() {
	// init prev/next buttons
	$('#btn-previous-img').click(function() {
		if(transLock) return; // ignore request if a transition is already happening
		else transLock = true; // otherwise lock it so requests are ignored until this transition is complete
		
		// fade old photo out
		$(arrPhotos[selectedPhoto]).fadeOut('slow', function(){
			// fade new photo in
			selectedPhoto--;
			if(selectedPhoto < 0) selectedPhoto = arrPhotos.length - 1;
			
			moveToImg(selectedPhoto);
		});
	});
	
	$('#btn-next-img').click(function() {
		if(transLock) return; // ignore request if a transition is already happening
		else transLock = true; // otherwise lock it so requests are ignored until this transition is complete
		
		// fade old photo out
		$(arrPhotos[selectedPhoto]).fadeOut('slow', function(){
			// fade new photo in
			selectedPhoto++;
			if(selectedPhoto > arrPhotos.length - 1) selectedPhoto = 0;;
			
			moveToImg(selectedPhoto);
		});
	});
	
	// fade in photo one
	moveToImg(selectedPhoto);
});

function moveToImg(id)
{
	$(arrPhotos[id]).fadeIn('slow', function(){
		transLock = false;
	});
}