// JavaScript Document

window.addEvent('domready', function(){
	
	var imgButtons = $$('#imgSlideButtons a');
	var imgs = $$('#imgSlides div');
	var slide = new Fx.Elements(imgs, {wait: false, duration: 1000, transition: Fx.Transitions.Cubic.easeOut});
	
	imgs.each(function(image, i){
		if(i != 0){
			image.set('opacity','0');	
		}
	});
	
	imgButtons.each(function(button, a){
		button.addEvent('click', function(event){
			
			var o = {};
			//foreach of the images hide the others and show the current
			imgs.each(function(image, i){
				if(a == i){
					o[i] = {opacity: 1};
				}else{
					o[i] = {opacity: 0};
				}
			});
			slide.start(o);
			
			//reset each of the buttons classes
			imgButtons.each(function(button){
				button.setProperty('class', 'imageButton' );
			});
			//set the current button to the current class
			button.setProperty('class', 'imageButtonCurrent' );
		});
	});

});