// set standard easing
jQuery.easing.def = "easeInOutExpo";

var base_path;

$(document).ready(function(){
  
 	base_path = $("body").attr("data-base-path");
  
  	// height of the window
	updateHeightOfComponents();
	
	// when user resizes the window
	$(window).resize(function()
	{
		// height of the window
		updateHeightOfComponents();
	});

	//update navigation
	updateNav();
	
  	//initSliders
	initSliders();

	//event aan de klik meer werk koppelen
	$(".more").click(function(){showMoreWork()});

	checkScrolling();
	
	//check of er in de hash een pagina meegegeven wordt
	$.localScroll.hash();
	
	//indien er een hash is de navigatie update
	if (window.location.hash) {
	  trigger({ id : window.location.hash.substr(1)});
	} else {
	  $('#slider .navigation a:first').click();
	}
	//nav scrolling
	$.localScroll({easing: 'easeInOutExpo', offset:0, hash: true, lazy: true, queue: false});
	
	
	
	
	// go find the navigation link that has this target and select the nav
	function trigger(data) {
	  var el = $('nav').find('a[href$="' + data.id + '"]').get(0);
	  setActiveItem(el);
	}
	


	//init formulier
	initform();
	
	
	$(".logo").css("-moz-transform","scale(1)");
	$(".logo").css("-webkit-transform","scale(1)");
	$(".logo").css("transform","scale(1)");
	
});

////////////////////////////////////////////////////////////////
// highlite selected nav item
///////////////////////////////////////////////////////////////

function updateNav(){

	//nav selected item setten
	$("nav a").each(function(){
		
		$(this).click(function(){
			
			//setActiveItem(this);

		});
		
	});
}


function setActiveItem(activeItem){
	
	$("nav a").each(function(){
		
		$(this).removeClass("active");
		
	});
	
	$(activeItem).addClass("active");
	
	//tweento($(activeItem).attr("href"));
}

////////////////////////////////////////////////////////////////
// positioning components + updating navigation
///////////////////////////////////////////////////////////////

//onderdelen de hoogte geven van het scherm

function updateHeightOfComponents(){
  
	var ids = new Array("#work","#about","#contact");
	
	for(i=0; i < ids.length; i++)
	{
	  
		//console.log(ids[i]);
	  
		if($(ids[i]).height() < window.innerHeight)
			$(ids[i]).css('height',window.innerHeight); // de padding
	}
}



function checkScrolling(){
	
	$(window).scroll(function () { 
	 
		var scrollY = $(window).scrollTop() +30; // de padding
	 	
		var workOffset =$("#work").offset();
		var aboutOffset = $("#about").offset();
		var contactOffset =  $("#contact").offset();
	 	
		var EXTRA_OFFSET = 30;
	 	//console.log(scrollY + " work y: " + workOffset.top);
		if(workOffset.top >= scrollY + EXTRA_OFFSET){
			setActiveItem("#homeBtn");
			updateNavStyle(false);
		}else if(workOffset.top <= scrollY && aboutOffset.top >= scrollY + EXTRA_OFFSET){
			setActiveItem("#workBtn");
			updateNavStyle(true);
		}else if(aboutOffset.top <= scrollY && contactOffset.top >= scrollY + EXTRA_OFFSET){
			setActiveItem("#aboutBtn");
			updateNavStyle(false);
		}else if(contactOffset.top <= scrollY + EXTRA_OFFSET){
			setActiveItem("#contactBtn");
			updateNavStyle(true);
		}
		
		//scrolling effectje op de homepage
		$(".logo").css({"top": 120 - (scrollY/1.5) });
		$("#foreword").css({"top": 120 - (scrollY/2) });
		
	});
}

function updateNavStyle(onDark){
	
	//console.log("color: " + onDark);
	if(onDark)
		$("nav").addClass("onDark");
	else
		$("nav").removeClass("onDark");
	/*
	$("nav a").each(function(index){
		
		if(onDark)
			$(this).addClass("onDark");
		else
			$(this).removeClass("onDark");
	});*/
	
}

function tweento(item){
	 var offset = $(item).offset();
	 
	$("body").animate({scrollTop:offset.top}, 500);
}


////////////////////////////////////////////////////////////////
// Work More Items +  Sliders + zebrastriping
///////////////////////////////////////////////////////////////

var addedJobs = [];

var counter = 3;

function showMoreWork(){
	
	counter += 2;
	
	var tekst = base_path+ "/job/" + (String) (counter);
	
	//console.log(tekst);
	
	$.get(tekst, function(data) {
		
		if(data != ""){
			$('.more').before(data);
		}else{
			$('.more').empty().append("<a href='javascript:void(0);' class='thatsIt'>thats all for now folks!</a>");
		}
		
		initSliders();
	});
}


function initSliders(){
	
	//console.log("sliders");
	
	$("#work figure").each(function(i){
		
		//console.log(i);
		
		$(this).easySlider({
			auto: false,
			continuous: true,
			nextId: "prev"+i,
			prevId: "next"+i,
			prevText:"",
			nextText:""
		});
		
	});
	
		
	$(".item span[id*='prev']").addClass("previous");
	$(".item span[id*='next']").addClass("next"); 

	$("#work .item a").each(function(){
		$(this).hover(function(){
			$(this).stop().animate({opacity: 1} ,500, 'easeOutExpo');
			},function(){
			$(this).stop().animate({opacity: 0} ,500, 'easeOutExpo');
		});    
	}); 
	
	$("#work .item:nth-child(2n+1)").addClass("stripe"); 
	//if(!$("#work .item").hasClass("animate"))
		//$("#work .item").addClass("animate");	
}

////////////////////////////////////////////////////////////////
// Contact
///////////////////////////////////////////////////////////////

function initform(){


initplaceholder();

$('#submit').click(function() {
	$("#contactForm").submit();
});


$("#contactForm").validate({
	
	
	submitHandler: function(form) {

		$("form").hide();
		$('#sending').show();
		//var dataString = 'name';  
		
		$.ajax({  
				type: "POST",  
				url: base_path + "/sendForm/",  
				data: $("#contactForm").serialize(),  
				success: function(data) { 
					$('#sending').hide();
					$('#thxforcontact').show();
					
				 }  
			}  
	);return false;
	},
	
	  invalidHandler: function(form, validator) {
	  var errors = validator.numberOfInvalids();
		 
	  if (errors) {	
			$("p.errorfield").show();
		} else {
			$("p.errorfield").hide();
		}
		
		},	errorPlacement: function(error, element) {
			$(element).addClass("error");
			//console.log(element);
		}
	});

}

function initplaceholder(){
	
	if(!Modernizr.input.placeholder){
	
		$('[placeholder]').focus(function() {
		  var input = $(this);
		  if (input.val() == input.attr('placeholder')) {
			input.val('');
			input.removeClass('placeholder');
		  }
		}).blur(function() {
		  var input = $(this);
		  if (input.val() == '' || input.val() == input.attr('placeholder')) {
			input.addClass('placeholder');
			input.val(input.attr('placeholder'));
		  }
		}).blur();
		$('[placeholder]').parents('form').submit(function() {
		  $(this).find('[placeholder]').each(function() {
			var input = $(this);
			if (input.val() == input.attr('placeholder')) {
			  input.val('');
			}
		  })
		});
	
	}
}

/*************************************************************
	extraatjes
*************************************************************/
/*
// Set-up to use getMouseXY function onMouseMove
document.onmousemove = getMouseXY;

// Temporary variables to hold mouse x-y pos.s
var tempX = 0

var middle = window.innerWidth/2;

// Main function to retrieve mouse x-y pos.s

function getMouseXY(e) {
  
    tempX = e.pageX

 
  // catch possible negative values in NS4
  if (tempX < 0){tempX = 0}

  if(tempX <= middle) {
	 console.log("smaller");
	  updateAccordeon(-(tempX/5))
  }else{
	 updateAccordeon(tempX/5)
  }
}


function updateAccordeon(teller){

	$(".logo").css("-moz-transform", "translateY("+teller +")");
	$(".logo").css("-webkit-transform", "translateY("+teller +")");

}*/