var wantScroll = 0;
var s = null;
var v = null;
var speed = 50;
var dir = 0;
var wasDir = 0;

function onTimeout()
{
    if (s == null)
    	s = document.getElementById('screenshots_view');

    if (v == null)
    	v = document.getElementById('screenshots_scroller');

    if (s != null && v != null)
    {
		var curScroll = Number(s.style.left.substr(0, s.style.left.length - 2));

        if (dir != 0)
		{
			curScroll += dir * speed;

			if (curScroll > 0)
				curScroll = 0;
			if (curScroll < -57*221 + v.offsetWidth)
				curScroll = -57*221 + v.offsetWidth;

    	    s.style.left = curScroll + 'px';
    	    wasDir = dir;
        }
        else if (wasDir != 0)
        {
        	var img = Math.floor(curScroll / 221);

        	if (wasDir != 0)
        	{
				if (wasDir > 0)
					img++;

        		var wantScroll = img * 221;
				if (wantScroll > 0)
					wantScroll = 0;
				if (wantScroll < -57*221 + v.offsetWidth)
					wantScroll = -57*221 + v.offsetWidth;

        		if (Math.abs(curScroll - wantScroll) > speed)
	       			curScroll += wasDir * speed;
	       		else
	       		{
        			curScroll = wantScroll;
        			wasDir = 0;
        		}

				s.style.left = curScroll + 'px';
        	}
        }
    }

  	window.setTimeout(onTimeout, 50);
}

function Scroll(ofs)
{
    r = document.getElementById('rightbtn');
    l = document.getElementById('leftbtn');

    r.style.backgroundColor = ofs < 0 ? '#808080' : '#C0C0C0';
    l.style.backgroundColor = ofs > 0 ? '#808080' : '#C0C0C0';

  	dir = ofs;
}

function StartScroller()
{
	window.setTimeout(onTimeout, 50);
}