// ************* DEFINE GLOBAL VARIABLES
var projectHeight = 105; //note must match .project height

// ************* DEFINE CUFON TEXT REPLACMENTS

//Cufon.replace('h1,h2,h3,h4', { hover:true, fontFamily: 'Myriad Pro' });
//Cufon.replace('#justintense-menu li', { hover:true, fontFamily: 'myriad-cond-semi' });

//Cufon.replace('span.headline', { hover:true, fontFamily: 'myriad-cond-semi' });

// make jQuery no conflic with other APIs
var $j = jQuery.noConflict();


// extend jquery 
	$j.fn.wait = function(time, type) {
        time = time || 500;
        type = type || "fx";
        return this.queue(type, function() {
            var self = this;
            setTimeout(function() {
                $j(self).dequeue();
            }, time);
        });
    };

// ************* DEFINE jQuery functions
$j(document).ready(function(){

	// Define easing type
	jQuery.easing.def = 'easeOutSine';
	
	
	$j('a[rel*=external]').click(function(){
  		this.target = "_blank";
	})
	
	
	/* navigation */
	$j("li.menu-item").hover(
		
		function () {
			var sub = $j(this).find("ul.justintense-submenu");
        	sub.stop(true, true).slideDown(800);
			$j(this).addClass("menu-item-over");
      	}, 
      	function () {
      		var sub = $j(this).find("ul.justintense-submenu");
        	sub.stop(true, true).slideUp(250);
			$j(this).removeClass("menu-item-over");
      	}

	);
	
	// fade in head text
	/*$j("#l1").wait(1000).fadeIn(1000);
	$j("#l2").wait(1500).fadeIn(1000);
	$j("#l3").wait(2000).fadeIn(1000);
	$j("#l4").wait(2500).fadeIn(1000);*/
	

	var config = {    
     	over: makeTall, // function = onMouseOver callback (REQUIRED)    
     	timeout: 750, // number = milliseconds delay before onMouseOut    
     	out: makeShort // function = onMouseOut callback (REQUIRED)    
	};

	$j("div.project").hoverIntent( config );
	$j("div.project").hover( showBorder, removeBorder );

	
	
	/*$j("#creative-box").css("opacity",0);
	

	$j("#creative-box").wait().animate({opacity: 1}, 1600,function(){
  		$j("#creative-box").animate({ height: 500 + 'px'}, 1500 );
	});*/

});


function makeTall() {
	var desc = $j(this).find("p.project-desc");
	var totalH = projectHeight + desc.height() + 5;	
	$j(this).animate({ height: totalH + 'px'}, 800 );
}

function makeShort() {
	$j(this).animate({ height: projectHeight + 'px'}, 800 );
}

function showBorder() {
	$j(this).addClass("over-border");
}

function removeBorder() {
	$j(this).removeClass("over-border");
}


$j(function(){
  
  // Keep a mapping of url-to-container for caching purposes.
  var cache = {
    // If url is '' (no fragment), display this div's content.
    '': $j('.expand-default')
  };
  
  // Bind an event to window.onhashchange that, when the history state changes,
  // gets the url from the hash and displays either our cached content or fetches
  // new content to be displayed.
  $j(window).bind( 'hashchange', function(e) {
    
    // Get the hash (fragment) as a string, with any leading # removed. Note that
    // in jQuery 1.4, you should use e.fragment instead of $j.param.fragment().
    var url = e.fragment;
    
    // Remove .expand-current class from any previously "current" link(s).
    $j( 'li.expand-current' ).removeClass( 'expand-current' );
    
    // Hide any visible ajax content.
    $j( '.expand-content' ).children( ':visible' ).hide();
    
    if(url && $j( 'a[href="/#' + url + '"]' ).parent().attr("class") == "submenu-item") {
    	$j( 'a[href="/#' + url + '"]' ).parent().parent().parent().addClass( 'expand-current' );
    }
    else {
    	// Add .bbq-current class to "current" nav link(s), only if url isn't empty.
    	url && $j( 'a[href="/#' + url + '"]' ).parent().addClass( 'expand-current' );
    }
    
    if ( cache[ url ] ) {
      // Since the element is already in the cache, it doesn't need to be
      // created, so instead of creating it again, let's just show it!
      //cache[ url ].slideDown("slow");
      
     // alert("cached: " + cache[ url ].height())
     
     var hHeight = cache[ url ].height();
      
      $j("#head").animate({height: hHeight}, 800, function() {
    		 // Since the element is already in the cache, it doesn't need to be
      		// created, so instead of creating it again, let's just show it!
      		cache[ url ].slideDown("slow");
      		
      		if(url == "") {
      			// fade in head text
				$j("#l1").wait(500).fadeIn(1000);
				$j("#l2").wait(1000).fadeIn(1000);
				$j("#l3").wait(1500).fadeIn(1000);
				$j("#l4").wait(2000).fadeIn(1000);
			}
  	});
      
    } else {
    
    	//alert("not cached: " + $j( "#" + url ).height())
    	
    	var hHeight = $j( "#" + url ).height();
    
    	$j("#head").animate({height: hHeight}, 800, function() {
    		 // Create container for this url's content and store a reference to it in the cache.
      		cache[ url ] = $j( "#" + url )
      			.slideDown("slow");
  		});

      /*// Create container for this url's content and store a reference to it in
      // the cache.
      cache[ url ] = $j( "#" + url )
      	
      		.slideDown("slow");*/
    }
  })
  
  // Since the event is only triggered when the hash changes, we need to trigger
  // the event now, to handle the hash the page may have loaded with.
  $j(window).trigger( 'hashchange' );
  
});