$(document).ready(function() {

	var nr = 0;
	$('div.accbutton').each(function(){
		$(this).css('left', nr+'px');
		nr = nr+110;
	})

	$('.content').show();

	$(".overlay").css("opacity", "0.3");

	$('div.return').click(function(event){

		event.stopImmediatePropagation();
		$(".overlay").each(function(){
			if($(this).css("display") == "none"){
				$(this).css("opacity", "0.0").show().animate({"opacity": "0.3"}, 300);
			}
		})

		var nr = 0;
		$('div.accbutton').each(function(){
			$(this).animate({
				left: nr+'px'
			}, 500);
			nr = nr+110;
		})
	});
	

	$('div.accbutton').click(function(){

		$(".overlay").each(function(){
			if($(this).css("display") == "none"){
				$(this).css("opacity", "0.0").show().animate({"opacity": "0.3"}, 300);
			}
		})
		$(this).find(".overlay:first-child").hide();

		var nu = $(this).attr('id');
		var nr = 0;
		$('div.accbutton').each(function(){
			$(this).animate({
				left: nr+'px'
			}, 500);
			if($(this).attr('id') == nu){
				nr = nr+450;
			}
			nr = nr+20;
		})
	});


	$('div.overlay').hover(
		function() {
			$(this).stop().animate({"opacity": "0.0"}, 300);
		},
		function() {
			$(this).stop().animate({"opacity": "0.3"}, 300);
		}
	);

	$(".vraag_send").click(function(){

		var naam = $("#vraag_naam");
		var email = $("#vraag_email");
		var bericht = $("#vraag_bericht");
		var error = false;
		addborder(naam);
		addborder(email);
		addborder(bericht);

		if(naam.val() == ''){addborder(naam, true);error = true;}
		if(email.val() == ''){addborder(email, true);error = true;}
		if(!isValidEmailAddress(email.val())){addborder(email, true);error = true;}
		if(bericht.val() == ''){addborder(bericht, true);error = true;}

		if(error){
			$(".vraag_message").css('border', '1px dashed #ee0000').html("U heeft niet alle velden correct ingevuld.").show();
			return;
		}

		$.ajax({
			url: "ajax.php",
			dataType: "json",
			data: {
				type: "sendvraag",
				naam: naam.val(),
				email: email.val(),
				bericht: bericht.val()
			},
			success: function(data){
				$(".vraag_message").css('border', '1px dashed #00cc33').html("Uw vraag is verzonden.").show();
				naam.val("");
				email.val("");
				bericht.val("");
			}
		});
	});

	$(".project_send").click(function(){

		var naam = $("#project_naam");
		var email = $("#project_email");
		var tel = $("#project_tel");
		var pronaam = $("#project_pronaam");
		var omschrijving = $("#project_omschrijving");
		var error = false;
		addborder(naam);
		addborder(email);
		addborder(omschrijving);


		if(naam.val() == ''){addborder(naam, true);error = true;}
		if(email.val() == ''){addborder(email, true);error = true;}
		if(!isValidEmailAddress(email.val())){addborder(email, true);error = true;}
		if(omschrijving.val() == ''){addborder(omschrijving, true);error = true;}

		if(error){
			$(".project_message").css('border', '1px dashed #ee0000').html("U heeft niet alle velden correct ingevuld.").show();
			return;
		}

		$.ajax({
			url: "ajax.php",
			dataType: "json",
			data: {
				type: "sendproject",
				naam: naam.val(),
				email: email.val(),
				tel: tel.val(),
				pronaam: pronaam.val(),
				omschrijving: omschrijving.val()
			},
			success: function(data){
				$(".project_message").css('border', '1px dashed #00cc33').html("Uw project is verzonden.").show();
				naam.val("");
				email.val("");
				tel.val("");
				pronaam.val("");
				omschrijving.val("");
			}
		});
	});



	function isValidEmailAddress(emailAddress) {
		var pattern = new RegExp(/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i);
		return pattern.test(emailAddress);
	}

	function addborder(item, error){
		if(error){
			item.css('border-top', '1px solid #ee0000');
			item.css('border-right', '1px solid #ff0000');
			item.css('border-bottom', '1px solid #ff0000');
			item.css('border-left', '1px solid #ee0000');
		}else{
			item.css('border-top', '1px solid #cccccc');
			item.css('border-right', '1px solid #e0e0e0');
			item.css('border-bottom', '1px solid #e0e0e0');
			item.css('border-left', '1px solid #cccccc');
		}
	}



    var interval = 0;

    $('#carousel_ul li:first').before($('#carousel_ul li:last'));
    var timer = setInterval('slide("right")', interval);

    $('#carousel_ul').hover(function(){
        clearInterval(timer)
		$('#carousel_ul').stop();
    },function(){
        timer = setInterval('slide("right")', interval);
    });





});



function slide(direction){

    var item_width = $('#carousel_ul li').outerWidth() + 10;
    var left_indent;
    if(direction == 'left'){
        left_indent = parseInt($('#carousel_ul').css('left')) + item_width;
    }else{
        left_indent = parseInt($('#carousel_ul').css('left')) - item_width;
    }

    $('#carousel_ul:not(:animated)').animate({
        'left' : left_indent
    },{
		duration: 2000,
		easing: "linear",
		complete : function(){
			if(direction == 'left'){
				$('#carousel_ul li:first').before($('#carousel_ul li:last'));
			}else{
				$('#carousel_ul li:last').after($('#carousel_ul li:first'));
			}
			$('#carousel_ul').css({
				'left' : '-210px'
			});
		}
	});

}