// Jquery Functions
	// © Copyright Jorick Wassink
	
	$(document).ready(function() {
		
		/* $(html).removeAttr('sizset'); */
		
		$("#projects .hide ").hide();
		/***************/
		/* Define Vars */
		/***************/
		var bgBtn		 = $('.header .nav .bgBtn');
		var add			 = "";
		var close		 = $('.close');
		var screenOn	 = false;
		var w			 = {};
		var elementsIn   = true;
		var activeSlide  = 1;
		var numbOfSlides = $("#projects").find('.slide').length;
		var lastCheck	 = numbOfSlides+1;
		var active;
		var activeOffset;
		var activeWidth;
		var mLeft;
		var navitem;
		var screen;
		var interval;
		var thisUrl;
		 
		w.width  = parseInt($(window).width()); 
		w.height = parseInt($(window).height());
		
		var animate		= $('#projects').attr('animate');
		
					
		
		/**********************/
		/* GET URL PARAMETERS */
		/**********************/
		var vars = [], hash;
		var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('/');
		for(var i = 0; i < hashes.length; i++){
			hash = hashes[i].split('=');
		    vars.push(hash[0]);
		    vars[hash[0]] = hash[1];
		}
		
		thisUrl = vars[3];
		
		
		
					
					
		/****************/
		/* Animate Menu */
		/****************/
		setTimeout( function(){ 
			
			active = $(".nav ul li.active");
			activeOffset = active.offset();
			activeWidth  = (active.width()) + 50;
			mLeft = (activeOffset.left) - 4;
			
			bgBtn.css({'margin-left': mLeft, 'width': activeWidth});
			bgBtn.animate({ 'opacity': 1 }, 1500);
			
		}, 1000);
		
		$(".nav ul li").mouseover(function(){
			navitem = $(this);

			itemOffset = navitem.offset();
			itemWidth  = (navitem.width()) + 50;
			
			mLeftNew = (itemOffset.left) - 5;
			
			bgBtn.animate({'margin-left': mLeftNew}, {duration: 800, easing: "easeOutBack", queue: false});
			bgBtn.animate({'width': itemWidth}, {duration: 300, easing: "easeOutBack", queue: false});
		});
		
		$(".nav").mouseleave(function(){
			
			bgBtn.animate({'margin-left': mLeft}, {duration: 800, easing: "easeOutBack", queue: false});
			bgBtn.animate({'width': activeWidth}, {duration: 300, easing: "easeOutBack", queue: false});
			
		});
		
		$(window).resize(function(){
			
			activeOffset = active.offset();
			activeWidth  = (active.width()) + 50;
			
			mLeft = (activeOffset.left) - 5;
			
			setTimeout( function(){ bgBtn.css({'margin-left': mLeft, 'width': activeWidth}, 0) }, 00);
			
		});
		
		
		
		
		
		
		
		
		
		if(thisUrl == "portfolio"){
		
		
				/******************/
				/* Control Screen */
				/******************/
				
				
				$('.grid').mouseenter(function(){
					img    = $(this).find('img');
					imgCls = img.parent().parent().parent().parent().parent().attr('class');
					
					if(imgCls == 'item open'){
						img.parent().parent().find('.overOpen').show();
						img.parent().animate({'height': "115px"},{duration: 200, queue: false, easing: 'easeInOutCirc'});
					}
					else{
						img.parent().parent().find('.overClosed').show();
						img.parent().animate({'height': "115px"},{duration: 200, queue: false, easing: 'easeInOutCirc'});
					}
				});
				
				$('.grid').mouseleave(function(){
					
					img    = $(this).find('img');
					
					img.parent().animate({'height': "150px"},{duration: 200, queue: false, easing: 'easeInOutCirc', complete: function(){
						$(this).parent().find('.overlay').hide();
					}});
					
				});
				
				$('.grid').click(function(){
					img    = $(this).find('img');
					imgSrc = img.attr('src');
					imgCls = img.parent().parent().parent().parent().parent().attr('class');
					imgItem = img.parent().parent().parent().parent().parent().attr('item');
					screen = $('#screen');
					
					
					if(imgCls == 'item open'){
						screenOn = true;
						$("html").css({'overflow': "hidden"});
						
						add = "<img src=\""+imgSrc+"\" class=\"imgLarge\"/>";
						
						
						screen.append(add);
						
						screen.show().animate({opacity : 1}, 400);
						img = screen.find('img');
						
						marginTop = $(window).scrollTop();
						img.css({'margin-top': 50+marginTop});
						
						margBtn  = img.offset();
						imgWidth = img.width();
						marginLeft = (margBtn.left+imgWidth)-60;
						close.css({'margin-top': (margBtn.top), 'margin-left': marginLeft});
					} else {
						
						thisRow = Math.ceil((imgItem/3));
						
						open = $('.overview').find('.open');
						jQuery.each(open, function(){
							$(this).find("ul li.infotext").animate({'height': "0px"}, 500);
							$(this).animate({'height': "180px"}, 500);
							$(this).switchClass("open", "closed", 0);
						});
						
						allLi = $('.overview').find('li');
						jQuery.each(allLi, function(){
							if( $(this).attr('row') == thisRow){
								$(this).switchClass("closed", "open", 300);
								$(this).animate({'height': "380px"}, 400);
								$(this).find("ul li.infotext").animate({'height': "240px"}, 500);
							}
						});
						
						
					}
					
				});
				
				
				$('#screen').click(function(){
					$('#screen').animate({opacity : 0}, {duration: 500, complete: function(){
						$(this).hide();
						$(this).find('img').remove();
						
						$("html").css({'overflow': "auto"});
						screenOn = false;
					}});
				});

		} //END CONTROL SCREEN 

		
		
		
		
		
		
		
		
		
		/**********************************/
		/* Set & Reset value input fields */
		/**********************************/
		
		$('input[title]').each(function(i){
			if($(this).attr('value')==''){
				$(this).attr('value',$(this).attr('title'));
			}
			$(this).focus(function(){
				
				$(this).addClass("inFi");
				
				if($(this).attr('value') == $(this).attr('title')) {
					$(this).attr('value','');
				}
				
			});
			$(this).blur(function(){
				
				$(this).removeClass('inFi');
				
				if($(this).attr('value') == '') {
					$(this).attr('value',$(this).attr('title'));
				}
			});
		});
		
		
		$('textarea[title]').each(function(i){
			if($(this).val()==''){
				$(this).attr('value',$(this).attr('title'));
			}
			$(this).focus(function(){
				$(this).addClass("inFi");
				if($(this).attr('value') == $(this).attr('title')) {
					$(this).attr('value','');
				}
			});
			$(this).blur(function(){
				$(this).removeClass("inFi");
				if($(this).attr('value') == '') {
					$(this).attr('value',$(this).attr('title'));
				}
			});
		});
		
		
		
		
		
		
		
		
		
		
		/*****************/
		/* Animate Quote */
		/*****************/
		/*	$('#quote').mouseenter(function(){
				$(this).animate({'height' : "110px"}, {duration: 500, easing: 'easeOutBounce'});
			});
			
			$('#quote').mouseleave(function(){
				$(this).animate({'height' : "100px"}, {duration: 500, easing: 'easeOutBounce'});
			});
			
			$('#quote').click(function(){
				$("#details").show({duration: 500});
				$(this).animate({'height' : "670px"}, {duration: 500, easing: 'easeOutBounce'});
			});				
		*
		
		
		
		
		
		
		
		/*******************/
		/* Animate LikeBox */
		/*******************/
		var LikeBox = $('#likeBox');
		setTimeout( function(){ LikeBox.animate({'opacity' : 1}, {duration: 500, easing:'linear', queue: false}) }, 500);
		
		LikeBox.mouseenter( function(){
			LikeBox.animate({'margin-left' : "-30px"}, {duration: 500, easing:'easeOutBounce', queue: false});
		});
		
		LikeBox.mouseleave( function(){
			setTimeout( function(){ LikeBox.animate({'margin-left' : "-180px"}, {duration: 500, easing:'easeOutBounce', queue: false})}, 500);
		});
		
		
		
		
		
		
		
		
		
		/******************/
		/* When Scrolling */
		/******************/
		
		$(window).scroll(function(){
			var scrolling = $(window).scrollTop();
			
			topMargin = 150+(scrolling);
			LikeBox.animate({'margin-top' : topMargin}, {duration: 500, easing:'easeInOutQuint', queue: false});
			
			if( thisUrl == "wie-ik-ben" ){
				if(scrolling >= 610){
					
					time = 1000;
					$("#timeline .item").each(function(){
						var item = $(this);
						setTimeout(function(){ item.animate({'margin-left': "5px"}, {duration: 1000, easing: 'easeOutExpo'});}, time)
						
						time = time+200;
					});
					
				}
			}
		});
		
		
		
		
		
		
		
		if( thisUrl == "" ){
				var e0n = $("#slide"+nextSlide+" .definition"); 
				var e0n; var e1n; var e2n; var e3n; var e4n; var e5n; var e6n 
				
				var e1p; var e2p; var e3p; var e4p; var e5p; var e6p;
				
				var oMn1; var oMn2; var oMn3; var oMn4; var oMn5; var oMn6;
				
				var e1pMl; var e2pMl; var e3pMl; var e4pMl; var e5pMl; var e6pMl;
				
				var oMn1; var oMn2; var oMn3; var oMn4; var oMn5; var oMn6;
				
				var nextSlide;
				var prevSlide;
				var pEffect;
				var pEffectOut;
				var interInt;
				var elementsIn;
				
				
				/*********************/
				/* Slide in Projects */
				/*********************/
				
				if(animate == 'true'){
					//Parallax effect
					pEffect    = "easeInOutQuint"; 
					pEffectOut = "easeInExpo";
					
					interInt = 7000; 
					
					
					
					// Define Elements
					var e0t = $("#slide" + activeSlide + " .definition"); 
					var e1t = $("#slide" + activeSlide + " #element1"); 
					var e2t = $("#slide" + activeSlide + " #element2"); 
					var e3t = $("#slide" + activeSlide + " #element3"); 
					var e4t = $("#slide" + activeSlide + " #element4"); 
					var e5t = $("#slide" + activeSlide + " #element5"); 
					var e6t = $("#slide" + activeSlide + " #element6"); 
					
					var oMe1 = parseInt( e1t.css('margin-left') );
					var oMe2 = parseInt( e2t.css('margin-left') );
					var oMe3 = parseInt( e3t.css('margin-left') );
					var oMe4 = parseInt( e4t.css('margin-left') );
					var oMe5 = parseInt( e5t.css('margin-left') );
					var oMe6 = parseInt( e6t.css('margin-left') );
					
					e0t.css({"opacity": 0});
					e1t.css({'margin-left': w.width/2, 'opacity': 0});
					e2t.css({'margin-left': w.width*2, 'opacity': 0});
					e3t.css({'margin-left': w.width*6, 'opacity': 0});
					e4t.css({'margin-left': w.width*12, 'opacity': 0});
					e5t.css({'margin-left': w.width*20, 'opacity': 0});
					e6t.css({'margin-left': w.width*30, 'opacity': 0});
					
					setTimeout( function(){
						e0t.parent().css({"z-index": '99'});
						e0t.parent().css({'opacity': 1});
						e0t.animate({'opacity': 1},{duration: 1300, easing: pEffect});
						e1t.animate({'margin-left': oMe1, 'opacity': 1},{duration: 1300, easing: pEffect});
						e2t.animate({'margin-left': oMe2, 'opacity': 1},{duration: 1300, easing: pEffect, complete: function(){
							elementsIn = false;
							activeSlide++;
						}});
						e3t.animate({'margin-left': oMe3, 'opacity': 1},{duration: 1200, easing: pEffect});
						e4t.animate({'margin-left': oMe4, 'opacity': 1},{duration: 1100, easing: pEffect});
						e5t.animate({'margin-left': oMe5, 'opacity': 1},{duration:  900, easing: pEffect});
						e6t.animate({'margin-left': oMe6, 'opacity': 1},{duration: 1300, easing: pEffect});
					}, 1000);
					
					
					
					interval = setInterval(function(){
						
						elementsIn = true;
						
						if(activeSlide == lastCheck){
							nextSlide = 1;
							prevSlide = numbOfSlides;
							activeSlide = 1;
						} else{
							nextSlide  = activeSlide;
							prevSlide  = activeSlide-1
						}
						
						var x = 1000;
						
						e0n = $("#slide"+nextSlide+" .definition"); 
						e1n = $("#slide"+nextSlide+" #element1"); 
						e2n = $("#slide"+nextSlide+" #element2"); 
						e3n = $("#slide"+nextSlide+" #element3"); 
						e4n = $("#slide"+nextSlide+" #element4"); 
						e5n = $("#slide"+nextSlide+" #element5"); 
						e6n = $("#slide"+nextSlide+" #element6"); 
						
						e1p = $("#slide"+prevSlide+" #element1"); 
						e2p = $("#slide"+prevSlide+" #element2"); 
						e3p = $("#slide"+prevSlide+" #element3"); 
						e4p = $("#slide"+prevSlide+" #element4"); 
						e5p = $("#slide"+prevSlide+" #element5"); 
						e6p = $("#slide"+prevSlide+" #element6"); 
						
						e1pMl = parseInt( e1p.css('margin-left') );
						e2pMl = parseInt( e2p.css('margin-left') );
						e3pMl = parseInt( e3p.css('margin-left') );
						e4pMl = parseInt( e4p.css('margin-left') );
						e5pMl = parseInt( e5p.css('margin-left') );
						e6pMl = parseInt( e6p.css('margin-left') );
						
						$("#slide"+prevSlide+" .definition").animate({'opacity': 0},{duration: (1.1*x), easing: pEffectOut});
						e1p.animate({'margin-left': -w.width},{duration: (1.1*x), easing: pEffectOut, complete: function(){ $(this).css({'opacity': 0, 'margin-left': e1pMl}) }});
						e2p.animate({'margin-left': -w.width},{duration: (1.1*x), easing: pEffectOut, complete: function(){ $(this).css({'opacity': 0, 'margin-left': e2pMl}) }});
						e3p.animate({'margin-left': -w.width},{duration: (1.2*x), easing: pEffectOut, complete: function(){ $(this).css({'opacity': 0, 'margin-left': e3pMl}) }});
						e4p.animate({'margin-left': -w.width},{duration: (1.4*x), easing: pEffectOut, complete: function(){ $(this).css({'opacity': 0, 'margin-left': e4pMl}) }});
						e5p.animate({'margin-left': -w.width},{duration: (1.2*x), easing: pEffectOut, complete: function(){ $(this).css({'opacity': 0, 'margin-left': e5pMl}) }});
						e6p.animate({'margin-left': -w.width},{duration: (1.6*x), easing: pEffectOut, complete: function(){ $(this).css({'opacity': 0, 'margin-left': e6pMl}) }});
						
						
						oMn1 = parseInt( e1n.css('margin-left') );
						oMn2 = parseInt( e2n.css('margin-left') );
						oMn3 = parseInt( e3n.css('margin-left') );
						oMn4 = parseInt( e4n.css('margin-left') );
						oMn5 = parseInt( e5n.css('margin-left') );
						oMn6 = parseInt( e6n.css('margin-left') );	
						
						e0n.css({'opacity': 0})
						e1n.css({'margin-left': w.width/2, 'opacity': 0})
						e2n.css({'margin-left': w.width*2, 'opacity': 0})
						e3n.css({'margin-left': w.width*6, 'opacity': 0})
						e4n.css({'margin-left': w.width*12, 'opacity': 0})
						e5n.css({'margin-left': w.width*20, 'opacity': 0})
						e6n.css({'margin-left': w.width*30, 'opacity': 0})
						
							
							
						
						//Slide In Next
						setTimeout(function(){
							e0n.parent().show();
							e0n.parent().css({"z-index": '99'});
							e0n.parent().css({'opacity': 1});
							e0n.animate({'opacity': 1},{duration: 2000, easing: pEffect});
							e1n.animate({'margin-left': oMn1, 'opacity': 1},{duration: 1300, easing: pEffect});
							e2n.animate({'margin-left': oMn2, 'opacity': 1},{duration: 1300, easing: pEffect, complete: function(){
								elementsIn = false;
								activeSlide++;
								interInt = 7000;
							}});
							e3n.animate({'margin-left': oMn3, 'opacity': 1},{duration: 1200, easing: pEffect});
							e4n.animate({'margin-left': oMn4, 'opacity': 1},{duration: 1100, easing: pEffect});
							e5n.animate({'margin-left': oMn5, 'opacity': 1},{duration:  900, easing: pEffect});
							e6n.animate({'margin-left': oMn6, 'opacity': 1},{duration: 1300, easing: pEffect});
							
						}, 700);
						
					}, interInt);
					
					
					
					
					/*
		$("html").mousemove(function(e){
						
						pageX = e.pageX - (w.width / 2);
						
						eX1 = oMe1-(pageX/50);
						eX2 = oMe2-(pageX/70);
						eX3 = oMe3-(pageX/50);
						eX4 = oMe4-(pageX/30);
						eX5 = oMe5-(pageX/20);
						eX6 = oMe6-(pageX/100);
			
						if(elementsIn == false){
							e1t.css({ 'margin-left' : eX1 })
							e2t.css({ 'margin-left' : eX2 })
							e3t.css({ 'margin-left' : eX3 })
							e4t.css({ 'margin-left' : eX4 })
							e5t.css({ 'margin-left' : eX5 })
							e6t.css({ 'margin-left' : eX6 })
						}
					});
		*/
				} }
		
		
		
		
		
		
		
		
		
		
		
		/************************/
		/* Animate Footer Icons */
		/************************/
		$("#block4 .icon").click( function(){
			nextEl = $(this).next("li");
			if(nextEl.is(":visible")){
				nextEl.hide("slide", {}, 200);
			} else{
				if( $("#block4 .url").is(":visible") ){
					$("#block4 .url:visible").hide("slide", {duration:200, complete: function(){
						nextEl.show("slide", {}, 200);
					}});
				}
				else{
					nextEl.show("slide", {}, 200);
				}
			}
		});
		
		$("#block4 .icon, #block2 .icon, #contentIcons .icon").mouseenter( function(){
			$(this).animate({'margin-top': "-5px"},{duration: 100, easing: "linear"});
		});
		
		$("#block4 .icon, #block2 .icon, #contentIcons .icon").mouseleave( function(){
			$(this).animate({'margin-top': "0px"},{duration: 100, easing: "easeOutElastic"});
		});
		
		
		
		
		
		
		
		
		
		
		/*************************/
		/* Onclick Submit Button */
		/*************************/
		if(thisUrl == "contact"){
			$('.submit').mousedown(function(){  $(this).switchClass("submit", "submitClick", 0)  });
			$('.submit').mouseup(function(){  $(this).switchClass("submitClick", "submit", 0)  });
		}
		
		
		
		
		
		
		
		/***************/
		/* Hover Likes */
		/***************/
		if(thisUrl == "wie-ik-ben"){
			var resetTxt;
			var info;
			var txt
			$('#ilike .overlay').mouseover(function(){
				
				clearTimeout(resetTxt);
				txt = $(this).attr('like');
				$("#ilike #text").text("i like " + txt );
				
			});
			
			$('#ilike .overlay').mouseout(function(){
				
				resetTxt = setTimeout( function(){ $("#ilike #text").text("things that i like" ); }, 2000 );
				
			});
			
			$("#timeline .item").mouseover(function(){
				info = $(this).attr("info");
				
				$('#info').text( info );
			});
		}
		
		
		
		
		/******************/
		/* Twitter Plugin */
		/******************/
		
		$(".tweet").tweet({
			username: "jorickwassinknl",
			avatar_size: 0,
			count: 3,
			loading_text: "loading tweets...",
			template: "{text}"
		});
		
		setTimeout( function(){ $(".tweet_list li").eq(0).show("fade", {}, 500) }, 800);
		
		var countTw = 0;
		setInterval(function(){
			thisTw = countTw;
			nextTw = countTw+1;
			
			if(countTw <= 1){
				
				$(".tweet_list li").eq(thisTw).hide("fade", {}, 500, function(){
					$(".tweet_list li").eq(nextTw).show("fade", {}, 500);
				});
				
				countTw++;
			} else{
				$(".tweet_list li").eq(thisTw).hide("fade", {}, 500, function(){
					$(".tweet_list li").eq(0).show("fade", {}, 500);
				});
				
				countTw = 0;
				
			}
			
		}, 6000);

		
		
		
		
		
		/***************************/
		/* KeyDown Nummeric fields */
		/***************************/
		var shiftDown;
		
		$(".onlyNumb").keydown(function(event) {
	        
	        //alert(event.keyCode);
	        	        
	        // Allow only backspace and delete
	        if ( event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 187 || event.keyCode == 9) {
	            
	        }
	        else {
	            // Ensure that it is a number and stop the keypress
	            if ((event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105 )) {
	                event.preventDefault(); 
	            }   
        	}
   		});
   		
   		$(".onlyNumb").keyup(function(event) {
   			
   			if(event.keyCode == 16){
   				shiftDown = false;
   			}
   		});
   		
   		
   		
   		
   		/*************************/
   		/* Animate Notifications */
   		/*************************/
   		setTimeout( function(){ 
   			$("#content .notification.true").show("fade", {}, 1000, function(){ 
	   			setTimeout( function(){ 
	   				$("#content .notification.true").hide("fade", {}, 1500)
	   			}, 7000)
   			})
   		}, 1000);
   		
   		
   		
   });