var liveAxleSlideshow = function() 
{
	/*
	/ File and id naming conventions are critical to this script.
	/ Asset ids should correspond the ids of their parent containers
	/ The id naming spec is as follows:
	/ id = type-name1-name2-name3.ext:WidthxHeight e.g.:
	/ id = img-cisco-netacad-map.jpg:540x360
	*/
	
	// Slideshow class variables	
	var ASSET_PATH = "assets/";

	var currentSectionId = 'index';	
	var currentWorkId;
	var currentAssetId;
	var indexSwfIsMousedOver = false;
	
	function prepareContentForSlideShow()
	{
		// Assign handlers main nav links
		createMainNav();
		
		// Assign handlers to each item in the work menu
		createWorkMenuNavigation();
		
		// Create the work-asset navigation for each .work div
		createAssetNavigation();
		
		// Create sandbox content nav
		createSandboxMenuNavigation();
		
		// Show intro swf
		showIntroSwf();
	}
	this.prepareContentForSlideShow = prepareContentForSlideShow;
	
	
	function createMainNav()
	{	   
	   $('#left a[href="#work-list"]').bind("click", function(e)
      {
         handleMainNavChange('work');
         return false;
      });
      
      $('#left a[href="#about-us"], #intro-read-more').bind("click", function(e)
      {
         handleMainNavChange('about');
         return false;
      });
      
      $('h1 a').bind("click", function(e)
      {
         handleMainNavChange('index');
         return false;
      });
	}
	this.createMainNav = createMainNav;
	
	
	function createWorkMenuNavigation()
	{
		$("#work-list ul li a").bind("click", function(e)
		{
			// Get work id from href atribute of link
			var workId = $(this).attr("href").split("#")[1];

			// Find the id of the first asset inside work container
			showWork( getFirstAssetFromWorkId(workId) );
					
			return false;
		});
	}
	this.createWorkMenuNavigation = createWorkMenuNavigation;
	
	
	function createSandboxMenuNavigation()
	{
		
		$("#ourwork-list ul li a").bind("click", function(e)
		{
			// Get work id from href atribute of link
			var id = $(this).attr("href").split("#")[1];

			// Find the id of the first asset inside work container
			showSandboxWork(id);
					
			return false;
		});
	}
	this.createSandboxMenuNavigation = createSandboxMenuNavigation;

	
	
	function createAssetNavigation()
	{
		$(".work").each(function (workCounter, workElement)
		{
			var workId = $(workElement).attr("id");
			var assetCount = $(workId + " .work-asset").length;
			
			// Add ids to each placard
			var placardId = workId + '-placard';
			$("#" + workId + " .work-placard").attr({id:placardId});
			
			// Create numbered asset nav container wrap
			var navHTML = '<div class="work-asset-nav-wrap clearfix">\n';
			
			// Create numbered asset nav container div
			navHTML += '<div class="work-asset-nav">\n';
			
			/*
			// Create link for placard
			navHTML += '<a href="' + "#" + placardId + '" >';
			navHTML += '<span class="placard-link">';
			navHTML += '1';
			navHTML += '</span>';
			navHTML += '</a>\n';
			*/
			
			// Loop through each asset in current work
			$("#" + workId + " .work-asset").each( function (assetCounter, assetElement)
			{
				// Create numerical link for each asset found
				var assetId = $(this).attr("id");
		
				navHTML += '<a href="' + "#" + assetId + '" >';
				navHTML += '<span class="' + getAssetLinkClass(assetId) + '">';
				navHTML += assetCounter+1; // Offset 1 for 0 and 1 for placard
				navHTML += '</span>';
				navHTML += '</a>\n';
			});
			
			// Add the 'next' button at the end 
			navHTML += '<a href="#next"><span class="next-link">Next</span></a>';
			
			// Close asset nav container div
			navHTML += "</div>\n";
		
			// Close asset nav container wrap
			navHTML += "</div>\n";
		
			// Append the asset nav HTML to the DOM
			$("#" + workId).prepend(navHTML);
				
			// Assign click handlers to each newly created asset nav link
			$("#" + workId + " .work-asset-nav a").each(function (assetNavCounter, assetNavElement)
			{					
				$(this).bind("click", function(e)
				{ 					
					if ( $(this).attr('href').split("#")[1] == 'next' )
					{
					 showNextWork();
					}
					else
					{
					 var assetId = $(this).attr('href').split("#")[1];
					 showWork(assetId);
					}
					
					return false;
				});
			});	
			
		});
	}
	this.createAssetNavigation = createAssetNavigation;
	
	
	function handleMainNavChange(navId)
	{
		// Always purge the current work when main nav changes
	 	if (currentAssetId)
		{
		   hideWork(currentAssetId);
		   hideAsset(currentAssetId);
		}
	  
	  switch (navId)
	  {
	    
	     case 'index':	     	 
	        //$('#work-list').css({display:'none'});   // Hide work list
	        $('#work-wrap').css({display:'none'});   // Hide work
	        $('#about-wrap').css({display:'none'});  // Hide about	
	        $('#ourWorkWrap').css({display:'none'}).empty(); // Hide our work
	                
	        $('#left a[href="#work-list"]').removeClass('selected'); // Remove selected class
	        $('#left a[href="#about-us"]').removeClass('selected'); // Remove selected class
	        
	        $('#intro-wrap').css({display:'none'}).fadeIn("slow"); // Show intro
			  showIntroSwf();
        break;
	     
	     case 'work':  	  
	     	  $('#intro-wrap').css({display:'none'}); // Hide intro
	        $('#about-wrap').css({display:'none'}); // Hide about
	        $('#ourWorkWrap').css({display:'none'}).empty(); // Hide our work
	        
	        $('#left a[href="#work-list"]').addClass('selected'); // Remove selected class
	        $('#left a[href="#about-us"]').removeClass('selected'); // Remove selected class
	        hideIntroSwf();

	        //showWork( getFirstWorkAssetId() ); // Show first work
	        //$('#work-list').css({display:'block'}); // Show work list
	        $('#work-wrap').css({display:'none'}).fadeIn("slow"); // Show work
	     break;
	     
	     case 'about':
	        $('#intro-wrap').css({display:'none'}); // Hide intro
	        //$('#work-list').css({display:'none'}); // Hide work list	        
	        $('#ourWorkWrap').css({display:'none'}).empty(); // Hide our work
	        $('#work-wrap').css({display:'none'}); // Hide work
	        
	        $('#left a[href="#work-list"]').removeClass('selected'); // Remove selected class
	        $('#left a[href="#about-us"]').addClass('selected'); // Remove selected class
		     hideIntroSwf();

		     $('#about-wrap').css({display:'none'}).fadeIn("slow"); // Show about
	     break;
	     
	     case 'sandbox':
	     	   $('#intro-wrap').css({display:'none'}); // Hide intro
	        	$('#about-wrap').css({display:'none'}); // Hide about    	   
	        	//$('#work-list').css({display:'none'}); // Hide work list	        
	        	$('#work-wrap').css({display:'none'}); // Hide work
	        	$('#ourWorkWrap').empty(); // Empty out previous our work
	        	
	        	$('#left a[href="#work-list"]').removeClass('selected'); // Remove selected class
	        	$('#left a[href="#about-us"]').addClass('selected'); // Remove selected class
	       	hideIntroSwf();
	       	
	       	$('#ourWorkWrap').css({display:'none'}).fadeIn("slow"); // Show work

	       	
	     break;
	  }
	  
	  currentSectionId = navId;
	  
	}
   this.handleMainNavChange = handleMainNavChange;
	
	
	function showWork(assetId)
	{
		// Make sure the main menu is correct
		handleMainNavChange('work');
		
		var workId = getWorkIdFromAssetId(assetId);		
		
		// If the work id doesn't match the current work id 
		if (workId != currentWorkId)
		{
			// If currentId is already present, hide old work
			if (currentWorkId)
			{
				hideWork(currentAssetId);
			}
			
			// Update work list nav
			$("#work-list a[href$='"+ workId +"']").addClass("selected");
			
			// Show requested work
			$("#" + workId).addClass("work-current");
			
			// Set current work id
			currentWorkId = workId;
		}
		
		// Show requested asset
		showAsset(assetId);			
	}
	this.showWork = showWork;
	
	
	function hideWork(assetId)
	{		
		var workId = getWorkIdFromAssetId(assetId);
		// alert("hideWork: " + workId);
		
		// Update work list nav
		$("#work-list a[href$='"+ workId +"']").removeClass("selected");
		
		// Hide the work container div	
		$("#" + workId).removeClass("work-current");
		
		currentWorkId = null;
	}
	this.hideWork = hideWork;
	
	
	function showAsset(assetId)
	{
		// Do nothing if asset is already visible
		if (assetId == currentAssetId) return false;
			
		// Hide the old asset if showing
		if (currentAssetId != undefined )
		{
			hideAsset(currentAssetId);
		}
		
		var workId = getWorkIdFromAssetId(assetId);
		
		if ( $('#' + assetId).hasClass('work-asset') )
		{
			// Make sure container div is showing
			$('#' + workId + ' .work-assets').css({display:'block'});
			
			// Determine asset properties from id
			var idParts = assetId.split("-");
			var ext = idParts[4];
			var path = ASSET_PATH + idParts[0] + "-" + idParts[1] + "-" + idParts[2] + "-" + idParts[3] + "." + ext;
			var videoPath = idParts[0] + "-" + idParts[1] + "-" + idParts[2] + "-" + idParts[3] + "." + ext;
			var width = parseInt(idParts[5]);
			var height = parseInt(idParts[6]);
			
			// IMG
			if (ext == 'jpg' || ext == 'gif' || ext == 'png')
			{
				var assetHTML = '<img src="'+ path + '" width="' + width + '" height="' + height + '" />';
				$("#" + workId + " .work-assets").css({width:width, height:height}).addClass('loading');
				var img = new Image();
				$(img).load(function () {
      	      $(this).css('display', 'none');
      	      $("#" + assetId).html(this);
					$("#" + workId + " .work-assets").removeClass('loading');
      	      $(this).fadeIn("slow");
      	  	}).error(function () {
      	      // notify the user that the image could not be loaded
      	  	}).attr({src:path, width:width, height:height});
			}
			
			// VIDEO
			if (ext == 'mov' || ext == 'flv' || ext == 'm4v')
			{
				var videoPlayerId = "vid-" + assetId;
				var assetHTML = '<div id="' + videoPlayerId + '"></div>';
				$("#" + assetId).html(assetHTML);
				var flashvars = { videoFileUrl:videoPath };
				var params = { menu:"false", allowscriptaccess:"always", bgcolor:'#FFFFFF', wmode:'transparent' };
				var attributes = { id: videoPlayerId, name: videoPlayerId };
				swfobject.embedSWF("assets/swf-video-player.swf", videoPlayerId, width, height, "9.0.115","assets/expressInstall.swf", flashvars, params, attributes);
			}
		}
		
		if ( $('#' + assetId).hasClass('work-placard') )
		{
			// Make sure container div is hiding
			$('#' + workId + ' .work-assets').css({display:'none'});
			
			$('#' + assetId).show();
		}
		
		// Update work asset nav
		$(".work-asset-nav a[href$='"+ assetId +"']").addClass("selected");
		
		// Change dimensions of parent container to accomodate asset
		$("#" + workId + " .work-assets").css({width:width, height:height});
		
		// Set currentAssetId
		currentAssetId = assetId;
	}
	this.showAsset = showAsset;
	
	
	function hideAsset(assetId)
	{
		if ( $('#' + assetId).hasClass('work-placard') )
		{
			$('#' + assetId).hide();
		}
		
		if ( $('#' + assetId).hasClass('work-asset') )
		{
			$("#" + assetId).empty();
		}
		
		// Update work asset nav
		$(".work-asset-nav a[href$='"+ assetId +"']").removeClass("selected");
		
		currentAssetId = null;
	}
	this.hideAsset = hideAsset;
	
	
	function showNextWork()
	{
	  if( !currentAssetId )
	  {
	     showWork( getFirstWorkAssetId() );
	  }
	  else
	  {
	  		var workId = getWorkIdFromAssetId(currentAssetId);
	  		
	  		// Find next asset id in current work container
	  		if ( $('#' + currentAssetId).hasClass('work-placard') )
	  		{
	  			var nextId = $('#' + workId + " .work-asset").eq(0).attr("id");
	  		}
	  		else if ( $('#' + currentAssetId).hasClass('work-asset') )
	  		{
	  			var nextId = $("#" + currentAssetId + " ~ .work-asset").eq(0).attr("id");
	  		}
	  		
	  		if (nextId)
	  		{
	  			showWork(nextId);
	  		}
	  		else
	  		{
	  			// No id found in current work container, look in next container
	  			var nextWorkId = $("#" + workId + " ~ .work").eq(0).attr("id");
	  			if (nextWorkId)
	  			{
	  				// Next work container found, get asset from first asset
	  				var nextId = getFirstAssetFromWorkId(nextWorkId);
	  				if (nextId)
	  				{
	  					showWork(nextId);
	  				}
	  	  	 	}
	  	  	 	else
	  	  	 	{
	  	  	 		handleMainNavChange('index') // At the end, go back to index
	  	  	 	}
	  	  	}  
	  	}
	}
	this.showNextWork = showNextWork;
	
	
	function getWorkIdFromAssetId(assetId)
	{
	 	var assetIdDashParts = assetId.split("-");
	 	var workId = assetIdDashParts[0] + "-" + assetIdDashParts[1] + "-" + assetIdDashParts[2];
	 	return workId;
	}
	this.getWorkIdFromAssetId = getWorkIdFromAssetId;
	
	
	function getFirstAssetFromWorkId(workId)
	{
		var firstAssetId = $("#" + workId + " .work-asset").eq(0).attr("id");
		//var firstAssetId = $("#" + workId + " .work-placard").attr("id");
		return firstAssetId;
	}
	this.getFirstAssetFromWorkId = getFirstAssetFromWorkId;
	
	
   function getFirstWorkAssetId()
	{
		return getFirstAssetFromWorkId( $('.work').eq(0).attr('id') );
	}
	this.getFirstWorkAssetId = getFirstWorkAssetId;


	function getAssetLinkClass(assetId)
	{
		 var ext = assetId.split("-")[4];
		
		// IMG
		if (ext == 'jpg' || ext == 'gif' || ext == 'png')
		{
			return 'img-link';
		}
		
		// VIDEO
		if (ext == 'mov' || ext == 'flv' || ext == 'm4v')
		{
			return 'vid-link';
		}		
	}
	this.getAssetLinkClass = getAssetLinkClass;
	
	function showIntroSwf()
	{
		var html = '<div id="intro-swf"></div>';
		var flashvars = { displayString:'Live Axle Interactive offers creative and technology consulting services\nrelated to the creation and delivery of complex websites and applications.\nWe create professional interactive business applications and marketing\nsolutions for Fortune 500 corporations and those companies requiring\nbusiness critical web-delivered messaging or services.' };
		var params = { menu:"false", allowscriptaccess:"always", bgcolor:'#FFFFFF', wmode:'transparent' };
		var attributes = { id:"intro-swf", name:"intro-swf" };
		if ( swfobject.hasFlashPlayerVersion("9.0.115") )
		{
			$('body').append(html);
			swfobject.embedSWF(ASSET_PATH + "swf-live-axle-intro.swf", "intro-swf", "100%", "100%", "9.0.115", "assets/swf-expressInstall.swf", flashvars, params, attributes);
			//$('#intro-wrap .company-definition').hide();
			$('#intro-wrap .first').css({visibility:'hidden'}); // Hide intro
			
			$('body').append('<div id="coords"></div>');
			var targetX = 560;
			var targetY = 250;			
			$('body').mousemove(function(e)
			{
      		var dx = targetX - e.pageX;
      		var dy = targetY - e.pageY;
      		var dist = Math.sqrt(dx*dx + dy*dy);
      		
      		//if (e.pageX > 360 && e.pageX < 920 && e.pageY > 290 && e.pageY < 440)
      		 
      		if (Math.abs(dist) < 200)
      		{
      			if (!indexSwfIsMousedOver)
      			{
      				indexSwfIsMousedOver = true;
      				
      				// Get swf element and tell it mouse over
						var swf = document.getElementById("intro-swf");
						if (swf && typeof swf.jsMouseOver != "undefined")
						{
							swf.jsMouseOver();
						}
      			}
      		}
      		else
      		{
      			if (indexSwfIsMousedOver)
      			{
      				indexSwfIsMousedOver = false;
      				
      				// Get swf element and tell it mouse over
						var swf = document.getElementById("intro-swf");
						if (swf && typeof swf.jsMouseOut != "undefined")
						{
							swf.jsMouseOut();
						}
      			}
      			
      		}  		
      		
    		});

		}
		else
		{
			$('#intro-wrap .first').css({visibility:'visible'}); // Hide intro
		}
	}
	this.showIntroSwf = showIntroSwf;
	
	
	function hideIntroSwf()
	{
		$("#intro-swf").remove();
		
		$('body').mousemove = null;
	}
	this.hideIntroSwf = hideIntroSwf;
	
	
	function showIntroSubhead()
	{
		//$('#intro-wrap .company-definition').fadeIn("slow"); 
	}
	this.showIntroSubhead = showIntroSubhead;
	window.showIntroSubhead = showIntroSubhead;
	
	function hideIntroSubhead()
	{
		//$('#intro-wrap .company-definition').fadeOut("slow");	
	}
	this.hideIntroSubhead = hideIntroSubhead;
	window.hideIntroSubhead = hideIntroSubhead;
	
	
	function showSandboxWork(id)
	{
		// Make sure the main menu is correct
		handleMainNavChange('sandbox');
		
		if (id == 'iphone-nurtur')
		{
			window.location = "http://liveaxle.com/nurtur";
		}
		
		if (id == 'iphone-roygbiv')
		{
			window.location = "http://liveaxle.com/roygbiv";
		}

		
		if (id == 'iphone-poppin')
		{
			$('#ourWorkWrap').load('ourwork/poppin/index.html #ourWorkContent', {}, function(){
				var flashvars = {};
				var params = { menu: "false" };
				var attributes = { id: "poppinSwf", name: "poppinSwf" };
				swfobject.embedSWF("ourwork/poppin/poppin.swf", "poppinPlaceholder", "400", "720", "9.0.0", "expressInstall.swf", flashvars, params, attributes);	
			});
		}
		
		if (id == 'cloud-rss')
		{
			$('#ourWorkWrap').load('ourwork/cloud/index.html #ourWorkContent', {}, function(){
				
				var videoPlayerId = "cloud-rss";
				var assetHTML = '<div id="' + videoPlayerId + '"></div>';
				$("#" + 'vid-cloud-rss').html(assetHTML);
				var flashvars = { videoFileUrl:'../ourwork/cloud/cloud-rss.mov' };
				var params = { menu:"false", allowscriptaccess:"always", bgcolor:'#FFFFFF', wmode:'transparent' };
				var attributes = { id: videoPlayerId, name: videoPlayerId };
				swfobject.embedSWF("assets/swf-video-player.swf", videoPlayerId, 580, 360, "9.0.115","assets/expressInstall.swf", flashvars, params, attributes);
				
				$('#ourWorkContent .work-assets').css({display:'block'});
			});
		
		}
		return false;
	}
	this.showSandboxWork = showSandboxWork;
}


$(document).ready(function()
{
	jQuery.easing.def = "easeOutCirc";

	var slideShow = new liveAxleSlideshow();
	slideShow.prepareContentForSlideShow();
	
});


$(window).load(function ()
{

});