window.addEvent('load', function() {

	var slides = 3;			// Change This
	var pos = 0;
	var offset = 900;		// HOW MUCH TO MOVE
	var currentslide = 0;

	var scroll = new Fx.Scroll('wrapper', {
		offset:{'x':0, 'y':0}, 
		transition: Fx.Transitions.Elastic.easeOut
	});
	

	$('goto1').addEvent('click', function(event) {
		event = new Event(event).stop();
		var slide = 1;
		if(currentslide == slide){
			if (window.pageYOffset != 480){
				var myFx = new Fx.Scroll(window).start(0,480);
			}
			return;
		} 
		
		jQuery('.box1').css({'backgroundColor':'white',border: 'solid 2px #308ECE'});
		jQuery('.box2').css({'backgroundColor':'#F1F2F5',border: 'solid 2px #D3D3D3'});
		jQuery('.box3').css({'backgroundColor':'#F1F2F5',border: 'solid 2px #D3D3D3'});
		
		// $$('.box1').setStyle('backgroundColor','white');
		// $$('.box2').setStyle('backgroundColor','#F1F2F5');
		// $$('.box3').setStyle('backgroundColor','#F1F2F5');
		
		// $$('.box1button').setStyle('background','url(/files/images/bg.jpg) no-repeat -1090px -1013px');
		
		// background: url(/files/images/bg.jpg) no-repeat -1090px -1013px;	
		
		currentslide = slide;																		
		pos = (offset*slide);
		// pos = 0;
		if (window.pageYOffset != 480){
			var myFx = new Fx.Scroll(window).start(0,480).chain(function(){
				$$('div.slides').setStyle('height', '350px');
				$$('div.wrapper').setStyle('height', '360px');				
				$$('div#stage-container').setStyle('height', '350px');								
				scroll.start(pos);
			});	
		} else {
			$$('div.slides').setStyle('height', '350px');
			$$('div.wrapper').setStyle('height', '360px');				
			$$('div#stage-container').setStyle('height', '350px');								
							
			scroll.start(pos);			
		}	

	});


	$('goto2').addEvent('click', function(event) {
		event = new Event(event).stop();
		var slide = 0;
		console.log(currentslide);

		if(currentslide == slide){
			if (window.pageYOffset != 480){
				var myFx = new Fx.Scroll(window).start(0,480);
			}
			return;
		}
		
		// $$('.box1').setStyle('backgroundColor','#F1F2F5');
		// $$('.box2').setStyle('backgroundColor','white');
		// $$('.box3').setStyle('backgroundColor','#F1F2F5');
		
		jQuery('.box1').css({'backgroundColor':'white',border: 'solid 2px #D3D3D3'});
		jQuery('.box2').css({'backgroundColor':'#F1F2F5',border: 'solid 2px #308ECE'});
		jQuery('.box3').css({'backgroundColor':'#F1F2F5',border: 'solid 2px #D3D3D3'});
		
		
		currentslide = slide;																		
		pos = (offset*slide);
		// pos = 900;		
		if (window.pageYOffset != 480){
			var myFx = new Fx.Scroll(window).start(0,480).chain(function(){
				$$('div.slides').setStyle('height', '660px');
				$$('div.wrapper').setStyle('height', '660px');				
				$$('div#stage-container').setStyle('height', '660px');								
				scroll.start(pos);
			});	
		} else {
			$$('div.slides').setStyle('height', '660px');
			$$('div.wrapper').setStyle('height', '660px');				
			$$('div#stage-container').setStyle('height', '660px');								
			scroll.start(pos);			
		}
	});
	
	$('goto3').addEvent('click', function(event) {
		event = new Event(event).stop();
		var slide = 2;
		if(currentslide == slide){
			if (window.pageYOffset != 480){
				var myFx = new Fx.Scroll(window).start(0,480);
			}
			return;
		}
		
		// $$('.box1').setStyle('backgroundColor','#F1F2F5');
		// $$('.box2').setStyle('backgroundColor','#F1F2F5');
		// $$('.box3').setStyle('backgroundColor','white');
		
		jQuery('.box1').css({'backgroundColor':'white',border: 'solid 2px #D3D3D3'});
		jQuery('.box2').css({'backgroundColor':'#F1F2F5',border: 'solid 2px #D3D3D3'});
		jQuery('.box3').css({'backgroundColor':'#F1F2F5',border: 'solid 2px #308ECE'});
		
		
		
		currentslide = slide;																		
		pos = (offset*slide);
		if (window.pageYOffset != 480){
			var myFx = new Fx.Scroll(window).start(0,480).chain(function(){
				$$('div.slides').setStyle('height', '660px');
				$$('div.wrapper').setStyle('height', '660px');				
				$$('div#stage-container').setStyle('height', '660px');								
				scroll.start(pos);
			});	
		} else {
			$$('div.slides').setStyle('height', '660px');
			$$('div.wrapper').setStyle('height', '660px');				
			$$('div#stage-container').setStyle('height', '660px');								
			
			scroll.start(pos);			
		}
	});	

	scroll.toLeft();
});
