var strExpandImage = '/App_Images/button_addFiles.jpg';
var strCollapseImage = '/App_Images/button_hideFiles.jpg';
var intSpeed = 15;
var itnIncrement = 5;
var intTimer;
var intCalculatedHeight;

function fnToggleDiv(pnlControlToShow, imgState) 
{
    var ctlPanel = document.getElementById(pnlControlToShow);
    if (ctlPanel.style.display != "block") 
    {
        if (imgState) {document.getElementById(imgState).setAttribute('src', strCollapseImage);}
        ShowPanel(pnlControlToShow);
        Expand(pnlControlToShow);
    }
    else 
    {
        if (imgState)
        {document.getElementById(imgState).setAttribute('src', strExpandImage);}
        Collapse(pnlControlToShow);
    }
}

function Expand(pnlName)
{
    var ctlPanel = document.getElementById(pnlName);
    var intHeight = ctlPanel.offsetHeight;
    if (intHeight < intCalculatedHeight)
    {
        ctlPanel.style.height = intHeight + itnIncrement + "px";
        intTimer = setTimeout("Expand('" + pnlName + "')", intSpeed);
    }
    else
    {
        clearTimeout(intTimer);
    }
}

function Collapse(pnlName)
{
    var ctlPanel = document.getElementById(pnlName);
    var intHeight = ctlPanel.offsetHeight;
    if (intHeight > itnIncrement)
    {
        ctlPanel.style.height = intHeight - itnIncrement + "px";
        intTimer = setTimeout("Collapse('" + pnlName + "')", intSpeed);
    }
    else 
    {
        clearTimeout(intTimer);
        ctlPanel.style.height = "100%";
        ctlPanel.style.display = "none";
    }
}

function ShowPanel(pnlName)
{
    var div = document.getElementById(pnlName);
    div.style.display = "block";
    intCalculatedHeight = div.offsetHeight;
    div.style.height = "0px";
}