//<!--
var margin = 0;
var currentFlag = 1;
var endFlags = 4; //this is the total number of flags minus the amount that is displayed plus 1
var flagHolder;
var pixelCounter = 0;
var pixelWidth = 42;
var loopSpeed = 10;

    
function Scroll(direction)
{
    
    if (direction == 'right')
    {
        currentFlag--;
    }
    else
    {
        currentFlag++;
    }
    MoveFlags(direction);
    ShowButtons();
}

function InitFlagScroller()
{
    currentFlag = 1;
    ShowButtons();

    flagHolder = document.getElementById("FlagList");
    flagHolder.style.position = 'absolute';
    //I have used margin as mozilla seems to have a problem with flagHolder.style.left
    flagHolder.style.marginLeft = margin + "px";
}

function ShowButtons()
{
    
    document.getElementById("ScrollLeft").style.display = (currentFlag == endFlags ? "none" : "block");
    document.getElementById("ScrollRight").style.display = (currentFlag == 1 ? "none" : "block");
}

function MoveFlags(direction)
{
    pixelCounter++;
    if (pixelCounter < pixelWidth)
    {
        if (direction == 'right')
        {
            margin++;
        }
        else
        {
            margin--;
        }
        flagHolder.style.marginLeft = margin + "px";
        setTimeout("MoveFlags('" + direction + "')", loopSpeed);
    }
    else 
    {
        pixelCounter = 0;
        return false;
    }
}

window.onload = function()
{
    InitFlagScroller();
}

//-->