/**
 * 
 * JS for the 2012 Userplane Website Redesign
 * Date: December 2011
 * 
 */

var upFx = {

	// NAV ANCHOR HOVER ANIMATIONS
	anchorFx: function() {
		
		// create jQuery objects for anchorFx
		var nav01 = $('#up-nav-01');
		var nav02 = $('#up-nav-02');
		
		// remove up-nav-link (non-JS class) and replace with JS related up-hover
		nav01.find('.up-nav-link').removeClass('up-nav-link').addClass('up-hover-01');
		
		// hover animations for nav 01 link rollovers
		$('#up-nav-01 .up-hover-01, .up-footer-list-item a').hover(
			function () {
				$(this).stop().animate({
					color: '#b5eb60'
				}, 100, 'swing' );
			}, 
			function () {
				$(this).stop().animate({
					color: '#789DBF'
				}, 700, 'swing' );
			}
		);
		
		//NEED TO FIX: IE8 does not allow the exact same hovering for nav-02 that it allows for nav-01,
		// so for now, not including IE8 for nav-02 hover animations
		if ( !$('html').hasClass('ie8') ) {
			// remove up-nav-link (non-JS class) and replace with JS related up-hover
			nav02.find('.up-nav-link').removeClass('up-nav-link').addClass('up-hover-02');
			
			// hover animations for nav 02 link rollovers
			$('#up-nav-02 .up-hover-02').hover(
				function () {
					$(this).stop().animate({
						color: '#b5eb60'
					}, 100, 'swing' );
				}, 
				function () {
					$(this).stop().animate({
						color: '#FFF'
					}, 700, 'swing' );
				}
			);
		}	
	},
	
	// HEADER LOGO ANIMATION
	headerFx: function() {
		
		// if JS is enabled, prep the tiny Userplane logo for the scroll animation below
		$('#up-navs .up-logo-block').removeClass('visuallyhidden').addClass('up-logo-tiny');
		
		// scroll animation for Userplane logos in the header
		$(window).scroll(
			function() {
				var scrollTop = parseInt( $(this).scrollTop() );
				var logo1 = $('#up-navs .up-logo-tiny');
				var logo2 = $('#up-hero-nav-container .up-logo');
				var nav2 = $('#up-nav-02');
				var nav2bkgd = $('#up-hero-nav-container');
				
			//	console.log('scrollTop: ', scrollTop);
			//	console.log('top: ', hero.css('top'));
				
				// animation of logo and nav2
				if ( scrollTop <= 13 ) {
					nav2.stop().animate({
						'margin-top': '39px'
					}, { queue: false, duration: 333 });
					logo1.stop().animate({
						opacity: '0',
						'top': '-50px'
					}, 500, 'swing' );
				} else if ( scrollTop > 13) {
					nav2.stop().animate({
						'margin-top': '16px'
					}, { queue: false, duration: 100 });
					logo1.stop().animate({
						opacity: '1',
						'top': '2px'
					}, 500, 'swing' );
				}
				
				// animations for hero and subsequent elements during scroll of page
				if ( scrollTop <= 13 ) {
					// as the scrollTop ranges from 0 - 13,
					// the top for the hero shifts by that value
					nav2bkgd.stop().animate({'top': ( -scrollTop ) + 'px' }, 100);
					logo2.stop().css('top', '47px').animate({
						opacity: '1'
					}, 700, 'swing' );
				} else if ( scrollTop > 13 ) {
					logo2.stop().animate({
							'top': ( -scrollTop * 3 ) + 'px',
							opacity: '0'
						}, 333, 'swing' );
					nav2bkgd.stop().animate({'top': '-30px' }, 100 );
				}
			}
		);
	},
	
	// SEARCH BOX
	searchFx: function() {
		
		var container = $('#up-search')
		var button = $('.up-search-button');
		var box = $('#up-search-box');
		
		// the following three css style sets establish the base state
		container.css({
			'width': '11px'
		});
		
		button.css({
			'background-image': 'url("/resources/cms/images/up_spyglass_blue.png")',
			'background-repeat': 'no-repeat',
			'background-position': '0px 5px',
			'width': '11px'
		});
		
		box.css({
			'background-color': 'transparent',
			'border-radius': '0px',
			'border-width': '0px',
			'height': '0px',
			'overflow': 'hidden',
			'padding': '0px',
			'width': '0px'
		});
		
		// when the search button is hovered		
		button.hover(
			function() {
				if ( parseInt(box.css('width')) < 1) {
					$(this).stop().css({'background-image': 'url("/resources/cms/images/up_spyglass_lime.png")'}).
					animate({
						opacity: '1'
					}, 250, 'swing');
				}
			},
			function() {
				if ( parseInt(box.css('width')) < 1) {
					$(this).stop().animate({
						opacity: '0.45'
					}, 700, 'swing', function() {
						$(this).css({'background-image': 'url("/resources/cms/images/up_spyglass_blue.png")'}).animate({
							opacity: '1'
						}, 0 );
					});
				}
			}
		);
		
		// when the search button is clicked, expand the search box
		button.click(function() {
			var boxWidth = parseInt(box.css('width'));
			if ( boxWidth < 3 ) {	
				container.stop().animate({
					'width': '100px'
				}, { queue: false, duration: 250 });
				
				button.stop().animate({
					'opacity': '.1',
					'width': '22px'
				}, { queue: false, duration: 250 }).css({				
					'background-position': '5px 5px',
				});
				
				box.css({
					'background-color': '#446074',
					'border-width': '1px',
					'height': '15px',
					'padding': '2px 4px 2px 18px'
				}).animate({
					width: '72px'				
				}, 250, 'swing', function() {
					button.css({
						'background-image': 'url("/resources/cms/images/up_spyglass_darkblue.png")',
						'cursor': 'default'
					}).animate({
						opacity: '1'
					}, { queue: false, duration: 333 });						
					$(this).animate({
						'border-radius': '11px'				
					}, 600, 'swing', function() {
						$(this).focus();
					});
					// the following is to correct PNG artifacts in IE8
					$('.ie8 .up-search-button').css({
						'background-color': '#446074',
						'height': '17px',
						'margin': '1px 1px'						
					});
				});
			}
		});
	},
	
	// FOOTER BUTTON ANIMATION
	footerFx: function() {
		
		/*
		var button = $('#up-footer-button');
		var logo   = $('#up-footer .up-logo-block');
		
		// set CSS for elements affected
		button.css({
			'bottom': '171px',
			'position': 'fixed',
			'margin-right': '-999px'
		});
		
		logo.css({
			'bottom': '11px'
		});
		
		// once the scroll almost reaches the bottom of the page, slide the button in
		$(window).scroll(
			function() {
				
				var min = 0;
				var max = $(document).height();
					console.log(max);
				var scrollTop = parseInt( $(this).scrollTop() );
					console.log(scrollTop);				
				var trigger = parseInt( $(document).height() - 700 );
					console.log(trigger);
		 
				if ( scrollTop > trigger ) {
					button.stop().animate({
						'margin-right': '60px',
					}, 700, 'swing' );
				} else {
					button.stop().animate({
						'margin-right': '-999px',
					}, 700, 'swing' );
				}
				
				
			}
		);*/
		
	}

}; // close upFx

// fire upFx object functions
$(document).ready(function() {

	var rez	= $(window).width();
	
	if ( rez > 979 ) {
		//alert(rez);
		upFx.anchorFx();
		upFx.headerFx();
		upFx.searchFx();
		upFx.footerFx();
	}
	
});