$(document).ready(function() {


/********************************************************************
Hide stuff for nav/page fade in
*********************************************************************/

	$('#nav').hide();
	$('#shadowName').hide();
	$('#shadowLinks').hide();

	// Have the #content fade in an shift up at load
	// Doesn't work quite right yet.
	// Look into getting the current "padding" value and adding to it.
	//
	// The "images" pages works nice, but something is going funny with the "videos" page. 
	// The "instructions" at the top are too low and they slide up, but they shouldn't.
	// The "instructions" on the "images" pages doesn't slide. Maybe beause of "position"?
	// It's probably a CSS thing from the switch of those classes. It's still too low even with this disabled.
	// Another problem is that when using hide(), the content leaves the stage (display: none;), which means the scrollbars pop in and out of existance. "visibility: hidden" is a nice workaround, but that doesn't work with the delay(), since delay() apparently only works with effects queues.
	// And of course, IE is not a fan of 'opacity'.
	// ar-2010.01.24
	//
	// $('#content').hide();
	// $('#content').fadeIn(250);
	// $('#content').delay('200').css({'opacity': '0', 'padding-top': '6px'}).animate({'opacity': '1', 'padding-top': '0'}, 300, 'swing');




	$('#enddot').delay(1600).css({'opacity': 0}).animate({'opacity': 1}, 300, 'swing');
	$('#footer').delay(3000).css({'opacity': 0}).animate({'opacity': 1}, 300);
	
	
	
	//$('#nav, #shadowName, #shadowLinks').delay(500).fadeIn(500);
	//$('#nav, #shadowName, #shadowLinks').delay(1000).fadeOut(400);
	
	// Bio
	//$('#bio').delay(800).css({'opacity': 0, 'padding-top': '6px'}).animate({'opacity': 1, 'padding-top': '0'}, 300, 'swing');
	
	/* Nav *********************************************************/
	
	// $('XXXX#nav').delay(2300).css({'top': '92px', 'opacity': 0, 'display': 'block'}).animate({ 'top': '89px', 'opacity': 1}, 400);
	// $('XXXX#shadowName').delay(1100).css({'background-position': '0 60px', 'opacity': 1, 'display': 'block'}).animate({ 'background-position': '0 0', 'opacity': 1}, 600);
	// $('XXXX#shadowLinks').delay(800).css({'background-position': '0 -40px', 'opacity': 1, 'display': 'block'}).animate({ 'background-position': '0 0', 'opacity': 1}, 800);

	// super fast
	//
	// $('#header').mouseenter(function() {
	// 	$('#shadowName').css({'background-position': '0 60px', 'opacity': 1, 'display': 'block'}).animate({ 'background-position': '0 0', 'opacity': 1}, 200);
	// 	$('#shadowLinks').delay(100).css({'background-position': '0 -40px', 'opacity': 1, 'display': 'block'}).animate({ 'background-position': '0 0', 'opacity': 1}, 100);
	// 	$('#nav').delay(100).css({'top': '92px', 'opacity': 0, 'display': 'block'}).animate({ 'top': '89px', 'opacity': 1}, 300);
	// });


/********************************************************************
Navigation Hide/Show Effects
*********************************************************************/

// Browser detection.
// I know, I know... jquery.support()
// http://api.jquery.com/jQuery.browser/
jQuery.each(jQuery.browser, function(i) {
   if($.browser.msie){

		$("#shadowName").show();
		$("#shadowLinks").show();
		$("#nav").show();

   }else{

		$('#header').mouseenter(function() {
			$('#shadowName').stop(true, true).css({'background-position': '0 60px', 'opacity': 1, 'display': 'block'}).animate({ 'background-position': '0 0', 'opacity': 1}, 200);
			$('#shadowLinks').stop(true, true).delay(200).css({'background-position': '0 -40px', 'opacity': 1, 'display': 'block'}).animate({ 'background-position': '0 0', 'opacity': 1}, 200);
			$('#nav').stop(true, true).delay(250).css({'top': '92px', 'opacity': 0, 'display': 'block'}).animate({ 'top': '89px', 'opacity': 1}, 200);
		});

		$('#header').mouseleave(function() {
			$('#shadowName').fadeOut('fast');
			$('#shadowLinks').fadeOut('fast');
			$('#nav').fadeOut('fast');

			// 2009.12.12/ar
			// There is a bug with jQuery 1.3.2 which breaks "fadeOut()" when applied to elements
			// with position:absolute, as is the case with the <li>s in #nav.
			// jQuery 1.3.0 does not have this bug.
			// See: http://stackoverflow.com/questions/735292/strange-behavior-when-using-jquery-fadeout-function-on-element-with-floated-eleme
			//
			// This code is used to manually fadeOut a position:absolute element with jQuery 1.3.2:
			//$('#nav').css({'top': '90px', 'opacity': 1, 'display': 'block'}).animate({'opacity' : 0}, 100);
			//
			// 2010.01.23/ar
			// This bug seems to have been fixed with jQuery 1.4.0.
			// Proof: Switch the version of jQuery in a particular page.
			// 1.3.0 = Works 
			// 1.3.2 = Doesn't Work (The navigation links do *not* fade away)
			// 1.4.0 = Works

			});
			
	// insp: http://nial.me/


   } // end msie if/else
 }); // end jQuery.each(jQuery.browser, function(i)



/********************************************************************
Media Stage and Selector (tabs)
*********************************************************************/

//When page loads...

//Hide all content
$(".tab_content").hide();

//Hide #stage
//$("#stage").css({'opacity': 0});
//$("#stage").css({'visibility': 'hidden'});

//Activate first tab
//$("ul.tabs li:first").addClass("active").show();

//Show first tab content
//$(".tab_content:first").show();

//On Click Event
$("ul.tabs li").click(function() {

	//Hide instructions "Select an image/video below..."
	$("p.mediainstructions").fadeOut(100);
	
	// Show instructions: "Click on an image for its description"
	$("p.imagesdescnote").delay(1800).fadeIn(200);

	// Show ".tab_content p.meta" content. ex: video "credits"
//	$(".tab_content p.meta").delay(3000).fadeIn(200);


	// Show #stage
	// Using "visiblity" now because IE doesn't respond to 'opacity' only.
	// http://stackoverflow.com/questions/1031927/visibility-option-in-jquery
	$clicked = $("#stage");
	if ($clicked.css("visibility") == "hidden") {
		$("#stage").css({'visibility': 'visible','top': '-61px', 'opacity': 0}).animate({'top': '-69', 'opacity': 1}, 300, 'swing');		
	}
	
	//Remove any "active" class
	$("ul.tabs li").removeClass("active");
	//Add "active" class to selected tab
	$(this).addClass("active");
	//Hide all tab content
	// Changed from hide() to fadeOut(150); on 2010.02.28. Need to make sure IE6 is still ok.
	$(".tab_content").fadeOut(150);

	//Find the href attribute value to identify the active tab + content
	var activeTab = $(this).find("a").attr("href");
	
	//Fade in the active ID content
	$(activeTab).delay(200).fadeIn();

	// Bug fix: IE will hide() content from view, but will not actually "unload" that content.
	// - Specifically flash movies.
	// - Without the below (hacky) fix, IE would hide the video in another tab, but would continue to play it, so one would hear the audio from a movie they shouldn't, as well as experience poor video performance because both videos were running at the same time.
	// - It should be possible to optimize this hack more, but even those optimizations can break IE.
	// - ar-2010.01.25
	// 
	//Fix reference: <http://api.jquery.com/load/>
	// 
	// More info and NON-Fixes:
	// 
	// http://stackoverflow.com/questions/1806032/flash-video-still-playing-on-div-that-is-removed-using-jquery-ie-bug
	// http://stackoverflow.com/questions/1784693/jquery-ie6-issue-swaping-videos-through-hide-show-while-playing
	//
	
	// 2010.10.09 (ar) - UPDATE: To get the new Vimeo.com HTML5 embed code working, I needed to resort to using this method for Safari and FF as well. This is effectivly the same as how Fancybox works. When a new tab is loaded all of the content in the previous tabs is effectivly deleted or in Fancybox/jQuery: empty();
	// Ultimate and better solution: Switch to Fancybox for this and the "images" page.
	// ALSO, as a result of this, I haven't figure out how to get jQuery to target the p.meta that gets loaded in with the content from videos-vimeo.com.html. So that credit line no longer fades in 3 seconds (3000ms) AFTER the video is loaded. It just comes in at the exact same time. I think the rememdy has something to do with attaching a "bind" or "live" jquery thing.
		
//	if($.browser.msie){
		if(activeTab == "#Reel"){
			$('#stage #Reel').load('videos-vimeo.com.html #Reelinner');
			$("#UnSueno, #Orbis").empty();
		};

		if(activeTab == "#UnSueno"){
			$('#stage #UnSueno').load('videos-vimeo.com.html #UnSuenoinner');
			$("#Reel, #Orbis").empty();
		};

		if(activeTab == "#Orbis"){
			$('#stage #Orbis').load('videos-vimeo.com.html #Orbisinner');
			$("#Reel, #UnSueno").empty();
		};
//	} // end msie if/else

	// End of basic Tab code
	return false;
});

//http://www.sohtanaka.com/web-design/simple-tabs-w-css-jquery/

// Alternate tab code:
// http://justfreetemplates.com/blog/2009/08/31/ultra-simple-jquery-tabs.html




/********************************************************************
Relative position getting (tests)
*********************************************************************/

//http://api.jquery.com/position/

// var p = $("#stage");
// var position = p.position();
// 
// $("#stage").css({"top": (position.top - 100)})




/********************************************************************
Page Specific
*********************************************************************/




/********************************************************************
Google Analytics
*********************************************************************/


// http://briancray.com/2009/03/14/google-analytics-hack-track-outbound-links/
jQuery(function () {
	jQuery('a:not([href*="' + document.domain + '"])').click(function () {
		pageTracker._trackPageview('/outgoing/' + jQuery(this).attr('href'));
	});
});

// Others:
// http://snipplr.com/view/26660/google-analytics--jquery--track-all-outbound-link-clicks/
// http://plugins.jquery.com/project/gaTracker
// http://plugins.jquery.com/project/jquery-google-analytics
// http://www.fofronline.com/2009-03/track-outbound-links-using-google-analytics/


// Track Anchors for the "Images" and "Videos" pages?
// http://stackoverflow.com/questions/1211507/how-to-track-anchor-tags-with-google-analytics

/********************************************************************
Misc.
*********************************************************************/
//jQuery Delay Plug-in
//http://james.padolsey.com/javascript/jquery-delay-plugin/

// 2010.01.23/ar
// Depreciated since the exact same functionality is built into jQuery 1.4

// $.fn.delay = function(time, callback){
//     // Empty function:
//     jQuery.fx.step.delay = function(){};
//     // Return meaningless animation, (will be added to queue)
//     return this.animate({delay:1}, time, callback);
// }



// Alternate Background-Position animation code?:
// http://www.catswhocode.com/blog/animated-background-image-with-jquery
// http://www.ajaxblender.com/blend-effect.html


// jQuery Equivilant of -webkit-transitions, specifically the hovers on in the resume:
// http://www.hv-designs.co.uk/tutorials/jquery/all.html
// http://www.tripwiremagazine.com/2009/12/15-jquery-plugins-that-you-will-find-useful-in-2010.html


// We need to handle opacity special in IE
// http://blog.clintecker.com/post/66129101/as-of-5985-jquery-advocates-feature-detection-over
// if ( name == "opacity" && !jQuery.support.opacity ) {
//     ret = jQuery.attr( style, "opacity" );



/********************************************************************
Final
*********************************************************************/
 });
