// Event on window load
window.addEvent('domready', function() {

	// Carousel - Let's define some variables first
	carousel = $('carousel-content');
	carousel_items = $$('#carousel-content div.job');
	carousel_items_visible = 4;
	carousel_item_width = 180;
	carousel_max_margin = carousel_items.length * carousel_item_width - carousel_item_width * carousel_items_visible;
	carousel_navigator = (navigator.appName == 'Microsoft Internet Explorer') ? "className" : "class";
	carousel_close = false;
	carousel_animation = new Fx.Tween(carousel, {duration: 1000});
	///////////////////////////////////////////////////////////////////////////////////////////////////////////////////

	// Accordion - Defines accordion list
	accordionList = new Array();
	accordionList[0] = createAccordion('about');
	accordionList[1] = createAccordion('portfolio');
	accordionList[2] = createAccordion('contact');
	///////////////////////////////////////////////////////////////////////////////////////////////////////////////////

	// Accordion - Defines toggle list
	toggleList = new Array();
	toggleList[0] = new Array($('about-toggle'), "#009933");
	toggleList[1] = new Array($('portfolio-toggle'), "#ffcc00");
	toggleList[2] = new Array($('contact-toggle'), "#003399");
	///////////////////////////////////////////////////////////////////////////////////////////////////////////////////

	// Carousel - The function to browse forward
	function carouselNextItem() {
		var carousel_position = parseInt(carousel.getStyle('left'));
		if (carousel_position == -carousel_max_margin) {
			carousel_animation.start('left', 0);
		} else { 
			var carousel_newposition = carousel_position - carousel_item_width * carousel_items_visible;
			if (carousel_newposition < -carousel_max_margin) {
				carousel_newposition = -carousel_max_margin;
			}
			carousel_animation.start('left', carousel_newposition);
		}
	}
	///////////////////////////////////////////////////////////////////////////////////////////////////////////////////

	// Carousel - The function to browse backward
	function carouselPreviousItem() {
		var carousel_position = parseInt(carousel.getStyle('left'));
		if (carousel_position == 0) {
			carousel_animation.start('left', -carousel_max_margin);
		} else { 
			var carousel_newposition = carousel_position + carousel_item_width * carousel_items_visible;
			if (carousel_newposition > 0) {
				carousel_newposition = 0;
			}
			carousel_animation.start('left', carousel_newposition);
		}
	}
	///////////////////////////////////////////////////////////////////////////////////////////////////////////////////

	// Accordion - Function that makes an instance of accordion
	function createAccordion(accordionId) {
		var accordion = new Fx.Slide(accordionId + '-accordion', {duration: 800});
		$(accordionId + '-toggle').addEvent('click', function(e) {
			changeToogleColors($(accordionId + '-toggle'));
			toggleAccordions(accordion);
		});
		accordion.addEvent('start', function(e) {
			$(accordionId + '-content').setStyle('overflow', 'visible');
			$(accordionId + '-content').setStyle('height', 'auto');
		});
		accordion.hide();
		return accordion;
	}
	///////////////////////////////////////////////////////////////////////////////////////////////////////////////////

	// Accordion - Function that hides accordions not used
	function toggleAccordions(accordionId) {
		if ((parseInt(carousel.getStyle('left')) != 0) && (accordionList[1].open)) {
			carousel_animation.start('left', 0);
			setTimeout(function () { toggleAccordions(accordionId); }, 500);
			return;
		}
		accordionId.toggle();
		for (i = 0; i < accordionList.length; i++) {
			var accordion = accordionList[i];
			if ((accordion != accordionId) && (accordion.open)) {
				accordion.toggle();
			}
		}
	}
	///////////////////////////////////////////////////////////////////////////////////////////////////////////////////

	// Accordion - Function that changes the tooglers colors
	function changeToogleColors(toggleId) {
		for (i = 0; i < toggleList.length; i++) {
			var toggle = toggleList[i];
			if ((toggle[0] == toggleId) && (!accordionList[i].open)) {
				toggle[0].setStyle('border-bottom', '5px solid ' + toggle[1]);
			} else {
				toggle[0].setStyle('border-bottom', '');
			}
		}
	}
	///////////////////////////////////////////////////////////////////////////////////////////////////////////////////

	// Carousel - Set up the 'next' and 'previous' buttons and 'complete' event
	carousel_animation.addEvent('complete', function() {
		if (parseInt(carousel.getStyle('left')) == 0) {
			$('carousel-wrap').setAttribute(carousel_navigator, 'div-inherit');
			$('carousel-content').setAttribute(carousel_navigator, 'div-inherit');
		}
	});

	$('carousel-next').addEvent('click', function() {
		$('carousel-wrap').setAttribute(carousel_navigator, 'div-relative');
		$('carousel-content').setAttribute(carousel_navigator, 'div-absolute');
		carouselNextItem();
	});

	$('carousel-previous').addEvent('click', function() {
		$('carousel-wrap').setAttribute(carousel_navigator, 'div-relative');
		$('carousel-content').setAttribute(carousel_navigator, 'div-absolute');
		carouselPreviousItem();
	});
	///////////////////////////////////////////////////////////////////////////////////////////////////////////////////

	// Contact Form - Set up the 'onsubmit' event
 	loading = new Image();
 	loading.src = 'images/loading.gif';

	$('form').addEvent('submit', function() {
		if (checkForm()) {
			hideForm();
			sendForm();
		}
		return false;
	});
	///////////////////////////////////////////////////////////////////////////////////////////////////////////////////

	// Contact Form - Checks all the fields
	checkForm = function() {
		if ($('field-name').value == "") {
			alert('Please enter your name');
			$('field-name').focus();
			return false;
		}
		if ($('field-email').value == "") {
			alert('Please enter your email');
			$('field-email').focus();
			return false;
		}
		if ($('field-message').value == "") {
			alert('Please enter a message');
			$('field-message').focus();
			return false;
		}
		return true;
	}
	///////////////////////////////////////////////////////////////////////////////////////////////////////////////////

	// Contact Form - Sends email using Ajax
	sendForm = function() {
		new Request({
			method: 'get',
			url: 'sendmail.php',
			data: 'name=' + $('field-name').value + '&email=' + $('field-email').value + '&site=' + $('field-site').value + '&message=' + $('field-message').value,
			onRequest: function() { $('contact-message').innerHTML = '<p align=center'+'><br /><br /><br /><img src=images/loading.gif width=32 height=32 alt=Loading /><br /><br /><br /><br /><br /><br /><'+'/p>'; },
			onComplete: function(response) { $('contact-message').innerHTML = '<p align=center><br /><br /><br /><br /><strong>' + response + '</strong><br /><br /><br /><br /><br /><br /><br /></p>'; }
		}).send();
	}
	///////////////////////////////////////////////////////////////////////////////////////////////////////////////////

	// Contact Form - Displays the contact message and hides the contact form
	hideForm = function() {
		$('form').style.display = "none";
		$('contact-message').style.display = "block";
	}
	///////////////////////////////////////////////////////////////////////////////////////////////////////////////////

	// Contact Form - Displays the contact form and hides the contact message
	displayForm = function() {
		$('form').style.display = "block";
		$('contact-message').style.display = "none";
		$('field-name').value = "";
		$('field-email').value = "";
		$('field-site').value = "";
		$('field-message').value = "";
	}
	///////////////////////////////////////////////////////////////////////////////////////////////////////////////////

});