/*

Better(?) Image fader (C)2004 Patrick H. Lauke aka redux

Inspired by Richard Rutter / Clagnut http://www.clagnut.com/blog/1299/ 

Original concept and code adapted from Couloir http://www.couloir.org/ 

preInit "Scheduler" idea by Cameron Adams aka The Man in Blue
http://www.themaninblue.com/writing/perspective/2004/09/29/ 

*/

/* general variables */
var TIMEOUT = 2500;

var fadeTargetId = "logo"; /* change this to the ID of the fadeable object */
var nameTargetId = "name";
var quoteTargetId = "quote";
var linkTargetId = "link";

function fadeInit() {
	if (document.getElementById) {
		/* get a handle on the fadeable object, to make code later more manageable */
		display();

		/* set the initial opacity in a (hopefully) cross browser way
		notice that because of the way the image is in front, and not obfuscated
		by another object we need to "fade out", i don't need a fallback mechanism
		to show/hide the covering object...the image is just there, full stop */
		var i = 0;
		var fadeTarget = document.getElementById(fadeTargetId + i);
		while (fadeTarget)
		{
			if (fadeTarget.style.MozOpacity!=null) {  
				/* Mozilla's pre-CSS3 proprietary rule */
				fadeTarget.style.MozOpacity = 0;
			} else if (fadeTarget.style.opacity!=null) {
				/* CSS3 compatible */
				fadeTarget.style.opacity = 0;
			} else if (fadeTarget.style.filter!=null) {
				/* IE's proprietary filter */
				fadeTarget.style.filter = "alpha(opacity=0)";
			}
			/* make the object visible again */
			fadeTarget.style.visibility = 'visible';
			i++;
			fadeTarget = document.getElementById(fadeTargetId + i);
		}
		window.setTimeout("fadeIn(0)", 500);
	}
}

function fadeIn(opacity) {
	if (opacity <= 100) {
		var i = 0;
		var fadeTarget = document.getElementById(fadeTargetId + i);
		while (fadeTarget)
		{
			if (fadeTarget.style.MozOpacity!=null) {
				/* Mozilla's pre-CSS3 proprietary rule */
				fadeTarget.style.MozOpacity = (opacity/100)-.001;
				/* the .001 fixes a glitch in the opacity calculation which normally results in a flash when reaching 1 */
			} else if (fadeTarget.style.opacity!=null) {
				/* CSS3 compatible */
				fadeTarget.style.opacity = (opacity/100)-.001;
			} else if (fadeTarget.style.filter!=null) {
				/* IE's proprietary filter */
				fadeTarget.style.filter = "alpha(opacity="+opacity+")";
				/* worth noting: IE's opacity needs values in a range of 0-100, not 0.0 - 1.0 */ 
			}
			i++;
			fadeTarget = document.getElementById(fadeTargetId + i);
		}
		opacity += 10;
		window.setTimeout("fadeIn("+opacity+");", 30);
	}
	else
	{
		window.setTimeout("fadeOut(100);", TIMEOUT);
	}
}

function fadeOut(opacity) {
	if (opacity >= 0)
	{
		var i = 0;
		var fadeTarget = document.getElementById(fadeTargetId + i);
		while (fadeTarget)
		{
			if (fadeTarget.style.MozOpacity!=null) {
				/* Mozilla's pre-CSS3 proprietary rule */
				fadeTarget.style.MozOpacity = (opacity/100)-.001;
				/* the .001 fixes a glitch in the opacity calculation which normally results in a flash when reaching 1 */
			} else if (fadeTarget.style.opacity!=null) {
				/* CSS3 compatible */
				fadeTarget.style.opacity = (opacity/100)-.001;
			} else if (fadeTarget.style.filter!=null) {
				/* IE's proprietary filter */
				fadeTarget.style.filter = "alpha(opacity="+opacity+")";
				/* worth noting: IE's opacity needs values in a range of 0-100, not 0.0 - 1.0 */ 
			}
			i++;
			fadeTarget = document.getElementById(fadeTargetId + i);
		}
		opacity -= 10;
		window.setTimeout("fadeOut("+opacity+");", 30);
	}
	else
	{
		display();
		window.setTimeout("fadeIn(0);", 30);
	}
}

function isDisplayed(displayedClients, clientIndex) {
  var result = false;
  for (var i = 0; i < displayedClients.length; i++) {
    if (displayedClients[i] == clientIndex) {
      result = true;
      break;
    }
  }
  return result;
}

function display() {
  var displayedClients = new Array();
  for (var i = 0; i < numClients; i++) {
    var clientIndex = -1;
    do {
      clientIndex = Math.floor(Math.random() * clients.length);
    } while (isDisplayed(displayedClients, clientIndex));

    displayedClients.push(clientIndex);

    var client = clients[clientIndex];

    var fadeTarget = document.getElementById(fadeTargetId + i);
    var nameTarget = document.getElementById(nameTargetId + i);
    var linkTarget = document.getElementById(linkTargetId + i);

    if (bQuote && client.quote) {
      document.getElementById(quoteTargetId + i).innerHTML = client.quote;
    } else {
      document.getElementById(quoteTargetId + i).innerHTML = "";
    }

    nameTarget.innerHTML = client.name;
    if (bLink) {
      nameTarget.href = client.homeUrl;
      linkTarget.href = client.homeUrl;
    }

    if (bQuote && client.logoQuote) {
      fadeTarget.src = "/images/client/" + client.logoQuote;
    } else {
      fadeTarget.src = "/images/client/" + client.logo;
    }
    fadeTarget.alt = name;
    fadeTarget.title = name;
  }
}

var clients = new Array();
var numClients;
var bLink;
var bQuote;
var bFade;
var bCascade;
if (location.pathname == "/" || location.pathname == "/index.shtml") {
  numClients = 1;
  bLink = false;
  bQuote = true;
  bFade = true;
  bCascade = true;
  document.write("<br />");
} else if (location.pathname == "/clients/" || location.pathname == "/clients/Default.asp") {
  numClients = 9;
  bLink = true;
  bQuote = false;
  bFade = true;
  bCascade = false;
  document.write("<span style=\"display:none;\" id=\"intro\"><br /><p>Our clients include...</p></span>");
} else {
  numClients = 3;
  bLink = true;
  bQuote = false;
  bFade = false;
  bCascade = false;
  document.write("<span style=\"display:none;\" id=\"intro\"><br /><p>Our clients include...</p></span>");
}

document.write("<div");
if (bCascade) {
  document.write(" id=\"container\"");
}
document.write(" style=\"text-align:center;\">");
for (var i = 0; i < numClients; i++) {
  if (bLink) {
    document.write("<a target=\"_blank\" id=\"" + linkTargetId + i + "\">");
  }
  document.write("<img id=\"" + fadeTargetId + i + "\" style=\"border: 0px none;\" />");
  if (bLink) {
    document.write("</a>");
  }
  document.write("<br />");
  if (bLink) {
    document.write("<a target=\"_blank\" id=\"" + nameTargetId + i + "\" class=\"names\"></a>");
  } else {
    document.write("<div id=\"" + nameTargetId + i + "\" class=\"names\"></div>");
  }
  document.write("<div id=\"" + nameTargetId + i + "\" class=\"names\"></div>");
  document.write("<div id=\"" + quoteTargetId + i + "\" class=\"quotes\"></div>");
  document.write("<br /><br /><br />");
}
document.write("</div>");

var xmlhttp;
if (window.XMLHttpRequest) {
  xmlhttp=new XMLHttpRequest();
} else {
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
  if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
    var clientTags = xmlhttp.responseXML.getElementsByTagName("client");

    for (var i = 0; i < clientTags.length; i++) {
      var name = clientTags[i].getElementsByTagName("name");
      var homeUrl = clientTags[i].getElementsByTagName("home-url");
      var logo = clientTags[i].getElementsByTagName("logo");
      var logoQuote = clientTags[i].getElementsByTagName("logo-quote");
      var quote = clientTags[i].getElementsByTagName("quote");

      var client = new Object();
      client.name = name[0].childNodes[0].nodeValue;
      client.homeUrl = homeUrl[0].childNodes[0].nodeValue;
      client.logo = logo[0].childNodes[0].nodeValue;
      if (logoQuote.length != 0) {
        client.logoQuote = logoQuote[0].childNodes[0].nodeValue;
      }
      if (quote.length != 0) {
        client.quote = quote[0].childNodes[0].nodeValue;
      }
      clients.push(client);
    }

    if (document.getElementById("intro")) {
      document.getElementById("intro").style.display = "";
    }

    if (bFade) {
      fadeInit();
    } else {
      display();
    }
  }
}
xmlhttp.open("GET", "/clients/clients.xml", true);
xmlhttp.send();
