//********************************************************************************
//
// Fading rollover button functionality. Originally written by Roy Whittle, but
// rewritten by me to clean it up substantially and add new functionality.
//
// Original author: Roy Whittle.
// Current maintainer: Rob Baker.
//
//********************************************************************************


//********************************************************************************
// Customisable global variables.
//********************************************************************************

var FadeInStep = 15;
var FadeOutStep = 5;


//********************************************************************************
// Inject the fading rollover button support into the parent document.
//
// Here is what each of those CSS properties is for:

// * opacity: 0.5; This is the �most important� one because it is the current
//   standard in CSS. This will work in most versions of Firefox, Safari, and
//   Opera. This would be all you need if all browsers supported current
//   standards. Which, of course, they don�t.
// * filter:alpha(opacity=50); This one you need for IE.
// * -moz-opacity:0.5; You need this one to support way old school versions of
//   the Mozilla browsers like Netscape Navigator.
// * -khtml-opacity: 0.5; This is for way old versions of Safari (1.x) when the
//   rendering engine it was using was still referred to as KTHML, as opposed to
//   the current WebKit.
//********************************************************************************

document.write('<STYLE TYPE="text/css">.imgFader{ position:relative; opacity:0.0; -moz-opacity:0.0; }</STYLE>');


//********************************************************************************
// Create new fading rollover objects for the parent document.
//********************************************************************************

if (!window.FadingButton)
{
	FadingButton=new Object();
}

FadingButton.RolloverObjects=new Array();
FadingButton.ImageFadeRunning=false;
FadingButton.ImageFadeInterval=30;


//********************************************************************************
// Create a new rollover object for the parent document.
//********************************************************************************

FadingButton.Rollover = function(name, image)
{
	FadingButton.RolloverObjects[name]=new Image();
	FadingButton.RolloverObjects[name].img_src = image;

	if (!FadingButton.Rollover.postLoad)
	{
		FadingButton.RolloverObjects[name].src = image;
	}
}


//********************************************************************************
// General rollover object variables.
//********************************************************************************

FadingButton.Rollover.postLoad = false;


//********************************************************************************
// Report an error in a rollover (currently disabled).
//********************************************************************************

FadingButton.Rollover.error = function(n)
{
}


//********************************************************************************
// Get an image within the document.
//
// Netscape 4 images could be in layers so we might have to recurse the layers to
// find the image.
//********************************************************************************

FadingButton.GetImage = function(n, d)
{
	var image = d.images[n];
	
	if (!image && d.layers)
	{
		for (var i=0; !image && i<d.layers.length; i++)
		{
			image=FadingButton.GetImage(n,d.layers[i].document);
		}
	}
			
	return image;
}


//********************************************************************************
// Find an image within the document.
//********************************************************************************

FadingButton.FindImage = function(n, d)
{
	var image = FadingButton.GetImage(n, d);

	if (!image)
	{
		return(new Image());
	}
	
	return image;
}


//********************************************************************************
// Fade an image in by setting the appropriate state derived from the current
// state.
//********************************************************************************

FadingButton.ImageFadeIn = function(image, imgSrc)
{
	if (image)
	{
		if (image.state == null)
		{
			image.state = "OFF";
			image.index = 0;
			image.next_on = null;
		}
		
		if (image.state == "OFF")
		{
			if (image.src.indexOf(imgSrc) == -1)
			{
				image.src=imgSrc;
			}
			
			image.currSrc = imgSrc;
			image.state = "FADE_IN";
			
			FadingButton.StartFading();
		}
		else if (image.state == "FADE_IN_OUT" ||
				  image.state == "FADE_OUT_IN" ||
				  image.state == "FADE_OUT")
		{
			if (image.currSrc == imgSrc)
			{
				image.state = "FADE_IN";
			}
			else
			{	
				image.next_on = imgSrc;
				image.state="FADE_OUT_IN";
			}
		}
	}
}


//********************************************************************************
// Fade an image out by setting the appropriate state derived from the current
// state.
//********************************************************************************

FadingButton.ImageFadeOut = function(image)
{
	if (image)
	{
		if (image.state=="ON")
		{
			image.state="FADE_OUT";
			FadingButton.StartFading();
		}
		else if (image.state == "FADE_IN")
		{
			image.state="FADE_IN_OUT";
		}
		else if (image.state=="FADE_OUT_IN")
		{
			image.next_on == null;
			image.state = "FADE_OUT";
		}
	}
}


//********************************************************************************
// Start the fading process if it isn't running already.
//********************************************************************************

FadingButton.StartFading = function()
{
	if (!FadingButton.ImageFadeRunning)
	{
		FadingButton.ImageFadeAnimation();
	}
}


//********************************************************************************
// Update the current fade states for each of the images.
//********************************************************************************

FadingButton.ImageFadeAnimation = function()
{
	FadingButton.ImageFadeRunning = false;
	
	for (i=0; i<document.images.length; i++)
	{
		var image = document.images[i];
		
		if (image.state)
		{
			if (image.state == "FADE_IN")
			{
				image.index+=FadeInStep;
				
				if (image.index > 100)
				{
					image.index = 100;
				}
				
				image.style.opacity = image.index/101;
				image.style.MozOpacity = image.index/101;
				
				if (image.index == 100)
				{
					image.state="ON";
				}
				else
				{
					FadingButton.ImageFadeRunning = true;
				}
			}
			else if (image.state == "FADE_IN_OUT")
			{
				image.index+=FadeInStep;
				
				if (image.index > 100)
				{
					image.index = 100;
				}
				
				image.style.opacity = image.index/101;
				image.style.MozOpacity = image.index/101;
				
				if (image.index == 100)
				{
					image.state="FADE_OUT";
				}
				
				FadingButton.ImageFadeRunning = true;
			}
			else if (image.state == "FADE_OUT")
			{
				image.index-=FadeOutStep;
				
				if (image.index < 0)
				{
					image.index = 0;
				}
				
				image.style.opacity = image.index/101;
				image.style.MozOpacity = image.index/101;
				
				if (image.index == 0)
				{
					image.state="OFF";
				}
				else
				{
					FadingButton.ImageFadeRunning = true;
				}
			}
			else if (image.state == "FADE_OUT_IN")
			{
				image.index-=FadeOutStep;
				
				if (image.index < 0)
				{
					image.index = 0;
				}
				
				image.style.opacity = image.index/101;
				image.style.MozOpacity = image.index/101;
				
				if (image.index == 0)
				{
					image.src = image.next_on;
					image.currSrc = image.next_on;
					image.state="FADE_IN";
				}
				
				FadingButton.ImageFadeRunning = true;
			}
		}
	}

	if (FadingButton.ImageFadeRunning)
	{
		setTimeout("FadingButton.ImageFadeAnimation()", FadingButton.ImageFadeInterval);
	}
}


//********************************************************************************
// Fade a rollover in.
//********************************************************************************

FadingButton.FadeIn = function(imgName, rollName)
{
	if (rollName == null)
	{
		rollName=imgName;
	}
	
	if (!FadingButton.RolloverObjects[rollName])
	{
		FadingButton.Rollover.error(rollName);
		return;
	}
	
	var image = FadingButton.FindImage(imgName, document);
	
	FadingButton.ImageFadeIn(image, FadingButton.RolloverObjects[rollName].img_src);
}
	

//********************************************************************************
// Fade a rollover out.
//********************************************************************************

FadingButton.FadeOut = function(imgName)
{
	var image = FadingButton.FindImage(imgName, document);
	
	FadingButton.ImageFadeOut(image);
}


//********************************************************************************
// Create a general button, taking into account alpha capabilities of the
// client's browser.
//********************************************************************************

function CreateButton(imageFolder, imageName, executeFunction, toolTip, cellItem, width, height, useLink)
{
	var string = "";
	var onImage = imageFolder + imageName + "_on.png";
	var offImage = imageFolder + imageName + "_off.png";
	
	SwapButton.PreloadImages(onImage);
	
	if (executeFunction.length > 0 && useLink == true)
	{
		string += "<a href='" + executeFunction + "'>"
	}
	
	if (BrowserSupportsAlpha())
	{
		FadingButton.Rollover(imageName, onImage);
		
		cellItem.style.backgroundImage = "url('" + offImage + "')";

		string += "<img src='" + offImage + "' class='imgFader' alt='" + toolTip + "' name='" + imageName + "' width='" + width + "' height='" + height + "' border='0' id='" + imageName + "' ";
		string += "onmouseout=\"FadingButton.FadeOut('" + imageName + "')\" onmouseover=\"FadingButton.FadeIn('" + imageName + "')\" title=\"" + toolTip + "\"";
	}
	else
	{
		string += "<img src='" + offImage + "' alt='" + toolTip + "' name='" + imageName + "' width='" + width + "' height='" + height + "' border='0' id='" + imageName + "' ";
		string += "onmouseout='SwapButton.RestoreImage()' onmouseover=\"SwapButton.SwapImage('" + imageName + "','','" + onImage + "',1)\" title=\"" + toolTip + "\"";
	}

	if (executeFunction.length > 0 && useLink == false)
	{
		string += "onclick=\"" + executeFunction + "\" ";	
	}
	
	string += ">";

	if (executeFunction.length > 0 && useLink == true)
	{
		string += "</a>"
	}

	cellItem.innerHTML = string;
}


//********************************************************************************
// Inject a general button, taking into account alpha capabilities of the
// client's browser.
//********************************************************************************

function InjectButton(imageFolder, imageName, executeFunction, toolTip, width, height, useLink)
{
	var string = "";
	var onImage = imageFolder + imageName + "_on.png";
	var offImage = imageFolder + imageName + "_off.png";
	
	SwapButton.PreloadImages(onImage);
	
	if (BrowserSupportsAlpha())
	{
		FadingButton.Rollover(imageName, onImage);
		
		document.write('<td width="' + width + '" align="left" valign="top" background="' + offImage + '"><div align="left">');
		
		if (executeFunction.length > 0 && useLink == true)
		{
			string += "<a href='" + executeFunction + "'>"
		}
		
		string += "<img src='" + offImage + "' class='imgFader' alt='" + toolTip + "' name='" + imageName + "' width='" + width + "' height='" + height + "' border='0' id='" + imageName + "' ";
		string += "onmouseout=\"FadingButton.FadeOut('" + imageName + "')\" onmouseover=\"FadingButton.FadeIn('" + imageName + "')\" title=\"" + toolTip + "\"";
	}
	else
	{
		document.write('<td width="' + width + '" align="left" valign="top"><div align="left">');
		
		if (executeFunction.length > 0 && useLink == true)
		{
			string += "<a href='" + executeFunction + "'>"
		}
		
		string += "<img src='" + offImage + "' alt='" + toolTip + "' name='" + imageName + "' width='" + width + "' height='" + height + "' border='0' id='" + imageName + "' ";
		string += "onmouseout='SwapButton.RestoreImage()' onmouseover=\"SwapButton.SwapImage('" + imageName + "','','" + onImage + "',1)\" title=\"" + toolTip + "\"";
	}

	if (executeFunction.length > 0 && useLink == false)
	{
		string += "onclick=\"" + executeFunction + "\" ";	
	}
	
	string += ">";

	if (executeFunction.length > 0 && useLink == true)
	{
		string += "</a>"
	}

	document.write(string);
	
	document.write('</div></td>');
}

