var scrollspeed = 400;

	
$(document).ready(function(){
	var scrollanimation = 0;
	$('.scroll-container').each(function(){
		var scrollBlockNum = 0;
		$(this).children('.scroll-block').each(function(){

			var width = parseInt($(this).innerWidth());	
			$(this).parent('.scroll-container').attr('blockwidth',width);
			$(this).css({'left':width*scrollBlockNum});
			scrollBlockNum += 1;
		
		});
	});
		
	var hideBlocks = function()
	{
		$('.scroll-block').each(function(){
			var leftP = parseInt($(this).css('left'));
			var leftD = leftP;
			leftP = leftP + parseInt($(this).parent('.scroll-container').attr('blockwidth'))
			fullwidth = parseInt($(this).parent('.scroll-container').width()) + parseInt($(this).parent('.scroll-container').css('margin-right'));
			if (( $(this).parent('.scroll-container').width() < leftP ) || ( 0 > leftD ))
			{
				$(this).css({'left':fullwidth}).addClass('hide');
			};
			if (( $(this).parent('.scroll-container').width() > leftP ) && ( 0 <= leftD ))
			{
				$(this).css({'display':'block'});
				loadImage($(this).children('.loading-image'));
			};
		});
	};
	
	hideBlocks();
	
	$('.arrow-right').click(function(){
		var parentBlock = $(this).parent().children('.scroll-container');
		moveRight(parentBlock);
	});
	$('.arrow-left').click(function(){
		var parentBlock = $(this).parent().children('.scroll-container')
		moveLeft(parentBlock);
	});
	

	
});

var loadImage = function(image){
	var height = image.height()
	var width = image.width()
	image.not(' .loaded').parent('.scroll-block').append('<i class="loading-image-anim"><i></i></i>');
	image.not(' .loaded').parent('.scroll-block').children('.loading-image-anim').width(width).height(height).css({'display':'none'}).fadeIn(200);
	image.not(' .loaded').load(function() {
		$(this).parent('.scroll-block').children('.loading-image-anim').stop().fadeOut(200);
	});
	image.not(' .loaded').attr('src',image.attr('title')).attr('title','').addClass('loaded');
};

var moveLeft = function(parentBlock){	

	parentBlock.queue(function(){
		fullwidth = parseInt(parentBlock.width()) + parseInt(parentBlock.css('margin-right'));
		parentBlock.children('.scroll-block').last().css({left:0-parseInt(parentBlock.css('margin-right'))-parseInt(parentBlock.attr('blockwidth'))}).insertBefore(parentBlock.children('.scroll-block').first()).removeClass('hide')
		parentBlock.children('.scroll-block').not(' .hide').last().addClass('hide').stop().animate({'left':fullwidth},scrollspeed)
		var scrollBlockNum = 0;
		var blocksNum = parentBlock.children('.scroll-block').not(' .hide').size()
		parentBlock.children('.scroll-block').not(' .hide').each(function(){
		
			var width = parseInt($(this).innerWidth());	
			$(this).parent('.scroll-container').attr('blockwidth',width);
			$(this).stop().animate({'left':width*scrollBlockNum},scrollspeed,function(){parentBlock.clearQueue();});
			loadImage($(this).children('.loading-image'));
			scrollBlockNum += 1;
			
		});	

	});
	
};

var moveRight = function(parentBlock){

	parentBlock.queue(function(){
		fullwidth = parseInt(parentBlock.width()) + parseInt(parentBlock.css('margin-right'));
		parentBlock.children('.scroll-block').first().stop().animate({left:0-parseInt(parentBlock.children('.scroll-block').innerWidth())-parseInt(parentBlock.css('margin-left'))},scrollspeed,function(){$(this).css({'left':fullwidth})}).insertAfter(parentBlock.children('.scroll-block').last()).addClass('hide')
		parentBlock.children('.scroll-block.hide').first().removeClass('hide');
		var scrollBlockNum = 0;
		var blocksNum = parentBlock.children('.scroll-block').not(' .hide').size()
		parentBlock.children('.scroll-block').not(' .hide').each(function(){
		
			var width = parseInt($(this).innerWidth());	
			$(this).parent('.scroll-container').attr('blockwidth',width);
			$(this).stop().animate({'left':width*scrollBlockNum},scrollspeed,function(){parentBlock.clearQueue()});
			loadImage($(this).children('.loading-image'));
			scrollBlockNum += 1;
			
		});	
	});	


};

$(document).ready(function(){
	$('table.spec tr:even').addClass('even');
});