// scrolling show/hide div.
// Usage: slidedown(objname) or slideup(objname) or ToggleSlideDiv(objname)
// Your div needs to be have the styles, display:none; and overflow:hidden; and a height: to start.
var timerlen = 5;
var slideAniLen = 300;

var timerID = new Array();
var startTime = new Array();
var obj = new Array();
var endHeight = new Array();
var moving = new Array();
var dir = new Array();

function slidedown(objname){
	if(moving[objname])
		return;
 
	if(document.getElementById(objname).style.display != "none")
		return; // cannot slide down something that is already visible
 
	moving[objname] = true;
	dir[objname] = "down";
	startslide(objname);
}
 
function slideup(objname){
	if(moving[objname])
		return;
 
	if(document.getElementById(objname).style.display == "none")
		return; // cannot slide up something that is already hidden
 
	moving[objname] = true;
	dir[objname] = "up";
	startslide(objname);
}

function startslide(objname){
	obj[objname] = document.getElementById(objname);
 
	endHeight[objname] = parseInt(obj[objname].style.height);
	startTime[objname] = (new Date()).getTime();
 
	if (dir[objname] == "down"){
		obj[objname].style.height = "1px";
	}
 
	obj[objname].style.display = "block";
 
	timerID[objname] = setInterval('slidetick(\'' + objname + '\');',timerlen);
}

function slidetick(objname){
	var elapsed = (new Date()).getTime() - startTime[objname];
 
	if (elapsed > slideAniLen)
		endSlide(objname)
	else {
		var d = Math.round(elapsed / slideAniLen * endHeight[objname]);
		var f = elapsed / slideAniLen;

		if (dir[objname] == "up") {
			d = endHeight[objname] - d;
			f = 1 - f;
		} 

		obj[objname].style.height = d + "px";
		obj[objname].style.opacity = f;
		obj[objname].style.filter = 'alpha(opacity='+(f*100)+')';
		document.getElementById(objname).value=f;
	}
 
	return;
}

function endSlide(objname){
	clearInterval(timerID[objname]);
 
	if(dir[objname] == "up"){
		obj[objname].style.display = "none";
		obj[objname].style.opacity = 0;
		obj[objname].style.filter = 'alpha(opacity='+(0)+')';
	}
	else{
		obj[objname].style.opacity = 1;
		obj[objname].style.filter = "";
	} 

	obj[objname].style.height = endHeight[objname] + "px";
 
	delete(moving[objname]);
	delete(timerID[objname]);
	delete(startTime[objname]);
	delete(endHeight[objname]);
	delete(obj[objname]);
	delete(dir[objname]);
 
	return;
}

function ToggleSlideDiv(divID) {
	if (document.getElementById(divID).style.display == 'block')
		slideup(divID);
	else
		slidedown(divID);
}

// Use this function with a setTimeout if you have a div with a dynamic height
function InitSlideDiv(objName) {
	var divStatus;

	if (document.getElementById(objName).style.display != "block")
		divStatus = "block";
	else
		ShowHideDiv(objName,'block');

	document.getElementById(objName).style.height=document.getElementById(objName).offsetHeight+'px';
	if (document.getElementById(objName).offsetHeight > slideAniLen) slideAniLen=parseInt(document.getElementById(objName).offsetHeight);

	if (divStatus != "block")
		ShowHideDiv(objName,'none');
}

// Non scrolling show/hide div. Your div needs a style setting of either display:none; or display:block to start.
function ShowHideDiv(divID,force) {
  if (document.getElementById(divID).style.display == 'block' && force != 'block')
    document.getElementById(divID).style.display = 'none';
  else if (document.getElementById(divID).style.display == 'none' && force != 'none')
    document.getElementById(divID).style.display = 'block';
}

function ShowHideFloatDiv(divID,force) {
  if (document.getElementById(divID).style.visibility == 'visible' && force != 'visible')
    document.getElementById(divID).style.visibility = 'hidden';
  else if (document.getElementById(divID).style.visibility == 'hidden' && force != 'hidden')
    document.getElementById(divID).style.visibility = 'visible';
}