// get the value of the bottom of the #main element by adding the offset of that element plus its height, set it as a variable
function attachHandler(jQuery) {
	
	$(window).on('load',function(){
		$('#obscure_header').css('height', ($('#photo_header').height()));
		$('#obscure_subscribe').css('height', ($('#photo_subscribe').height()));	
		$('#myCarousel.carousel.slide').css('height', ($('#photo_header').height()));
	});
	
	var mainbottom = $('#myCarousel').offset().top + ($('#myCarousel').height()*2)+100;
	
	// on scroll, 
	$(window).on('scroll',function(){

	    // we round here to reduce a little workload
	    stop = Math.round($(document).scrollTop());
	    if (stop > mainbottom) {
	        $('.navbar-inner').addClass('past-main');
	    } else {
	        $('.navbar-inner').removeClass('past-main');
	   }

	});

	// scroll to 'header'
	$(".btn-logo").click(function() {
	    event.preventDefault();
	    $('html, body').animate({
	        scrollTop: $("#myCarousel").offset().top
	    }, 1000);
	});
	
	// scroll to 'about'
	$(".btn-about").click(function() {
	    event.preventDefault();
	    $('html, body').animate({
	        scrollTop: ($("#about").offset().top - 150)
	    }, 1000);
	});
	
	// scroll to 'features'
	$(".btn-features").click(function() {
	    event.preventDefault();
	    $('html, body').animate({
	        scrollTop: ($("#features").offset().top - 50)
	    }, 1000);
	});
	
	// scroll to 'subscribe'
	$(".btn-subscribe").click(function() {
	    event.preventDefault();
	    $('html, body').animate({
	        scrollTop: ($("#subscribe").offset().top)
	    }, 1000);
	});
	
	$( window ).resize(function(){
		$('#obscure_header').css('height', ($('#photo_header').height()));	
		$('#obscure_subscribe').css('height', ($('#photo_subscribe').height()));	
		$('#myCarousel.carousel.slide').css('height', ($('#photo_header').height()));
		var mainbottom = $('#myCarousel').offset().top + ($('#myCarousel').height()*2)-10;
	});
};

$(document).ready(attachHandler);
$(document).load(attachHandler);