// JavaScript Document
var goRotate = true;
function initListener() {  //here we have the  event listeners for certain items. This makes them active on click for the listed functions

	var nextList = document.getElementById("nextImage");//attaching click behaviours to the next and previous buttons
		nextList.style.display='none';
		nextList.onclick = function() {
		theId = this.parentNode.parentNode.id;
		initImage('next',theId);
		return false;
		}
	
	var prevList = document.getElementById("prevImage");//attaching click behaviours to the next and previous buttons
		prevList.style.display='none';
		prevList.onclick = function() {
		theId = this.parentNode.parentNode.id;
		initImage('',theId);
		return false;
		}
	
	var firstBlock = document.getElementById("fadeThis").getElementsByTagName("LI");//making the first list item visible, and starting the rotator script
		if (firstBlock.length > 0)
		{   
		    firstBlock[0].style.display = 'block';
		    goRotate = true;
		    if (firstBlock.length > 1) {
			    autoRotator(firstBlock[0].parentNode.id);
		    }
		}
		
}

var upTo = 0;
var start = true;
function autoRotator(theId) {	
    
    if(start)
    {
       initImageStart('next',theId);		
	   window.setTimeout("autoRotator('"+theId+"')", 1000);//timeout		
    }
    else
    {
        if (goRotate)
	        initImage('next',theId);		
	    window.setTimeout("autoRotator('"+theId+"')", 3500);//timeout		
	}
}

function stopRotator() {
	goRotate = false;	
}


function displayNextPrevLinks() {

	var nextList = document.getElementById("nextImage");//attaching click behaviours to the next and previous buttons
		nextList.style.display='inline';
	
	var prevList = document.getElementById("prevImage");//attaching click behaviours to the next and previous buttons
		prevList.style.display='inline';
}



function resumeRotator() {		
	goRotate = true;
}

function mouseOutEventHandler(e) {	 		
     e = e || window.event;
     var target = e.srcElement || e.target;
     if (target != this) return;
     var related = e.relatedTarget || e.toElement;
     while (related != this && related.nodeName != 'BODY')
          related = related.parentNode;
     if (related == this) return;
   
     // the rest of the function
	 
	goRotate = true;	
	theId = this.parentNode.id;	
	autoRotator(theId);
	return false; 
}

function initImage(next, theId) {
	if (document.getElementById(theId).getElementsByTagName("LI")) {//checking to see if what we are looking for exists
	    ii = document.getElementById(theId).getElementsByTagName("LI");// and the getting it
		currentOne = ii[upTo].id;
		if (next) { 
			upTo += 1;
			if (upTo > ii.length -1) {
			upTo = 0;
			}
			nextOne = ii[upTo];
		}
		else {
			upTo -= 1;
			if (upTo < 0) {
				upTo = ii.length - 1;
			}
			nextOne = ii[upTo];
		}
		fadeOut(currentOne, 100);//the hard work of actually running the functions to change opacity
		setOpacity(nextOne, 0);
		nextOne.style.display = 'block';//all LIs start out as display:none, but once they have their opacity set to 0 they can stay display:block
		imageId = nextOne.id;
		fadeIn(imageId, 0);
	}
	displayNextPrevLinks();
}

function initImageStart(next, theId) {
	if (document.getElementById(theId).getElementsByTagName("LI")) {//checking to see if what we are looking for exists
	    
		ii = document.getElementById(theId).getElementsByTagName("LI");// and the getting it
		currentOne = ii[upTo].id;
		if (next) { 
			upTo += 1;
			if (upTo > ii.length -1) {
			upTo = 0;
			start = false;
			}
			nextOne = ii[upTo];
		}
		else {
			upTo -= 1;
			if (upTo < 0) {
				upTo = ii.length - 1;
			}
			nextOne = ii[upTo];
		}
		fadeOut(currentOne, 100);//the hard work of actually running the functions to change opacity
		setOpacity(nextOne, 0);
		nextOne.style.display = 'block';//all LIs start out as display:none, but once they have their opacity set to 0 they can stay display:block
		imageId = nextOne.id;
		fadeIn(imageId, 0);
	}
	displayNextPrevLinks();
}

function setOpacity(obj, opacity) {//setting the opacity using various browser styles as seen on http://clagnut.com/sandbox/imagefades/
  opacity = (opacity == 100)?99.999:opacity;
  obj.style.filter = "alpha(opacity:"+opacity+")";
  obj.style.KHTMLOpacity = opacity/100;
  obj.style.MozOpacity = opacity/100;
  obj.style.opacity = opacity/100;
}

//Function which actually steps through fading in / out the object the as seen on http://clagnut.com/sandbox/imagefades/
function fadeOut(objId,opacity) 
{
	obj = document.getElementById(objId);
	if (opacity >= 0) {
		setOpacity(obj, opacity);
		opacity -= 20;
		window.setTimeout("fadeOut('"+objId+"',"+opacity+")", 100);
	}
	else 
	{
		obj.style.display = 'none'
 	}
}

function fadeIn(objId,opacity) {//Function which actually steps through fading in / out the object the as seen on http://clagnut.com/sandbox/imagefades/
    obj = document.getElementById(objId);
	if (opacity <= 100) {
      setOpacity(obj, opacity);
      opacity += 20;
      window.setTimeout("fadeIn('"+objId+"',"+opacity+")", 100);
    }
  }

function addLoadEvent(func) { //Simon Willison's exciting new version of the addLoadEvent function. Allows us to attach multiplefunctions to the onload event. http://simon.incutio.com/archive/2004/05/26/addLoadEvent
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    }
  }
}

//add functions to the addLoadEvent;

addLoadEvent(initListener);