/*
Author: Ian Lunn
Author URL: http://www.ianlunn.co.uk/

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() {


	//SELECTORS
	var $window = $(window);
	var $blueprint = $('.blueprint');
	var $wfm = $('.wfm');
	var $headimg = $('.company-1 .inner-wrapper');
	var $firstcoltop = $('.company-2 .first');
	var $secondcoltop = $('.company-2 .second');
	var $thirdcoltop = $('.company-2 .third');
	var $fourthcoltop = $('.company-2 .fourth');
	var $secondwfm = $('.company-2 .inner-wrapper ul');
	var $keyvisual = $('.keyvisual');
	var $thirdwfm = $('.company-3 .wfm');
	var $markentop = $('.marken-top');
	var $markenbottom = $('.marken-bottom');
	var $rightimg = $('.company-4 .right');
	var $message = $('.company-4 .right span');
	var $messagetwo = $('.best-mark');
	var $firstcolbot = $('.company-5 .first');
	var $secondcolbot = $('.company-5 .second');
	var $thirdcolbot = $('.company-5 .third');
	var $fourthcolbot = $('.company-5 .fourth');
	
	//WINDOW HEIGHT
	var windowHeight = (700); 
	
	
	//PLACE INVIEW
	$('.blueprint, .wfm, .company-1 .inner-wrapper, .company-2 li, .company-2 .inner-wrapper ul, .keyvisual, .company-4 .left div, .company-4 .right, .company-4 .right span, .best-mark, .company-5 li').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 = (700); 
		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
	}
	
	/*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($blueprint.hasClass("inview")){
			//call the newPos function and change the background position
			$blueprint.css({'backgroundPosition': newPos(50, windowHeight, pos, 700, 1.3)}); 
		}
		
		if($wfm.hasClass("inview")){
			$wfm.css({'backgroundPosition': newPos(50, windowHeight, pos, 600, -0.9)});
		}
		
		if($headimg.hasClass("inview")){
			$headimg.css({'backgroundPosition': newPos(50, windowHeight, pos, 700, 0.3)});
		}

		if($firstcoltop.hasClass("inview")){
			$firstcoltop.css({'backgroundPosition': newPos(50, windowHeight, pos, 1390, -0.6)});
		}
		
		if($secondcoltop.hasClass("inview")){
			$secondcoltop.css({'backgroundPosition': newPos(50, windowHeight, pos, 1550, 0.6)});
		}
		
		if($thirdcoltop.hasClass("inview")){
			$thirdcoltop.css({'backgroundPosition': newPos(50, windowHeight, pos, 1390, -0.6)});
		}
		
		if($fourthcoltop.hasClass("inview")){
			$fourthcoltop.css({'backgroundPosition': newPos(50, windowHeight, pos, 1550, 0.6)});
		}
		
		if($secondwfm.hasClass("inview")){
			$secondwfm.css({'backgroundPosition': newPos(3, windowHeight, pos, 1278, -0.9)});
		}

		if($keyvisual.hasClass("inview")){
			$keyvisual.css({'backgroundPosition': newPos(0, windowHeight, pos, 1800, 0.6)});
		}
		
		if($thirdwfm.hasClass("inview")){
			$thirdwfm.css({'backgroundPosition': newPos(0, windowHeight, pos, 1810, -0.9)});
		}
		
		if($markentop.hasClass("inview")){
			$markentop.css({'backgroundPosition': newPos(50, windowHeight, pos, 2450, -0.8)});
		}
		
		if($markenbottom.hasClass("inview")){
			$markenbottom.css({'backgroundPosition': newPos(50, windowHeight, pos, 2550, 0.8)});
		}
		
		if($rightimg.hasClass("inview")){
			$rightimg.css({'backgroundPosition': newPos(50, windowHeight, pos, 2200, 0.6)});
		}
		
		if($message.hasClass("inview")){
			$message.css({'backgroundPosition': newPos(50, windowHeight, pos, 2300, -1.2)});
		}
		
		if($messagetwo.hasClass("inview")){
			$messagetwo.css({'backgroundPosition': newPos(70, windowHeight, pos, 2771, -1.2)});
		}
		
		if($firstcolbot.hasClass("inview")){
			$firstcolbot.css({'backgroundPosition': newPos(50, windowHeight, pos, 3055, -0.6)});
		}
		
		if($secondcolbot.hasClass("inview")){
			$secondcolbot.css({'backgroundPosition': newPos(50, windowHeight, pos, 3223, 0.6)});
		}
		
		if($thirdcolbot.hasClass("inview")){
			$thirdcolbot.css({'backgroundPosition': newPos(50, windowHeight, pos, 3055, -0.6)});
		}
		
		if($fourthcolbot.hasClass("inview")){
			$fourthcolbot.css({'backgroundPosition': newPos(50, windowHeight, pos, 3223, 0.6)});
		}
		
		$('#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
	});
	
});
