// JavaScript Document
// functions to extract information from the xml documents

// global variables
var myDoc;
var counter;
var index;


// function that will cycle through the xml document and print the thumbnails and names to the screen
function writeThumbnails(keyword)
{
		// Find the root element for the category		
		var baseElement = myDoc.getElementsByTagName(keyword);
		// create an array of the item elements for each category
		var items = baseElement[0].getElementsByTagName("item");
		
		// counter for products
		counter = 0;

		for (i=0;i<items.length;i++)
		{
			// Get the contents of each items by tag name
			// product name
			var name = items[i].getElementsByTagName("name");
			// product thumbnail link
			var thumbnail = items[i].getElementsByTagName("thumbnail");
			
			// increase the counter to determine link page
			counter++
			
			// write the opening div container to hold the information
			document.write("<div id=\"imageThumbnail\">");
			
			// write the link for the thumbnail image
			document.write ("<a href=\"" + keyword + counter + ".htm\">");
			
			// write the thumbnail image
			document.write ("<img src=\"../images/" + keyword + "/tbs/" + thumbnail[0].firstChild.nodeValue + "\" width=\"75\" height=\"75\" border=\"0\"/>");
			
			// close the link
			document.write ("</a>");
			
			document.write ("<br />");
	
			// write the link for the name of the product
			document.write ("<a href=\"" + keyword + counter + ".htm\">");
			
			// write the product name
			document.write ("<span class=\"productName\">");
			document.write (name[0].firstChild.nodeValue);
			document.write ("</span>");
			
			// close the link
			document.write ("</a>");
			
			// close the div
			document.write ("</div>");
		}
}//end function writeThumbnails()


// writes picture and detailed information to the page
function writeDetail(keyword, index)
{
	// find the root element for the category
	var baseElement = myDoc.getElementsByTagName(keyword);
	
	// create an array of the item elements for each category
	var items = baseElement[0].getElementsByTagName("item");
	
	// retrieve all the product information from the xml document
	var name = items[index].getElementsByTagName("name");
	var number = items[index].getElementsByTagName("number");
	var picture = items[index].getElementsByTagName("picture");
	var large = items[index].getElementsByTagName("large");
	var dimensions = items[index].getElementsByTagName("dimensions");
	var weight = items[index].getElementsByTagName("weight");
	var casepack = items[index].getElementsByTagName("casepack");
	var size = items[index].getElementsByTagName("size");
	var colour = items[index].getElementsByTagName("colour");
	var description = items[index].getElementsByTagName("description");
	
	// write the product name as the page header
	document.write ("<h1>" + name[0].firstChild.nodeValue + "</h1>");
	
	// write the opening div container to hold the product image
	document.write ("<div id=\"imageProduct\">");
	
	// write the product image and link to closeup picture
	document.write ("<a href=\"../images/" + keyword + "/large/" + large[0].firstChild.nodeValue + "\" target=\"_blank\">");
	document.write ("<img src=\"../images/" + keyword + "/" + picture[0].firstChild.nodeValue + "\" border=\"0\" />");
	document.write ("</a>");
	
	// close the div container holding the product image
	document.write ("</div>");
	
	// write the opening div container that will hold the descriptive text
	document.write ("<div id=\"descriptionProduct\">");
	
	// write the product information

		// item code number
		document.write ("<p><span class=\"bodyBold\">Item code: </span>");
		document.write (number[0].firstChild.nodeValue);
		document.write ("</p>");
		
		// dimensions
		if (dimensions[0].firstChild.nodeValue != "none")
		{
			document.write ("<p><span class=\"bodyBold\">Dimensions: </span>");
			document.write (dimensions[0].firstChild.nodeValue);
			document.write ("</p>");
		}
		
		// sizes available
		if (size[0].firstChild.nodeValue != "none")
		{
			document.write ("<p><span class=\"bodyBold\">Sizes available: </span>");
			document.write (size[0].firstChild.nodeValue);
			document.write ("</p>");
		}
		
		// colours available
		if (colour[0].firstChild.nodeValue != "none")
		{
			document.write ("<p><span class=\"bodyBold\">Colors available: </span>");
			document.write (colour[0].firstChild.nodeValue);
			document.write ("</p>");
		}

		// weight
		if (weight[0].firstChild.nodeValue != "none")
		{
			document.write ("<p><span class=\"bodyBold\">Weight: </span>");
			document.write (weight[0].firstChild.nodeValue);
			document.write ("</p>");
		}
		
		// case pack
		if (casepack[0].firstChild.nodeValue != "none")
		{
			document.write ("<p><span class=\"bodyBold\">Case pack: </span>");
			document.write (casepack[0].firstChild.nodeValue);
			document.write ("</p>");
		}
		
		// description
		if (description[0].firstChild.nodeValue != "none")
		{
			document.write ("<p><span class=\"bodyBold\">Description: </span>");
			document.write (description[0].firstChild.nodeValue);
			document.write ("</p>");
		}
		
	// close the div container holding the descriptive text
	document.write ("</div>");
}//end function writeDetail()

// writes picture and detailed information to the page
function writeDetailClearance(keyword, index)
{
	// find the root element for the category
	var baseElement = myDoc.getElementsByTagName(keyword);
	
	// create an array of the item elements for each category
	var items = baseElement[0].getElementsByTagName("item");
	
	// retrieve all the product information from the xml document
	var name = items[index].getElementsByTagName("name");
	var number = items[index].getElementsByTagName("number");
	var picture = items[index].getElementsByTagName("picture");
	var large = items[index].getElementsByTagName("large");
	var material = items[index].getElementsByTagName("material");
	var dimensions = items[index].getElementsByTagName("dimensions");
	var weight = items[index].getElementsByTagName("weight");
	var casepack = items[index].getElementsByTagName("casepack");
	var size = items[index].getElementsByTagName("size");
	var colour = items[index].getElementsByTagName("colour");
	var description = items[index].getElementsByTagName("description");
	
	// write the product name as the page header
	document.write ("<h1>" + name[0].firstChild.nodeValue + "</h1>");
	
	// write the opening div container to hold the product image
	document.write ("<div id=\"imageProduct\">");
	
	// write the product image and link to closeup picture
	if (large[0].firstChild.nodeValue != "none")
	{
		document.write ("<a href=\"../images/" + keyword + "/large/" + large[0].firstChild.nodeValue + "\" target=\"_blank\">");
	}
	document.write ("<img src=\"../images/" + keyword + "/" + picture[0].firstChild.nodeValue + "\" border=\"0\" />");
	document.write ("</a>");
	
	// close the div container holding the product image
	document.write ("</div>");
	
	// write the opening div container that will hold the descriptive text
	document.write ("<div id=\"descriptionProduct\">");
	
	// write the product information

		// item code number
		document.write ("<p><span class=\"bodyBold\">Item code: </span>");
		document.write (number[0].firstChild.nodeValue);
		document.write ("</p>");
		
		// material - CLEARANCE only
		if (material[0].firstChild.nodeValue != "none")
		{
			document.write ("<p><span class=\"bodyBold\">Material: </span>");
			document.write (material[0].firstChild.nodeValue);
			document.write ("</p>");
		}
		
		// dimensions
		if (dimensions[0].firstChild.nodeValue != "none")
		{
			document.write ("<p><span class=\"bodyBold\">Dimensions: </span>");
			document.write (dimensions[0].firstChild.nodeValue);
			document.write ("</p>");
		}
		
		// sizes available
		if (size[0].firstChild.nodeValue != "none")
		{
			document.write ("<p><span class=\"bodyBold\">Sizes available: </span>");
			document.write (size[0].firstChild.nodeValue);
			document.write ("</p>");
		}
		
		// colours available
		if (colour[0].firstChild.nodeValue != "none")
		{
			document.write ("<p><span class=\"bodyBold\">Colors available: </span>");
			document.write (colour[0].firstChild.nodeValue);
			document.write ("</p>");
		}

		// weight
		if (weight[0].firstChild.nodeValue != "none")
		{
			document.write ("<p><span class=\"bodyBold\">Weight: </span>");
			document.write (weight[0].firstChild.nodeValue);
			document.write ("</p>");
		}
		
		// case pack
		if (casepack[0].firstChild.nodeValue != "none")
		{
			document.write ("<p><span class=\"bodyBold\">Case pack: </span>");
			document.write (casepack[0].firstChild.nodeValue);
			document.write ("</p>");
		}
		
		// description
		if (description[0].firstChild.nodeValue != "none")
		{
			document.write ("<p><span class=\"bodyBold\">Description: </span>");
			document.write (description[0].firstChild.nodeValue);
			document.write ("</p>");
		}
		
	// close the div container holding the descriptive text
	document.write ("</div>");
}//end function writeDetail()



// function to write the side nav for the outdoor furniture category
function sideNavOutdoor(keyword)
{
	// Find the root element for the category
	var baseElement = myDoc.getElementsByTagName(keyword);
	// create an array of the item elements for each category
	var items = baseElement[0].getElementsByTagName("item");
	
	// write the category and link to its home page
	document.write("<a href=\"index.htm\" class=\"sideNavTitle\">");
	document.write(keyword);
	document.write("</a><br />");
	
	// cycle through the document for the product links
	for (i=0; i<items.length; i++)
	{
		// create the index for the product link
		var index = i + 1;
		// get the product name
		var name = items[i].getElementsByTagName("name");
		// write the links
		document.write("<a href=\"" + keyword + index + ".htm\" class=\"sideNavlink\">");
		document.write(name[0].firstChild.nodeValue);
		document.write("</a><br />")
	}
	
/* This entire section is not needed as there are no further subcategories

// write the remaining categorys for the outdoor furniture section
	if (keyword != "hardwood")
	{
	document.write("<a href=\"../hardwood/index.htm\" class=\"sideNavTitle\">");
	document.write("hardwood");
	document.write("</a><br />");
	}
	
	if (keyword != "bamboo")
	{
	document.write("<a href=\"../bamboo/index.htm\" class=\"sideNavTitle\">");
	document.write("bamboo");
	document.write("</a><br />");
	}

	if (keyword != "mosaic")
	{
	document.write("<a href=\"../mosaic/index.htm\" class=\"sideNavTitle\">");
	document.write("mosaic");
	document.write("</a><br />");
	}*/
}//end function sideNavOutdoor()

// function to write the side nav for the willow category
function sideNavWillow(keyword)
{
	// Find the root element for the category
	var baseElement = myDoc.getElementsByTagName(keyword);
	// create an array of the item elements for each category
	var items = baseElement[0].getElementsByTagName("item");
	
	// write the category and link to its home page
	if (keyword == "willow_decor")
	{
		document.write("<a href=\"index.htm\" class=\"sideNavTitle\">");
		document.write("willow d&eacute;cor");
		document.write("</a><br />");
	}
	else if (keyword == "fencing")
	{
		document.write("<a href=\"index.htm\" class=\"sideNavTitle\">");
		document.write("fences &amp; privacy screens");
		document.write("</a><br />");
	}
	else if (keyword == "trellis")
	{
		document.write("<a href=\"index.htm\" class=\"sideNavTitle\">");
		document.write("trellises &amp; plant supports");
		document.write("</a><br />");
	}
	else if (keyword == "willow_iron")
	{
		document.write("<a href=\"index.htm\" class=\"sideNavTitle\">");
		document.write("willow &amp; iron");
		document.write("</a><br />");
	}
	else
	{	
	document.write("<a href=\"index.htm\" class=\"sideNavTitle\">");
	document.write(keyword);
	document.write("</a><br />");
	}
	
	// cycle through the document for the product links
	for (i=0; i<items.length; i++)
	{
		// create the index for the product link
		var index = i + 1;
		// get the product name
		var name = items[i].getElementsByTagName("name");
		// write the links
		document.write("<a href=\"" + keyword + index + ".htm\" class=\"sideNavlink\">");
		document.write(name[0].firstChild.nodeValue);
		document.write("</a><br />")
	}
	
	// write the remaining categorys for the willow section
	if (keyword != "willow_decor")
	{
	document.write("<a href=\"../willow_decor/index.htm\" class=\"sideNavTitle\">");
	document.write("willow d&eacute;cor");
	document.write("</a><br />");
	}
	
	if (keyword != "fencing")
	{
	document.write("<a href=\"../fencing/index.htm\" class=\"sideNavTitle\">");
	document.write("fences &amp; privacy screens");
	document.write("</a><br />");
	}

	if (keyword != "trellis")
	{
	document.write("<a href=\"../trellis/index.htm\" class=\"sideNavTitle\">");
	document.write("trellises &amp plant supports");
	document.write("</a><br />");
	}
	
	if (keyword != "willow_iron")
	{
	document.write("<a href=\"../willow_iron/index.htm\" class=\"sideNavTitle\">");
	document.write("willow &amp; iron");
	document.write("</a><br />");
	}

}//end function sideNavWillow()

// function to write the side nav for the planters category
function sideNavPlanters(keyword)
{
	// Find the root element for the category
	var baseElement = myDoc.getElementsByTagName(keyword);
	// create an array of the item elements for each category
	var items = baseElement[0].getElementsByTagName("item");
	
	// write the category and link to its home page
	if (keyword == "stoneware")
	{
		document.write("<a href=\"index.htm\" class=\"sideNavTitle\">");
		document.write("stoneware planters");
		document.write("</a><br />");
	}
	else if (keyword == "earthenware")
	{
		document.write("<a href=\"index.htm\" class=\"sideNavTitle\">");
		document.write("earthenware planters");
		document.write("</a><br />");
	}
	else
	{	
	document.write("<a href=\"index.htm\" class=\"sideNavTitle\">");
	document.write(keyword);
	document.write("</a><br />");
	}

	// cycle through the document for the product links
	for (i=0; i<items.length; i++)
	{
		// create the index for the product link
		var index = i + 1;
		// get the product name
		var name = items[i].getElementsByTagName("name");
		// write the links
		document.write("<a href=\"" + keyword + index + ".htm\" class=\"sideNavlink\">");
		document.write(name[0].firstChild.nodeValue);
		document.write("</a><br />")
	}
	
	// write the remaining categorys for the planters section
	if (keyword != "stoneware")
	{
	document.write("<a href=\"../stoneware/index.htm\" class=\"sideNavTitle\">");
	document.write("stoneware planters");
	document.write("</a><br />");
	}
	
	if (keyword != "earthenware")
	{
	document.write("<a href=\"../earthenware/index.htm\" class=\"sideNavTitle\">");
	document.write("earthenware planters");
	document.write("</a><br />");
	}

}//end function sideNavPlanters()

// function to write the side nav for the decor category
function sideNavDecor(keyword)
{
	// Find the root element for the category
	var baseElement = myDoc.getElementsByTagName(keyword);
	// create an array of the item elements for each category
	var items = baseElement[0].getElementsByTagName("item");
	
	// write the category and link to its home page
	if (keyword == "birdbaths")
	{
		document.write("<a href=\"index.htm\" class=\"sideNavTitle\">");
		document.write("glazed birdbaths");
		document.write("</a><br />");
	}
	else if (keyword == "time_worn")
	{
		document.write("<a href=\"index.htm\" class=\"sideNavTitle\">");
		document.write("time-worn treasures");
		document.write("</a><br />");
	}
	else if (keyword == "gardnfolk")
	{
		document.write("<a href=\"index.htm\" class=\"sideNavTitle\">");
		document.write("gard'nfolk");
		document.write("</a><br />");
	}
	else if (keyword == "glassware")
	{
		document.write("<a href=\"index.htm\" class=\"sideNavTitle\">");
		document.write("handblown glass d&eacute;cor");
		document.write("</a><br />");
	}
	else if (keyword == "mushrooms")
	{
		document.write("<a href=\"index.htm\" class=\"sideNavTitle\">");
		document.write("ceramic mushrooms");
		document.write("</a><br />");
	}
	else if (keyword == "ceramic")
	{
		document.write("<a href=\"index.htm\" class=\"sideNavTitle\">");
		document.write("ceramic ornaments");
		document.write("</a><br />");
	}
	else if (keyword == "garden_stakes")
	{
		document.write("<a href=\"index.htm\" class=\"sideNavTitle\">");
		document.write("garden stakes");
		document.write("</a><br />");
	}
	else if (keyword == "outdoor_fountains")
	{
		document.write("<a href=\"index.htm\" class=\"sideNavTitle\">");
		document.write("outdoor fountains");
		document.write("</a><br />");
	}
	else
	{	
	document.write("<a href=\"index.htm\" class=\"sideNavTitle\">");
	document.write(keyword);
	document.write("</a><br />");
	}
	
	// cycle through the document for the product links
	for (i=0; i<items.length; i++)
	{
		// create the index for the product link
		var index = i + 1;
		// get the product name
		var name = items[i].getElementsByTagName("name");
		// write the links
		document.write("<a href=\"" + keyword + index + ".htm\" class=\"sideNavlink\">");
		document.write(name[0].firstChild.nodeValue);
		document.write("</a><br />")
	}
	
	// write the remaining categorys for the decor section
	if (keyword != "birdbaths")
	{
	document.write("<a href=\"../birdbaths/index.htm\" class=\"sideNavTitle\">");
	document.write("glazed birdbaths");
	document.write("</a><br />");
	}

	if (keyword != "time_worn")
	{
	document.write("<a href=\"../time_worn/index.htm\" class=\"sideNavTitle\">");
	document.write("time-worn treasures");
	document.write("</a><br />");
	}
	
	if (keyword != "gardnfolk")
	{
	document.write("<a href=\"../gardnfolk/index.htm\" class=\"sideNavTitle\">");
	document.write("gard'nfolk");
	document.write("</a><br />");
	}
	
	if (keyword != "glassware")
	{
	document.write("<a href=\"../glassware/index.htm\" class=\"sideNavTitle\">");
	document.write("handblown glass d&eacute;cor");
	document.write("</a><br />");
	}

	if (keyword != "mushrooms")
	{
	document.write("<a href=\"../mushrooms/index.htm\" class=\"sideNavTitle\">");
	document.write("ceramic mushrooms");
	document.write("</a><br />");
	}

	if (keyword != "ceramic")
	{
	document.write("<a href=\"../ceramic/index.htm\" class=\"sideNavTitle\">");
	document.write("ceramic ornaments");
	document.write("</a><br />");
	}
	
	if (keyword != "garden_stakes")
	{
	document.write("<a href=\"../garden_stakes/index.htm\" class=\"sideNavTitle\">");
	document.write("garden stakes");
	document.write("</a><br />");
	}

	if (keyword != "outdoor_fountains")
	{
	document.write("<a href=\"../outdoor_fountains/index.htm\" class=\"sideNavTitle\">");
	document.write("outdoor fountains");
	document.write("</a><br />");
	}

	if (keyword != "figurines")
	{
	document.write("<a href=\"../figurines/index.htm\" class=\"sideNavTitle\">");
	document.write("figurines");
	document.write("</a><br />");
	}

}//end function sideNavDecor()

// function to write the side nav for the clearance category
function sideNavClearance(keyword)
{
	// Find the root element for the category
	var baseElement = myDoc.getElementsByTagName(keyword);
	// create an array of the item elements for each category
	var items = baseElement[0].getElementsByTagName("item");
	
	// write the category and link to its home page
	document.write("<a href=\"index.htm\" class=\"sideNavTitle\">");
	document.write(keyword);
	document.write("</a><br />");
	
	// cycle through the document for the product links
	for (i=0; i<items.length; i++)
	{
		// create the index for the product link
		var index = i + 1;
		// get the product name
		var name = items[i].getElementsByTagName("name");
		// write the links
		document.write("<a href=\"" + keyword + index + ".htm\" class=\"sideNavlink\">");
		document.write(name[0].firstChild.nodeValue);
		document.write("</a><br />")
	}
	
}//end function sideNavClearance()