// JavaScript Document

// Nav bar stuff

$(function(){
				var box_active = false, 
			   		link_active = false, 
					origin_xy = $("#logo").offset(),
					navbox_xy = Object();
				navbox_xy.px = origin_xy.left + 497;
				navbox_xy.cx = origin_xy.left + 625;
				navbox_xy.sx = origin_xy.left + 842;
				
				$("#main-nav #searchsubmit")
					.attr("value", "Go");
				
				//$("#main-nav #s")
				//	.attr("value", "Enter search terms here");
			   		   
			   $("li.portfolio-link a, li.contact-link a, li.search-link a")
			   		.attr("href", "#");

				function closeNavBox( selector ){
					$( selector )
						.stop()
						.fadeOut(200)
						.animate({top:"0px"}, {duration:200, queue:false});
				}
				function deactivateNavLink( selector ){
					$( selector )
						.stop()
						.animate({backgroundPosition:"(-45px -200px)"}, {duration:300, complete:function(){
							$(this).css({backgroundPosition: "-45px -200px"})
							.removeClass("active");
						}});
				}
				function resetNav(){
						closeNavBox( box_active );
						box_active = false;
						deactivateNavLink( link_active );
						link_active = false;
				}
				function openNavBox( selector ){
						$(selector)
							.stop()
							.fadeIn(300)
							.animate({top:"60px"}, {duration: 300, queue:false});
						box_active = selector;
				}
				function activateNavLink( selector ){
						var xy = "(" + getNavLinkX( selector ) + "px -135px)";
						$(selector)
							.addClass("active")
							.stop().animate({backgroundPosition: xy }, {duration:300, complete:function(){}});
						link_active = selector;
				}
				function mouseoverNavLink( selector ){
					if( link_active != selector ){
						var xy = "(" + getNavLinkX( selector ) + "px -190px)";
						$( selector )
							.stop().animate({backgroundPosition: xy }, {duration:200});
					}
				}
				function mouseoutNavLink( selector ){
					if ( link_active != selector ){
						//var xy = "(" + getNavLinkX( selector ) + "px -200px)";
						var xy = "(" + initializeXY(selector) + ")";
						$( selector )
								.stop().animate({backgroundPosition: xy }, {duration:100, complete:function(){
									$(this).css({backgroundPosition: xy });
								}});
					}
				}
				function getNavLinkX( selector ) {
					var width = Math.round( $( selector ).width() );
					var width = ( width - 200 ) / 2;
					return width;
				}
				function initializeXY( selector ){
					var xy = getNavLinkX( selector ) + "px -200px";
					return xy;
				}
				
				$('#main-nav')
					.click(function(e){
						e.stopPropagation();
				})
					
			   $('#main-nav li.portfolio-link')
					/*.css( 'backgroundPosition', function(){ 
							return ( initializeXY( "#main-nav li.portfolio-link" ))} )*/
					.css({ backgroundPosition:"-45.5px -200px" })  //Typekit throws the initializeXY off during load; setting this manually till I can get the work-around working.
					.mouseover( function () {
						mouseoverNavLink( "#main-nav li.portfolio-link" );
					})
					.mouseout(function(){
						mouseoutNavLink( "#main-nav li.portfolio-link" );
					})
					.click(function(){	
						if ( box_active && box_active != '#main-nav #p' ) resetNav();
						openNavBox("#main-nav #p");
						activateNavLink( '#main-nav li.portfolio-link' );
						//link_active = $(this);
					})
					
				$('#main-nav li.blog-link')
					/*.css( 'backgroundPosition', function(){ 
							return ( initializeXY( "#main-nav li.blog-link" ))} )*/
					.css({ backgroundPosition:"-62px -200px" })
					.mouseover(function(){
						mouseoverNavLink( '#main-nav li.blog-link' );
					})
					.mouseout(function(){
						mouseoutNavLink( '#main-nav li.blog-link' );
					})
					.click(function(){
						if ( box_active ) resetNav();
					})
					
				$('#main-nav li.about-link')
					/*.css( 'backgroundPosition', function(){ 
							return ( initializeXY( "#main-nav li.about-link" ))} )*/
					.css({ backgroundPosition:"-41.5px -200px" })
					.mouseover(function(){
						mouseoverNavLink( '#main-nav li.about-link' );
					})
					.mouseout(function(){
						mouseoutNavLink( '#main-nav li.about-link' );
					})
					.click(function(){
						if ( box_active ) resetNav();
					})

									
				$('#main-nav li.contact-link')
					/*.css( 'backgroundPosition', function(){ 
							return ( initializeXY( "#main-nav li.contact-link" ))} )*/
					.css({ backgroundPosition:"-50px -200px" })
					.mouseover(function(){
						mouseoverNavLink( '#main-nav li.contact-link' );
					})
					.mouseout(function(){
							mouseoutNavLink( '#main-nav li.contact-link' );
					})
					.click(function(){
						if ( box_active && box_active != '#main-nav #c' ) resetNav();
						openNavBox("#main-nav #c");
						activateNavLink( '#main-nav li.contact-link' );
					})
					
				$('#main-nav li.search-link')
					/*.css( 'backgroundPosition', function(){ 
							return ( initializeXY( "#main-nav li.search-link" ))} )*/
					.css({ backgroundPosition:"-53.5px -200px" })
					.mouseover(function(){
						mouseoverNavLink( '#main-nav li.search-link' );
					})
					.mouseout(function(){
							mouseoutNavLink( '#main-nav li.search-link' );
					})
					.click(function(){
						if ( box_active && box_active != '#main-nav #search' ) resetNav();
						openNavBox("#main-nav #search");
						activateNavLink( '#main-nav li.search-link' );
					})
					
				$('#main-nav #p')
					.css({top:0, left: navbox_xy.px + "px"});
				$('#main-nav #c')
					.css({top:0, left: navbox_xy.cx + "px"});
				$('#main-nav #search')
					.css({top:0, left: navbox_xy.sx + "px"});
	 			
				$('body').click(function(){
						if ( box_active ) resetNav();
				});


// Portfolio stuff

															
				// The default axis is 'y', but in this demo, I want to scroll both
				// You can modify any default like this
				$.localScroll.defaults.axis = 'xy';
				
				$.localScroll({
					duration:1500,
					hash:true,
					onBefore:function( e, anchor, $target ){
					},
					onAfter:function( anchor, settings ){
					}
				});
				
				//getting the summary format thumbnails images to act like links.				
				$('.project-link img').attr('height', function(i, val){ return val = $(this).parent().parent().innerHeight() });
});