var FADE=1;
var t;
var t2;
var t3;
imgCycle=1;

function hilightON(element) {
  element.style.backgroundImage="url(../images/nav/rollover-bg.png)";
  element.style.backgroundPosition="center center";
  element.style.backgroundRepeat="no-repeat";
}

function hilightOFF(element) {
  element.style.backgroundImage="";
}

function showMenu(id) {
  document.getElementById(id).style.visibility="visible";
  //fadeIn(id,0);
}

function hideMenu(id) {
  document.getElementById(id).style.visibility="hidden";
  //fadeOut(id,0);
}

function changeBG(element,color) {
  element.style.backgroundColor = color;
}

// fade in an element
function fadeIn(identity,opacity) {
  id = identity;
  if(FADE) {
    opac = opacity;
  }
  else {
    opac = 100;
  }
  if(opac<100) {                                   //100 is 100% opacity
    opac = opac + 4;                               //increase the opacity by 2
    setOpacity(id,opac);                        //set new value of opacity for the image
    t = setTimeout("fadeIn(id,opac)",100);        //delays the function for a slow fade
  }
  else {
    //FADE = 0;
  }
}

// set the opacity of an element for any type of browser
function setOpacity(identity,opacity) {
  var id = identity;
  var opac = opacity;
  document.getElementById(id).style.opacity = opac/100;                  //new Mozilla and Safari
  document.getElementById(id).style.filter = "alpha(opacity:"+opac+")";  //IE
  document.getElementById(id).style.KHTMLOpacity = opac/100;             //old Safari and Konqueror
  document.getElementById(id).style.MozOpacity = opac/100;               //old Mozilla
}

// fade out an element
function fadeOut(identity,opacity) {
  id = identity;
  opac = opacity;
  clearTimeout(t);                                 //stop the fadeIn cycle
  setOpacity(id,opac);
  FADE = 1;
}


//function to cycle images in and out
//imgOut = image that needs to be faded out (on its way out)
//imgIn = image that naees to be faded in
function startImageCycle() {
  t3 = setTimeout("cycleImages()",6000);
}

function cycleImages() {
  id1 = "img1";
  id2 = "img2";
  //if the first image is visible
  if (imgCycle == 1) {
    imgOut = id1;
    imgIn = id2;
    imgCycle = 2;
  }
  else if (imgCycle == 2) {
    imgOut = id2;
    imgIn = id1;
    imgCycle = 1;
  }

  setOpacity(imgIn,0);                                         // make sure the new image starts with opacity=0
  setOpacity(imgOut,100);
  swapImg(imgOut,imgIn,0);
  t2 = setTimeout("cycleImages()",6000);
}

function swapImg(imgOut,imgIn,opacity) {
  visibility = opacity;
  var invertOpac;
  idOut = imgOut;
  idIn = imgIn;
  if (visibility<100) {
    visibility = visibility + 4;
    invertVisi = 100-visibility;
    setOpacity(idOut,invertVisi);
    setOpacity(idIn,visibility);
    t = setTimeout("swapImg(idOut,idIn,visibility)",100);        //delays the function for a slow fade
  }
  else {
    setOpacity(idOut,0);
    setOpacity(idIn,100);
  }
}

function getOpacity(id) {
  if (document.getElementById(id).style.opacity) {
    return document.getElementById(id).style.opacity * 100;
  }
  else if (document.getElementById(id).style.filter) {
    return document.getElementById(id).style.filter;
  }
  else if (document.getElementById(id).style.KHTMLOpacity) {
    return document.getElementById(id).style.KHTMLOpacity * 100;
  }
  else {
    return document.getElementById(id).style.MozOpacity * 100;
  }
}

//center the background position
function bodyBgPosition() {
  var x = 0;
  if (window.innerHeight) {
    x = window.innerWidth;
  }
  else if (document.documentElement && document.documentElement.clientHeight) {
    x = document.documentElement.clientWidth;
  }
  else if (document.body) {
    x = document.body.clientWidth;
  }

  document.body.style.backgroundPosition=(x-760)/2-85;
}