addLoadEvent(RegisterImageFades);

/*
* Get elements from class name
*/
function GetElementsByClassName(class_name, root_node) {
	//if a default root node isnt given, make it the whole doc
	if (root_node === null) { root_node = document; }
	
	//get all of the nodes within the root node
	var all_elements = root_node.getElementsByTagName('*');

	//scan through the nodes and get nodes that match the class name
	var elements = [];
	
	if (all_elements !== null) {
		for(var i=0, j=0; i < all_elements.length; i++) {
			//test whether the class name exists in the nodes class name
			if (all_elements[i].className.match(class_name)) {
				 elements[j++] = all_elements[i];
			}
		}
	}
	
	//return the elements that matches (if any)
	return elements;
}

/*
* Register and start all of the fades for the images
*/
function RegisterImageFades() {
	//Get all of the groups of images
	var image_groups = GetElementsByClassName('jpgs',document.body);

	var images = [image_groups.length];
	var delays = [image_groups.length];

	//get all of the images from the groups and set timers on them
	for (var i=0; i<image_groups.length;i++) {
		images[i] = image_groups[i].getElementsByTagName('img');
		delays[i] = images[i].length > 3 ? 4000 : 6000; //if 3 or more images, delay 4 seconds, otherwise 6 seconds
		
		setImagesTimer(images[i], delays[i]);
		FadeAllImages(images[i], delays[i]);
	}
}

/*Takes an image group and times it to animate*/
function setImagesTimer(specific_images,specific_delay) {
	var images = specific_images;
	var delay = specific_delay;
	
	if (images.length>1) {
		window.setInterval(function() { FadeAllImages(images,delay); },delay*images.length);
	}
}

/*Takes a sequence of images and sets timers for each image*/
function FadeAllImages(imgs, delay) {
	var images = imgs;
	var fade_delay = delay;
	
	//set all of the images to default z ordering
	for (var i=0;i<images.length;i++) {
		images[i].style.zIndex = 0;
	}
	
	//assign a timer to each image
	for (var i=0;i<images.length;i++) {
		//Set a timer to fade it in
		setImageTimer(images[i], delay,i);
	}
}

/*Takes a single image and times it to animate*/
function setImageTimer(specific_image,specific_delay,image_number) {
	var image = specific_image;
	var delay = specific_delay*image_number;
	
	window.setTimeout(function() { FadeImage(image,image_number); },delay);
}

/*Fades an image in*/
function FadeImage(img,image_number) {
	img.style.opacity=0.0;
	
	/*Below: Just for IE*/
	if (img.filters && img.filters.alpha) {
		img.filters.alpha.opacity = 0;
	}
	
	img.style.zIndex=image_number+1;
	var img_opacity=0.0;

	var timer_function = window.setInterval(function() {
		if (img.style.opacity >=1.0) {
			window.clearInterval(timer_function);
		} else {
			img_opacity += 0.05;	//at 20fps, transition lasts 1 second, = 1/(fps*duration)
			
			img.style.opacity = img_opacity;
			
			/*Below: Just for IE*/
			if (img.filters && img.filters.alpha) {
				img.filters.alpha.opacity = img_opacity*100;
			}
		}
	},50); //approx 20 fps, =1000/fps
}