var galleryImages = [];
var currentImage = 0;
var interval = 5000 // ms
var duration = 3.0 // sec
var timerReference;
var inProgress = false;
var ef1 = false;
var ef2 = false;
	
function switchImg(){
	inProgress = true;
	ef1 = new Effect.Fade(galleryImages[currentImage], { duration: duration});
	currentImage = currentImage < galleryImages.length-1 ? currentImage+1 : 0;
	ef2 = new Effect.Appear(galleryImages[currentImage], { duration: duration});
	$$(".circle").each(function(el){
		el.removeClassName("on");
	});
	$('galleryCircles').down(currentImage).addClassName("on");
	inProgress = false;
}
	
function show(imageIndex){
	clearInterval(timerReference);

	while (inProgress){
		
	}
	
	if (ef1){
		ef1.cancel();
		ef1.element.hide();
	}
	if (ef2){
		ef2.cancel();
		ef2.element.hide();
	}
	
	galleryImages[currentImage].hide();
	galleryImages[currentImage].setOpacity(0);

	
	currentImage = imageIndex;
	
	galleryImages[currentImage].show();
	galleryImages[currentImage].setOpacity(1);
	
	$$(".circle").each(function(el){
		el.removeClassName("on");
	});
	$('galleryCircles').down(currentImage).addClassName("on");

	timerReference = setInterval(switchImg, interval);
}//end show
	
	
Event.observe(window, 'load', function(){
		
	var index = 0;
		
	$$(".galleryImg").each(function(el){
		el.hide();
		galleryImages.push(el);
	});
		
	if (galleryImages.length > 1){
		for(var i=0; i<galleryImages.length; i++){
			var circle = document.createElement("A");
			circle.href = "#";
			circle.imageIndex = i;
			Element.extend(circle);
			circle.addClassName('circle');
			$('galleryCircles').appendChild(circle);
		
			circle.observe('click', function(e){
				Event.stop(e);
				show(this.imageIndex);
			});
		}
	
		timerReference = setInterval(switchImg, interval);
		$('galleryCircles').down(currentImage).addClassName("on");
	}
	
	if (galleryImages.length > 0){
		new Effect.Appear(galleryImages[currentImage], { duration: duration});
	}	
		
});