// JavaScript Document KSA Fader Array
//
// Image Array Rotation with Fading Effect Between Images
// Tested on Safari 5 MAC, Opera 10 MAC, Firefox 3 MAC, Internet Explorer 7 PC, Chrome 5 MAC
// Needs to be installed on a page along with ksa-arrayfader.css stylesheet
//
// Check if the browser supports get element by id and sets answer of true or false outcome

if (document.getElementById) {
	stdBrowser = true
}
else {
	stdBrowser = false
}

// Fader Routine Defaults

a = 0  // default opacity control value 000
mo = 0 // default moz opacity value 0.x
o = 0 // default opacity value 0.x
f = 0 // default filter alpha opacity value 0
r = 2 // rate of opacity change 2% at a time
currElem = "faderimg"

// sets the call for the div tag that the routine fades and the zindex is -1
// for reference the fixed image div is named staticimg and the zindex is -2

delayr = 6500 // sets the value of the rotate function timeout delay in 1000ths of a second the rotate routinue is called every 6500 or 6.5 seconds so there is a 4 second gap between image fades
delayf = 25 // sets the value of the fader function timeout delay in 1000ths of a second -- the fader routine takes a total of 2500 or 2.5 seconds 

// Array Part Of The Routine Defaults

// adImages = new Array("","","","")  // the array images preloads only needed if you do not have a separate js file containing the array

thisAd = -1 // counter for which images we are on, at first start you want to be beyond the end of the array
nextAd = thisAd + 1 // counter for the next image
imgCt = adImages.length  // image counter checked against the length of the array

// The Fader Function Routine

function fader() {

// the main count down loop

if (a < 100) { 
// if the value of a is less than 100 then add the rate of change
a=a+r;  
// then transfer or convert the value of a into the opacity values
mo=a/100;
o=a/100;
f=a;

}

// this bit checks how the browser checks true or false for the browser handling of get element by id

if (stdBrowser) {
		menuObj = document.getElementById(currElem).style
	}
	else {
		menuObj = eval("document." + currElem)
	}
	
// sets all the opacity styles on the page linked to the specified div id

	if(stdBrowser) {
		menuObj.opacity = o
		menuObj.filter = "alpha(opacity="+f+")"
		menuObj.MozOpacity = mo;
	}
	else {
		menuObj.opacity = o;
		menuObj.filter = "alpha(opacity="+f+")"
		menuObj.MozOpacity = mo;
	}

// checks again if a is more than 0 if so waits 25 then loops

if (a < 100) {
setTimeout("fader()",delayf) } 

// else assumes faded to 100

else {

// reset value of a
a = 0  // default opacity control value 

// reset the opacity control values to 0 to hide visibility
mo=a;
o=a;
f=a;

// add to the image counters for the array process

thisAd++ // add 1 to the image counter
if (thisAd == imgCt) {  // if the counter is equals the thisAd value
thisAd = 0  // reset the thisAd to the start
}
nextAd = thisAd + 1
if (nextAd == imgCt) { // if the counter is equal to the nextAd value
nextAd = 0 // rest the nextAd to the start
}

// first changes the invisible background image to the this image	

document.backgrd.src=adImages [thisAd] 

// reset the opacity to 0 on the foregrd image div styles so it remains hiding

if(stdBrowser) {
		menuObj.opacity = o
		menuObj.filter = "alpha(opacity="+f+")"
		menuObj.MozOpacity = mo;
	}
	else {
		menuObj.opacity = o;
		menuObj.filter = "alpha(opacity="+f+")"
		menuObj.MozOpacity = mo;
	}

// now reset the invisible image to the next image in the array

document.foregrd.src=adImages [nextAd] 

// with everything setup to run again ends function

}
}

// This bit calls the fader function runs it through then waits 'delayr' seconds before calling the function again

function rotate() {

// set the caption box information at start up

if (document.getElementById) {
document.getElementById("captionbox").innerHTML=adTitles[nextAd];} // note nextAd at this stage value is 0

// firstly lets check that the browser supports images if no then it is static

if (document.images) {

		fader();

		setTimeout("rotate()", delayr)
	
	// Every x thousand milliseconds or x seconds depending on value of delay
	}
}

// New location handler for the URLs related to the image

function newLocation() {
	document.location.href = ""+adURL[thisAd]
}
