var cssClass = new Array(5);
cssClass[0] = "MC";
cssClass[1] = "SubCatLvl1";
cssClass[2] = "SubCatLvl2";
cssClass[3] = "SubCatLvl3";
cssClass[4] = "SubCatLvl4";

var Tree = new Array;
Tree[0] = "132$$0$$The Troentorp Collection$$/ListProducts.aspx?cat=132$$0$$0$$1";
Tree[1] = "102$$0$$Clogs$$/ListProducts.aspx?cat=102$$1$$0$$1";
Tree[2] = "104$$102$$Monet$$/ListProducts.aspx?cat=104$$0$$0$$2";
Tree[3] = "108$$102$$Rembrandt$$/ListProducts.aspx?cat=108$$0$$0$$2";
Tree[4] = "111$$102$$Durer$$/ListProducts.aspx?cat=111$$0$$0$$2";
Tree[5] = "110$$102$$O'Keefe$$/ListProducts.aspx?cat=110$$0$$0$$2";
Tree[6] = "112$$102$$Raphael$$/ListProducts.aspx?cat=112$$0$$0$$2";
Tree[7] = "113$$102$$Wright$$/ListProducts.aspx?cat=113$$0$$0$$2";
Tree[8] = "114$$102$$Audubon$$/ListProducts.aspx?cat=114$$0$$0$$2";
Tree[9] = "130$$102$$Donatello$$/ListProducts.aspx?cat=130$$0$$0$$2";
Tree[10] = "131$$102$$Johansson$$/ListProducts.aspx?cat=131$$0$$1$$2";
Tree[11] = "103$$0$$Sandals$$/ListProducts.aspx?cat=103$$1$$0$$1";
Tree[12] = "105$$103$$Mariah$$/ListProducts.aspx?cat=105$$0$$0$$2";
Tree[13] = "125$$103$$Mary Jane$$/ListProducts.aspx?cat=125$$0$$0$$2";
Tree[14] = "126$$103$$Karin$$/ListProducts.aspx?cat=126$$0$$0$$2";
Tree[15] = "137$$103$$Anna$$/ListProducts.aspx?cat=137$$0$$1$$2";
Tree[16] = "106$$0$$Closed back clogs$$/ListProducts.aspx?cat=106$$1$$0$$1";
Tree[17] = "115$$106$$Picasso$$/ListProducts.aspx?cat=115$$0$$0$$2";
Tree[18] = "116$$106$$Van Gogh$$/ListProducts.aspx?cat=116$$0$$0$$2";
Tree[19] = "117$$106$$5 Star Professional$$/ListProducts.aspx?cat=117$$0$$1$$2";
Tree[20] = "134$$0$$$$/ListProducts.aspx?cat=134$$0$$0$$1";
Tree[21] = "135$$0$$$$/ListProducts.aspx?cat=135$$0$$0$$1";
Tree[22] = "136$$0$$$$/ListProducts.aspx?cat=136$$0$$0$$1";
Tree[23] = "139$$0$$$$/ListProducts.aspx?cat=139$$0$$1$$1";

// Arrays for nodes and icons

var nodes = new Array();
var nodeObjects = new Array();
var openNodes = new Array();
var icons = new Array(14);

// Loads all icons that are used in the tree

function SendForm(form)
			{
				form.submit();
			}

function preloadIconsStart(path) {
	icons[0] = new Image();
	icons[0].src = path + "/menu/mp.gif";
	icons[1] = new Image();
	icons[1].src = path + "/menu/mp.gif";
	icons[2] = new Image();
	icons[2].src = path + "/menu/mp.gif";
	icons[3] = new Image();
	icons[3].src = path + "/menu/mp.gif";
	icons[4] = new Image();
	icons[4].src = path + "/menu/mm.gif";
	icons[5] = new Image();
	icons[5].src = path + "/menu/mm.gif";
	icons[6] = new Image();
	icons[6].src = path + "/menu/mm.gif";
	icons[7] = new Image();
	icons[7].src = path + "/menu/mm.gif";
	icons[8] = new Image();
	icons[8].src = path + "/menu/trans.gif";
	icons[9] = new Image();
	icons[9].src = path + "/menu/trans.gif";
	icons[10] = new Image();
	icons[10].src = path + "/menu/trans.gif";
	icons[11] = new Image();
	icons[11].src = path + "/menu/folder.gif";
	icons[12] = new Image();
	icons[12].src = path + "/menu/folder.gif";
	icons[13] = new Image();
	icons[13].src = path + "/menu/trans.gif";
}

function NodeItemStart(obj, idx)
{
	var vals = obj.split('$$');

	this.id = idx;
	this.catid = vals[0];
	this.parentid = vals[1];
	this.name = vals[2];
	this.path = vals[3];
	this.isOpen = false;
	this.hasChildNode = Boolean(parseInt(vals[4]));
	this.lastSibling = Boolean(parseInt(vals[5]));
	this.level = parseInt(vals[6]);
	
	this.joinString = function(cssClass)
	{
		var css = cssClass[this.level];
		var cssLength = css.length;
		var result = "";
		
		// Write out line & empty icons
		
	
		result += "\n\t<div class=\"" + cssClass[this.level] + "\">\n\t";
		
		result += "\t<table cellpadding=1 cellspacing=0 border=0 width=\"100%\">\n\t\t\t<tr>\n\t\t\t\t<td class=\"menuTd1Lvl" + this.level + "\">";	
		
		for (jdx = 2; jdx <= this.level; jdx++)
		{
			if (jdx == this.level)
			{
				result += "<img src=\"" + icons[13].src + "\" align=\"absbottom\" alt=\"\" />";
			}
			else if (jdx >= 1)
			{
				result += "<img src=\"" + icons[9].src + "\" align=\"absbottom\" alt=\"\" />";
			}
		}
			
		// Write out join icons
		if (this.hasChildNode) 
		{
			if (this.isOpen) 
			{
				if (this.lastSibling)
				{
					result += "<img id=\"join" + this.catid + "\" onclick=\"javascript:ocStart(" + this.catid + ", -1);\" src=\"" + icons[6].src + "\"";
				}
				else
				{
					result += "<img id=\"join" + this.catid + "\" onClick=\"javascript: ocStart(" + this.catid + ", -1);\" src=\"" + icons[4].src + "\"";
				}
			}
			else 
			{
				if (this.lastSibling)
				{
					result += "<img id=\"join" + this.catid + "\" onclick=\"javascript: ocStart(" + this.catid + ", -1);\" src=\"" + icons[2].src + "\"";
				}
				else
				{
					result += "<img id=\"join" + this.catid + "\" onclick=\"javascript: ocStart(" + this.catid + ", -1);\" src=\"" + icons[0].src + "\"";
				}
			}
			result += " align=\"absbottom\" style=\"cursor:pointer;\" alt=\"Open/Close node\" /></a>";
		}
		else 
		{
			if (this.lastSibling)
			{
				result += "<img src=\"" + icons[8].src + "\" align=\"absbottom\" />";
			}
			else
			{
				result += "<img src=\"" + icons[10].src + "\" align=\"absbottom\" alt=\"\" />";				
			}
		}
		
		// Start link
		// Write out folder & page icons
		result += "</td>\n\t\t\t\t<td class=\"menuTd2Lvl" + this.level + "\">";
		if (this.hasChildNode) 
		{
			if (this.path.length > 0)
			{
				result += "<img id=\"icon" + this.catid + "\" ";
				if (this.isOpen) 
				{
					result += "src=\"" + icons[12].src + "\" align=\"absbottom\" alt=\"Folder\" width=\"0\" />";
				}
				else
				{
					result += "src=\"" + icons[11].src + "\" align=\"absbottom\" alt=\"Folder\" width=\"0\" />";				
				}
				result += "</td><td width=\"100%\">";
										
				if (cssLength > 0)
				{
					result += "<label class=\"" + css + "\" style=\"cursor:pointer;border: 0px solid;\" onclick=\"javascript: ocStart(" + this.catid + ", -1, '" + this.path + "');\" onmouseover=\"window.status='" + this.name + "';return true;\" onmouseout=\"window.status=' ';return true;\">";
				}
				else
				{
					result += "<label style=\"cursor:pointer;\" onclick=\"javascript: ocStart(" + this.catid + ", -1, '" + this.path + "');\" onmouseover=\"window.status='" + this.name + "';return true;\" onmouseout=\"window.status=' ';return true;\">";					
				}
			}
			else
			{
				result += "<img id=\"icon" + this.catid + "\" ";
				if (this.isOpen) 
				{
					result += "src=\"" + icons[12].src + "\" align=\"absbottom\" alt=\"Folder\" width=\"0\" />";
				}
				else
				{
					result += "src=\"" + icons[11].src + "\" align=\"absbottom\" alt=\"Folder\" width=\"0\" />";				
				}
				result += "</td><td width=\"100%\">";
				
				if (cssLength > 0)
				{
					result += "<label class=\"" + css + "\" style=\"cursor:pointer;border: 0px solid;\" onclick=\"javascript: ocStart(" + this.catid + ", -1);\" onmouseover=\"window.status='" + this.name + "';return true;\" onmouseout=\"window.status=' ';return true;\">";
				}
				else
				{
					result += "<label style=\"cursor:pointer;\" onclick=\"javascript: ocStart(" + this.catid + ", -1);\" onmouseover=\"window.status='" + this.name + "';return true;\" onmouseout=\"window.status=' ';return true;\">";
				}
			}
		}
		else 
		{
			if (this.path.length > 0)
			{
				result += "<img id=\"icon" + this.catid + "\" src=\"" + icons[11].src + "\" align=\"absbottom\" width=\"0\" alt=\"" + this.catid + "\" /></td><td width=\"100%\">";
				
				if (cssLength > 0)
				{		
					result += "<label onclick=\"javascript:ocStart(-1, -1, '" + this.path + "');\"  class=\"" + css + "\" style=\"cursor:pointer;border: 0px solid;\">";
				}
				else
				{
					result += "<label style=\"cursor:pointer:border;\" onclick=\"javascript:ocStart(-1, -1, '" + this.path + "');\">";				
				}
			}
			else
			{
				result += "<img id=\"icon" + this.catid + "\" src=\"" + icons[11].src + "\" align=\"absbottom\" width=\"0\" alt=\"" + this.name + "\" /></td><td width=\"100%\">";
				
				if (cssLength > 0)
				{
					result += "<label class=\"" + css + "\" style=\"border: 0px solid;\">";
				}
				else
				{
					result += "<label>";
				}
			}
		}
			
		// Write out node name
		result += this.name;
		// End link
		
		result += "</label>";
			
		result += "</td>\n\t\t</tr>\n\t</table>\n";
		
		result += "</div>\n";

		
		return result;
	};
}

function InitNodeObjectsStart(arrName)
{
	for (idx=0; idx < arrName.length; idx++)
	{
		var item = new NodeItemStart(arrName[idx], idx);

		nodeObjects.push(item);
	}
}	

// Create the tree

function createTreeStart(startNode, openNode, strSkin) 
{
	var arrName = Tree;
	var nodes = arrName;
	
	if (nodes.length > 0) 
	{
		preloadIconsStart(strSkin);
		if (startNode == null)
		{
			startNode = 0;
		}
	
		document.write("<div class=\"menuTree\">");	
		var recursedNodes = new Array();
		
		var currentIdx = 0;
		
		InitNodeObjectsStart(arrName);
		
		while (currentIdx < nodeObjects.length)
		{
			currentIdx = addNodeStart(nodeObjects[currentIdx], nodeObjects[currentIdx].level);
		}
		
		document.write("</div >");
	}
}

// Returns the position of a node in the array

function getArrayIdStart(node) {
	for (i=0; i<nodes.length; i++) 
	{
		var nodeValues = nodes[i].split("|");
		if (nodeValues[0]==node) return i;
	}
}

// Puts in array nodes that will be open

function setOpenNodesStart(openNode) 
{
	for (i=0; i<nodes.length; i++) 
	{
		var nodeValues = nodes[i].split("|");
		if (nodeValues[0]==openNode) 
		{
			openNodes.push(nodeValues[0]);
			setOpenNodesStart(nodeValues[1]);
		}
	} 
}


// Checks if a node is open

function isNodeOpenStart(node) 
{
	for (i=0; i<openNodes.length; i++)
	{
		if (openNodes[i]==node) 
			return true;
	}
	
	return false;
}

// Adds a new node in the tree

function addNodeStart(parentNode, currentLevel) 
{
	while (parentNode.level == currentLevel)
	{
			var currentIdx = parentNode.id;
			
			document.write(parentNode.joinString(cssClass));
			
			// If node has children write out divs and go deeper
			if (parentNode.hasChildNode) 
			{
				//document.write("<div id=\"div" + parentNode.catid + "\" class=\"GroupLvl" + parentNode.level + "\"");
				document.write("<div id=\"div" + parentNode.catid + "\"");
				if (!parentNode.isOpen)
				{
					document.write(" style=\"display: none;\"");
				}
			
				document.write(">");
				
				
				currentIdx = addNodeStart(nodeObjects[currentIdx + 1], nodeObjects[currentIdx + 1].level);
				
				document.write("</div>");
			}
			// remove last line or empty icon
			
			parentNode = nodeObjects[currentIdx + 1];
			
			if (parentNode != null)
			{
				if (parentNode.level != currentLevel)
				{
					return currentIdx;
				}
			}
			else
			{
				return currentIdx + 1;
			}
		}
	
	return currentIdx + 1;
}


// Opens or closes a node

function ocStart(node, type, href)
{
	if (node > -1)
	{
		oc2Start(node, type);
	}
	
	if (href != null)
	{
		window.location.href = href;
	}
}

function oc2Start(node, type) 
{
	var theDiv = document.getElementById("div" + node);
	var theJoin = document.getElementById("join" + node);
	var theIcon = document.getElementById("icon" + node);
	if (theDiv.style.display == 'none') 
	{
		if (type == 0)
		{
			theJoin.src = icons[8].src;
		}
		else if (type == 1)
		{
			theJoin.src = icons[9].src;
		}
		else if (type == 2)
		{
			theJoin.src = icons[6].src;
		}
		else
		{
			theJoin.src = icons[4].src;
		}
		
		theIcon.src = icons[12].src;
		theDiv.style.display = '';
	}
	else 
	{
		if (type == 0)
		{
			theJoin.src = icons[8].src;
		}
		else if (type == 1)
		{
			theJoin.src = icons[9].src;
		}
		else if (type == 2)
		{
			theJoin.src = icons[2].src;
		}
		else
		{
			theJoin.src = icons[0].src;
		}
		
		theIcon.src = icons[11].src;
		theDiv.style.display = 'none';
	}
	
	return true;
}