var div;
var animation;
var li_total_width;
var pixels_p_sec;
var ratio;
var animation_timeout;
var li_width = 150;
var pixels_p_sec = 40;
var default_ratio = 4;
var mouseover = false;

$(document).ready(function() {
	if ($('div.scrollable_vw').length)
	{
		div = $('div.scrollable_vw');
		ul = $(div).find('ul');

		html = ul.html();
		$(ul).append(html)
		$(ul).append(html)

		li_total_width = 0;
		ul.find('img').each(function(){
			li_total_width = li_width + li_total_width;
		});
		ul.width(li_total_width);

		total_time = calc_total_time(1);

		div_offset = div.offset();
		div_offset_x = div_offset.left;

		div.css({overflow: 'hidden'});

		start_animation('left', total_time);

		div.live('mouseover mousemove', function(e) {
			clearTimeout(animation_timeout);
			mouseover = true;

			mouse_offset = e.pageX-div_offset_x;
			div_middle = div.width()/2;
			div_middle_movable = div_middle-70;

			mouse_offset_mid = mouse_offset-div_middle;

			if(mouse_offset_mid > -70 && mouse_offset_mid < 70)
			{
				animation.stop(true);
			}
			else if(mouse_offset_mid < 0)
			{

				ratio_new = default_ratio-(default_ratio * ((div_middle-(-mouse_offset_mid)) / div_middle));
				if(ratio != ratio_new)
				{
					ratio = ratio_new;
					start_animation('right', calc_total_time(ratio));
	/* 				animation_timeout = setTimeout("start_animation('right', calc_total_time(ratio))", 40); */
				}
			}
			else
			{
				ratio_new = default_ratio-(default_ratio * ((div_middle-mouse_offset_mid) / div_middle));
				if(ratio != ratio_new)
				{
					ratio = ratio_new;
	/* 				start_animation('left', calc_total_time(ratio)) */
					animation_timeout = setTimeout("start_animation('left', calc_total_time(ratio))", 30);
				}
			}
		});


		div.live('mouseout', function(e){
			clearTimeout(animation_timeout);
			mouseover = false;
			animation_timeout = setTimeout("start_animation('left', calc_total_time(1))", 500);
		});

	}
});

function calc_total_time(ratio) 
{
	total_time = li_total_width / (pixels_p_sec * ratio) * 1000;
	return total_time;
}

function start_animation(direction, total_time) 
{

	if(animation)
	 animation.stop();


	if(direction == 'right')
	{
		scrollLeft = div.scrollLeft();
		ratio_scrollLeft = 1-scrollLeft/li_total_width;
		total_time_new = total_time * (1-ratio_scrollLeft);	
		
		animation = div.animate({
		    scrollLeft: '-='+(scrollLeft),
		    queue: false,
		  }, total_time_new, 'linear', function() {
		});
	}
	else
	{
		scrollLeft = div.scrollLeft()+div.width();
		ratio_scrollLeft = scrollLeft/li_total_width;
		total_time_new = total_time * (1-ratio_scrollLeft);	

		animation = div.animate({
		    scrollLeft: '+='+(li_total_width-scrollLeft),
		    queue: false,
		  }, total_time_new, 'linear', function() {
		});	
	}
	
}