/*
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 = $('#intro');
var $secondBG = $('#second');
var $thirdBG = $('#third');
var $fourthBG = $('#fourth');
var $fourthBGnew = $('#fourth-new');
var $fifthBG = $('#fifth');
var $sixthBG = $('#sixth');
var $seventhBG = $('#seventh');
var windowHeight = $window.height(); //get the height of the window
	
//apply the class "inview" to a section that is in the viewport
$('#intro, #second, #third, #fourth, #fourth-new, #fifth, #sixth, #seventh').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 second section is in view...
if($secondBG.hasClass("inview")){
$('.el-estudio').addClass("moving");
$('#nav li.active').removeClass('active');
$('li a[href="#second"]').parent().addClass('active');
}
else {$('.el-estudio').removeClass("moving");
$('li a[href="#second"]').parent().removeClass('active');
}

//if the third section is in view...
if($thirdBG.hasClass("inview")){
$('.servicios').addClass("moving");
$('#nav li.active').removeClass('active');
$('li a[href="#third"]').parent().addClass('active');
}
else {$('.servicios').removeClass("moving");
$('li a[href="#third"]').parent().removeClass('active');
}

//if the fourth section is in view...
if($fourthBG.hasClass("inview")){
$('.galeria').addClass("moving");
$('#nav li.active').removeClass('active');
$('li a[href="#fourth"]').parent().addClass('active');
}
else {$('.galeria').removeClass("moving");
$('li a[href="#fourth"]').parent().removeClass('active');
}

//if the fourth-new section is in view...
if($fourthBGnew.hasClass("inview")){
$('.clientes').addClass("moving");
$('#nav li.active').removeClass('active');
$('li a[href="#fourth-new"]').parent().addClass('active');
}
else {$('.clientes').removeClass("moving");
$('li a[href="#fourth-new"]').parent().removeClass('active');
}

//if the fifth section is in view...
if($fifthBG.hasClass("inview")){
$('.blog').addClass("moving");
$('#nav li.active').removeClass('active');
$('li a[href="#fifth"]').parent().addClass('active');
}
else {$('.blog').removeClass("moving");
$('li a[href="#fifth"]').parent().removeClass('active');
}

//if the sixth section is in view...
if($sixthBG.hasClass("inview")){
$('.contacto').addClass("moving");
$('#nav li.active').removeClass('active');
$('li a[href="#sixth"]').parent().addClass('active');
}
else {$('.contacto').removeClass("moving");
$('li a[href="#sixth"]').parent().removeClass('active');
}

//if the seventh section is in view...
if($seventhBG.hasClass("inview")){
$('.end').fadeIn(500);}
else {$('.end').fadeOut('fast');
}

$('#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
});
});
