// JavaScript Document

$(document).ready(function() {
		  
	// CONFIG
	var podWidth 			= 330	; // width of 1 pod
	var numberOfPodsVis 	= 3		; // bumber of pods that are visible at one time
	var disBetweenPods 		= 10	; // distance between each pod 
	// END - CONFIG
	
	// GLOBALS
	
	// select all the pods and put them in an array
	var podARR = $("#pod_drawer > ul").toArray();
	
	// setup the drawer size dependant on how many pods are in it
	var podDrawer = $("#pod_drawer");
	podDrawer.css("width", podARR.length * (podWidth + disBetweenPods));
	
	// tracks the position of a pod with respect to visibility	
	var podPosARR = new Array();
	
	// tracks how far the drawer can slide in any given direction
	var slideThreshold = podARR.length - numberOfPodsVis;
	var slideTracker = 0;
	
	// END - GLOBALS
	
	
	// INIT
	
	// assign a position for each pod with respect to visibility
	$.each(podARR, function(i) {
		switch(i) {
			case 0: podPosARR[i]="left";
				break;
			case 1: podPosARR[i]="center";
				break;
			case 2: podPosARR[i]="right";
				break;
			default: podPosARR[i]="inactive";
		}
		
		// DEBUG
		// uncomment for debugging - need to uncomment debugging areas (x2) below as well
		/* $(this).text(i+"—"+podPosARR[i]); */
		
	});
	
	
	// FORWARD
	$("#forward").click(function () {
		
		if(slideTracker < slideThreshold) {
			
			// if all the pods have been viewed in this direction then disable the forward button.
			// this also resets the back button to active if the forward button is pressed
			slideTracker++;
			$("#back").removeClass("disabled");
			if(slideTracker == slideThreshold) $("#forward").addClass("disabled");
			
			// move the drawer of pods
			podDrawer.animate({"left": "-="+podWidth+"px"}, "slow", "swing");
			
			$.each(podARR, function(i) {
				
				// (if) an pod is inactive and it's previous-sibling 
				// is in the "right" visible position, then...
				if(podPosARR[i-1] == "right") {
					$(this).removeClass().addClass("enter_right_activated");
				}
				// if this is the pod in the "left" position then...
				else if(podPosARR[i] == "left") {
					$(this).removeClass().addClass("exit_left_activated");
				}
				
			});
			
			// reorganize the position array
			var popped = podPosARR.pop();
			podPosARR.unshift(popped);
			
			// DEBUG
			/*// uncomment for debugging
			$.each(podARR, function(i) {
				$(this).text(i+"—"+podPosARR[i]);
			});
			*/

		} // END if
		
		return false;
		
	});
	
	
	// BACK
	$("#back").click(function () {
		
		if(slideTracker > 0) {
			
			// if all the pods have been viewed in this direction then disable the back button.
			// this also resets the forward button to active if the back button is pressed
			slideTracker--;
			$("#forward").removeClass("disabled");
			if(slideTracker == 0) $("#back").addClass("disabled");
			
			// move the drawer of pods
			podDrawer.animate({"left": "+="+podWidth+"px"}, "slow", "swing");
			
			$.each(podARR, function(i) {
				
				// (if) an pod is inactive and it's next-sibling 
				// is in the "left" visible position, then...
				if(podPosARR[i+1] == "left") {
					$(this).removeClass().addClass("enter_left_activated");
				}
				// if this is the pod in the "right" position then...
				else if(podPosARR[i] == "right") {
					$(this).removeClass().addClass("exit_right_activated");
				}
				
			});
			
			// reorganize the position array
			var shifted = podPosARR.shift();
			podPosARR.push(shifted);
			
			// DEBUG
			/*// uncomment for debugging
			$.each(podARR, function(i) {
				$(this).text(index+"—"+podPosARR[i]);
			});
			*/
		
		} // END if
		
		return false;
					
	});
	
	  
}); // END Document Ready