//setup the left to keep track of position
var left = 0;
var container_width = 0;
var move_width = 0;
var display_num = 0;

jQuery(document).ready(function($){
	//get the containers width'
	container_width = $(".video_images").length * $(".video_images").width();
	
	//get the move width
	move_width = $(".video_images").width();
	
	//set the display num
	display_num = Math.round($("#youtube_container").width() / move_width);
	
	//set the containers width
	$("#video_container").width(container_width);
});

function animate(direction){
	//check if it is animated
	if($("#video_container").is(":animated")){
		return false;
	}
	
	//go the direction
	switch(direction){
		case 'left':
			//set the left
			left -= move_width;
		
			//check that it doesnt go past the start
			if(left < 0){
				left = 0;
				return false;
			} else {	
				//animate the container
				$("#video_container").animate({"left": "+="+move_width+"px"}, "slow", function(){
					checkButtons();
				});
			}	
			break;
		
		case 'right':
			//set the left
			left += move_width;
			
			//if the offset is greater than than the total_width dont move
			if(left > (container_width - (move_width * display_num))){
				left = (container_width - (move_width * display_num));
				return false;
			} else {
				$("#video_container").animate({"left": "-="+move_width+"px"}, "slow", function(){
					checkButtons();
				});
			}
			break;
	}

}

function checkButtons(){
	//check the previous button
	if(left > 0){
		$("#videos_prev").show();
	} else {
		$("#videos_prev").hide();
	}
	
	//check the next button
	if(left == (container_width - (move_width * display_num))){
		$("#videos_next").hide();
	} else {
		$("#videos_next").show();
	}
}