/***************************************************************
* lib.js
* version 1.4 2007-01-11
***************************************************************/ 
var aarfNav = Class.create();
var aarfSection = Class.create();
var aarfGroup = Class.create();
var aarfItem = Class.create();

aarfNav.prototype = {

	/***************************************************************
	* constructor
	* @param xmlDoc is refence to entire control xml 
	* @param hParent is parent HTML element
	 **************************************************************/ 
	initialize: function(xmlDoc, hParent) {

		//default properties
		this.hParent = hParent
		
		//initialization
		this.initNav(xmlDoc);	
	}, 

	/***************************************************************
	* initialize the nav
	* @param xmlDoc is refence to entire control xml 
	 **************************************************************/ 	
	initNav: function(xmlDoc) {
	
		//home link
		var hLinkBox = this.hParent.appendChild(document.createElement('div'));
		hLinkBox.id = 'homelinkbox';
		var hLink = hLinkBox.appendChild(document.createElement('a'));
		hLink.setAttribute('href', '../../index.html');
		hLink.id = "homelink";
		hLink.innerHTML = "Home Page";		
		
		//backwards compatibility -- remove homelink from newer documents if specified
		var oHomeLink = xmlDoc.getElementsByTagName("homelink")[0];	
		if (oHomeLink && oHomeLink.firstChild.nodeValue && oHomeLink.firstChild.nodeValue == "false") {
			this.hParent.removeChild(hLinkBox);
		}
		
		var oSections = xmlDoc.getElementsByTagName("section");			
		for (var s=0; s < oSections.length; s++) {
	
			//section list 
			var hSectionList = this.hParent.appendChild(document.createElement('ul'));
			hSectionList.id = "sectionList" + s;
			hSectionList.className = "sectionList";	
	
			//section name
			var hSection = hSectionList.appendChild(document.createElement('li'));
			var hSectionLink = document.createElement('a');
			hSectionLink.setAttribute('href', 'javascript:toggleSection(' + s + ');');
			hSectionLink.innerHTML = oSections[s].attributes.getNamedItem("label").value;
			hSectionLink.id = "navSection" + s;
			hSectionLink.className = 'section';
			hSection.appendChild(hSectionLink);		
			
			//group list 
			var hGroupList = hSectionList.appendChild(document.createElement('ul'));			
			hGroupList.id = "groupList" + s;
			hGroupList.className = "groupList";
			var oGroups = oSections[s].getElementsByTagName("group");
			
			for (var g=0; g < oGroups.length; g++) {
			
				//group name
				var hGroup = hGroupList.appendChild(document.createElement('li'));
				var hLink = document.createElement('a');
				hLink.setAttribute('href', 'javascript:getGroup(' + s + ',' + g + ');');
				hLink.className = 'group';
				hLink.innerHTML = oGroups[g].attributes.getNamedItem("label").value;
				hGroup.appendChild(hLink);
				
			} 			
		}
		
					
		//debug
		//createStyleNav(this.hParent);
		
	}	
}	

aarfSection.prototype = {

	/***************************************************************
	* constructor
	* @param oSectionNode is entire "section" node from control xml
	* @param hSection is parent HTML element		
	* @param nGroupIndex is optional numeric index of which child
	*        group in section node to create
	***************************************************************/ 
	initialize: function(oSectionNode, hParent, nGroupIndex) {
	
		//default properties
		this.sID = "resources";
		this.nGroupIndex = (nGroupIndex == undefined) ? 0 : nGroupIndex;
		this.hParent = hParent;
	
		//object initialization
		this.initSection(oSectionNode);
	},
	
	/***************************************************************
	* initialization for section
	* @param oSectionNode is entire "section" node from control xml
	 **************************************************************/ 
	initSection: function(oSectionNode) {

		//create container element
		var hSection = document.createElement('div');	
		hSection.id = this.sID;	
	
		//sections should have a label
		if (oSectionNode.attributes.getNamedItem("label").value != "") {				
			var hLabel = hSection.appendChild(document.createElement('h2'));	
			hLabel.innerHTML = oSectionNode.attributes.getNamedItem("label").value;
			hLabel.className = 'sectionLabel';							
		}
		
		//handle child items
		this.parseGroups(oSectionNode, hSection);
		
		//write the new section to page
		this.hParent.appendChild(hSection);
	},
	
	/***************************************************************
	* create a new group for each group in section
	* @param oSectionNode is entire "section" node from control xml
	* @param hSection is parent HTML element
	 **************************************************************/ 	
	parseGroups: function(oSectionNode, hSection) {

		var oGroups = oSectionNode.getElementsByTagName("group");

		//if nGroupIndex is defined, get that requested group, otherwise
		//default to the first group of the section	
		var oGroup = new aarfGroup(oGroups[this.nGroupIndex], hSection);	
	}
}

aarfGroup.prototype = {

	/***************************************************************
	* constructor
	* @param xmlNode is a complete "group" xml node from configuration xml
	* @param hParent is the parent html node 
	 **************************************************************/ 
	initialize: function(xmlNode, hParent) {
	
		//instance props
		this.sLabel = xmlNode.attributes.getNamedItem("label").value;
		this.hParent = hParent;	
		
		//initialize
		this.initGroup(xmlNode);
	},

	/***************************************************************
	* initialization of group
	* @param xmlNode is a complete "group" xml node from configuration xml
	 **************************************************************/	
	initGroup: function(xmlNode) {
	
		//create a group container
		var hGroup = document.createElement('div');
		hGroup.className = "group";		
		this.hParent.appendChild(hGroup);	
		
		//each group has a label
		if (this.sLabel != "") {				
			var hLabel = hGroup.appendChild(document.createElement('h3'));	
			hLabel.innerHTML = this.sLabel;
			hLabel.className = 'groupLabel';							
		}	
		
		//handle all items in this group
		this.parseItems(xmlNode, hGroup);
	},
		
	/***************************************************************
	* create an item for each item in this group
	* @param oSectionNode is the entire group node from control xml
	* @param hSection is the parent html element
	 **************************************************************/ 
	parseItems: function(oSectionNode, hSection) {
		
		var oItems = oSectionNode.getElementsByTagName("item");
	
		for (var i=0; i < oItems.length; i++) {
	
			var oItem = new aarfItem(oItems[i]);
			
			var hItem = document.createElement('div');
			hItem.className = oItem.getClassType();
			hItem.innerHTML = oItem.getEmbed();
			
			hSection.appendChild(hItem);	
		}
	}	
}

aarfItem.prototype = {

	/***************************************************************
	* constructor
	* @param xmlNode is a complete "item" xml node from configuration xml
	 **************************************************************/ 
	initialize: function(xmlNode) {
	
		//static 
		aarfItem.nCount = ++aarfItem.nCount || 0; 
	
		//assigned properties
		this.sID = "item_" + aarfItem.nCount;
		this.sType = "";
		this.sResource = "";
		this.sLabel = "";
		this.sParams = "";
		this.oParams = new Object();
		this.sFlashVars = "";		
		this.sEmbed = "";
		this.sClassType = ""; //used by css
		
		//object initialization
		this.initItem(xmlNode);	
	},

	/***************************************************************
	* parse creation xml, populate instance properties, create item code
	* @param xmlNode is a complete "item" xml node from configuration xml
	 **************************************************************/ 
	initItem: function(xmlNode) {
	
		//derrive values from item node attributes
		var oLabel = xmlNode.getElementsByTagName("label")[0];
		var oResource = xmlNode.getElementsByTagName("resource")[0];
		var oParams = xmlNode.getElementsByTagName("params")[0];
		var oFlashVars = xmlNode.getElementsByTagName("flashvars")[0];				
		
		//set instance properties
		this.sType = xmlNode.attributes.getNamedItem("type").value;			
		this.sResource = oResource.firstChild.nodeValue;	
		
		//item label is mostly optional (not for "link" items though);
		this.sLabel = (oLabel.firstChild != null) ? oLabel.firstChild.nodeValue : "";	
		
		//parameters attribute value is optional, but if passed, are pipe delimited key/value pairs in string format
		if (oParams.firstChild != null) {
			var aParams = oParams.firstChild.nodeValue.split("|")
			for (var n=0; n < aParams.length; n++) {
				var aPairs = aParams[n].split("=");
				this.oParams[aPairs[0]] = aPairs[1];
			} 						
		}

		//flashvars attribute value is optional, but if passed, are pipe delimited key/value pairs in string format
		if (oFlashVars) {
			if (oFlashVars.firstChild != null) {
				this.sFlashVars = oFlashVars.firstChild.nodeValue;
			}
		}
	
		//define the object embed string based on declared type
		if (this.sType == "copy") {
	
			this.sClassType = "copyItem";			
			this.sEmbed = '<div class="copyblock">' + this.sResource + '</div>';
			if (this.sLabel != "") { 
				this.sEmbed = "<h5>" + this.sLabel + "</h5>" + this.sEmbed; 
			} 	

		} else if (this.sType == "image") {
	
			this.sClassType = "imageItem";
			
			this.sEmbed += '<img src="resources/' + this.sResource + '" alt="" /><br />';
			if (this.sLabel != "") { 
				this.sEmbed = "<h5>" + this.sLabel + "</h5>" + this.sEmbed; 
			} 

		} else if (this.sType == "iframe") {

			this.sClassType = "iframeItem";

			//handle optional parameters or use defaults
			var sWidth = (this.oParams.width) ? this.oParams.width : "400";				
			var sHeight = (this.oParams.height) ? this.oParams.height : "300";
			var sFrameborder = (this.oParams.frameborder) ? this.oParams.frameborder : "0";
			var sScrolling = (this.oParams.scrolling) ? this.oParams.scrolling : "auto";			
			var sMarginheight = (this.oParams.marginheight) ? this.oParams.marginheight : "0";
			var sMarginwidth = (this.oParams.marginwidth) ? this.oParams.marginwidth : "0";						
			
			this.sEmbed += ' <iframe width="' + sWidth + '" height="' + sHeight + '" src="' + this.sResource + '" frameborder="' + sFrameborder + '" scrolling="' + sScrolling + '" marginheight="' + sMarginheight + '" marginwidth="' + sMarginwidth + '"></frame>';
			if (this.sLabel != "") { 
				this.sEmbed = "<h5>" + this.sLabel + "</h5>" + this.sEmbed; 
			} 			
						
		} else if (this.sType == "flash") {
	
			this.sClassType = "flashItem";
	
			//handle optional parameters or use defaults
			var sVersion = (this.oParams.version) ? this.oParams.version : "7";
			var sRGB = (this.oParams.bgcolor) ? this.oParams.bgcolor : "ffffff";
			var sWidth = (this.oParams.width) ? this.oParams.width : "600";				
			var sHeight = (this.oParams.height) ? this.oParams.height : "600";
			var sFlashVars = (this.sFlashVars && (this.sFlashVars != "")) ? this.sFlashVars : "";			
	
			//flash label
			if (this.sLabel != "") { 
				this.sEmbed = "<h5>" + this.sLabel + "</h5>" + this.sEmbed; 
			} 
			
			//create custom flash embed
			this.sEmbed += '<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=' + sVersion + ',0,0,0" width="' + sWidth + '" height="' + sHeight + '" id="swf' + this.sID + '" align="middle">';
			this.sEmbed += '<param name="allowScriptAccess" value="sameDomain" /><param name="movie" value="resources/' + this.sResource + '" /><param name="quality" value="high" /><param name="bgcolor" value="#' + sRGB + '" /><param name="flashvars" value="' + sFlashVars + '" />';
			this.sEmbed += '<embed src="resources/' + this.sResource + '" quality="high" bgcolor="#' + sRGB + '" width="' + sWidth + '" height="' + sHeight + '" name="swf' + this.sID + '" align="middle" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" flashvars="' + sFlashVars + '"/></object>';					

		} else if (this.sType == "link") {
	
			this.sClassType = "linkItem";			
			var sTarget = (this.oParams.target) ? this.oParams.target : "_blank";				
			this.sEmbed += '<a href="' + this.sResource + '" target="' + sTarget + '">' + this.sLabel + '</a><br />';	
			
		} else if (this.sType == "quicktime") {
		
			this.sClassType = "quicktime";
			
			//handle optional parameters or use defaults
			var sAutoplay = (this.oParams.autoplay) ? this.oParams.autoplay : "true";						
			var sController = (this.oParams.controller) ? this.oParams.controller : "true";									
			var sWidth = (this.oParams.width) ? this.oParams.width : "300";				
			var sHeight = (this.oParams.height) ? this.oParams.height : "300";			
			
			//create custom quicktime embed
			this.sEmbed = '<objectclassid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"codebase="http://www.apple.com/qtactivex/qtplugin.cab" width="' + sWidth + '" height="' + sHeight + '">';
			this.sEmbed += '<param name="src" value="' + this.sResource + '" /><param name="' + sAutoplay + '" value="true" /><param name="controller" value="' + sController + '" />';
			this.sEmbed += '<embed src="resources/' + this.sResource + '" width="' + sWidth + '" height="' + sHeight + ' type="video/quicktime" pluginspage="http://www.apple.com/quicktime/download/" autoplay="' + sAutoplay + '" controller="' + sController + '" />'
			this.sEmbed += '</object>';			
			
			//label
			if (this.sLabel != "") { 
				this.sEmbed = "<h5>" + this.sLabel + "</h5>" + this.sEmbed; 
			} 			
		
		}
	},

	getClassType: function() {
		return this.sClassType;
	},
	
	getID: function() {
		return this.sID;
	},
	
	getLabel: function() {
		return this.sLabel;
	},
	
	getEmbed: function() {
		return this.sEmbed;
	}

}

/***************************************************************
* @param nSection is the numeric indicator of the requested
*        section within the master XML
* @param bDefault (optional), unless passed "false", default to first group
**************************************************************/ 
function toggleSection(nSection, sDefault) {

	var aSections = document.getElementsByClassName('sectionList', 'navResources');

	for (var i=0; i < aSections.length; i++) {
	
		if (i == nSection) {
			var hSection = $("sectionList" + nSection);	
			Element.toggle(hSection.childNodes[1]);
			if (Element.hasClassName(hSection, "sectionClosed")) {		
				Element.removeClassName(hSection, "sectionClosed");
				Element.addClassName(hSection, "sectionOpen");		
			}				
			
			if (sDefault == "false") {
				getGroup(nSection, document.nGroup);			
			} else {
				getGroup(nSection, 0);
			}
				
		} else {
			var hSection = $("sectionList" + i);	
			Element.hide(hSection.childNodes[1]);
		
			if (Element.hasClassName(hSection, "sectionOpen")) {
				Element.removeClassName(hSection, "sectionOpen");
				Element.addClassName(hSection, "sectionClosed");		
			} 	
		}	
	}
}
 
/***************************************************************
* @param nSection is the numeric indicator of the requested
*        section within the master XML
* @param nGroup is the numeric indicator of the requested group
*        within the section node of master XML
 **************************************************************/ 
function getGroup(nSection, nGroup) {

	//remove current section
	var hContent = $('content');
	hContent.removeChild($('resources'));
	
	//retrieve requested section
	var oSection = new aarfSection(xmlDoc.getElementsByTagName("section")[nSection], hContent, nGroup);
	
	//note current position in page heirarchy
	document.nSection = nSection;
	document.nGroup = nGroup;
	
	//update nav
	navHighlightSection(nSection);
	navHighlightGroup(nSection, nGroup);	
}

/***************************************************************
* update navigation to reflect indicated group is currently active
* @param nSection is the currently active section, parent of requested group
* @param nGroup is the group to turn "on"
 **************************************************************/ 
function navHighlightGroup(nSection, nGroup) {

	var aLinks = document.getElementById("navResources").getElementsByTagName("a");
	var aGroups = document.getElementById("groupList" + nSection).getElementsByTagName("a");

	//turn off any currently active group
	for (var i=0; i < aLinks.length; i++) {
		if (aLinks[i].className == "groupOn") {
			aLinks[i].className = "group";
		} 
	}	
	
	//highlight requested group
	try {
		aGroups[nGroup].className = "groupOn";
	} catch(e) {}

}

/***************************************************************
* update navigation to reflect passed section is currently active
* @param nSection is the section to turn "on"
 **************************************************************/ 
function navHighlightSection(nSection) {

	//turn off any currently highlighted section
	//var aSections = getElementsByClassName(document.getElementById("nav"), "sectionOn");
	var aSections = document.getElementsByClassName("sectionOn");
	if (aSections.length > 0) {
		aSections[0].className = "section";
	}
	
	//highlight requested section
	document.getElementById("navSection" + nSection).className = "sectionOn";
	
	//always default to first group in section (may be overwritten by subsequent navHighlightGroup())
	navHighlightGroup(nSection, 0);

}

/***************************************************************
* create a client specific page header
* @param xmlDoc is entire header node fom external control file
* @param bContent is optional boolean, if true, link logo to resource page level
 **************************************************************/ 
function headCreate(xmlDoc, bContent) {

	//create header container
	var hContainer = document.createElement('div');	
	hContainer.id = 'header';

	//get client logo
	var oLogo = xmlDoc.getElementsByTagName("logo")[0];	
	var sLogo = (bContent) ? '../../images/' + oLogo.firstChild.nodeValue : 'images/' + oLogo.firstChild.nodeValue;
	var sLink = (bContent) ? '../../index.html' : 'index.html';
	
	var hLogoBox = hContainer.appendChild(document.createElement('div'));
	hLogoBox.id = "logo";
	var hLink = hLogoBox.appendChild(document.createElement('a'));
	hLink.setAttribute('href', sLink);
	
	var hLogo = hLink.appendChild(document.createElement('img'));
	hLogo.setAttribute('src', sLogo);	
	
	document.getElementsByTagName("body").item(0).appendChild(hContainer);	
	
}	

/***************************************************************
* create a client specific page title
* @param xmlHeader is entire header node fom external control file
* @param hParent is parent html to append new content to
 **************************************************************/ 
function titleCreate(xmlHeader, hParent) {

	//get title copy
	var oTitle = xmlDoc.getElementsByTagName("title")[0];	
	var sTitle = oTitle.firstChild.nodeValue;


	//create header container
	var hContainer = document.createElement('h1');	
	hContainer.id = 'pagetitle';
	hContainer.innerHTML = sTitle;

	hParent.appendChild(hContainer);	
	
}

/***************************************************************
* create a client specific page sidebar
* @param xmlDoc is entire header node fom external control file
* @param hParent is the html parent element to attach new content to
 **************************************************************/ 
function sidebarCreate(xmlDoc, hParent) {

	var oSidebar = xmlDoc.getElementsByTagName("sidebar")[0];	

	var hSidebar = document.createElement('div');	
	hSidebar.id = 'sidebar';
	hSidebar.innerHTML = oSidebar.firstChild.nodeValue;
			
	hParent.appendChild(hSidebar);
	
	//debug
	//createStyleNav(hSidebar);		
	
}	

/***************************************************************
* create a client specific navigation
* @param xmlDoc is entire header node fom external control file
* @param hParent is the html parent element to attach new content to
 **************************************************************/ 
function navCreate(xmlDoc, hParent) {

	var hContainer = document.createElement('div');	
	hContainer.id = 'nav';

	//start processing sections
	sectionProcess(xmlDoc, hContainer, 0, true);
	
	hParent.appendChild(hContainer);	
	
	navStateInit(hParent);	
}	 

/***************************************************************
* process all "section" nodes
* @param ndSection is the current section node to evaluate
* @param hParent is html parent element to append new content to
* @param nDepth is numeric depth of nested section, used for css assignment
* @param bFirst is optional boolean, if true omit opening UL
 **************************************************************/ 
function sectionProcess(ndSection, hParent, nDepth, bFirst) {

	var sName = ndSection.nodeName;
	var nLength = ndSection.childNodes.length;
	var sLabel = ndSection.getAttribute("label");
	var sOpen = ndSection.getAttribute("open");			
	var hList; 
			
	//the first container for the nav is a div, otherwise it's a new list
	if (bFirst) {
		hList = document.createElement('div');
		hList.id = "sections";
	} else {
		hList = document.createElement('ul');
		hList.className = 'sectionNav';
	}
	
	//sections nodes with children of one or more may be either nests of
	//other section children or a single section link -- sections with
	//no children are a simple section link	
	if (nLength >= 1) {	
		if (ndSection.firstChild.nodeType == 1) {
			if (sLabel) {	
				hItem = hList.appendChild(document.createElement('li'));		
				var hLink = hItem.appendChild(document.createElement('a'));
				hLink.id = "parentNav" + (nParentNavs++);
				hLink.innerHTML = sLabel;
				hLink.setAttribute('href', 'javascript:toggleNavDisplay("' + hLink.id  + '");');														 
				
				//display
				hLink.className = (sOpen == "false") ? "section" + nDepth + " navParentClosed" : "section" + nDepth + " navParentOpen";
				
			}		
			for (var i=0; i < nLength; i++) { 
				sectionProcess(ndSection.childNodes[i], hList, nDepth+1); 
			}
		
			hParent.appendChild(hList);		
		} else {
			sectionLink(ndSection, hParent, hList, nDepth, sLabel);						
		}		

	} else {
		sectionLink(ndSection, hParent, hList, nDepth, sLabel);
	}
} 

/***************************************************************
* 
 **************************************************************/ 
function navStateInit(hParent) {
	var aLinks = hParent.getElementsByTagName('a');
	for (var i=0; i < aLinks.length; i++) {
		if (Element.hasClassName(aLinks[i], "navParentClosed")) {
			var hParentNode = aLinks[i].parentNode.parentNode;	
			var nChildren = hParentNode.getElementsByTagName('ul');			
			for (var k=0; k < nChildren.length; k++) {										
				Element.toggle(nChildren[k]);
			}
		}
	}
}

/***************************************************************
* show or hide content in the client navigation
 **************************************************************/ 
function toggleNavDisplay(sLink) {

	var hLink = $(sLink);
	var hParent = hLink.parentNode.parentNode;	
	var nChildren = hParent.getElementsByTagName('ul');

	//hide or reveal all child sections
	for (var i=0; i < nChildren.length; i++) {										
		Element.toggle(nChildren[i]);
	}
	
	//update classnames
	if (Element.hasClassName(hLink, "navParentOpen")) {
		Element.removeClassName(hLink, "navParentOpen");
		Element.addClassName(hLink, "navParentClosed");
	} else if (Element.hasClassName(hLink, "navParentClosed")) {
		Element.removeClassName(hLink, "navParentClosed");
		Element.addClassName(hLink, "navParentOpen");
	}
}					

/***************************************************************
* create a section link
* @param ndSection is the current section node to evaluate
* @param hParent is html parent new list item is appended to
* @param hList is html parent element to append new content to
* @param nDepth is numeric depth of nested section, used for css assignment
* @param sLabel is text string used for new link
 **************************************************************/ 
function sectionLink(ndSection, hParent, hList, nDepth, sLabel) {
	var hItem = hList.appendChild(document.createElement('li'));
	var hLink = hItem.appendChild(document.createElement('a'));
	hLink.setAttribute('href', 'content/' + ndSection.firstChild.nodeValue + '/index.html');							
	hLink.className = "section" + nDepth;							
	hLink.innerHTML = sLabel;	
	hParent.appendChild(hList);		
} 

/***************************************************************
* strip all whitespace nodes from passed xmldoc
* @param node is xmldoc to modify
 **************************************************************/ 
function removeEmptyTextNodes(node) {
	for (var i=0; i < node.childNodes.length; i++) {
		var child = node.childNodes[i];
		if ((child.nodeType == 3) && (!/\S/.test(child.nodeValue))) {
			node.removeChild(node.childNodes[i]);
			i--;
		} else if (child.nodeType == 1) {
			removeEmptyTextNodes(child);
		}
	}
}

/***************************************************************
* debugging purposes only
**************************************************************/ 
function setStyle(sType) {

	var sPath = (sType == "content") ? "../../" : "";
	var nStyle = (document.cookie.charAt(6)) ? document.cookie.charAt(6) : "0";
	var hStyle = document.createElement('link');
	
	hStyle.setAttribute('rel', 'stylesheet');
	hStyle.setAttribute('type', 'text/css');
	hStyle.setAttribute('href', sPath + 'styles/style' + nStyle + '.css');	
	document.getElementsByTagName("head").item(0).appendChild(hStyle);		

}

/***************************************************************
* debugging purpose only
**************************************************************/ 
function createStyleNav(hParent) {

	var hContainer = document.createElement('div');
	hContainer.id = 'stylesNav';
	
	var hLabel = hContainer.appendChild(document.createElement('p'));
	hLabel.innerHTML = 'FPO Style Switcher';

	for (var i=0; i < 3; i++) {	
		var hLink = hContainer.appendChild(document.createElement('a'));
		var hBreak = hContainer.appendChild(document.createElement('br'));
		hLink.innerHTML = "style" + i;
		hLink.setAttribute('href', "javascript: document.cookie='style=" + i + "'; window.location.reload();");
	}

	hParent.appendChild(hContainer);

}