// Declare global variables

var XMLFile = 'xml/portfolio.xml'; // Filename of the XML file to use
var XMLDoc; // Object to hold loaded XML file
var currentItem = 0; // The currently viewed item
var totalItems; // The number of items in the portfolio
var titles = new Array(); // Array to hold portfolio item titles
var descriptions = new Array(); // Array to hold portfolio item descriptions
var images = new Array(); // Array to hold portfolio item images

// Loads the XML file into the object
function loadXML()
{
	// Return if the browser can not use the functions needed
	if (!document.getElementById) return false;
	if (!document.getElementsByTagName) return false;

	// Try loading using Internet Explorer methods
	try
	{
		XMLDoc = new ActiveXObject("Microsoft.XMLDOM");
	}
	catch(e)
	{
		// If not, try using Firefox, Mozilla, Opera, etc methods
		try
		{
			XMLDoc = document.implementation.createDocument("","",null);
		}
		catch(e)
		{
			// Neither worked, so stop execution
			return false;
		}
	}
	
	// Turns off asynchronized loading to ensure file is fully loaded
	XMLDoc.async = false;
	
	// Try and load the file
	try
	{
		XMLDoc.load(XMLFile);
	}
	catch(e)
	{
		// Return if file could not be loaded
		return false;
	}

	// Report success
	return true;
}

// Parses the XML file and prints the titles
function parseXML()
{
	// Load the XML file
	var loaded = loadXML();
	
	if (loaded == false)
	{
		displayStaticVersion();
		return false;
	}
	
	// Get items in the portfolio
	var portfolioTitles = XMLDoc.getElementsByTagName('item');

	// Store the total number of items
	totalItems = portfolioTitles.length;

	// Loop through each item in the portfolio
	for (var counter = 0; counter < totalItems; ++counter)
	{
		// Store elements of the item in an array for easier access
		titles[counter] = portfolioTitles[counter].getElementsByTagName("title")[0].firstChild.nodeValue;
		descriptions[counter] = portfolioTitles[counter].getElementsByTagName("description")[0].firstChild.nodeValue;
		images[counter] = portfolioTitles[counter].getElementsByTagName("image")[0].firstChild.nodeValue;
	}
	
	// Update the display
	initialiseDisplay();
}

// Go to the previous item in the portfolio
function previous()
{
	// Return if at the start of the list
	if (currentItem == 0) return false;

	// Decrease the current item pointer
	--currentItem;

	// Update the display
	updateDisplay();
}

// Go to the next item in the portfolio
function next()
{
	// Return if at the end of the list
	if (currentItem == totalItems - 1) return false;

	// Increase the current item pointer
	++currentItem;

	// Update the display
	updateDisplay();
}

// Update the display with the correct data
function updateDisplay()
{
	document.getElementById('portfolioTitle').innerHTML = '<strong>Title:</strong> ' + titles[currentItem];
	document.getElementById('portfolioDescription').innerHTML = '<strong>Description:</strong> ' + descriptions[currentItem];
	document.getElementById('portfolioImage').innerHTML = '<img src="images/portfolio/large/' + images[currentItem] + '.jpg" />';

	document.getElementById('portfolioTotal').innerHTML = totalItems;
	document.getElementById('portfolioCurrent').innerHTML = currentItem + 1;
}

// Set up the elements to display the portfolio
function initialiseDisplay()
{
	// Get the portfolio container div
	portfolioHolder = document.getElementById('dynamicPortfolio');

	// Add the elements to the container
	portfolioHolder.innerHTML = '<p id="portfolioIntro">\n'
	+'Please use the links below to browse through our portfolio.\n'
	+'<\/p>\n'
	+'<ul id="portfolioNavButtons">\n'
	+'<li id="previous"><a href="#" onclick="previous(); return false;">Previous <span>Item<\/span><\/a><\/li>\n'
	+'<li id="location">Now showing item <span id="portfolioCurrent">X<\/span> of <span id="portfolioTotal">Y<\/span><\/li>\n'
	+'<li id="next"><a href="#" onclick="next(); return false;">Next <span>Item<\/span><\/a><\/li>\n'
	+'<\/ul>\n'
	+'<p id="portfolioTitle"><\/p>\n'
	+'<p id="portfolioDescription"><\/p>\n'
	+'<p id="portfolioImage"><\/p>';
	
	// Hide the static version
	document.getElementById('portfolio').style.display = 'none';
	
	// Update the display
	updateDisplay();
}

// Displays the static version of the portfolio if there was a problem loading the dynamic version
function displayStaticVersion()
{
	// Get the static version from within the noscript tag
	var staticVersion = document.getElementsByTagName("noscript")[0].innerHTML;
	
	// Get the portfolio container div
	portfolioHolder = document.getElementById('dynamicPortfolio');
	
	// Put the static version HTML into the container
	//portfolioHolder.innerHTML = unescape(document.getElementsByTagName("noscript")[0].innerHTML;
	
}

// Initialise the XML and display when the script is loaded
parseXML();

/*
	Sources Used:
	
		http://www.w3schools.com/XML/xml_parser.asp
		http://www.javascriptkit.com/domref/elementmethods.shtml
*/