$(document).ready(function() {
	//Checken welke html bestand er open staat
	var sPath = window.location.pathname;
	var sPage = sPath.substring(sPath.lastIndexOf('/') + 1); 	
	
	// Bereken aan de hand van de schermgrootte waar verschillende elementen heen moeten. 
	var margin_width = document.documentElement.clientWidth; 
	//margin_width = (margin_width / 2) - 300;
	margin_width = 265;
	var margin_nav = document.documentElement.clientHeight;
	// margin_nav = (margin_nav / 100) * 20; 
	margin_nav = 110;
	
	var margin_layer = document.documentElement.clientHeight; 
	margin_layer = (margin_layer / 100) * 20; 
	
	var margin_art = document.documentElement.clientWidth; 
	margin_art = (margin_art / 2) - 200; 
	
	//standaard acties
	$("#home").css('margin-top', -2000);
	if(document.documentElement.clientWidth <= 1024){
		margin_width = margin_width + 80;
	
	}
	$("#myImageFlow").css('height', 400);
	$("#layer").css('margin-left', margin_width);
	$("#layer_en").css('margin-left', margin_width);
	$("#layer_fr").css('margin-left', margin_width);
	$("#home").css('margin-left', margin_width);
	$("#art_box, #art_box_en, #art_box_fr").css('margin-left', margin_width);
	$(".press_box").css('margin-left', margin_width);
	var margin_contact = $('#contact').height();
	margin_contact = (document.documentElement.clientHeight / 100) * 20; 
	var margin_logo = document.documentElement.clientHeight;
	margin_logo = margin_logo - 90;
	$("#contact, #contact_en, #contact_fr").animate({ marginTop: 40}, {duration:1, easing: 'easeOutQuad'});
	$("#contact, #contact_en, #contact_fr").css('margin-top', 40); 
	
	// Controleer welke pagina actief is en voer de daarbij behorende handelingen uit. 
	if(sPage == 'art.html' || sPage == 'art.php'){
		//$("#myImageFlow").animate({ marginLeft: 0}, { duration: 1, easing: 'easeOutQuad' });
		$("#myImageFlow").animate({ marginLeft: 2000}, { duration : 1, easing: 'easeOutQuad' });
		$("#adjemarck").css('margin-top', 15);
		$("#art_box_en").css('padding', 0);
		$("#art_box_en").css('margin-top', -2000);
		$("#art_box_en").animate({ opacity : 1, marginTop: 40}, { duration:1000, easing: 'easeInOutBack'});
		$("#nav").animate({ opacity: 1, marginTop: margin_nav}, { duration: 1, easing: 'easeInOutBack' } );
		$("#logo").animate({marginTop: 40},{ duration:1, easing: 'easeOutQuad'});
		$("#btn_art").css('font-weight','bold');
		$('#art_box a, #art_box_en a, #art_box_fr a').bind('mouseclick mousedown keydown', function() {
	 		$("#art_box, #art_box_en, #art_box_fr").animate({ marginTop : -2000}, {duration:1000, easing : 'easeOutQuad'}); 
	 		$("#myImageFlow").animate({ marginLeft: 0}, { duration: 1000, easing: 'easeOutQuad' });
	 		$('#art_box a, #art_box_en a, #art_box_fr a').unbind();
			$("#language").animate({ marginTop: -50}, {duration: 100, easing: 'easeOutQuad' });
		}); 
		$("#language").delay(900).animate({ marginTop: 0}, {duration: 100, easing: 'easeOutQuad' });
		
		$("#lang_NL").click(function(){
			$artmargin_en = $("#art_box_en").css('margin-top');
			$artmargin_fr = $("#art_box_fr").css('margin-top');
			if($artmargin_en == '40px' || $artmargin_fr == '40px'){
				$("#art_box_en").animate({ marginTop: -2000}, { duration: 1000, easing: 'easeOutQuad' });
				$("#art_box_fr").animate({ marginTop: -2000}, { duration: 1000, easing: 'easeOutQuad' });
				$("#art_box").animate({ marginTop: 40}, {duration: 1000, easing: 'easeOutQuad' });
			}
		});
		$("#lang_EN").click(function(){
			$artmargin_nl = $("#art_box").css('margin-top');
			$artmargin_fr = $("#art_box_fr").css('margin-top');
			if($artmargin_nl == '40px' || $artmargin_fr == '40px'){
				$("#art_box").animate({ marginTop: -2000}, { duration: 1000, easing: 'easeOutQuad' });
				$("#art_box_fr").animate({ marginTop: -2000}, { duration: 1000, easing: 'easeOutQuad' });
				$("#art_box_en").animate({ marginTop: 40}, {duration: 1000, easing: 'easeOutQuad' });
			}
		});
		$("#lang_FR").click(function(){
			$artmargin_nl = $("#art_box").css('margin-top');
			$artmargin_en = $("#art_box_en").css('margin-top');
			if($artmargin_nl == '40px' || $artmargin_en == '40px'){
				$("#art_box").animate({ marginTop: -2000}, { duration: 1000, easing: 'easeOutQuad' });
				$("#art_box_en").animate({ marginTop: -2000}, { duration: 1000, easing: 'easeOutQuad' });
				$("#art_box_fr").animate({ marginTop: 40}, {duration: 1000, easing: 'easeOutQuad' });
			}
		});

	}else if(sPage == 'press.html' || sPage == 'press.php' ){
	
		$(".imageflow_press").animate({ marginLeft: 0}, { duration : 1, easing: 'easeOutQuad' });

		//$("#myImageFlow").animate({ marginLeft: 0}, { duration: 1, easing: 'easeOutQuad' });
		$("#myImageFlow").not(".imageflow_press").animate({ marginLeft: 2000}, { duration : 1, easing: 'easeOutQuad' });
		$("#adjemarck").css('margin-top', 15);
		$(".press_box").css('padding', 0);

		$(".press_box").css('margin-top', -2000);
		$(".press_box").animate({ opacity : 1, marginTop: 40}, { duration:1000, easing: 'easeInOutBack'});
		$("#nav").animate({ opacity: 1, marginTop: margin_nav}, { duration: 1, easing: 'easeInOutBack' } );
		$("#btn_lightsculptures:visible").hide("slow");
		$("#btn_projects:visible").hide("slow");
		$("#btn_modules:visible").hide("slow");
		$("#btn_art:visible").hide("slow");
		$("#logo").animate({marginTop: 40},{ duration:1, easing: 'easeOutQuad'});
		$("#btn_press").css('font-weight','bold');

	}else if(sPage == 'lightsculptures.html' || sPage == 'lightsculptures.php'){
		$(".imageflow_lightsculptures").animate({ marginLeft: 0}, { duration: 1, easing: 'easeOutQuad' });
		$("#nav").animate({ opacity: 1, marginTop: margin_nav}, { duration: 1, easing: 'easeInOutBack' } );
		$("#logo").animate({marginTop: 40},{ duration:1, easing: 'easeOutQuad'});
		$("#btn_lightsculptures").css('font-weight','bold');
	}else if(sPage == 'modules.html' || sPage == 'modules.php'){
		$("#myImageFlow").animate({ marginLeft: 0}, { duration: 1, easing: 'easeOutQuad' });
		$("#nav").animate({ opacity: 1, marginTop: margin_nav}, { duration: 1, easing: 'easeInOutBack' } );
		$("#logo").animate({marginTop: 40},{ duration:1, easing: 'easeOutQuad'});
		$("#btn_modules").css('font-weight','bold');
	}else if(sPage == 'projects.html' || sPage == 'projects.php'){
		$("#myImageFlow").animate({ marginLeft: 0}, { duration: 1, easing: 'easeOutQuad' });
		$("#nav").animate({ opacity: 1, marginTop: margin_nav}, { duration: 1, easing: 'easeInOutBack' } );
		$("#logo").animate({marginTop: 40},{ duration:1, easing: 'easeOutQuad'});
		$("#btn_projects").css('font-weight','bold');
	}else if(sPage == 'contact.html' || sPage == 'contact.php'){
		$("#myImageFlow").animate({ marginLeft: 2000}, { duration : 1, easing: 'easeOutQuad' });
		$("#layer").animate({ marginTop: -2000}, { duration: 1, easing: 'easeOutQuad' });
		$("#contact").animate({ marginLeft: margin_width}, {duration: 1, easing: 'easeOutQuad' });
		$("#nav").animate({ opacity: 1, marginTop: margin_nav}, { duration: 1, easing: 'easeInOutBack' } );
		$("#btn_lightsculptures:visible").hide("slow");
		$("#btn_projects:visible").hide("slow");
		$("#btn_modules:visible").hide("slow");
		$("#btn_art:visible").hide("slow");
		$("#logo").animate({marginTop: 40},{ duration:1, easing: 'easeOutQuad'});

	}else if(sPage == 'layer.html' || sPage == 'layer.php'){
		
		$("#layer").animate({ marginTop: 40}, {duration: 1, easing: 'easeOutQuad' });
		$("#nav").animate({ opacity: 1, marginTop: margin_nav}, { duration: 1, easing: 'easeInOutBack' } );
		$("#btn_lightsculptures:visible").hide("slow");
		$("#btn_projects:visible").hide("slow");
		$("#btn_modules:visible").hide("slow");
		$("#btn_art:visible").hide("slow");
		$("#logo").animate({marginTop: 40},{ duration:1, easing: 'easeOutQuad'});
	}else if(sPage == 'contact_succes.html' || sPage == 'contact_succes.php'){
		$("#myImageFlow").animate({ marginLeft: 2000}, { duration : 1, easing: 'easeOutQuad' });
		$("#contact_succes").animate({ marginTop: margin_layer}, {duration: 1, easing: 'easeOutQuad' });
		$("#contact_succes").animate({ marginLeft: margin_width}, {duration: 1, easing: 'easeOutQuad' });
		$("#nav").animate({ opacity: 1, marginTop: margin_nav}, { duration: 1, easing: 'easeInOutBack' } );
		$("#btn_lightsculptures:visible").hide();
		$("#btn_projects:visible").hide();
		$("#btn_modules:visible").hide();
		$("#btn_art:visible").hide();
		$("#logo").animate({marginTop: 40},{ duration:1, easing: 'easeOutQuad'});
	}else{
		$("#nav").animate({ opacity: 1, marginTop: margin_nav}, { duration: 1000, easing: 'easeInOutBack' } );
		$("#myImageFlow").css('margin-left', 2000);
		$("#home").animate({ marginTop: 40}, {duration: 1000, easing: 'easeInOutBack' });
		$(".innerfade").animate({ marginTop: margin_layer}, {duration: 1000, easing: 'easeInOutBack' });
		$("#logo").animate({marginTop: 40},{ duration:1000, easing: 'easeOutQuad'});	
		$("#btn_lightsculptures").toggle();
		$("#btn_projects").toggle();
		$("#btn_modules").toggle();
		$("#btn_art").toggle();	
	}
	
	$("#fb").delay(750).animate({ bottom: 40 }, { duration: 250, easing: 'easeInOutBack' } );

	
	$("#language a").click(function(){
		$(this).removeClass('inactive').addClass('active');
		$("#language a").not(this).removeClass('active').addClass('inactive');
	});

	$("#lang_NL").click(function(){
		$layermargin_en = $("#layer_en").css('margin-top');
		$layermargin_fr = $("#layer_fr").css('margin-top');
		$contactmargin_en = $("#contact_en").css('margin-left');
		$contactmargin_fr = $("#contact_fr").css('margin-left');
		if($contactmargin_en == margin_width+'px' || $contactmargin_fr == margin_width+'px'){
			$("#contact").animate({ marginLeft: margin_width}, { duration: 1000, easing: 'easeOutQuad' });
			$("#contact_en, #contact_fr").animate({ marginLeft: -2000}, { duration: 1000, easing: 'easeOutQuad' });
		}
		if($layermargin_en == '40px' || $layermargin_fr == '40px'){
			$("#layer_en").animate({ marginTop: -2000}, { duration: 1000, easing: 'easeOutQuad' });
			$("#layer_fr").animate({ marginTop: -2000}, { duration: 1000, easing: 'easeOutQuad' });
			$("#layer").animate({ marginTop: 40}, {duration: 1000, easing: 'easeOutQuad' });
		}
	});
	$("#lang_EN").click(function(){
		$layermargin_nl = $("#layer").css('margin-top');
		$layermargin_fr = $("#layer_fr").css('margin-top');
		$contactmargin_nl = $("#contact").css('margin-left');
		$contactmargin_fr = $("#contact_fr").css('margin-left');
		if($contactmargin_nl == margin_width+'px' || $contactmargin_fr == margin_width+'px'){
			$("#contact_en").animate({ marginLeft: margin_width}, { duration: 1000, easing: 'easeOutQuad' });
			$("#contact, #contact_fr").animate({ marginLeft: -2000}, { duration: 1000, easing: 'easeOutQuad' });
		}
		if($layermargin_nl == '40px' || $layermargin_fr == '40px'){
			$("#layer").animate({ marginTop: -2000}, { duration: 1000, easing: 'easeOutQuad' });
			$("#layer_fr").animate({ marginTop: -2000}, { duration: 1000, easing: 'easeOutQuad' });
			$("#layer_en").animate({ marginTop: 40}, {duration: 1000, easing: 'easeOutQuad' });
		}
	});
	$("#lang_FR").click(function(){

		$layermargin_nl = $("#layer").css('margin-top');
		$layermargin_en = $("#layer_en").css('margin-top');
		$contactmargin_nl = $("#contact").css('margin-left');
		$contactmargin_en = $("#contact_en").css('margin-left');
		if($contactmargin_nl == margin_width+'px' || $contactmargin_en == margin_width+'px'){
			$("#contact_fr").animate({ marginLeft: margin_width}, { duration: 1000, easing: 'easeOutQuad' });
			$("#contact_en, #contact").animate({ marginLeft: -2000}, { duration: 1000, easing: 'easeOutQuad' });
		}
		if($layermargin_nl == '40px' || $layermargin_en == '40px'){
			$("#layer").animate({ marginTop: -2000}, { duration: 1000, easing: 'easeOutQuad' });
			$("#layer_en").animate({ marginTop: -2000}, { duration: 1000, easing: 'easeOutQuad' });
			$("#layer_fr").animate({ marginTop: 40}, {duration: 1000, easing: 'easeOutQuad' });
		}

	});
	
	$("#btn_layer").click(function(){
	
		$NL_color = $('#lang_NL').css('color');
		$EN_color = $('#lang_EN').css('color');
		$FR_color = $('#lang_FR').css('color');
		
		if ($("#language").length == 0) {
			$("#layer").animate({ marginTop: 40}, {duration: 1000, easing: 'easeOutQuad' });
		}
		else if ($NL_color == 'rgb(255, 255, 255)') { 
			$("#layer").animate({ marginTop: 40}, {duration: 1000, easing: 'easeOutQuad' });
		}
		else if ($EN_color == 'rgb(255, 255, 255)') { 
			$("#layer_en").animate({ marginTop: 40}, {duration: 1000, easing: 'easeOutQuad' });
		}
		else if ($FR_color == 'rgb(255, 255, 255)') { 
			$("#layer_fr").animate({ marginTop: 40}, {duration: 1000, easing: 'easeOutQuad' });
		}
		
		$("#language").delay(900).animate({ marginTop: 0}, {duration: 100, easing: 'easeOutQuad' });

		$("#btn_layer").css('font-weight','bold');
		$("#btn_contact").css('font-weight','normal');
		$("#btn_work").css('font-weight','normal');
		$("#btn_home").css('font-weight','normal');
		$("#btn_lightsculptures").css('font-weight','normal');
		$("#btn_projects").css('font-weight','normal');
		$("#btn_modules").css('font-weight','normal');
		$("#btn_art").css('font-weight','normal');					
		$("#btn_press").css('font-weight','normal');					
		$("#myImageFlow").animate({ marginLeft: 2000}, {duration: 1000, easing: 'easeOutQuad' });
		$("#contact").animate({ marginLeft: -2000}, { duration: 1000, easing: 'easeOutQuad' });
		$("#home").animate({ marginTop: -2000}, {duration: 1000, easing: 'easeOutQuad' });
		$("#btn_lightsculptures:visible").hide("slow");
		$("#btn_projects:visible").hide("slow");
		$("#btn_modules:visible").hide("slow");
		$("#btn_art:visible").hide("slow");
		$("#contact_succes").animate({ marginTop: -2000}, {duration: 2000, easing: 'easeOutQuad' });
		$("#art_box").animate({ marginTop: -2000}, {duration: 2000, easing: 'easeOutQuad' });
		$(".press_box").animate({ marginTop: -2000}, {duration: 2000, easing: 'easeOutQuad' });
	});

	$('#nav ul li').not("#btn_layer").click(function(){
		$("#layer, #layer_en, #layer_fr").animate({ marginTop: -2000}, { duration: 1000, easing: 'easeOutQuad' });
	});
	$('#nav ul li').not("#btn_art").click(function(){
		$("#art_box, #art_box_en, #art_box_fr").animate({ marginTop: -2000}, { duration: 1000, easing: 'easeOutQuad' });
	});
	$('#nav ul li').not("#btn_contact").click(function(){
		$("#contact, #contact_en, #contact_fr").animate({ marginLeft: -2000}, { duration: 1000, easing: 'easeOutQuad' });
	});
	$('#nav ul li').not("#btn_layer, #btn_art, #btn_contact").click(function(){
		$("#language").animate({ marginTop: -50}, {duration: 100, easing: 'easeOutQuad' });
	});
	
	$("#btn_work").click(function(){
		$("#btn_contact").css('font-weight','normal');
		$("#btn_layer").css('font-weight','normal');
		$("#btn_work").css('font-weight','normal');
		$("#btn_home").css('font-weight','normal');	
		$("#btn_lightsculptures").css('font-weight','bold');
		$("#btn_projects").css('font-weight','normal');
		$("#btn_modules").css('font-weight','normal');
		$("#btn_art").css('font-weight','normal');				
		$("#btn_press").css('font-weight','normal');					
		$(".imageflow_lightsculptures").css('visibility','visible');
		$(".imageflow_lightsculptures").animate({ marginLeft: 0}, { duration: 1000, easing: 'easeOutQuad' });
		$("#contact").animate({ marginLeft: -2000}, { duration: 1000, easing: 'easeOutQuad' });
		$("#home").animate({ marginTop: -2000}, {duration: 1000, easing: 'easeOutQuad' });
		$("#btn_lightsculptures:hidden").show("slow");
		$("#btn_projects:hidden").show("slow");
		$("#btn_modules:hidden").show("slow");
		$("#btn_art:hidden").show("slow");	
		$("#contact_succes").animate({ marginTop: -2000}, {duration: 2000, easing: 'easeOutQuad' });
		$("#art_box").animate({ marginTop: -2000}, {duration: 2000, easing: 'easeOutQuad' });
		$(".press_box").animate({ marginTop: -2000}, {duration: 2000, easing: 'easeOutQuad' });
	});

	$("#btn_contact").click(function(){

		$NL_color = $('#lang_NL').css('color');
		$EN_color = $('#lang_EN').css('color');
		$FR_color = $('#lang_FR').css('color');
		
		if ($("#language").length == 0) {
			$("#contact").animate({ marginLeft: margin_width}, {duration: 1000, easing: 'easeOutQuad' });
		}
		else if ($NL_color == 'rgb(255, 255, 255)') { 
			$("#contact").animate({ marginLeft: margin_width}, {duration: 1000, easing: 'easeOutQuad' });
		}
		else if ($EN_color == 'rgb(255, 255, 255)') { 
			$("#contact_en").animate({ marginLeft: margin_width}, {duration: 1000, easing: 'easeOutQuad' });
		}
		else if ($FR_color == 'rgb(255, 255, 255)') { 
			$("#contact_fr").animate({ marginLeft: margin_width}, {duration: 1000, easing: 'easeOutQuad' });
		}
		
		$("#language").delay(900).animate({ marginTop: 0}, {duration: 100, easing: 'easeOutQuad' });

		$("#btn_contact").css('font-weight','bold');
		$("#btn_layer").css('font-weight','normal');
		$("#btn_work").css('font-weight','normal');
		$("#btn_home").css('font-weight','normal');
		$("#btn_lightsculptures").css('font-weight','normal');
		$("#btn_projects").css('font-weight','normal');
		$("#btn_modules").css('font-weight','normal');
		$("#btn_art").css('font-weight','normal');			
		$("#btn_press").css('font-weight','normal');					
		$("#myImageFlow").animate({ marginLeft: 2000}, { duration : 1000, easing: 'easeOutQuad' });
		$("#home").animate({ marginTop: -2000}, {duration: 1000, easing: 'easeOutQuad' });
		$("#btn_lightsculptures:visible").hide("slow");
		$("#btn_projects:visible").hide("slow");
		$("#btn_modules:visible").hide("slow");
		$("#btn_art:visible").hide("slow");
		$("#contact_succes").animate({ marginTop: -2000}, {duration: 2000, easing: 'easeOutQuad' });
		$("#art_box").animate({ marginTop: -2000}, {duration: 2000, easing: 'easeOutQuad' });
		$(".press_box").animate({ marginTop: -2000}, {duration: 2000, easing: 'easeOutQuad' });
	});
	
	$("#btn_home").click(function(){
		$("#btn_contact").css('font-weight','normal');
		$("#btn_layer").css('font-weight','normal');
		$("#btn_work").css('font-weight','normal');
		$("#btn_home").css('font-weight','bold');
		$("#btn_lightsculptures").css('font-weight','normal');
		$("#btn_projects").css('font-weight','normal');
		$("#btn_modules").css('font-weight','normal');
		$("#btn_art").css('font-weight','normal');	
		$("#btn_press").css('font-weight','normal');					
		$("#myImageFlow").animate({ marginLeft: 2000}, { duration : 1000, easing: 'easeOutQuad' });
		$("#home").animate({ marginTop: 40}, {duration: 1000, easing: 'easeOutQuad' });
		$("#btn_lightsculptures:visible").hide("slow");
		$("#btn_projects:visible").hide("slow");
		$("#btn_modules:visible").hide("slow");
		$("#btn_art:visible").hide("slow");
		$("#contact_succes").animate({ marginTop: -2000}, {duration: 2000, easing: 'easeOutQuad' });
		$("#art_box").animate({ marginTop: -2000}, {duration: 2000, easing: 'easeOutQuad' });
		$(".press_box").animate({ marginTop: -2000}, {duration: 2000, easing: 'easeOutQuad' });
		
	});
	
	
	$("#form1").validate({
		rules: {
			
			naam: { required:true,minlength: 5},
			telefoon: { required:true,minlength: 5},
			email: { 
				required:true,
				email:true
			},
			bericht: "required"},
			messages: {
				naam: '<br>Voer a.u.b. uw volledige naam in.',
				telefoon: '<br>Voer a.u.b. een correct telefoonnummer in.',
				email:'<br>Voer a.u.b. een correct e-mailadres in.',
				bericht:'<br>Voer a.u.b. een bericht in.'
			
			}
			
			
		
	});
	$('#innerfade').innerfade({
				speed: 'slow',
				timeout: 4500,
				type: 'sequence',
				containerheight: '450px'
	});

		
	
	
});