function fadeX(objToFadeID, IsFadeIn, timeToFade, delay)
{
//objToFadeID - Object ID of the Div or object you want to fade
//IsFadeIn - Is this a fade in (vs fade out) 1 = true, 0 = false
//timeToFade - Time in ms to fade the object
//delay - Time in ms to delay the fade

var objToFade = document.getElementById(objToFadeID);
if(objToFade == null)
return;

var fadeXFactor = IsFadeIn==1?1:-1; // used to reverse values for fade in vs out

if ((timeToFade==0)&&(delay==0))
{
//if this is a simple instant popup, then make the settings are return
objToFade.style.background = 1*IsFadeIn;
objToFade.style.filter = 'alpha(opacity = ' + 100*IsFadeIn + ')';
objToFade.fadeState=2*fadeXFactor;
return;
}

if (delay == null)
delay = 0;

if (IsFadeIn)
objToFade.OriginalFadeInTime = timeToFade;
else
objToFade.OriginalFadeOutTime = timeToFade;

if(objToFade.fadeState != null)
{

if ((objToFade.fadeState==1*fadeXFactor)||(objToFade.fadeState==2*fadeXFactor)||(objToFade.fadeState==3*fadeXFactor))
{
return; //Current fade is in same direction or already there so we are OK;
}
else if (objToFade.fadeState==-1*fadeXFactor)
{
//reverse the time and the fade direction and let it continue
objToFade.fadeState = 1*fadeXFactor;
objToFade.timeToFade = timeToFade;
if (IsFadeIn)
{
objToFade.fadeTimeLeft = timeToFade*(1-objToFade.fadeTimeLeft/objToFade.OriginalFadeOutTime);
}
else
{
objToFade.fadeTimeLeft = timeToFade*(1-objToFade.fadeTimeLeft/objToFade.OriginalFadeInTime);
}

return;
}
else if (objToFade.fadeState==-3*fadeXFactor)
{
// NEW THINGY
var objFading = document.getElementById(objFadingID);
//object is in hold status but direction needs to be reversed and use the passed in time value
objToFade.fadeState=3*fadeXFactor;
objToFade.timeToFade = timeToFade;
if (IsFadeIn)
{
objToFade.fadeTimeLeft = timeToFade*(1-objToFade.fadeTimeLeft/objToFade.OriginalFadeOutTime);
}
else
{
objToFade.fadeTimeLeft = timeToFade*(1-objToFade.fadeTimeLeft/objToFade.OriginalFadeInTime);
}
return;
}
}

//if we got this far, then the object is in the fully opposite state
objToFade.timeToFade = timeToFade;
objToFade.fadeTimeLeft = timeToFade;
objToFade.fadeState = 3*fadeXFactor;
var now = new Date();
now.setMilliseconds(now.getMilliseconds() + delay);
setTimeout("animateFade(" + now.getTime() + ",'" + objToFadeID + "')", 10 + delay);
}

function animateFade(lastTick, elementID)
{
var curTick = new Date().getTime();
var elapsedTicks = curTick - lastTick;

var element = document.getElementById(elementID);
if (element.fadeState==3) element.fadeState=1;
if (element.fadeState==-3) element.fadeState=-1;

if(element.fadeTimeLeft <= elapsedTicks)
{
element.style.opacity = element.fadeState == 1 ? '1' : '0';
element.style.filter = 'alpha(opacity = ' + (element.fadeState == 1 ? '100' : '0') + ')';
element.fadeState = element.fadeState == 1 ? 2 : -2;
return;
}

element.fadeTimeLeft -= elapsedTicks;
var newOpVal = element.fadeTimeLeft/element.timeToFade;
if(element.fadeState == 1)
newOpVal = 1 - newOpVal;
element.style.opacity = newOpVal;
element.style.filter = 'alpha(opacity = ' + (newOpVal*100) + ')';

setTimeout("animateFade(" + curTick + ",'" + elementID + "')", 10);
}
function fadeXout(objFading, IsFadeIn, timeToFade, delay) {
var objToFade = document.getElementById(objToFadeID);
if(objToFade == null)
return;

var fadeXFactor = IsFadeIn==1?1:-1; // used to reverse values for fade in vs out

if ((timeToFade==0)&&(delay==0))
{
//if this is a simple instant popup, then make the settings are return
objToFade.style.opacity = 1*IsFadeIn;
objToFade.style.filter = 'alpha(opacity = ' + 100*IsFadeIn + ')';
objToFade.fadeState=2*fadeXFactor;
return;
}

if (delay == null)
delay = 0;

if (IsFadeIn)
objToFade.OriginalFadeInTime = timeToFade;
else
objToFade.OriginalFadeOutTime = timeToFade;

if(objToFade.fadeState != null)
{

if ((objToFade.fadeState==1*fadeXFactor)||(objToFade.fadeState==2*fadeXFactor)||(objToFade.fadeState==3*fadeXFactor))
{
return; //Current fade is in same direction or already there so we are OK;
}
else if (objToFade.fadeState==-1*fadeXFactor)
{
//reverse the time and the fade direction and let it continue
objToFade.fadeState = 1*fadeXFactor;
objToFade.timeToFade = timeToFade;
if (IsFadeIn)
{
objToFade.fadeTimeLeft = timeToFade*(1-objToFade.fadeTimeLeft/objToFade.OriginalFadeOutTime);
}
else
{
objToFade.fadeTimeLeft = timeToFade*(1-objToFade.fadeTimeLeft/objToFade.OriginalFadeInTime);
}

return;
}
else if (objToFade.fadeState==-3*fadeXFactor)
{
// NEW THINGY
var objFading = document.getElementById(objFadingID);
//object is in hold status but direction needs to be reversed and use the passed in time value
objToFade.fadeState=3*fadeXFactor;
objToFade.timeToFade = timeToFade;
if (IsFadeIn)
{
objToFade.fadeTimeLeft = timeToFade*(1-objToFade.fadeTimeLeft/objToFade.OriginalFadeOutTime);
}
else
{
objToFade.fadeTimeLeft = timeToFade*(1-objToFade.fadeTimeLeft/objToFade.OriginalFadeInTime);
}
return;
}
}

//if we got this far, then the object is in the fully opposite state
objToFade.timeToFade = timeToFade;
objToFade.fadeTimeLeft = timeToFade;
objToFade.fadeState = 3*fadeXFactor;
var now = new Date();
now.setMilliseconds(now.getMilliseconds() + delay);
setTimeout("animateFade(" + now.getTime() + ",'" + objToFadeID + "')", 10 + delay);
}

function animateFade(lastTick, elementID)
{
var curTick = new Date().getTime();
var elapsedTicks = curTick - lastTick;

var element = document.getElementById(elementID);
if (element.fadeState==3) element.fadeState=1;
if (element.fadeState==-3) element.fadeState=-1;

if(element.fadeTimeLeft <= elapsedTicks)
{
element.style.opacity = element.fadeState == 1 ? '1' : '0';
element.style.filter = 'alpha(opacity = ' + (element.fadeState == 1 ? '100' : '0') + ')';
element.fadeState = element.fadeState == 1 ? 2 : -2;
return;
}

element.fadeTimeLeft -= elapsedTicks;
var newOpVal = element.fadeTimeLeft/element.timeToFade;
if(element.fadeState == 1)
newOpVal = 1 - newOpVal;
element.style.opacity = newOpVal;
element.style.filter = 'alpha(opacity = ' + (newOpVal*100) + ')';

setTimeout("animateFade(" + curTick + ",'" + elementID + "')", 10);
}