// JavaScript Document
// Andy @ Squidge Media
$(function (){ 
	
	$(".mainNav").click(function(){
								 
		if($(this).hasClass("reduced") == false){
		
			loadMain($(this));
			
		}

		return false;

	// end the mainNav listener
	});



	$(".jNavSub").click(function(){
								 
			loadSub($(this));
			
			return false;

	// end the jNavSub listener
	});
		   
		   
	$(".closeScroller").livequery('click', function(){
													
					$.scrollTo("nav",
					
					{onAfter:function(){ 
						//alert("here");
						$.scrollTo( '-=120px', 100 );											   
					}});
		
		$(this).siblings(".scrollable").remove();
		
		$(".active").removeClass("active");
		$(".show").removeClass("show");
		$(".reduced").removeClass("reduced");
		
		$(this).parent("li").animate({width:"89px"},300,'linear', function(){
																		   
			$("nav").removeClass("open");
			//$(this).children(".scrollable").remove();
		
		});
		
		$(".closeScroller").remove();
		addActive();
		return false;
		
	});






	$(".scrollable").livequery(function(){
										
		$(this).scrollable().navigator({

			// select the current subNav to be used as navigator
			navi: "ul.show",

			// select A tags inside the navigator to work as items (not direct children)
			naviItem: 'a',

			// assign "current" class name for the active A tag inside navigator
			activeClass: 'current'

		// end initiate scrollable
		});
		
	// end scrollable livequery
	});


	$(".jLink").livequery('click', function(){
											
		//$(".scrollable").unbind();

		// grab the api so we can use it later
		var api = $(".scrollable").data("scrollable");

		// get the current href
		var thisHref = $(this).attr("href");

		//alert(thisHref);

		$(this).attr("href", '');

		// set the path for the equivelant link
		var eqvLink = "a[href='"+thisHref+"']";
		// go and find the eqv link
		var eqvLink = $("#aNav").find(eqvLink);

		//alert($(eqvLink).html());
		
		// get the index number of this link
		var eqvIndex = eqvLink.parent("li").index();
		
		//alert(eqvIndex);
		
		// is this a direct child of #aNav li?
		var eqvStatus = $(eqvLink).isChildOf("#aNav li li");
			
		//alert(eqvStatus);
		
		// if it IS, that means it's a subNav link
		// check if it belongs to the subnav group that is active (ul.show)
		if(eqvStatus == true){
			
			eqvStatus = $(eqvLink).isChildOf("ul.show");
			
			// curSub means link is a child of the current subnav
			// genSub means link is a subnav, but not the active one
			eqvStatus = eqvStatus == true ? "curSub" : "genSub";

		// else if it's not a subNav link
		// check if it's the active mainNav ("li.active")
		} else {
			
			//eqvStatus = $(eqvLink).isChildOf("li.active");

			eqvStatus = $(eqvLink).parent("li").hasClass("active");

			//alert(eqvStatus);

			// curMain means that we're already on this tab, slide it home
			// genMain means we're not looking at the right tab
			eqvStatus = eqvStatus == true ? "curMain" : "genMain";
			
		// end if eqvLink is a subNav	
		}

		//alert(eqvStatus);
		
		// build a switch statement to decide how to handle these links
		switch(eqvStatus){
			
			// the easiest one, its the current overview page
			case "curMain":
			
				// just scroll back to slide 0
				api.seekTo(0);
			
			break;
			
			var api = $(".scrollable").data("scrollable");
			// the easy one, the link is in the current subnav
			case "curSub":
			
				// simply scroll to the correct div.slide
				
				// start with the current index
				var curIndex = api.getIndex();
				
				// deduct the targetIndex from the curIndex
				var moveIndex = eqvIndex - curIndex;
				
				// move the scrollable slides to the correct position
				api.move(moveIndex);
				
				loadSub(eqvLink);
			
			break;
			
			// more difficult, it's a main link but it's not the current one
			case "genMain":
			
				// run the main load function. All the difficult stuff happens there
				loadMain(eqvLink);
			
			break;
			
			// lastly, the most difficult; it's a subnav of another mainNav
			case "genSub":
			
				// ok so we need to run loadMain() and then manipulate the slides
				// but the eqvLink won't do for loadMain in this occasion
				// we need to get the parent li->a
				var parentEqvLink = eqvLink.parent("li").parents("li").children("a");
				
				// this isn't working and I don't know why
				// if I delay the load with an alert in the loadSub() function it's fine
				// so I guess it's going too fast - but I don't know how to fix it
				
				// run loadMain() with additional variables so the loadSub() runs after load
				//loadMain(parentEqvLink, eqvLink, eqvIndex);



				// lets try and work out what is happening here
				
				// lifting the code from loadMain()
				var element = parentEqvLink;


				if($(".closeScroller").html() != null){
					$(".closeScroller").remove();
				}
	
				// define some variables
				// set the current clicked item
				// var element = $(this);
				// set the href for the overview page
				var overview = element.attr("href");
	
				// reset width any li's with the class "active"
				$(".active").animate({width:'89px'},150, 'linear', function(){
		
					  // remove any instance of ".scrollable" on the page
					  $(".scrollable").remove();

					  // clear the current select class'
		  			// remove class "reduced" for active a.mainNav
		  			$(".reduced").removeClass("reduced");
		  			// remove class "active" for active li.jNav
		 			 $(".active").removeClass("active");
		  			// remove class "show" from subNav
		  			$(".show").removeClass("show");
		  			// add class "open" to nav
		  			$("nav").addClass("open");
	  
		  			// add the current select class'
		  			// add class "reduced" to the current .mainNav
		  			element.addClass("reduced");
		  			// add class "active" to the active li.jNav
		  			var parentLi = element.parent("li");
		  			parentLi.addClass("active");
		 			 // add class "show" to the current subNav
		  			element.siblings("ul").addClass("show");
		  
		  
		  			// try and scroll the page to the correct place
		  			// if the parent li is the first child of #aNav, scroll home
		  			if(parentLi.hasClass("c1") == true){
			  
			  			$.scrollTo("nav",
					
								{onAfter:function(){ 
									//alert("here");
									$.scrollTo( '-=120px', 100 );											   
								}});
			  
		  			} else {
			  
						  $.scrollTo(element.parent("li").prev(),
					
								{onAfter:function(){ 
									//alert("here");
									$.scrollTo( '-=30px', 100 );											   			
								}}
					
							);
			  
		  			}
		  
		  			element.parent("li").animate({width:'795px'},300,'linear',function(){
			
						  // empty the #target & load the content again
						  $("#target").empty().load('loadScrollable.html', function(){
																					
	  
							  // when loadScrollable.html has finished loading
							  // load the first the overview page into the first div
				 			 $('#items .slide:eq(0)').load(overview, function(){
																		 
								  // move the target div to within the current li
					  			$(element).after($("#target").html());
					  			$("#target").empty();
					  			$(element).after('<a href="#" title="Close Section" class="closeScroller">Close</a>');
					  
					  
					  
					  
					  			// lets try loading the subNav in here
					  					
							  	// get the href of the current link
							  	var thisHref = eqvLink.attr("href");
							  
							  	// create the index variable
							 	 var index = eqvLink.parent("li").index();
								  
							  	// if the index is not 0 (the overview page)
							  	if(index != 0){
									  
									  // convert this number into the #item element
									  var indexLoad = "#items .slide:eq("+index+")";
								  
								  
								  		
								  
									  // load the content from the href into that div
									  $(indexLoad).load(thisHref, function(){				
	
											setTimeout("apiScroll("+eqvIndex+")",500);
										  //alert(api2);
										  //api2.seekTo(eqvIndex);
										
									  });
						  
									  
							  	// end if	
							  	}	
							  
							  
							  
																						   
				 			 });
	  
			  			});		
				
		 			 });

		  
						//- bug fix
						addActive();
		
				});
		


			
			break;
			

		// end the switch statement
		}
		
		return false;

	// end jLink livequery
	});



	// load the internal scroll for all dynamically loaded pages (from D:Coed)
	$(".new-scroller").livequery(function(){
		$(this).jScrollPane();										
	});
	
	

// end doc ready
 });



function apiScroll(index){
	
	var api2 = $(".scrollable").data("scrollable");
	api2.seekTo(index);

}


// the main load function for all top level navigation
function loadMain(element, subElement, subIndex){
	
	if($(".closeScroller").html() != null){
		$(".closeScroller").remove();
	}
	
	// define some variables
	// set the current clicked item
	// var element = $(this);
	// set the href for the overview page
	var overview = element.attr("href");
	
	// reset width any li's with the class "active"
	$(".active").animate({width:'89px'},150, 'linear', function(){
		
		  // remove any instance of ".scrollable" on the page
		  $(".scrollable").remove();


		  // clear the current select class'
		  // remove class "reduced" for active a.mainNav
		  $(".reduced").removeClass("reduced");
		  // remove class "active" for active li.jNav
		  $(".active").removeClass("active");
		  // remove class "show" from subNav
		  $(".show").removeClass("show");
		  // add class "open" to nav
		  $("nav").addClass("open");
	  
		  // add the current select class'
		  // add class "reduced" to the current .mainNav
		  element.addClass("reduced");
		  // add class "active" to the active li.jNav
		  var parentLi = element.parent("li");
		  parentLi.addClass("active");
		  // add class "show" to the current subNav
		  element.siblings("ul").addClass("show");
		  
		  
		  // try and scroll the page to the correct place
		  // if the parent li is the first child of #aNav, scroll home
		  if(parentLi.hasClass("c1") == true){
			  
			  $.scrollTo("nav",
					
					{onAfter:function(){ 
						//alert("here");
						$.scrollTo( '-=120px', 100 );											   
					}});
			  
		  } else {
			  
			  $.scrollTo(element.parent("li").prev(),
					
					{onAfter:function(){ 
						//alert("here");
						$.scrollTo( '-=30px', 100 );											   
					}}
					
				);
			  
		  }
		  
		  element.parent("li").animate({width:'795px'},300,'linear',function(){
			
			  // empty the #target & load the content again
			  $("#target").empty().load('loadScrollable.html', function(){
	  
				  // when loadScrollable.html has finished loading
				  // load the first the overview page into the first div
				  $('#items .slide:eq(0)').load(overview, function(){
																		 
					  // move the target div to within the current li
					  $(element).after($("#target").html());
					  $("#target").empty();
					  $(element).after('<a href="#" title="Close Section" class="closeScroller">Close</a>');
																 
				  });
	  
			  });		
				
		  });
		  
		  // on the last case, genSub, we need to wait till the mainNav has finished
		  // then we can launch the loadSub() function
		  if(subElement != null){
			  
			  // grab the api so we can use it later
			  var api = $(".scrollable").data("scrollable");
		  
			  // run loadSub();
			  //loadSub(subElement);
			  
			  //api.seekTo(subIndex);
		  
		  }
		  
			//- bug fix
			addActive();
		
	});
		
}


function addActive(){
	// - bug hack, add clas active to #target so this function doesn't fail
	if($(".active").html() == null){
		$("#target").addClass("active");
	}	
}

function loadSub(element){

	// get the href of the current link
	var thisHref = element.attr("href");
	
	// create the index variable
	var index = element.parent("li").index();
		
	// if the index is not 0 (the overview page)
	if(index != 0){
			
		// convert this number into the #item element
		var indexLoad = "#items .slide:eq("+index+")";
		
		
		// load the content from the href into that div
		$(indexLoad).load(thisHref);

			
	// end if	
	}	
}