var backImage = new Array(); // don't change this
var imgNum = 0;

//Images
backImage[0] = "templates/img/bgAboutUs1.jpg";
backImage[1] = "templates/img/bgAboutUs2.jpg";
backImage[2] = "templates/img/bgAboutUs3.jpg";
// backImage[3] = "";

//document.getElementById('bgChanger2').style.backgroundImage = 'url('+backImage[0]+')';
timeoutChange = setTimeout( "changeBGImageLoop()", 8000);

function SetColor(id,cr){
	document.getElementById(id).style.color = cr;
}

preLoadBackgrounds(backImage[0],backImage[1],backImage[2]);

function changeBGImage(whichImage){
	imgNum=whichImage;
	for(iNum = 1; iNum <= backImage.length; iNum++ ){
		element = "bgChangerBtn"+iNum;
		SetColor(element,'white');
	}
	element = "bgChangerBtn"+(imgNum+1);
	SetColor(element,'red');
	
	clearTimeout(timeoutChange);
	timeoutChange = setTimeout( "changeBGImageLoop("+imgNum+")", 7000);
	if (document.body){
		FadeInImage('bgChanger2',backImage[whichImage],'bgChanger1')
	}
}
function changeBGImageLoop(){
	for(iNum = 1; iNum <= backImage.length; iNum++ ){
		element = "bgChangerBtn"+iNum;
		SetColor(element,'white');
	}
	imgNum=(imgNum+1)%backImage.length;
	element = "bgChangerBtn"+(imgNum+1);
	SetColor(element,'red');
	timeoutChange = setTimeout( "changeBGImageLoop()", 8000);

	if (document.body){
		FadeInImage('bgChanger2',backImage[imgNum],'bgChanger1')
	}

}

function changerSetOpacity(object,opacityPct)
{
  // IE.
  object.style.filter = 'alpha(opacity=' + opacityPct + ')';
  // Old mozilla and firefox
  object.style.MozOpacity = opacityPct/100;
  // Everything else.
  object.style.opacity = opacityPct/100;
}
function ChangeOpacity(id,msDuration,msStart,fromO,toO)
{
  var element=document.getElementById(id);
  var opacity = element.style.opacity * 100;
  var msNow = (new Date()).getTime();
  opacity = fromO + (toO - fromO) * (msNow - msStart) / msDuration;
  if (opacity<0) 
    changerSetOpacity(element,0)
  else if (opacity>100)
    changerSetOpacity(element,100)
  else
  {
    changerSetOpacity(element,opacity);
    element.timer = window.setTimeout("ChangeOpacity('" + id + "'," + msDuration + "," + msStart + "," + fromO + "," + toO + ")",1);
  }
}
function FadeIn(id)
{
  var element=document.getElementById(id);
  if (element.timer) window.clearTimeout(element.timer); 
  var startMS = (new Date()).getTime();
  element.timer = window.setTimeout("ChangeOpacity('" + id + "',1000," + startMS + ",0,100)",1);
}
function FadeOut(id)
{
  var element=document.getElementById(id);
  if (element.timer) window.clearTimeout(element.timer); 
  var startMS = (new Date()).getTime();
  element.timer = window.setTimeout("ChangeOpacity('" + id + "',1000," + startMS + ",100,0)",1);
}
function FadeInImage(foregroundID,newImage,backgroundID)
{
  var foreground=document.getElementById(foregroundID);
  if (backgroundID)
  {
    var background=document.getElementById(backgroundID);
    if (background)
    {
      background.style.backgroundImage = foreground.style.backgroundImage;
    }
  }
  changerSetOpacity(foreground,0);
  foreground.style.backgroundImage = 'url(' + newImage + ')';;
  if (foreground.timer) window.clearTimeout(foreground.timer); 
  var startMS = (new Date()).getTime();
  foreground.timer = window.setTimeout("ChangeOpacity('" + foregroundID + "',2000," + startMS + ",0,100)",1);
}

function preLoadBackgrounds(){
  for(i=0;i<arguments.length;i++){
    this[i]=new Image()
    this[i].src=arguments[i]
  }
  return this
}