/*

Title: Silhouette Image Rollover

Created by: Tim Ottewell
Created on: 08/06/2009
Version 1.0

Changes:

Changes made by:
Date of changes:

*/

function changeImages(rLink, imageLocation, rolloverImages, divbackground) {
	//Code to swap out the silhouette images
	
	//gets the ID of the link that has been clicked
	var linkID = rLink.getAttribute("id");
	
	//create an array containing the rollover images
	var images = rolloverImages.getElementsByTagName("img");	
	
	
	
	
	//looks through all the rollover images
	for (var i = 0; i < images.length; i++) {
		//gets the ID of each rollover image
		var imageID = images[i].getAttribute("id");
		
		
		//if the ID of the image matches the ID of the link
		if (linkID == imageID) {
			//get the source attribute of the rollover image
			var imageSource = images[i].getAttribute("src");
			
				divbackground[0].style.backgroundColor = '#F5F5F5';
				divbackground[2].style.backgroundColor = '#FAFAFA';
				divbackground[3].style.backgroundColor = '#F5F5F5';
				
				
				
			if (i == 2) { 
				i++;
				divbackground[i].style.backgroundColor = '#fceddc';
			}
			else if (i == 1)
			{
				i++
				divbackground[i].style.backgroundColor = '#fceddc';
			}
			else if (i == 0)
			{
				divbackground[i].style.backgroundColor = '#fceddc';
			}
				
			
			//set the image source of the holder to the rollover image source
			imageLocation.setAttribute("src", imageSource);
			
			
		}
	}
}


function prepareImages() {
	//sets the default image that will be displayed at the beginning and on rollout 
	var defaultImage = document.getElementById("imageHolder");
	
	//sets the array of images that will be used for rollovers
	var rolloverImages = document.getElementById("rolloverImages");
	
	//sets the source for the default rollover image
	var defaultImageSource = defaultImage.getAttribute("src");
			
	//get the div containing the topic rollover links
	var rolloverLinks = document.getElementById("rolloverLinks");
	
	//create an array of all the element divs by name
	var divbackground = rolloverLinks.getElementsByTagName("td");
	
	//create an array of all the topic links
	var links = rolloverLinks.getElementsByTagName("a");
	
	divbackground[0].setAttribute("vAlign", "middle");
	divbackground[2].setAttribute("vAlign", "middle");
	divbackground[3].setAttribute("vAlign", "middle");
				
	//check for mouse over and mouse out events on the topics links
	for (var i = 0; i < links.length; i++) {
		links[i].onmouseover = function() {
			changeImages(this, defaultImage, rolloverImages, divbackground);
		}
	}
}


//function to run the script which everything has loaded
function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      oldonload();
      func();
    }
  }
}

//run the script
addLoadEvent(prepareImages);