var topMargin;
var eleHeight;
var holderHeight;
var scale = 0;
var scroll = false;

function toggleScroll(direction)
{
    scroll = !scroll;
    scale = 0;
    eleHeight = document.getElementById("leftScroller").offsetHeight;
    holderHeight = document.getElementById("holderScroller").offsetHeight;    
    changeMargin(direction, 1);
}

function killScroll()
{
    scroll = false;
}

function changeMargin(direction, size)
{
	 
    scale = scale + 1;
    if (scale > 50) { scale = 50; }
	if (direction == "down")	
	{
		var marg = document.getElementById("leftScroller").style.marginTop;
		if (marg != "") {
			marg = parseInt(marg.substring(0, marg.length - 2));
			marg = marg + (size * scale);
			if (marg > 0) { marg = 0; scroll = false; document.getElementById("scrollButtonUp").src = "../skin_default/template_images/scroll-up.gif"; }
		} else { scroll = false; }
		document.getElementById("leftScroller").style.marginTop = (marg) + "px";
		var strImage = document.getElementById("scrollButtonDown").src;
		if (strImage.indexOf("scroll-down-active.gif") < 0 ) { document.getElementById("scrollButtonDown").src = "../skin_default/template_images/scroll-down-active.gif"; };
		
	} else
	{
		var marg = document.getElementById("leftScroller").style.marginTop;
	
		if (marg != "") {
			marg = parseInt(marg.substring(0, marg.length - 2));
			marg = marg - (size * scale);
			if (marg < (holderHeight - eleHeight)) { marg = holderHeight - eleHeight; scroll = false; document.getElementById("scrollButtonDown").src = "../skin_default/template_images/scroll-down.gif"; } 
		} else { scroll = false; }
		document.getElementById("leftScroller").style.marginTop = (marg) + "px";	
		var strImage = document.getElementById("scrollButtonUp").src;
		if (strImage.indexOf("scroll-up-active.gif") < 0 ) { document.getElementById("scrollButtonUp").src = "../skin_default/template_images/scroll-up-active.gif"; };
	}
	topMargin = document.getElementById("leftScroller").style.marginTop;
    
    if (scroll == true) { setTimeout("changeMargin('" + direction + "' , " + size + ");", 100); }
}

function ImageStep(action)
{
    clearTimeout(myTime);
    if (action.toUpperCase() == "NEXT")
    {   
        imagePlay = false;
        activeImage = activeImage + 1;
        if (activeImage == imageList.length)
        { activeImage = 0; }
        document.getElementById("thebigpic").src="../imageupload/showimage.aspx?id=" + imageList[activeImage] + "&width=" + imageSize + "&height=" + imageSize;
        if (imagePlay)
        {
            PlayImage();
        }
    }
    if (action.toUpperCase() == "PREVIOUS")
    {   
        imagePlay = false;
        activeImage = activeImage - 1;
        if (activeImage == -1)
        { activeImage = imageList.length - 1; }
        document.getElementById("thebigpic").src="../imageupload/showimage.aspx?id=" + imageList[activeImage] + "&width=" + imageSize + "&height=" + imageSize;
    }
    if (action.toUpperCase() == "PLAY")
    {   
        imagePlay = true;
        ImageStep("playnext");
    }
    if (action.toUpperCase() == "STOP")
    {   
        imagePlay = false;
        clearTimeout(myTime);
    }
    if (action.toUpperCase() == "PLAYNEXT")
    {   
        if (imagePlay)
        {
            activeImage = activeImage + 1;
            if (activeImage == imageList.length)
            { activeImage = 0; }
            document.getElementById("thebigpic").src="../imageupload/showimage.aspx?id=" + imageList[activeImage] + "&width=" + imageSize + "&height=" + imageSize;
            PlayImage();
        }
    }

}

function PlayImage()
{
        if (imagePlay)
        {
            myTime = setTimeout("ImageStep('playnext')", 1500);
       }
}