/*
JavaScript for the demo: Recreating the Nikebetterworld.com Parallax Demo
Demo: Recreating the Nikebetterworld.com Parallax Demo
Author: Ian Lunn
Author URL: http://www.ianlunn.co.uk/
Demo URL: http://www.ianlunn.co.uk/demos/recreate-nikebetterworld-parallax/
Tutorial URL: http://www.ianlunn.co.uk/blog/code-tutorials/recreate-nikebetterworld-parallax/

License: http://creativecommons.org/licenses/by-sa/3.0/ (Attribution Share Alike). Please attribute work to Ian Lunn simply by leaving these comments in the source code or if you'd prefer, place a link on your website to http://www.ianlunn.co.uk/.

Dual licensed under the MIT and GPL licenses:
http://www.opensource.org/licenses/mit-license.php
http://www.gnu.org/licenses/gpl.html
*/

$(document).ready(function() { //when the document is ready...


	//save selectors as variables to increase performance
	var $window = $(window);
	var $firstBG = $('#index');
	var $secondBG = $('#apresentacao');
	var doutor = $("#apresentacao .bg");
	var $thirdBG = $('#orgaos-sociais');
	var $fourthBG = $('#legislacao');
	var pipeta = $("#legislacao .bg");
	var $fifthBG = $('#tornese-socio');
	var $beneficios = $('#beneficios');
	var $sixthBG = $('#revista');
	var $seventhBG = $('#contactos');
	var $historialBG = $('#historial');
	var $planoBG = $('#plano-actividades');
	var mao = $("#plano-actividades .bg");
	var $protocolosBG = $('#protocolos');
	var $estatutosBG = $('#estatutos');
	var petri = $("#estatutos .bg");
	var $reginternoBG = $('#reginterno');
	var $associadosBG = $('#associados');
	var $linksuteisBG = $('#linksuteis');
	
	
	var windowHeight = $window.height(); //get the height of the window
	
	
	//apply the class "inview" to a section that is in the viewport
	$('#index, #apresentacao, #orgaos-sociais, #legislacao,#tornese-socio, #beneficios, #revista, #contactos, #historial, #plano-actividades, #protocolos, #estatutos, #reginterno, #linksuteis, #associados ').bind('inview', function (event, visible) {
			if (visible == true) {
			$(this).addClass("inview");
			} else {
			$(this).removeClass("inview");
			}
		});
	
			
	//function that places the navigation in the center of the window
	function RepositionNav(){
		var windowHeight = $window.height(); //get the height of the window
		var navHeight = $('#nav').height() / 2;
		var windowCenter = (windowHeight / 2); 
		var newtop = windowCenter - navHeight;
		$('#nav').css({"top": newtop}); //set the new top position of the navigation list
	}
	
	//function that is called for every pixel the user scrolls. Determines the position of the background
	/*arguments: 
		x = horizontal position of background
		windowHeight = height of the viewport
		pos = position of the scrollbar
		adjuster = adjust the position of the background
		inertia = how fast the background moves in relation to scrolling
	*/
	function newPos(x, windowHeight, pos, adjuster, inertia){
		return x + "% " + (-((windowHeight + pos) - adjuster) * inertia)  + "px";
	}
	
	//function to be called whenever the window is scrolled or resized
	function Move(){ 
		var pos = $window.scrollTop(); //position of the scrollbar

		//if the first section is in view...
		if($firstBG.hasClass("inview")){
			//call the newPos function and change the background position
			$firstBG.css({'backgroundPosition': newPos(100, windowHeight, pos, 1140, -1)}); 
		}
		
		//if the second section is in view...
		if($secondBG.hasClass("inview")){
			//call the newPos function and change the background position
			$secondBG.css({'backgroundPosition': newPos(50, windowHeight, pos, 1000, 0.2)});
			//call the newPos function and change the secnond background position
			doutor.css({'backgroundPosition': newPos(50, windowHeight, pos, 1000, 0.2)});
		}
		
		//if the third section is in view...
		if($historialBG.hasClass("inview")){
			//call the newPos function and change the background position
			$historialBG.css({'backgroundPosition': newPos(0, windowHeight, pos, 2090, 0.35)});
		}
		
		//if the second section is in view...
		if($planoBG.hasClass("inview")){
			//call the newPos function and change the background position
			$planoBG.css({'backgroundPosition': newPos(60, windowHeight, pos, 1800, 0.06)});
			//call the newPos function and change the secnond background position
			mao.css({'backgroundPosition': newPos(100, windowHeight, pos, 5800, 0.18)});
		}
		
		//if the third section is in view...
		if($protocolosBG.hasClass("inview")){
			//call the newPos function and change the background position
			$protocolosBG.css({'backgroundPosition': newPos(10, windowHeight, pos, 3800, 0.10)});
		}
		
		//if the third section is in view...
		if($thirdBG.hasClass("inview")){
			//call the newPos function and change the background position
			$thirdBG.css({'backgroundPosition': newPos(20, windowHeight, pos, 2600, 0.02)});
		}
		
		//if the second section is in view...
		if($estatutosBG.hasClass("inview")){
			//call the newPos function and change the background position
			$estatutosBG.css({'backgroundPosition': newPos(100, windowHeight, pos, 1400, 0.05)});
			//call the newPos function and change the secnond background position
			petri.css({'backgroundPosition': newPos(100, windowHeight, pos, 12000, 0.1)});
		}
		
		//if the third section is in view...
		if($reginternoBG.hasClass("inview")){
			//call the newPos function and change the background position
			$reginternoBG.css({'backgroundPosition': newPos(50, windowHeight, pos, 1800, 0.01)});
		}
		
		if($associadosBG.hasClass("inview")){
			//call the newPos function and change the background position
			$associadosBG.css({'backgroundPosition': newPos(50, windowHeight, pos, 2000, 0.02)}); 
		}
		
		//if the second section is in view...
		if($fourthBG.hasClass("inview")){
			//call the newPos function and change the background position
			$fourthBG.css({'backgroundPosition': newPos(98, windowHeight, pos, 4800, 0.032)});
			//call the newPos function and change the secnond background position
			pipeta.css({'backgroundPosition': newPos(80, windowHeight, pos, 13800, 0.10)});
		}
		
		//if the third section is in view...
		if($fifthBG.hasClass("inview")){
			//call the newPos function and change the background position
			$fifthBG.css({'backgroundPosition': newPos(0, windowHeight, pos, 1000, 0.017)});
		}
		
		//if the second section is in view...
		if($beneficios.hasClass("inview")){
			//call the newPos function and change the background position
			$beneficios.css({'backgroundPosition': newPos(60, windowHeight, pos, 1800, 0.03)});
		}
		
		//if the fourth section is in view...
		
		
		if($sixthBG.hasClass("inview")){
			//call the newPos function and change the background position
			$sixthBG.css({'backgroundPosition': newPos(100, windowHeight, pos, 3000, 0.03)}); 
		}
		
		if($seventhBG.hasClass("inview")){
			//call the newPos function and change the background position
			$seventhBG.css({'backgroundPosition': newPos(100, windowHeight, pos, 3000, 0.02)}); 
		}
		
		if($linksuteisBG.hasClass("inview")){
			//call the newPos function and change the background position
			$linksuteisBG.css({'backgroundPosition': newPos(50, windowHeight, pos, 2000, 0.02)}); 
		}
		
		$('#pixels').html(pos); //display the number of pixels scrolled at the bottom of the page
	}
		
	RepositionNav(); //Reposition the Navigation to center it in the window when the script loads
	
	$window.resize(function(){ //if the user resizes the window...
		Move(); //move the background images in relation to the movement of the scrollbar
		RepositionNav(); //reposition the navigation list so it remains vertically central
	});		
	
	$window.bind('scroll', function(){ //when the user is scrolling...
		Move(); //move the background images in relation to the movement of the scrollbar
	});
	
});
