/*
Azure Portfolio Semi - Ajax Slider Wotsit Thingy
A Graham
Azure Graphic & Web Design 
October 2009

If someones got time get rid of the hardcoded values, either read em in on dom ready
or pass em to a setup function. Ta.
*/

azure.portfolio = 
{
	
	animating : false,				//we doing an animation?
	current_instigator : false,		//where the change type click came from
	target_div : false,				//where were gonna put our ajax content when changing type

	current_job_slide : 1,			//current job were looking at
	current_job_type : 1,			//current job type were looking at


	setup : function()
	{
		//Set up the buttons
		this.bind_buttons();
		//Make sure we show the first bit of job info...
		$("#workInfo").html( $(".workInfo:first").html() );
		//...oh and make it look pretty
		Cufon.replace("#workInfo .delay-replace");
	},


	//Hook our two button types
	bind_buttons : function()
	{
		//This handles changing of job types - this was a more generic function in its first iteration
		$(".azure_load_into").live("click", function()
		{
			//go away if were currently animating
			if (azure.portfolio.animating == true)
				return false;
			
			//work out where were putting the content based on the anchors rel
			target_div = $("#work-type-" + $(this).attr("rel"));
		
			//if the target has already been loaded then just slide us to it
			if (target_div.hasClass("loaded") == true)
				return azure.portfolio.slide_to_type($(this).attr("rel"));
			
			//set some various bits and bobs
			azure.portfolio.target_div = target_div;
			azure.portfolio.current_instigator = $(this);
			azure.portfolio.animating = true;
			
			//load in the job type with some ajax
			$.post($(this).attr("href"), {}, azure.portfolio.handle_load);
			
			//stop button default behaviour
			return false;
		});
		
		//this handles sliding between jobs
		$(".slidejob").live("click", azure.portfolio.slide_to_job);
		
	},
	
	//called after a new job type has been loaded - fairly obvious
	handle_load : function(data)
	{
		//azure.portfolio.current_job_slide = 1;
		azure.portfolio.target_div.html(data);
		azure.portfolio.target_div.addClass("loaded");
		//slide to the new type
		azure.portfolio.slide_to_type(azure.portfolio.current_instigator.attr("rel"));								
	},
	
	
	//move to a given job type
	slide_to_type : function(slide_id)
	{
		//the panel id we require
		required_panel = "work-type-" + slide_id;
		slide_position = 0;
		
		
		//iterate each of the work type slides till we find a match
		$(".work-type-slide").each(function()
		{
			slide_position++;
			if ($(this).attr("id") == required_panel)
			{
				//They are asking for the current slide...
				if (slide_position == azure.portfolio.current_job_type)
				{
					//...which is pointless
					return false;
				}
				else
				{
					//get rid of the little active icon at this point
					$("#jobNavPanel-inner .active").removeClass("active");
					//slap tickle
					azure.portfolio.animating = true;
					//work out the new left position for just the menu carousel wotsit (sorry for the hardcoded values)
					new_menu_left = 210 - (slide_position * 210);
					new_menu_left = new_menu_left + "px";
					//ensure speed is consistent
					slide_hspeed = azure.portfolio.slide_time(slide_position, azure.portfolio.current_job_type);
					slide_vspeed = azure.portfolio.slide_time(azure.portfolio.current_job_slide, 1);					
					//do the actual animation - menu first
					$("#jobNavPanel-inner").animate( { left: new_menu_left }, slide_hspeed, function()
					{															
						//work out what were doing with the main pain
						new_left = 657 - (slide_position * 657);
						new_left = new_left + "px";
						//now if were not at the top of the slider (looking at a job > 1) move back to the top
						if ($("#workContent-inner").css("top") != "0px")
						{
							//vertically...
							$("#workContent-inner").animate( { top: "0px" }, slide_vspeed, function()
							{
								//...then horizontally
								$("#workContent-inner").animate( { left: new_left }, slide_hspeed, function() { azure.portfolio.animating = false; });
							});
						}
						else
						{
							//were at the top just animate horizontally
							$("#workContent-inner").animate( { left: new_left }, slide_hspeed, function() { azure.portfolio.animating = false; });
						}
					});	
					
					//first link should be active
					first_link = $("#jobNav" + slide_id + " a:first");
					//Find out where our first items job info is
					required_info = first_link.attr("rel");
					//blah
					first_link.addClass("active");
					//Show the info
					azure.portfolio.show_job_info(required_info);
					//etc
					azure.portfolio.current_job_type = slide_position;
					azure.portfolio.current_job_slide = 1;
					return false;
				}
			}
		});
	
		return false;
	},
	
	//gracefully shows a bit of job info
	show_job_info : function(slide_id)
	{
		required_info = $("#work-info-" + slide_id);
		$("#workInfo").fadeOut(333, function()
		{
			$("#workInfo").html(required_info.html());
			//dont change the class back to .replace cos cufon goes nuts and throws an error
			Cufon.replace("#workInfo .delay-replace");			
			$("#workInfo").fadeIn(333);
		});		
	},
	
	//move the main area to a specific job
	slide_to_job : function()
	{
		//animating already go away
		if (azure.portfolio.animating == true)
			return false;
		
		//find out what panel were after
		required_panel = "work-panel-" + $(this).attr("rel");
		required_info = $(this).attr("rel");
		
		//current job aint active no more
		$("#jobNavPanel-inner .active").removeClass("active");
		//but new job is
		$(this).addClass("active");

		slide_position = 0;
		type_position = 0;
		type_div = false;
		
		//im sure this could be rewritten - we could store id instead of counting but nvm
		$(".work-type-slide").each(function()
		{
			type_position++;
			if (type_position == azure.portfolio.current_job_type)
			{
				type_div = $(this).attr("id");
				type_div = "#" + type_div;
				return false;
			}
		});
		
		//iterate each panel till we find the one were after
		$(type_div + " .workPanel").each(function()
		{
			slide_position++;
			if ($(this).attr("id") == required_panel)
			{
				//they want the current one - pointless
				if (slide_position == azure.portfolio.current_job_slide)
				{
					return false;
				}
				else
				{
					//away we go
					azure.portfolio.animating = true;
					//show the job info
					azure.portfolio.show_job_info(required_info);
					//work out where we want to be
					new_top = 426 - (slide_position * 426);
					new_top = new_top + "px";
					//ensure speed is consistent
					slide_speed = azure.portfolio.slide_time(slide_position, azure.portfolio.current_job_slide);
					//fire off the animation
					$("#workContent-inner").animate( { top: new_top }, slide_speed, function() { azure.portfolio.animating = false; });
					azure.portfolio.current_job_slide = slide_position;
					return false;
				}
			}
		});
		return false;
	},
	
	//used to ensure consistent speed during animations
	slide_time : function(current_slide, previous_slide)
	{
		//work out how many slides were travelling
		distance = current_slide - previous_slide;
		if (distance < 0) 
			distance = 0 - distance;
		
		if (distance == 0)
			distance = 1;
			
		//times by however much per slideeee
		return distance * 222;
	}
	
}

$(function() 
{
	//Away we go...
	azure.portfolio.setup();
});