/*
	Feature loading javascript
	Supports asynchronous feature loading via AJAX
*/

// Global variables
var requestUrl = "FeatureInfo.aspx?id=";		// URL to get feature info XML from
var currentIndex = 0;							// current feature's index
var fadeCurrent = 0;							// current fade value
var fadeStep = 0;								// fade step
var fadeTimer = null;							// handle to fading timer
var fadeTime = 30;								// fade delay
var featureImage = new Image();					// new image holder

// Main entry function. Called when the Next and Prev buttons are clicked
function LoadFeature(i)
{	
	try {
		FadeOut(document.getElementById('feature'));

		// move next or prev
		currentIndex += i;
		GetFeatureInfo(currentIndex);
	}
	catch (e) {
		alert("An error occurred while processing your request.");
	}
}

// Gets remote feature info for the given index offset
function GetFeatureInfo(index)
{
	var featureInfo = new Array();

	try {
		// Firefox, Opera, Safari, etc
		xml = new XMLHttpRequest();
	}
	catch (e) {
		// IE 6+
		try {
			xml = new ActiveXObject("Msxm12.XMLHTTP");
		}
		catch (e) {
			// IE 4+
			try {
				xml = new ActiveXObject("Microsoft.XMLHTTP");
			}
			catch (e) {
				throw "Error getting XML object";
				return false;
			}
		}
	}

	// event handler for request completion
	xml.onreadystatechange = function()
	{
		switch (xml.readyState)
		{
			// request started
			case 1:
				document.getElementById('featureBox').style.cursor = 'wait';
				break;

			// request complete
			case 4:
				doc = xml.responseXML.documentElement;

				if (doc == null)
					throw "Received invalid response from server";

				if (doc.getElementsByTagName('error')[0] != null)
					throw "Error: " + doc.getElementsByTagName('error_msg')[0].childNodes[0].nodeValue;

				// save info
				featureInfo["title"] = GetXmlValue(doc, "title");
				featureInfo["image"] = GetXmlValue(doc, "image");;
				featureInfo["description"] = GetXmlValue(doc, "description");;
				featureInfo["link"] = GetXmlValue(doc, "link");;

				// callback function for when picture has finished loading
				featureImage.onload = function()
				{
					SetFeatureInfo(featureInfo);
					FadeIn(document.getElementById('feature'));
					document.getElementById('featureBox').style.cursor = '';
				}

				// set src of new picture
				featureImage.src = featureInfo["image"];
		}
	}

	// make request
	xml.open("GET", requestUrl + index + "&r=" + Math.random(), true);
	xml.send(null);
}

// Gets a value from an XML document tree
function GetXmlValue(xml, value)
{
	var element = xml.getElementsByTagName(value);

	if (element == null || element.length == 0)
		return "";
	else if (element[0].childNodes.length == 0)
		return "";
	else
		return element[0].childNodes[0].nodeValue;
}

// Apply new feature details to page
function SetFeatureInfo(featureInfo)
{
	document.getElementById('featureImage').src = featureImage.src;
	document.getElementById('featureTitle').innerHTML = featureInfo["title"];
	document.getElementById('featureText').innerHTML = featureInfo["description"];
	
	if (featureInfo["link"].length > 0)
		document.getElementById('featureText').innerHTML += "<a href='" + featureInfo["link"] + "'>Read More</a>";
}

// Fade the given object out
function FadeOut(object)
{
	if (fadeTimer != null)
	{
		clearInterval(fadeTimer);
		fadeTimer = null;
	}

	var id = object.id;
	fadeCurrent = 1.0;
	fadeStep = -0.1;
	SetOpacity(object, fadeCurrent);

	fadeTimer = window.setInterval("DoFade('" + id + "')", fadeTime);
}

// Fade the given object in
function FadeIn(object)
{
	if (fadeTimer != null)
	{
		clearInterval(fadeTimer);
		fadeTimer = null;
	}

	var id = object.id;
	fadeCurrent = 0.0;
	fadeStep = 0.1;
	SetOpacity(object, fadeCurrent);

	fadeTimer = window.setInterval("DoFade('" + id + "')", fadeTime);
}

// Callback to perform fading
function DoFade(id)
{
	var object = document.getElementById(id);

	fadeCurrent += fadeStep;
	SetOpacity(object, fadeCurrent);

	if (fadeCurrent >= 1.0 || fadeCurrent <= 0.0)
	{
		clearInterval(fadeTimer);
		fadeTimer = null;
	}
}

// Sets the opacity of an object to the given value
function SetOpacity(object, opacity)
{
	if (typeof object.style.opacity == "string")
		object.style.opacity = opacity;
	else
		object.style.filter = "alpha(opacity=" + opacity * 100 + ")";
}