// JavaScript Document
var arrPhotos = document.getElementsByName('photo[]');
var selectedPhoto = 0;
var transLock = false;
var timerSpeed = 6000;

(jQuery.noConflict())(function($) {

	for(i=0;i<arrPhotos.length;i++){
		$('#btn-container').append('<img class="btn-nav" src="images/btn-nav.png" id="btn-'+i+'" />');	
	}
	
	$('.btn-nav').click(function(){	
		if(transLock){
			return; 
		}else{
			transLock = true; 
		}		
		
		selectedPhoto = $(this).attr('id').replace('btn-','');
		moveToImg(selectedPhoto);
	});
	
	function moveToImg(id){	

		$('#caroussel-right').fadeOut(500);
		$('#caroussel-left').fadeOut(500);
		
		$('#transition-container').animate({'left': -(id * 901) + 'px'}, 750, 'swing', function() {
																								
			for(i=0;i<arrPhotos.length;i++){
				$("#btn-"+i).attr('src','images/btn-nav.png');	
			}
			
			$('#caroussel-right').html($('#caption-'+id).html());
	
			$("#btn-"+id).attr('src','images/btn-nav-selected.png');																					
			transLock = false;
			myTimer.reset(timerSpeed);
		});
		
		$('#caroussel-right').fadeIn(1500);
		$('#caroussel-left').fadeIn(1500);
	}

	var myTimer = $.timer(timerSpeed, function (timer) {
		if(transLock){
			return; 
		}else{
			transLock = true; 
		}		
		
		selectedPhoto++;
		if(selectedPhoto > arrPhotos.length - 1){
			selectedPhoto = 0;;
		}
		moveToImg(selectedPhoto);
	});	
	
	moveToImg(selectedPhoto);
});