//Clone what we've got
function cloner(){
	// Pad before
	var smfirst = $('#features_list li:first');
	var smfirstclass = $(smfirst).attr('class');
	$('#features_list_container li').each(function(){
		$(this).clone(true).insertBefore(smfirst);
	})
	lgfirst = $('#feature_panes li:first');
	$('#features_panes_container li').each(function(){
		$(this).clone(true).insertBefore(lgfirst);
	})

	// Advance to the ones we need
	$('#features_list_wrapper').css('left', (liL * lisW * limb * -1) - (offset * lisW)  + 'px');
	$('#feature_panes_wrapper').css('left', (liL * lilW * limb * -1) + 'px');
	
	// Uncomment if you want them to match
	//$('#feature_panes_wrapper').css('left', (liL * lilW * limb * -1) - (offset * lisW) + 'px');
	
	
	//Account for new length
	t = $('#features_list_container li').length
	
	// Pad after
	$('#features_list_container li:gt(' + ((t/2)-1) + ')').each(function(){
		smlast = $('#features_list li:last');
		$(this).clone(true).insertAfter(smlast);
	})
	$('#features_panes_container li:gt(' + ((t/2)-1) + ')').each(function(){
		lglast = $('#feature_panes li:last');
		$(this).clone(true).insertAfter(lglast);
	})
	
	// We hide the first item so it wont show up when the page loads. After we are done initalizing - we show it.
	$('.' + smfirstclass).css('display', 'block');
	
	//Update the li length
	liL		= $('#features_list_container li').length;
}

function adv(){
	inc = inc + 1;
	if(inc >= 1 && inc <= ((liL/3)*2)){
		move(inc, -1);
	}
}
function rev(){
	inc = inc - 1;
	if(inc >= 1 && inc <= ((liL/3)*2)){
		move(inc, 1);
	}
}


function move(page, d){
	var dir = d;
	
	//Depending on Direction - calculate how much to the Small Feature Bar
	if(d == 1){
		swp = ((page + limb + offset) * lisW * dir);
	}else{
		swp = (page * lisW * dir);
	}
	
	//Depending on Direction - calculate how much to the Large Feature Bar
	if(d == 1){
		lwp = ((page + offset) * lilW * dir);
	}else{
		lwp = ((page - offset) * lilW * dir);
	}
	
	
	if(dir == -1){
		// Amts = (LI Width (large or Small) * direction * li Move By) + large or small Wrapper Position
		var samt = (lisW * dir * limb) + swp;
		var lamt = (lilW * dir * limb) + lwp;
	}else{
		var samt = (lisW * dir * limb) - swp;
		var lamt = (lilW * dir * limb) - lwp;
	}
	
	
	$('#features_list_wrapper').animate({ left : samt  }, 500, function(){
		//FWD
		if(dir == -1){
			// At the 3/4 mark we are going to adjust the CSS
			if(page == ((liL/3)*2)){
				
				// Calculate the amount we need to move (adjust for offset)
				var amt = (-1 * (liL/3) * lisW) - (offset * lisW);
				$('#features_list_wrapper').css({ left : amt  });
				
				// Set Incrementer back to the 1/3 mark (or the first panel that is shown onload)
				inc = (liL / 3);
			}
		}
		//REV
		if(dir == 1){	
			// At the first item we are going to adjust the CSS + be sure to include the offset
			if(page == 1){
				
				// Calculate the amount we need to move (adjust for offset)
				var amt = (-1 * ((liL/3)+offset) * lisW) - (offset * lisW);
				$('#features_list_wrapper').css({ left : amt  });
				
				// Set Incrementer back to the 1/3 mark (or the first panel that is shown onload + 1 because of the offset)
				inc = ((liL / 3) + offset); 
			}
		}
	});

	
	
	$('#feature_panes_wrapper').animate({ left : lamt  }, 500, function(){
		//FWD
		if(dir == -1){
			// At the 3/4 mark we are going to adjust the CSS
			if(page == ((liL/3)*2)){
				
				// Calculate the amount we need to move
				var amt = (-1 * (liL/3) * lilW);
				$('#feature_panes_wrapper').css({ left : amt  });
				
				// Set Incrementer back to the 1/3 mark (or the first panel that is shown onload)
				inc = (liL / 3);
			}
		}
		//REV
		if(dir == 1){
			if(page == 1){
				
				// At the first item we are going to adjust the CSS + be sure to include the offset
				var amt = (-1 * ((liL/3)+offset) * lilW);
				$('#feature_panes_wrapper').css({ left : amt  });
				
				// Set Incrementer back to the 1/3 mark (or the first panel that is shown onload + 1 because of the offset)
				inc = ((liL / 3) + offset); 
			}
		}
	});
	
}

function init(){
	cloner();
	
	jQuery('#feature_arrows li.fwd a').click(function(){
		 animate = false;
		 adv();
		 return false;
	})

	jQuery('#feature_arrows li.rev a').click(function(){
		 animate = false;
		 rev();
		 return false;
	})

}	

function _autoAdvance() {
    if (animate == true) {
	    adv();			
    }
}


$(document).ready(function () {
  
	liL		= $('#features_list_container li').length
	lisW 	= 323; 				// make sure to add margins & padding width = 322px + 1px right-margin
	lilW 	= 980; 				// make sure to add margins & padding width = 322px + 1px right-margin
	limb 	= 1; 				// li to move by
	offset 	= 1;				// Featurette offest (moves X items to the left)
	animate = true;	
	inc 	= liL;				// Set incrementer at the position of the first panel shown onload
	
	
	// NOTE: workaround added by joe since everyTime was giving errors 7/4/2011
	// setInterval(_autoAdvance, 4000);
	
	/* $(document).everyTime(10000, "features", function(i) {
		if (animate == true) {
			adv();			
		}
	}); */ 

	init();
  
});