///	<summary>Encapsulates data/methods for an item rendered in the leftnav</summary>
function NavItem() {
	this.cssClass		= null;
	this.copy			= null;
	this.href			= null;
	this.onmouseover	= null;
	this.onmouseout		= null;
	this.onclick		= null;
	
	///	<summary>item class setter</summary>
	/// <param name="value">string - value to set internal property to</param>
	this.SetClass = function(value) {
		this.cssClass = value;
	}
	
	///	<summary>item copy setter</summary>
	/// <param name="value">string - value to set internal property to</param>
	this.SetCopy = function(value) {
		this.copy = value;
	}
	
	///	<summary>item href setter</summary>
	/// <param name="value">string - value to set internal property to</param>
	this.SetHref = function(value) {
		this.href = value;
	}
	
	///	<summary>item onmouseover setter</summary>
	/// <param name="value">string - value to set internal property to</param>
	this.SetOnmouseover = function(value) {
		this.onmouseover = value;
	}
	
	///	<summary>item onmouseout setter</summary>
	/// <param name="value">string - value to set internal property to</param>
	this.SetOnmouseout = function(value) {
		this.onmouseout = value;
	}
	
	///	<summary>item onclick setter</summary>
	/// <param name="value">string - value to set internal property to</param>
	this.SetOnclick = function(value) {
		this.onclick = value;
	}
	
	///	<summary>Renders the item to the display</summary>
	/// <param name="listCssClass">string - css class for item rendering</param>
	this.Render = function(listCssClass) {
		document.write('<li class="' + listCssClass + '"><a href="' + this.href + '" class="' + this.cssClass + '" onmouseover="' + this.onmouseover + '" onmouseout="' + this.onmouseover + '" onclick="' + this.onclick + '">' + this.copy + '</a></li>');
	}
}

///	<summary>Encapsulates data/methods for an section of items rendered in the leftnav</summary>
///	<remarks>requires /page/v4/script/ArrayExtension.js and /page/v4/script/FPImage.js</remarks>
function NavSection() {
	this.header	= new FPImage();
	this.footer	= new FPImage();
	this.items	= new Array();
	
	///	<summary>Sets up the header image for the section</summary>
	///	<remarks>parameter list matches that of the FPImage constructor</remarks>
	this.SetHeader = function(imgName, imgSrc, imgClass, imgWidth, imgHeight, imgAlt, imgBorder, imgUseOnmouseover, imgLink) {
		this.header = new FPImage(imgName, imgSrc, imgClass, imgWidth, imgHeight, imgAlt, imgBorder, imgUseOnmouseover, imgLink);
	}
	
	///	<summary>Sets up the footer image for the section</summary>
	///	<remarks>parameter list matches that of the FPImage constructor</remarks>
	this.SetFooter = function(imgName, imgSrc, imgClass, imgWidth, imgHeight, imgAlt, imgBorder, imgUseOnmouseover, imgLink) {
		this.footer = new FPImage(imgName, imgSrc, imgClass, imgWidth, imgHeight, imgAlt, imgBorder, imgUseOnmouseover, imgLink);
	}
	
	///	<summary>Adds an item to the section</summary>
	/// <param name="item">object - item to be added to the section</param>
	this.Add = function(item) {
		this.items.push(item);
	}
	
	///	<summary>Renders the section to the display</summary>
	/// <param name="listCssClass">string - css class for item rendering</param>
	this.Render = function(listCssClass) {
		document.write('' +
			'<div id="browseToys" style="position: relative;">\n' +
			'<div>' + this.header.html + '</div>' +
			'<div valign="top" class="leftnavcolor" width="161">\n' +
				'<ul class="' + listCssClass + '">');
		
				// Loop all items in the section and render them to the display
		for (var i = 0; i < this.items.length; i++) {
			this.items[i].Render(listCssClass);
		}
		
		document.write('' +
				'</ul>' +
			'</div>' +
			'<div>' + this.footer.html + '</div>');
	}
}