var borderChanges = '#nav a, .section_heading h2, .section_heading h3, #contact_form .text';
var bgChanges = '.scrollbar .handle, body, #contact_submit';
var colourChanges = '.content_container_sleeve a';
var colours = new Array();
var changeColourTo = '';
var numColours = 0;
var index = 0;
var interval;

function changeColours(){
	$$(borderChanges).each(function(el){
		el.morph({
			borderColor: changeColourTo
		});
	});
	$$(bgChanges).each(function(el){
		el.morph({
			backgroundColor: changeColourTo
		});
	});
	$$(colourChanges).each(function(el){
		el.morph({
			color: changeColourTo
		});
	});
}

function nextColour(){
	index < numColours-1 ? index++ : index = 0;
	changeColourTo = colours[index];
	changeColours();
}

document.addEvent('domready', function(){
	$$('.external').setProperty('target', '_blank');
	//if height of window is less than height of wrapper, change top positioning.
	wrapperHeight = $('wrapper').getSize().y;
	function repositionWrapper(){
		if (window.getSize().y < wrapperHeight){
			$('wrapper').setStyles({'top': 0, 'marginTop': 0});
			$$('body').setStyles({'backgroundPosition': '50% -925px'});
		}else{
			var offset = -(wrapperHeight/2);
			$('wrapper').setStyles({'top': '50%', 'marginTop': offset});
			$$('body').setStyles({'backgroundPosition': '50% '+((window.getSize().y/2)-1232)+'px'});
		}
	};
	repositionWrapper();
	window.addEvent('resize', repositionWrapper);
	
	//get Colours
	$$('#colour_changer a').each(function(el){
		colours.push(el.getStyle('backgroundColor'));
		numColours++;
	});
	changeColourTo = colours[0];
	changeColours();
	
	interval = self.setInterval("nextColour()", 5000);
	
	
	
	$$('.text').addEvents({
		'focus': function(){
			this.tween('backgroundColor', '#EEEEEE');
		},	
		'blur': function(){
			this.tween('backgroundColor', '#FFFFFF');
		}	
	});
	
	//create logo fade
	$$('#logo a').addEvents({
		'mouseenter': function(){
			this.getElements('.colour').fade('out');
		},
		'mouseleave': function(){
			this.getElements('.colour').fade('in');	
		},
		'focus': function(){ this.fireEvent('mouseenter'); },
		'blur': function(){ this.fireEvent('mouseleave'); },
		'click': function(){ return false; }
	});
	
	$$('#colour_changer a').addEvents({
		'click': function(e) {
			e.stop();
			window.clearInterval(interval);
			interval = self.setInterval("nextColour()", 5000);
			changeColourTo = this.getStyle('backgroundColor');
			changeColours();
		},
		'mouseenter':function(){
			this.fade(.5);
		},
		'mouseleave':function(){
			this.fade(1);
		},
		'focus': function(){ this.fireEvent('mouseenter'); },
		'blur': function(){ this.fireEvent('mouseleave'); }
	});
	
	//set width of slidey
	var totalWidth = 0;
	$$('.content_section').each(function(el){
		totalWidth+=el.getSize().x;
	});
	$('sliding_container').setStyle('width', totalWidth);
	
	//scrollbars
	makeScrollbar($('content_home'), $('scrollbar_home'), $$('#scrollbar_home .handle')[0]);
	makeScrollbar($('content_work_thumbs'), $('scrollbar_work_thumbs'), $$('#scrollbar_work_thumbs .handle')[0]);
	makeScrollbar($('content_tech'), $('scrollbar_tech'), $$('#scrollbar_tech .handle')[0]);
	makeScrollbar($('content_contact'), $('scrollbar_contact'), $$('#scrollbar_contact .handle')[0]);
	
	$$('.work_section').each(function(el){
		if (el.getElements('.content_container_sleeve')[0].getSize().y>el.getSize().y){
			//console.log(el.getChildren('.content_container_sleeve')[0].getSize().y);
			var handle = new Element('div', {'class': 'handle'});
			var scrollbar = new Element('div', {'class': 'scrollbar'});
			handle.inject(scrollbar.inject(el, 'top'));
			makeScrollbar(el.getChildren('.work_scrollpane')[0], scrollbar, handle);
                        //            <div class="scrollbar"><div class="handle"></div></div>
									
		}
	});
	//take titles on inputs and make them values
	$$('input.text').each(function(el){
		if(el.getProperty('title') != ""){
			el.setProperty('value', el.getProperty('title'));
			el.addEvents({
			   'focus': function(){
				   if (this.getProperty('title') == this.getProperty('value'))
					   this.setProperty('value', "");
			   },
			   'blur': function(){
				   if (this.getProperty('value') == "")
					   this.setProperty('value', this.getProperty('title'));
			   }
		   });
		}
	});
	
	
	//navigation
	$$('#nav a').addEvents({
		'mouseenter':function(){
			this.set('tween', {duration: 100});
			this.tween('top','0');
		},
		'mouseleave':function(){
			this.set('tween', {duration: 100});
			this.tween('top','5px');
		},
		'focus': function(){ this.fireEvent('mouseenter'); },
		'blur': function(){ this.fireEvent('mouseleave'); },
		'click': function(){ return false; }
	});
	$$('#content_work_thumbs a').addEvents({
		'click': function(){ return false; }
	});
	
	$$('#nav a').addEvent('click', function(){
		var index = this.getParent().getAllPrevious().length;
		$('sliding_container').tween('left', -675*index);
		$$('#nav li').removeClass('current');
		this.getParent().addClass('current');
		return false;
	});
	
	$$('#logo a').addEvent('click', function(e){
		$$('#nav a')[0].fireEvent('click');
		return false;
	});
	
	$('callback').addEvent('click', function(el){
		if (this.getProperty('checked') == true)
			$('tel').setStyle('display','block');
		else
			$('tel').setStyle('display','none');
	});
	
	//set width of slidey
	totalWidth = 0;
	$$('.work_section').each(function(el){
		totalWidth+=el.getSize().x;
	});
	$('content_work').setStyle('width', totalWidth);
	
	$$('#content_work_thumbs a').addEvent('click', function(){
		var index = this.getParent().getAllPrevious().length;
		$('content_work').tween('left', -500*index);
		$$('#content_work_thumbs li').removeClass('current');
		this.getParent().addClass('current');
		return false;
	});
	
	
	$('contact_form').addEvent('submit', function(e) {
		//Prevents the default submit event from loading a new page.
		e.stop();
		//Set the options of the form's Request handler. 
		//("this" refers to the $('myForm') element).
		this.set('send', {url: '/includes/email_script.php', 
			onComplete: function(response) {
			if (response == 'sent'){
				$('contact_form').setStyle('display', 'none');
				$('contact_result').setStyle('display', 'block');
			}
			//$('contact_result').set('html', response);
		}});
		//Send the form.
		this.send();
	});
	$('send_another').addEvent('click', function(){ 
		$('contact_form').setStyle('display', 'block');
		$('contact_result').setStyle('display', 'none');
		$$('#contact_form .text').setProperty('value', '');
		return false;
	});

});


function makeScrollbar(content,scrollbar,handle,horizontal,ignoreMouse){
	if (content.getChildren('.content_container_sleeve').length > 0){
		if (content.getChildren('.content_container_sleeve')[0].getSize().y<content.getSize().y)
			scrollbar.setStyle('display','none');
	}
	var steps = horizontal?(content.getScrollSize().x - content.getSize().x):(content.getScrollSize().y - content.getSize().y);
	var slider = new Slider(scrollbar, handle, {	
		steps: steps,
		mode: (horizontal?'horizontal':'vertical'),
		onChange: function(step){
			// Scrolls the content element in x or y direction.
			var x = horizontal?step:0;
			var y = horizontal?0:step;
			content.scrollTo(x,y);
		}
	}).set(0);
	if(!(ignoreMouse)){
		// Scroll the content element when the mousewheel is used within the 
		// content or the scrollbar element.
		$$(content, scrollbar).addEvent('mousewheel', function(e){	
			e = new Event(e).stop();
			var step = slider.step - e.wheel * 30;	
			slider.set(step);					
		});
	}
	// Stops the handle dragging process when the mouse leaves the document body.
	$(document.body).addEvent('mouseleave',function(){slider.drag.stop()});
}