//FIXED BANNER ON SCROLL TO TOP

// ELEMENTS
var cpro = $("#cpro");
var header = $("#header");
var top = $("#top");


function fixOverlayElementHeight() {
	var gal1_height = $("#gal1 img").outerHeight();
	
	$(".overlay").css('height', gal1_height);
	$(".hover-box").css('height', gal1_height);
}


function fixHeroHeight() {
	var hero_img_1 = $("#hero-img-1");
	var hero_img_2 = $("#hero-img-2");
	var hero_img_3 = $("#hero-img-3");
	
	var three_heros = [hero_img_1.outerHeight(), hero_img_2.outerHeight(), hero_img_3.outerHeight()];
	var min_hero_height = Math.min.apply(null,three_heros);
	var max_hero_height = Math.max.apply(null,three_heros);

	var slideshow = $("slideshow");
	$("#slideshow").css('height', max_hero_height);

	//alert('hero img heights: ' + three_heros.join(', ') + "\nmin: " + min_hero_height)
}


function switchBanner() {
	
	//use this if we need to shut off under screen width 480
	if ($(window).width()>480){
	
	if ((eTop - $(window).scrollTop()) < headerHeight) {
		cpro.addClass("fix-cpro");
		$("#back-to-form").show(); //show button to return to form
		$("#cpro").css('top', headerHeight); //make sure cpro is set wherever the header height ends
	} else {
		cpro.removeClass("fix-cpro");
		$("#back-to-form").hide(); //hide button to return to form
	}
	
	}
	
	
}


function switchNav() {
	
	//use this if we need to shut off under screen width 480
	if ($(window).width()>480){
	}
	
	if ((eTop - $(window).scrollTop()) <= headerHeight + navHeight) {
		$("#nav").css('position', "absolute"); 
		$("#nav").css('top', (eTop-navHeight)+"px");
		
	} else {
		$("#nav").css('position', "fixed");
		$("#nav").css('top', headerHeight);
	}
}

function heroTop() {
	if ($(window).width()>480){
		$("#hero").css('margin-top', (headerHeight+navHeight)+"px");
	} else {
		$("#hero").css('margin-top', (headerHeight)+"px");
	}
}

function fixBannerHeight() {
	$("#top").css('height',cproHeight); //fix height on object beneath banner to make "snapping" seamless
}




function log(txt, txt2, txt3) {
	$("#log").html("location : <b>" + txt + "</b> px <br>header height:  <b>" + txt2 + "</b> px <br>cpro height:  <b>" + txt3 + "</b> px")
}

$(document).ready(function(){

	//TEST ZONE 
	
	
	//INITIAL RUN ON THE FIXES
	eTop = $('#banner-marker').offset().top; //get the offset top of the element
	headerHeight = header.outerHeight(); //get height of header
	cproHeight = cpro.outerHeight(); //get height of cpro banner
	navHeight = $("#nav").outerHeight();
		
	fixHeroHeight(); //first run to update height on load
	fixBannerHeight();
	fixOverlayElementHeight();
	switchNav();
	heroTop();
	$("#hidden-testy-box").hide();
	$("#back-to-form").hide();
	
	//SCROLL ANIMATION TO GO BACK TO THE FORM ON CLICK
	$(".jumper").on("click", function( e ) {
		e.preventDefault();

		$("body, html").animate({ 
		  scrollTop: $('#banner-marker').offset().top - header.outerHeight()
		}, 600);
	});
	
	$(window).scroll(function() { //when window is scrolled
		eTop = $('#banner-marker').offset().top; //get the offset top of the element
		headerHeight = header.outerHeight(); //get height of header
		cproHeight = cpro.outerHeight(); //get height of cpro banner
		navHeight = $("#nav").outerHeight();
		
		switchBanner();
		switchNav();
		heroTop();
	});
	
	// on 'touchmove' for mobile scrolling
	$('body').on({
		'touchmove': function(e) {
			eTop = $('#banner-marker').offset().top; //get the offset top of the element
			headerHeight = header.outerHeight(); //get height of header
			cproHeight = cpro.outerHeight(); //get height of cpro banner
			navHeight = $("#nav").outerHeight();
			
			switchBanner();
			switchNav();
			heroTop();
		}
	});
	
	$(window).resize(function() { //when window is resized
		eTop = $('#banner-marker').offset().top; //get the offset top of the element
		headerHeight = header.outerHeight(); //get height of header
		cproHeight = cpro.outerHeight(); //get height of cpro banner
		navHeight = $("#nav").outerHeight();
		
		switchBanner();
		switchNav();
		heroTop();
		fixBannerHeight(); //fix banner height for seamless switch
		fixHeroHeight(); //fix hero height if window is resized
		fixOverlayElementHeight();
	});
	
	
	
	//SLIDESHOW CODE
	$("#slideshow > div:gt(0)").hide();
	fixHeroHeight();
	
	setInterval(function() {
	  fixHeroHeight();
	  $('#slideshow > div:first')
		.fadeOut(1000)
		.next()
		.fadeIn(1000)
		.end()
		.appendTo('#slideshow');
	}, 7000);



	//TESTIMONIAL BOXES 
	$("#exit-testy-box").click(function(){
		$("#hidden-testy-box").hide();
		$("#testy-box1 li").css("margin-bottom", "5%");
	});
	$("#show-testy-box").click(function(){
		$("#hidden-testy-box").show();
		$("body, html").animate({ 
		  scrollTop: $('#hidden-testy-box').offset().top
		}, 600);
		$("#testy-box1 li").css("margin-bottom", "-3%");
	});
	
	
	//NAV LINKS TO SECTIONS OF PAGE
	$("#earn-points-nav").click(function(){
		var headerHeight = header.outerHeight(); //get height of header
		var cproHeight = cpro.outerHeight(); //get height of cpro banner
		var scrollPoint =  $('#earn-points').offset().top - (headerHeight + cproHeight);
		
		$("body, html").animate({ 
		  scrollTop: scrollPoint-30
		}, 600);
		
	});
	
	$("#products-nav").click(function(){
		var headerHeight = header.outerHeight(); //get height of header
		var cproHeight = cpro.outerHeight(); //get height of cpro banner
		var scrollPoint =  $('#products').offset().top - (headerHeight + cproHeight);
		
		$("body, html").animate({ 
		  scrollTop: scrollPoint-30
		}, 600);
		
	});
	
	$("#member-nav").click(function(){
		var headerHeight = header.outerHeight(); //get height of header
		var cproHeight = cpro.outerHeight(); //get height of cpro banner
		var scrollPoint =  $('#member').offset().top - (headerHeight + cproHeight);
		
		$("body, html").animate({ 
		  scrollTop: scrollPoint-30
		}, 600);
		
	});
	
});