var zegar_klient = null;

function align_klienci(){
	var width = parseInt($(".klient:eq(0)").css('width'));	
	var max_left = parseInt($("#klienci").css('width'));
	
	
	var i=0;
	var colors = ['red','blue','pink','yellow','orange','navy','purple','green','gray','black'];
	$(".klient").each(function(){
		if(i*width > max_left){
			$(this).css({'left' : i*width, /*'background' : colors[i],*/ 'opacity' : 0});
		}else{
			$(this).css({'left' : i*width, /*'background' : colors[i]*/});
		}
		i++;
	});
}



function animate_klienci(el){
	var width = parseInt($(".klient:eq(0)").css('width'));
	var max_left = parseInt($("#klienci").css('width'));
	var c_pos = parseInt(el.css('left'));	
		
	if(c_pos < 0){
		var ratio = width + c_pos;
		el.css({'left' : c_pos - 1, 'opacity' : ratio/100});
	}else if((c_pos < max_left) && (c_pos > max_left - width)){
		var ratio = max_left - c_pos;
		el.css({'left' : c_pos - 1, 'opacity' : ratio/100});
	}else{
		el.css({'left' : c_pos - 1});
	}
	
	
	
	
	if(parseInt(el.css('left')) <= -width){
		var clone = el.clone();
		clone.css({'left' : parseInt($(".klient:last").css('left')) + width -1, 'opacity' : '1' });
		$("#klienci").append(clone);
		el.remove();					
	}		
	
}


function toggle_klienci(){
	
	$(".klient").each(function(){
		animate_klienci($(this));			
	});
		
}




$(document).ready(function(){
	align_klienci();
	
	
	zegar_klient = setInterval(function(){
		toggle_klienci();	
	},50);
	
});