$(window).load(function(){
	$(window).scrollTop(0);		
	var deviceAgent = navigator.userAgent.toLowerCase();
	isApple = deviceAgent.match(/(iphone|ipod|ipad)/);
	$("#loading").hide();
	$("body").css("background-image","url(../../images/layout/bg.png)");
	
	tI = $("#gallery").children("a").length;
	
	if (!isApple) {
		if ( $.browser.msie  && $.browser.version <= 8){
			$("#container").show();
		}else{
			$("#container").fadeIn();
		}
		
		function buildSite(){
			/* SET SOME (GLOBAL) VARS */
			$window = $(window);
			wW = $window.width();
			wH = $window.height();
			$d = $("#detector");
			dW = $d.width();
			
			/* SAVE DIMENNSIONS OF SOME ELEMENTS */
			p6H = $("#part6").height();			
			cW  = $("#container").width();
						
			/* FIND THEIR TOP OFFSETS  */	
			p1Top    = findTop(document.getElementById("part1"));
			p2Top    = findTop(document.getElementById("part2"));
			girlsTop = findTop(document.getElementById("girls"));
			h3Top    = findTop(document.getElementById("h3"));
			p4Top    = findTop(document.getElementById("part4"));
			navTop   = findTop(document.getElementById("navigation"));
			p5Top    = findTop(document.getElementById("part5"));
			p6Top    = findTop(document.getElementById("part6"));
			p7Top    = findTop(document.getElementById("part7"));
			p8Top    = findTop(document.getElementById("part8"));	
			if($("#c2").css("margin-top") == "200px" && dW <= 550){
				$("#c2").css("margin-top","0px");
			}			
			moveFBButton();
		}
		
		buildSite();
		
		/* MOVE ALL ELEMENTS TO THEIR PRE-ANIMATED LOCATIONS AND STATES */
		$("#h1").css("margin-top","0px");
		$("#c1").css("margin-bottom","0px");
		$("#girls").css("opacity","0");
		if(dW > 550){
			$("#c2").css("margin-top","200px");
		}
		if (!$.browser.msie  || $.browser.version >= 8){
			$("#c2").css("opacity","0");
		}
		$("#h3").css("opacity","0");
		$("#h4").css("margin-top","-100px");
		$("#h4").css("padding-bottom","100px");
		$("#c4").css("opacity","0");
		if (!$.browser.msie  || $.browser.version >= 9){
			$("#c4").css("margin-top","-400px");
			$("#c4").css("padding-bottom","445px");
		}
		$("#photo1").css("opacity","0");
		$("#photo2").css("opacity","0");
		$("#photo3").css("opacity","0");
		$("#photo4").css("opacity","0");
		$("#photo5").css("opacity","0");
		$("#photo6").css("opacity","0");
		$("#photo7").css("opacity","0");
		$("#photo8").css("opacity","0");
		$("#navigation").css("opacity","0");		
		if (!$.browser.msie  || $.browser.version >= 9){
			$("#left").css("opacity","0");
			$("#right").css("opacity","0");
		}
		if ($.browser.msie  && $.browser.version <= 8){
			$(".p").hide();
		}
		$("#p6photo").css("opacity", "0");
		$("#h6").css("top","20%");
		
		$("#h7").css("margin-top", "-200px");
		$("#h7").css("opacity","0");		
		if (!$.browser.msie  || $.browser.version >= 8){
			$("#c7").css("margin-top", "-400px");
			$("#c7").css("padding-bottom", "400px");
		}else{
			$("#c7").css("opacity","0");
		}
		$("#part8").css("margin-top","-164px");
		$("#part8").css("margin-bottom","164px");
		$("#part9").css("opacity","0");
		
		/* REFRESH CUFON IF THE WINDOW IS RESIZED AND THE DETECTOR ELEMENT HAS BEEN CHANGED */
		$(window).resize(function(){
			if(dW != $d.width()){
				dW = $d.width();
				Cufon.refresh();
			}
			buildSite();
		});
		
		/* WHEN SCROLLING, FIRE THE "MOVE" FUNCTION */
		$window.bind('scroll', function(){
			Move();
			
		});
		
		function Move(){
			/* GET THE AMOUN OF PX SCROLLED */
			var pos = $window.scrollTop();
			
			/* START ANIMATING ALL THE ELEMENTS DEPENDING ON THE SCROLLED DISTANCE */		
				// HEADER 1
				if ($.browser.msie  && $.browser.version <= 8){
					moveElement("h1", pos, p1Top+100, p1Top+wH-200,0,-450,"margin-bottom", "px");
				}else{
					moveElement("h1", pos, p1Top+100, p1Top+wH-300,0,-500,"margin-bottom", "px");
				}
				fadeElement("h1", pos, p1Top+200, p1Top+200, "out");
				// CONTENT 1
				if (!$.browser.msie  || $.browser.version >= 9){
					fadeElement("c1", pos, p1Top+200, p1Top+wH-300, "out");			
				}
				// IMAGE GIRLS
				fadeElement("girls", pos, girlsTop-wH+100, girlsTop-300, "in");
				// CONTENT 2
				if(dW > 550){
					moveElement("c2", pos, girlsTop-wH+300, girlsTop-100,200,0,"margin-top", "px");
					if (!$.browser.msie  || $.browser.version >= 8){
						fadeElement("c2", pos, girlsTop-wH+300, girlsTop-100, "in");
					}
				}
				else{
					if (!$.browser.msie  || $.browser.version >= 8){
						fadeElement("c2", pos, p1Top+100, p1Top+300, "in");
					}
				}
				// HEADER 3
				fadeElement("h3", pos, h3Top-wH+100, h3Top-wH+300, "in");
				// HEADER 4
				moveElement("h4", pos, p4Top-wH+20, p4Top-wH+300,-100,0,"margin-top", "px");
				moveElement("h4", pos, p4Top-wH+20, p4Top-wH+300,100,0,"padding-bottom", "px");
				// CONTENT 4
				if (!$.browser.msie  || $.browser.version >= 9){
					moveElement("c4", pos, p4Top-wH+100, p4Top-400,-400,0,"margin-top", "px");
					moveElement("c4", pos, p4Top-wH+100, p4Top-400,445,45,"padding-bottom", "px");					
				}
				fadeElement("c4", pos, p4Top-wH+100, p4Top-200, "in");
				// PHOTOS
				fadeElement("photo1", pos, p4Top-wH+400, h3Top-wH+550, "in");
				fadeElement("photo2", pos, p4Top-wH+450, h3Top-wH+600, "in");
				fadeElement("photo3", pos, p4Top-wH+500, h3Top-wH+650, "in");
				fadeElement("photo4", pos, p4Top-wH+550, h3Top-wH+700, "in");
				fadeElement("photo5", pos, p4Top-wH+600, h3Top-wH+750, "in");
				fadeElement("photo6", pos, p4Top-wH+650, h3Top-wH+800, "in");
				fadeElement("photo7", pos, p4Top-wH+700, h3Top-wH+850, "in");
				fadeElement("photo8", pos, p4Top-wH+750, h3Top-wH+900, "in");
				// NAVIGATION
				fadeElement("navigation", pos, navTop-wH, navTop-wH+150, "in");
				// PART 5
				if (!$.browser.msie  || $.browser.version >= 9){
					fadeElement("left", pos, p5Top-wH+200, p5Top-100,"in");
					fadeElement("right", pos, p5Top-wH+200, p5Top-100,"in");
				}
				// PART 6	
				moveElement("h6", pos, p6Top-wH+300, p6Top-wH+600,20,50,"top", "%");
				fadeElement("p6photo", pos, p6Top-wH+200, p6Top,"in");
				//PART 7
				moveElement("h7", pos, p7Top-wH+0, p7Top-wH+200,-200,0,"margin-top", "px");
				fadeElement("h7", pos, p7Top-wH+0, p7Top-wH+200, "in");				
				if (!$.browser.msie  || $.browser.version >= 8){
					moveElement("c7", pos, p7Top-wH+300, p7Top-wH+500,-400,0,"margin-top", "px");
					moveElement("c7", pos, p7Top-wH+300, p7Top-wH+500,400,0,"padding-bottom", "px");
				}
				fadeElement("c7", pos, p7Top-wH+300, p7Top-wH+500, "in");
				// PART 8
				moveElement("part8", pos, p7Top-400, p7Top-200,-164,0,"margin-top", "px");
				moveElement("part8", pos, p7Top-400, p7Top-200,164,0,"margin-bottom", "px");
				//PART 9			
				fadeElement("part9", pos, p7Top-200, p7Top, "in");
		}
		
		/* MOVE AN ELEMENT BASED ON THE SCROLL POSITION */
		function moveElement(id, curPos, startPos, endPos, startVal, endVal, prop, un ){
			if(curPos >= startPos && curPos <= endPos){		
				var newVal = Math.ceil(startVal+(((curPos - startPos) / (endPos-startPos) )*(endVal-startVal)));		
				$("#" + id).css(prop, newVal + un);
			}else if(curPos < startPos){
				$("#" + id).css(prop, startVal + un);
			}else if(curPos > endPos){
				$("#" + id).css(prop, endVal + un);
			}
		}
		
		/* FADE AN ELEMENT BASED ON THE SCROLL POSITION */
		function fadeElement(id, curPos, startPos, endPos, inOut ){
			if(inOut == "in"){
				if(curPos >= startPos && curPos <= endPos){		
					var newOp = (curPos - startPos) / (endPos-startPos);
					$("#" + id).css("opacity", newOp);
				}else if(curPos < startPos){			
					$("#" + id).css("opacity", 0);
					
				}else if(curPos > endPos){
					$("#" + id).css("opacity", 1);
				}
			}else{
				if(curPos >= startPos && curPos <= endPos){		
					var newOp =  1 - ((curPos - startPos) / (endPos-startPos));
					$("#" + id).css("opacity", newOp);
				}else if(curPos < startPos){			
					$("#" + id).css("opacity", 1);
					
				}else if(curPos > endPos){
					$("#" + id).css("opacity", 0);
				}
			}
		}
		
	}else{
		$("#container").show();	
		moveFBButton();
	}
});

window.onorientationchange = function(){
	moveFBButton();
}
function moveFBButton(){
	var cW = $("#container").width();
	var nT = (1280 - cW)/17 + 3;
	$("#facebook").css("top", nT + "px");	
}
/* FUNCTION USED TO FIND THE COMPLETE TOP OFFSET OF A CERTAIN ELEMENT */
function findTop(obj) {
	var curtop = 0;
	if (obj.offsetParent){
		do{
			curtop += obj.offsetTop;
		} 
		while (obj = obj.offsetParent);
		return curtop;
	}
}

function jumpTo(id){
	var tar = 0;
	var speed = 700;
	if(!isApple){
		if(id == "worship"){
			tar = p4Top + 50;
		}else if(id == "history"){
			tar = p5Top-40;
		}else if(id == "contact"){
			tar = p8Top-20;
		}else if(id == "start"){
			tar = p2Top;
			speed = 4000;
		}
	}else{
		if($("#detector").width() == 550){
			if(id == "worship"){
				tar = 1600;
			}else if(id == "history"){
				tar = 2700;
			}else if(id == "contact"){
				tar = 5115;
			}else if(id == "start"){
				tar = 800;
				speed = 4000;
			}
		}else{
			if(id == "worship"){
				tar = 1700;
			}else if(id == "history"){
				tar = 2650;
			}else if(id == "contact"){
				tar = 4550;
			}else if(id == "start"){
				tar = 800;
				speed = 4000;
			}

		}

	}
	$('html,body').animate({scrollTop: tar},speed);	
}

var curId = 0;

function showFoto(id){
	curId = id;
	nP = $("#path" + id).val();
	nI = document.createElement('img');
	
	if(isApple){
		$("#overlay").show();
		$("#imgHolder").show();
		$(window).scrollTop(0);	
		document.getElementById('imgHolder').appendChild(nI); 
	}else{
		$("#overlay").fadeIn();
		$("#imgHolder").hide();
		nI.onload = function() {
			$("#loader").fadeOut();
			document.getElementById('imgHolder').appendChild(nI); 
			$("#imgHolder").fadeIn(800);
		};
	}
	
	nI.src = nP;
	
}
function hideOverlay(){
	if(isApple){
		$(window).scrollTop(2100);		
		$("#overlay").hide();
		document.getElementById('imgHolder').innerHTML = "";
	}else{
		$("#overlay").fadeOut(500, function(){		
			document.getElementById('imgHolder').innerHTML = "";									
		});
	}
	
}
function prevFoto(){
	if(curId != 1){
		curId--;
	}else{
		curId = tI;
	}
	swapFoto(curId);
}
function nextFoto(){
	if(curId != tI){
		curId++;
	}else{
		curId = 1;
	};
	swapFoto(curId);
}
function swapFoto(id){
	nP = $("#path" + id).val();
	nI = document.createElement('img');
	$("#smallLoader").fadeIn();
	nI.onload = function() {
		document.getElementById('imgHolder').innerHTML = "";
		$("#smallLoader").hide();
		document.getElementById('imgHolder').appendChild(nI); 	
		
	};
	nI.src = nP;
}


var formValid = true;
var emailValid = false;
var dataForm = "";

function submitForm(){					
	formValid = true;
	var inputs = $("#contactForm").find("input");
	for( i=0; i < inputs.length; i++){
		if(inputs[i].name != "tel"){
			if(inputs[i].value == ""){
				formValid = false;
				document.getElementById(inputs[i].name).className = "error";
				$("#" + inputs[i].name + "-error").fadeIn();
			}else{
				dataForm += inputs[i].name + "=" + encodeURIComponent(inputs[i].value) + "&";		
			}
		}else{
			dataForm += inputs[i].name + "=" + encodeURIComponent(inputs[i].value) + "&";	
		}
	}
	if(document.getElementById("bericht").value == ""){
		document.getElementById("bericht").className = "error";
		$("#bericht-error").fadeIn();
		formValid = false;
	}else{
		dataForm += "bericht=" + encodeURIComponent(document.getElementById("bericht").value);		
	}
	if(emailValid && formValid){
		if (window.XMLHttpRequest)
		{
			xmlhttp=new XMLHttpRequest();
		}
		else
		{
			xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
		}		
		xmlhttp.onreadystatechange=function(){
			if (xmlhttp.readyState==4 && xmlhttp.status==200)
			{
				if(xmlhttp.responseText != ""){
					if(xmlhttp.responseText == "mail verzonden"){
						$("#contactForm").fadeOut(500, function(){
								$("#contactForm").show();
								$("#contactForm").css("visibility", "hidden");
								document.getElementById("contactForm").reset();	
						});
						$("#contactSuccess").fadeIn();
					}else{
						alert(xmlhttp.responseText);
					}
				}
			}
		}	
		xmlhttp.open("GET","../../inc/functions/sendMail.php?"+dataForm,true);
		xmlhttp.send();
	}
}


$("#email").blur(function(){
	var regex = /^([a-zA-Z0-9_\.\-\+])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
	if(!regex.test(this.value)){
		this.className = "error";
		$("#email-error").fadeIn();
		emailValid = false;
	}
	else{
		this.className = "";
		$("#email-error").css("display","none");
		emailValid = true;
	}
});

$("#naam").blur(function(){
	if(this.value == ""){
		this.className = "error";
		$("#naam-error").fadeIn();
	}else{
		this.className = "";
		$("#naam-error").css("display","none");
	}
});

$("#adres").blur(function(){
	if(this.value == ""){
		this.className = "error";
		$("#adres-error").fadeIn();
	}else{
		this.className = "";
		$("#adres-error").css("display","none");
	}
});

$("#bericht").blur(function(){
	if(this.value == ""){
		this.className = "error";
		$("#bericht-error").fadeIn();
	}else{
		this.className = "";
		$("#bericht-error").css("display","none");
	}
});
