// preload nav images

aboutOver = new Image();
aboutOver.src = "/images/nav/about-ovr.gif"
aboutOff = new Image();
aboutOff.src = "/images//nav/about-off.gif"

servicesOver = new Image();
servicesOver.src = "/images/nav/services-ovr.gif"
servicesOff = new Image();
servicesOff.src = "/images//nav/services-off.gif"

portfolioOver = new Image();
portfolioOver.src = "/images/nav/portfolio-ovr.gif"
portfolioOff = new Image();
portfolioOff.src = "/images//nav/portfolio-off.gif"

contactOver = new Image();
contactOver.src = "/images/nav/contact-ovr.gif"
contactOff = new Image();
contactOff.src = "/images//nav/contact-off.gif"

// preload recent work images
sampleWork1 = new Image();
sampleWork1.src = "/images/samplework1.jpg"
sampleWork2 = new Image();
sampleWork2.src = "/images/samplework2.jpg"
sampleWork3 = new Image();
sampleWork3.src = "/images/samplework3.jpg"
sampleWork4 = new Image();
sampleWork4.src = "/images/samplework4.jpg"
sampleWork5 = new Image();
sampleWork5.src = "/images/samplework5.jpg"

function swapImage(imageName,imageFile) { //standard image swapping function
if (document.images) {eval('document.images[imageName].src='+imageFile+'.src');}
else return;
}

var n=0
var nextFade
function startCrossfade() {
	clearInterval(nextFade);
	n++; if(n>5) n = 1;
	crossfadeImage('mainPic', 'blendPic','sampleWork'+n);
	nextFade = setInterval("startCrossfade()", 5000);

}

function crossfadeImage(bottomImage, topImage, imageToSwap) {

  globalDivID = bottomImage;
  globalImageID = topImage;

	if (document.getElementById(topImage).src.indexOf(eval(imageToSwap+".src")) == -1) {

  	// Set the background image to the currently displaying image
        // This is now done on HTML render and when fade is complete
		document.getElementById(bottomImage).style.backgroundImage = "url(" + document.getElementById(topImage).src + ")";
  
  	// Set the top image to invisible
		setOpacity(0, topImage);

  	// Set the top image to the target image
		document.getElementById(topImage).src = eval(imageToSwap+".src");
    
  	// Slowly fade in the top image back to visible
		fadeElementSetup(topImage, 0, 100, 10);

//  } else {

	 // alert("Already Set");

	}
}

function fadeElementSetup(theID, fdStart, fdEnd, fdSteps) {
  fadeSteps = fdSteps;
  fadeCurrent = 0;
  fadeAmount = (fdStart - fdEnd) / fadeSteps;
  fadeTimer = setInterval("fadeElement('"+theID+"')", 50);
}

function fadeElement(theID) {
  fadeCurrent++;
  // Set the opacity depending on if we're adding or subtracting (pos or neg)
  if (fadeAmount < 0) {
    setOpacity(Math.abs(fadeCurrent * fadeAmount), theID);
  } else {
    setOpacity(100 - (fadeCurrent * fadeAmount), theID);
  }
  if (fadeCurrent == fadeSteps) {
    // We're done, so clear
    clearInterval(fadeTimer);

    // Here's "mininfo" specific code, that sets the background to be prepared for the next fade
    // Set the background image to the currently displaying image
    document.getElementById(globalDivID).style.backgroundImage = "url(" + document.getElementById(globalImageID).src + ")";

  }
}

function setOpacity(opacity, theID) { 

  var object = document.getElementById(theID).style;

  // If it's 100, set it to 99 for Firefox.

  if (navigator.userAgent.indexOf("Firefox") != -1) {
    if (opacity == 100) { opacity = 99.999; } // This is majorly retarded
  }

  // Multi-browser opacity setting

  object.filter = "alpha(opacity=" + opacity + ")"; // IE/Win
  object.KhtmlOpacity = (opacity / 100);            // Safari 1.1 or lower, Konqueror
  object.MozOpacity = (opacity / 100);              // Older Mozilla+Firefox
  object.opacity = (opacity / 100);                 // Safari 1.2, Firefox+Mozilla
}
var prevLayerName = "sample1";
function toggleLayer(layerName) {
	document.getElementById(prevLayerName).style.display = "none";
	document.getElementById(layerName).style.display = "block";
	prevLayerName = layerName;
}