var current = 0; /* contains the number of the current array field of the ,essage array from the HTML file */
var element = document.getElementById('text_fade'); /* ID of the element where the text will go in the HTML file */
var duration = 50;  /* this will be multiplie by the increment in the fade functions to give a staggered fade effect */
var delay = 5000;     /* 5 sec delay before fading out */
var timer_in = new Array(); /* contains all the Fade_in setTimeout variables */
var timer_out = new Array(); /* contains all the Fade_out setTimeout variables */
var timer_in1; /* keeps track of the SetTimeout delay before calling the next fade_in function */
var timer_out1; /* keeps track of the SetTimeout delay before calling the next fade_out function */
var fade; /* keeps track of which fade function is active for play/pause functions */
var i=0; /* Loop increment */
var opacity=0; /* opacity setting */
var opacity_step=0; /* current opacity if loop is paused */


/* set the opacity of the element (between 0.0 and 1.0) */
function setOpacity(level) {
	element.style.opacity = level;
	element.style.MozOpacity = level;
	element.style.KhtmlOpacity = level;
	element.style.filter = "alpha(opacity=" + (level * 100) + ");";
	opacity_step = parseInt(level*10); /* set the opacity_step level in case the fade effect is paused during the effect */
}

/* rotate and create timers to fade the testimonial in */
function fadeIn(){
	fade="fade_in";  /* fade variable tracks which function to restart after pause */ 
	element.innerHTML = messages[current];  /* Set the innerHTML to the current number in the Message Array (set in the HTML) */
	for (i=opacity_step; i<=10; i++) { /* Set the incrementor to the number of opacity_steps since the last fade finished */
		opacity=i/10; 
		timer_in[i]=setTimeout("setOpacity(" + opacity + ")", i * duration); /* timer_in array contains the individual setTimeout opacity settings - each set to run at intervals to give the impression of a fading effect (the time of each is worked out by multipling the incrementor by the duration) */ 
	}
	timer_out1=setTimeout("fadeOut()", delay); /* setTimeout for the fade out effec - ie the delay while the message is diplayed */
	current = ((current + 1) + messages.length) % messages.length; /* set current to the next array field number. This calculation figures out the next number be it looping from the end back to the start or visa versa */
}

/* create timers to fade the testimonial away */
function fadeOut() {
	fade="fade_out";  /* fade variable tracks which function to restart after pause */ 
	var step = opacity_step; /* set the variable 'steps' to the current opacity of the text */
	for (i=opacity_step; i>=0; i--) {
		opacity=i/10;
		timer_out[i]=setTimeout("setOpacity(" + opacity + ")", (step-i) * duration); /* timer_out array contains the individual setTimeout opacity settings - each set to run at intervals to give the impression of a fading effect (the time of each is worked out by subtracting the incrementor from the number of opacity steps required to get to 0 multiplied by the duration) */
	}
	timer_in1=setTimeout("fadeIn()", duration * step); /* setTimout timer to pause the fade_in effect until all the fade_out sets are complete */
}

/* create pause function */
function pause() {
	for (i=0; i<=10; i++) { /* Clear all the setTimeout timers stored in the arrays */
		clearTimeout(timer_in[i]);
		clearTimeout(timer_out[i]);
	}
	clearTimeout(timer_out1); /* Clear all the setTimeout timers on the fade-in and fade-out delays */
	clearTimeout(timer_in1);
	document.getElementById('controls').innerHTML = "<p><a href='javascript:previous()'>previous</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a href='javascript:play()'>play</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a href='javascript:next()'>next</a></p>"; /* Change 'Pause' in controls to 'Play' */
}

/* create play function */
function play() {
	document.getElementById('controls').innerHTML = "<p><a href='javascript:previous()'>previous</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a href='javascript:pause()'>pause</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a href='javascript:next()'>next</a></p>"; /* Change 'Play' in controls back to 'Pause' */
	if (fade=="fade_in") { /* depending on which timer was paused, the variable fade dictates which function is used to restart */
		current = ((current - 1) + messages.length) % messages.length; /* minus 1 to continue fading in current array field item (as current has alreay been incremented up in preparation for the next fade effect */
		opacity_step = opacity_step+1; /* helps to discuise the minor delay in restarting the fade effect by jumping to the next fade step */
		fadeIn();
	} else {
		fadeOut();
	} 
}

/* create previous function */
function previous() {
	for (i=0; i<=10; i++) {
		clearTimeout(timer_in[i]);
		clearTimeout(timer_out[i]);
	}
	clearTimeout(timer_out1);
	clearTimeout(timer_in1);
	current = ((current - 2) + messages.length) % messages.length; /* minus 2 as current is already set for the next news item */
	fadeOut(); /* no matter what stage the fade effect is at, the current item will fade out and the previous item will be fade in */
}

/* create next function */
function next() {
	for (i=0; i<=10; i++) { /* Clear all the setTimeout timers stored in the arrays */
		clearTimeout(timer_in[i]);
		clearTimeout(timer_out[i]);
	}
	clearTimeout(timer_out1); /* Clear all the setTimeout timers on the fade-in and fade-out delays */
	clearTimeout(timer_in1);
	fadeOut();  /* no matter what stage the fade effect is at, the current item will fade out and the next item will be fade in (no need to increment 'current' as it is already incremented in preparation for the next fade anyway) */
}

/* start the effect on load */
fadeIn();