/*

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/

*/

window.onload = getImageHrefs;

// *** Settings *** //
var changeInterval = 3000; // Time between (start of) transitions, 1000 = 1sec, 0 for no auto changing (6000 is a nice value)*** strange effects if buttons used with auto changing
var opacityStep = 3; //percentage to change opacity on each loop (100 = no fading)
var transitionTime = 4; //time between opacity steps (lower makes transition smoother and faster, set zero if no fading)
//Time for transition is: transitionTime / opacityStep (sec)

/* general variables */
var fadeTargetClass = 'photo';
var fadeTarget;
var preInitTimer;
var target=null;

var imageArray=new Array(); // array to hold images
imageArray[0] = new Image();
imageArray[0].src = "/media/images/home-1_200.jpg"; //images/image1.jpg";
imageArray[1] = new Image();
imageArray[1].src = "/media/images/home-2_201.jpg";
imageArray[2] = new Image();
imageArray[2].src = "/media/images/home-3_202.jpg";
imageArray[3] = new Image();
imageArray[3].src = "/media/images/irisback1_358.jpg";
imageArray[4] = new Image();
imageArray[4].src = "/media/images/irisback2_357.jpg";
var currImage; // the index of the current main image in the array
var nextImage;

preInit();

/* functions */


function preInit() {
	/* an inspired kludge that - in most cases - manages to initially hide the image
	   before even onload is triggered (at which point it's normally too late, and a nasty flash
	   occurs with non-cached images) */
	if ((getElementsByClass)&&(fadeTarget=getElementsByClass(fadeTargetClass)[0])) {
		fadeTarget.style.visibility = "hidden";
		clearTimeout(preInitTimer);
		if (typeof preInitTimer != 'undefined') clearTimeout(preInitTimer); /* thanks to Steve Clay http://mrclay.org/ for this small Opera fix */
	} else {
		preInitTimer = setTimeout("preInit()",2);
	}
}

function fadeInit() {
	if (document.getElementById) {
		/* get a handle on the fadeable object, to make code later more manageable */
		preInit(); /* shouldn't be necessary, but IE can sometimes get ahead of itself and trigger fadeInit first */
		/* 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 */
		if (fadeTarget.style.MozOpacity!=null) {
			/* Mozilla's pre-CSS3 proprietary rule */
			fadeTarget.style.MozOpacity = 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';
		window.setTimeout("fadeIn(0)", 50);

	}
}

// handles fading and hiding of images
function fadeIn(opacity) {
	
	if (fadeTarget) {
		if (opacity <= 100) {
			if (fadeTarget.style.MozOpacity!=null) {
				//alert("1");
				/* 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) {
				alert("2");
				/* CSS3 compatible */
				/*fadeTarget.style.opacity = (opacity/100)-.001;
			}*/ else if (fadeTarget.style.filter!=null) {
				//alert("3");
				/* 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 */
			}
			// opacity change step
			opacity += opacityStep;
			// duration to fade image over
			window.setTimeout("fadeIn("+opacity+")", transitionTime);
		}
		else {
			// once image is fully opaque, load image to background and set image as hidden
			getElementsByClass("home_main")[0].style.background = "url('"+imageArray[currImage].src+"') no-repeat";
			getElementsByClass(fadeTargetClass)[0].style.visibility="hidden";
		}
	}

}

/* initialise fader by hiding image object first */
addEvent (window,'load',fadeInit)

/* 3rd party helper functions */

/* addEvent handler for IE and other browsers */
function addEvent(elm, evType, fn, useCapture)
// addEvent and removeEvent
// cross-browser event handling for IE5+,  NS6 and Mozilla
// By Scott Andrew
{
 if (elm.addEventListener){
   elm.addEventListener(evType, fn, useCapture);
   return true;
 } else if (elm.attachEvent){
   var r = elm.attachEvent("on"+evType, fn);
   return r;
 }
}

function changeimage2(i) {
	target.src=imageArray[i].src
	currImage=i;
	if(nextImage==imageArray.length-1) nextImage = 0;
	else nextImage=i+1;
	timeoutImg = 'changeimage2('+nextImage+')';
	fadeInit();
	if(changeInterval!=0) setTimeout(timeoutImg,changeInterval);
}

function getImageHrefs() {
		target=getElementsByClass(fadeTargetClass)[0];
		changeimage2(0); 
}

function getElementsByClass(searchClass,node,tag) {
  var classElements = new Array();
  if (node == null)
    node = document;
  if (tag == null)
    tag = '*';
  var els = node.getElementsByTagName(tag);
  var elsLen = els.length;
  var pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)");
  for (i = 0, j = 0; i < elsLen; i++) {
    if (pattern.test(els[i].className) ) {
      classElements[j] = els[i];
      j++;
    }
  }
  return classElements;
}