function TemplateXML(strURI,strType,strName, strConceptID, strLanguage) {
	// load from a file or create a new xml
	if ((strURI !="") && (strURI != null)) { 
		this.node = this.loadXMLFromString(strURI).documentElement;
		if (retainLayout == false || retainLayout == "false") {
			cleanup();
		}
	} 
	
	else {
		this.node = this.newXML(strType).documentElement;		
	}	
	setAtt(this.node, "name", strName);
	this.root = this.node;	
	this.doc = this.root.ownerDocument;
	this.objType = strType;
	
	// the template node
	this.template = this.root;
	
	// now if this is a new node, set doctype and language here
	if (strConceptID != null) {
		var nDocType = this.getDoctypeNode();
		setAtt(nDocType, "id",strConceptID)
	}
	if (strLanguage != null) {
		setAtt(this.node, "locale", strLanguage);
	}
}

//======================== 	Display		Functions	=====================
	function drawContent() {
		var qLength = this.getFieldCount();
		var workarea = document.getElementById("fields");
		var strField = "";
		for (var i=0;i<qLength;i++) {
			strField = strField + "<span ID=\""+i+"\"></span>";
		}
		workarea.innerHTML = strField;
		for (var i=0;i<qLength;i++) {	
			var fieldarea = document.getElementById(i);
			drawField(i, fieldarea);
		}		
		if (qLength ==0 ) {  objTemplate.addField();}
	}
	TemplateXML.prototype.drawContent = drawContent;


//======================== 	Field	Functions	=====================

 
	function addField(){
		// find Fields node
		// add Field node

		var nFieldsNode = objTemplate.getFieldsNode();
		var nTmp = this.doc.createElement("Field");
		nFieldsNode.appendChild(nTmp);
		nTmp.setAttribute("tsRegions", "ActivityTopicSpottingRegion,SymptomTopicSpottingRegion,ProductTopicSpottingRegion,ObjectTopicSpottingRegion");
		
		var iNewFieldIndex = objTemplate.getFieldCount()-1;
 		objTemplate.checkReorderPageButton();
		var workarea = document.getElementById("fields");
		workarea.innerHTML = workarea.innerHTML + "<span ID=\""+ iNewFieldIndex +"\"></span>";
		var fieldarea = document.getElementById(iNewFieldIndex);
		this.drawField(iNewFieldIndex , fieldarea,true);		
	
	}
	TemplateXML.prototype.addField = addField;


	function drawField(iFieldIndex, workarea, bExpand){	
		
		// We will be getting most of the information from FormElemtnNode anyway		
		var FieldNode = objTemplate.getFieldsNode().childNodes.item(iFieldIndex);
		var strid = getAtt(FieldNode,"id");

		var strFieldName = html_escape(strid);

		var toggleimg = "btn_plus.gif";
		if ((bExpand) || (getExpand(FieldNode))) {toggleimg = "btn_collapse.gif";}
//		if ((bExpand)|| ()) { toggleimg = "btn_collapse.gif";}

		workarea.innerHTML = 
"<table width=\"100%\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\">" +
"<tr bgColor=\"#7FB2CC\">" +
"	<td colspan=\"2\"><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"3\" border=\"0\"></td>" +
"</tr>" +
"<tr bgColor=\"#7FB2CC\" valign=\"top\">" +
"	<td><img src=\"../img/sp.gif\" alt=\"\" width=\"10\" height=\"1\" border=\"0\"><input id=button1 onclick=toggleField("+iFieldIndex+",this)  type=image src=\"../img/"+toggleimg+"\""+iFieldIndex+"img\" align=\"absmiddle\">"+
"<span class=\"body_darkblue\" ID=\""+iFieldIndex+".title\">&nbsp;&nbsp;Area "+(iFieldIndex+1)+": <i><b>"+strFieldName+"</b></i></span></td>" +
"	<td align=\"right\"><img src=\"../img/btn_deletesmall.gif\" onClick=\"objTemplate.deleteField("+iFieldIndex+")\" alt=\"\" width=\"42\" height=\"15\" border=\"0\"><span class=\"note\">&nbsp;&nbsp;</span></td>" +
"</tr>" +
"</table>" +
"<span ID="+iFieldIndex+".detail></span>"+
"<table width=\"100%\" border=\"0\" cellspacing=\"0\" cellpadding=\"1\"  bgColor=\"#ffffff\">" +
"	<tr>" +
"		<td><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"10\" border=\"0\"></td>" +
"	</tr>" +
"</table>" ;


		//check if we want to expand this guy or not
		if ((bExpand) || (getExpand(FieldNode))) {
			// EXPAND
			toggleField(iFieldIndex);
		}
		
	}
	TemplateXML.prototype.drawField = drawField;


	function toggleField(iFieldIndex,obj) {
		//find field detail
		var detailArea = document.getElementById(iFieldIndex+".detail");
		var FieldNode = this.getFieldsNode().childNodes.item(iFieldIndex);		
		if (FieldNode == null) { alert ("form element node is null"); return;} 
		if (detailArea.innerHTML.length>0) {
			// let's collapse
			if (obj!=null) {obj.src = "../img/btn_plus.gif"; }
			detailArea.innerHTML = "";
			setExpand(FieldNode, false);
		}
		// let's expand the content
		else {  
			if (obj!=null) {
				obj.src ="../img/btn_collapse.gif";
			}
			setExpand(FieldNode, true);
			expandField(iFieldIndex,detailArea);		
		}
	}
	
	
	function expandField(iFieldIndex,detailArea) {
		var FieldNode = objTemplate.getFieldsNode().childNodes.item(iFieldIndex);
		var strid = getAtt(FieldNode, "id");
		var strname = getAtt(FieldNode,"name");
		var strtype = getAtt(FieldNode,"type");
		//var strname = setAtt(FieldNode, "name", "textarea");
		var strRegions = getAtt(FieldNode, "tsRegions");
		var strfielddescription = getAtt(FieldNode,"name");
		//var strdefault = getAtt(FormElementNode,"default");
		var strdefault = getDefaultText(iFieldIndex);
//		var strrow = getAtt(FieldNode,"row");
		var strcol = getAtt(FieldNode,"col");
		var iheight = getAtt(FieldNode,"height");
		if (iheight == "") { iheight= 200;}
		var strrow = parseInt(iheight/20);
		var strrequire = getAtt(FieldNode, "required");
		var strRequiredCheck= "checked";
		if (strrequire == "false") { strRequiredCheck = "";}
		var strid = html_escape(strid);
		var strfielddescription = html_escape(strfielddescription);
		var strDefaultText = html_escape(strdefault);

		var attrvalue = new Array ("dropdown", "display", "radiobutton", "text", "checkbox");

		var strType =  new Array(6);
		var iValue=3;
		for (i=0;i<6;i++) { 
			strType[i]="";
			if ( strtype  == attrvalue[i]) { iValue= i; }
		}
		strType[iValue]="checked";


		// time to print out something...
		var strFieldContent = ""+
		
"<table width=\"100%\" border=\"0\" cellspacing=\"0\" cellpadding=\"1\"  bgColor=\"#7FB2CC\">" +
"<tr>" +
"<td>" +
"<table width=\"100%\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\" bgColor=\"#ededed\">" +
"<!-- Margins ---->" +
"<tr>" +
"<td width=\"10\" rowspan=\"2\"><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"1\" border=\"0\"></td>" +
"<td><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"10\" border=\"0\"></TD>" +
"<td width=10  rowspan=\"2\"><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"1\" border=\"0\"></td>" +
"</tr>" +
"<!-- /Margins ---->" +
"<tr valign=\"top\">" +
"<td>" +
"<table width=\"100%\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\">" +
"<tr>" +
"<td width=\"90\"><span class=\"body_bold\">Area ID:</span></td>" +
"<td><input  onFocus=\"setActiveText(this)\" onBlur=\"setFieldID("+iFieldIndex+", this.value);setDirty()\" name=fieldName size=\"35\" value=\""+strid+"\">&nbsp;&nbsp;<input type=\"checkbox\" "+strRequiredCheck+" onClick=\"toggleRequire("+iFieldIndex+", this)\"><span class=body>Required</span><br><span class=\"note\">Note: Maximum of 25 alphanumeric characters including underscore.</span></td>" +
"</tr>" +
"<tr>" +
"	<td colspan=\"2\"><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"7\" border=\"0\"></td>" +
"</tr>" +
"<tr>" +
"<td width=\"90\"><span class=\"body_bold\">Area Name:</span></td>" +
"	<td><span class=\"\"><textarea name=\"namefield\" rows=\"2\" cols=\"45\" onBlur=\setAtt(objTemplate.getFieldsNode().childNodes.item("+(iFieldIndex)+"),'name',this.value);setDirty()>"+strfielddescription+"</textarea></span></td>" +
"</tr>" +
"<tr>" +
"<td colspan=\"2\"><span class=\"body_bold\">Advanced</span>&nbsp;&nbsp;<input id=\"advanceImg\" onclick=\"toggleAdvance("+iFieldIndex+")\" type=\"image\" name=\"advanceImg\" src=\"../img/adv_downarrow.gif\" align=\"absmiddle\"><br>" +
"		<!-- Advanced Toggle ---->" +
"		<span ID=\"advanced."+iFieldIndex+"\"></span>" +
"		<!-- Advanced Toggle ---->" +
"	</td>" +
"</tr>" +
"<tr>" +
"	<td colspan=\"2\"><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"7\" border=\"0\"></td>" +
"</tr>" +
"<tr>" +
"	<td colspan=\"2\"><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"7\" border=\"0\"></td>" +
"</tr>" +
"<tr>" +
"<td width=\"90\"><span class=\"body_bold\">Area UI:</span><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"25\" border=\"0\"><br></td>" +
"	<td>" +
			"<span class=\"body\">Text Box Rows:&nbsp;&nbsp;<input type=\"text\" name=\"textfield2\" size=\"5\" onBlur=\"setAtt(objTemplate.getFieldsNode().childNodes.item("+(iFieldIndex)+"),'row',this.value*20);setDirty()\" value=\""+strrow+"\">"+
//			"&nbsp;&nbsp;Columns:&nbsp;&nbsp;<input type=\"text\" name=\"textfield2\" size=\"5\"  onBlur=\"setAtt(objTemplate.getFieldsNode().childNodes.item("+(iFieldIndex)+"),'height',this.value*20);setDirty()\" value=\""+strcol+"\">&nbsp;&nbsp;)"+
"</span></td>"+

/*
"<td width=\"90\"><span class=\"body_bold\">Area UI:</span><br><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"25\" border=\"0\"><br></td>" +
			"			 <TABLE width=\"100%\"  cellspacing=\"0\" cellpadding=\"0\" border=\"0\"> "+
			"			 <tr>"+
			"			 <td width=50%><input type=\"radio\" name=\""+iFieldIndex+"qtype\" value=\"3\" onClick=\"setUI("+iFieldIndex+",3);setDirty()\" "+strType[3]+">"+
			"&nbsp;&nbsp;<span class=\"body\">Text Box (Rows:&nbsp;&nbsp;<input type=\"text\" name=\"textfield2\" size=\"5\" onBlur=\"setAtt(objTemplate.getFieldsNode().childNodes.item("+(iFieldIndex)+"),'row',this.value);setDirty()\" value=\""+strrow+"\">"+
			"&nbsp;&nbsp;Columns:&nbsp;&nbsp;<input type=\"text\" name=\"textfield2\" size=\"5\"  onBlur=\"setAtt(objTemplate.getFieldsNode().childNodes.item("+(iFieldIndex)+"),'col',this.value);setDirty()\" value=\""+strcol+"\">&nbsp;&nbsp;)</span></td>"+
			"			 <td ><input type=\"radio\" name=\""+iFieldIndex+"qtype\" value=\"0\" onClick=\"setUI("+iFieldIndex+",0);setDirty()\" "+strType[0]+">"+
			"&nbsp;&nbsp;<span class=\"body\">Drop Downs</span></td>"+
			"			 </tr>"+
			"			 <tr>"+
			"			 <td><input type=\"radio\" name=\""+iFieldIndex+"qtype\" value=\"1\" onClick=\"setUI("+iFieldIndex+",1);setDirty()\" "+strType[1]+">"+
			"&nbsp;&nbsp;<span class=\"body\">None (question text only)</span></td>"+
			"			 <td><input type=\"radio\" name=\""+iFieldIndex+"qtype\" value=\"2\" onClick=\"setUI("+iFieldIndex+",2);setDirty()\" "+strType[2]+">"+
			"&nbsp;&nbsp;<span class=\"body\">Radio Buttons</span></td>"+
			"			 </tr>"+
			"			 <tr>"+
			"			  <td></td>"+
			"			  <td><input type=\"radio\" name=\""+iFieldIndex+"qtype\" value=\"4\" onClick=\"setUI("+iFieldIndex+",4);setDirty()\" "+strType[4]+">"+
			"&nbsp;&nbsp;<span class=\"body\">Check Boxes</span></td>"+
			"			 </tr>"+
			"			 </table>"+
*/
"	</td>" +
"</tr>" +
"<tr>" +
"	<td colspan=\"2\"><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"7\" border=\"0\"></td>" +
"</tr>" +
"<tr>" +
"<td width=\"90\"><span class=\"body_bold\">Default Text:</span></td>" +
"	<td><input onFocus=\"setActiveText(this)\" "+
"onBlur=\"setDefaultText("+(iFieldIndex)+",this.value);setDirty();\" "+
"ID=\"defaulttext"+"."+iFieldIndex+"\" size=\"60\" value=\""+strDefaultText+"\""+
"onSelect=\"storeCaret(this);\""+
"onClick=\"storeCaret(this);\""+
"onKeyUp=\"storeCaret(this);\">"+
//"<input type=image src=\"../img/btn_insert_variable.gif\" onClick=\"insertVariable('defaulttext."+iFieldIndex+"');\" >"+
"</td>" +
"</tr>" +
"</table>" +
"<span ID="+iFieldIndex+".selections></span>" +
"	</td>" +
"</tr>" +
"<tr>" +
"	<td><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"10\" border=\"0\"></td>" +
"</tr>" +
"</table>" +
"</td>" +
"</tr>" +
"</table>" +
"" ;

		
		detailArea.innerHTML = strFieldContent;
		
		/*
		// show tags if needed
		if (strRegions.length >0 ) {
			toggleAdvance(iFieldIndex);
			//document.forms["DSform"].elements["toggleTaggingDetailCheck."+iFieldIndex].checked=true;
			toggleTaggingDetail(iFieldIndex, document.forms["DSform"].elements["toggleTaggingDetailCheck."+iFieldIndex]);
		}
		*/
		// selection detail
		if ((iValue ==0) || (iValue==2) || (iValue==4) || (iValue ==3) ) {
			showSelection(iFieldIndex);			
		}
	}


function setFieldID(iFieldIndex, strValue) {
	setAtt(objTemplate.getFieldsNode().childNodes.item(iFieldIndex),'id',strValue);
	//updateTitle
	var workarea = document.getElementById(iFieldIndex+".title");
	workarea.innerHTML = "&nbsp;&nbsp;Field " + iFieldIndex + "<i><b>"+strValue+ "</b></i>";
	
}

//======================== 	Selection	Functions	=====================


	function showSelection(iFieldIndex) {
		// list all answers first
		var nlValue = objTemplate.getValueNodeList(iFieldIndex);		
		var workarea = document.getElementById(iFieldIndex+".selections");
//		if (nlFragment.length==0) {
			// add a blank ?
			var strContent = 
"<table width=\"100%\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\" bgColor=\"#ededed\">" +
"<tr>" +
"	<td colspan=\"2\"><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"20\" border=\"0\"></td>" +
"</tr>" +
"<tr>" +
"	<td colspan=\"2\"><img onClick=\"addSelection("+iFieldIndex+");setDirty()\" src=\"../img/btn_addsel.gif\">&nbsp;&nbsp;"+
"<span ID=\"reorderSelection."+iFieldIndex+"\"></span></td>" +
"</tr>" +
"<tr>" +
"	<td colspan=\"2\"><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"10\" border=\"0\"></td>" +
"</tr>" +
"</table>" +
"<!---------------- /Field Top Section ------------------->" +
"<span ID="+iFieldIndex + ".selectiondetail></span>";
			workarea.innerHTML = strContent;
//		}
		// write to workarea
		for (var i=0;i<nlValue.length;i++) {
			document.getElementById(iFieldIndex+".selectiondetail").innerHTML = document.getElementById(iFieldIndex+".selectiondetail").innerHTML + "<span ID=\""+iFieldIndex+"."+i+"\"></span>";
			drawSelection(iFieldIndex,i);
		}
		objTemplate.checkReorderSelectionButton(iFieldIndex);
	}

	function addSelection(iFieldIndex) {
		// add node
		var nFields = objTemplate.getFieldsNode()
		// look for "values nodes insde
		var nTmp = objTemplate.doc.createElement("val");
		nFields.childNodes.item(iFieldIndex).appendChild(nTmp);
		var inumSelection =0;
		var nlValue = objTemplate.getValueNodeList(iFieldIndex);		
		if (nlValue != null) {
			inumSelection = nlValue.length-1;
		}
		// then draw
		objTemplate.checkReorderSelectionButton(iFieldIndex);
		document.getElementById(iFieldIndex+".selectiondetail").innerHTML = document.getElementById(iFieldIndex+".selectiondetail").innerHTML + "<span ID=\""+iFieldIndex+"."+inumSelection+"\"></span>";
		drawSelection(iFieldIndex,inumSelection);
	}
	
	function drawSelection(iFieldIndex, iSelectionIndex, bExpand) {
	
		var FieldNode = objTemplate.getFieldsNode().childNodes.item(iFieldIndex);
		var SelectionNode = objTemplate.getValueNodeList(iFieldIndex).item(iSelectionIndex);
		// retrieve attributes
		var strSelectionName = getAtt(SelectionNode,"name");

		var toggleimg = "btn_plus.gif";
		if ((bExpand)|| (getExpand(SelectionNode))) { toggleimg = "btn_collapse.gif";}
		var workarea = document.getElementById(iFieldIndex+"."+iSelectionIndex);
		var strContent = 
"<table width=\"100%\" border=\"0\" cellspacing=\"0\" cellpadding=\"1\"  bgColor=\"#006699\">" +
"<tr>" +
"<td>" +
"<table width=\"100%\" bgColor=\"#ffffff\" cellspacing=\"0\" cellpadding=\"0\" border=\"0\">" +
"<tr bgColor=\"#d9e8F0\">" +
"	<td colspan=\"2\"><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"2\" border=\"0\"></td>" +
"</tr>" +
"<tr bgColor=\"#d9e8F0\" valign=\"top\">" +
"	<td><img src=\"../img/sp.gif\" alt=\"\" width=\"10\" height=\"1\" border=\"0\">" +
"<input onclick=toggleSelection("+iFieldIndex+","+iSelectionIndex+",this) type=\"image\" src=\"../img/"+toggleimg+"\" align=\"absmiddle\">" +
"<span class=\"body_darkblue\">&nbsp&nbsp;"+(iSelectionIndex+1)+" <i><b>"+strSelectionName+"</b></i></span></td>" +
"	<td align=\"right\"><img onClick=\"deleteSelection("+iFieldIndex+","+iSelectionIndex+")\" src=\"../img/btn_deletesmall.gif\" alt=\"\" width=\"42\" height=\"15\" border=\"0\"><span class=\"note\">&nbsp;&nbsp;</span></td>" +
"</tr>" +
"<tr>" +
"	<td>" +
"<span id="+iFieldIndex+"."+iSelectionIndex+".detail></span>"+
"	</td>" +
"</tr>" +
"</table>" +
"" +
"</td>" +
"</tr>" +
"</table>" ;
		workarea.innerHTML = strContent;
		//expand
		if ((bExpand)|| (getExpand(SelectionNode))) { 
			expandSelection(iFieldIndex, iSelectionIndex);
		}
	}

	function deleteSelection(iFieldIndex, iSelectionIndex) {
		// remove node. Two of them
		// find the node first.. there are actually two nodes to worry about
		var FieldNode = objTemplate.getFieldsNode().childNodes.item(iFieldIndex);
		var SelectionNode = objTemplate.getValueNodeList(iFieldIndex).item(iSelectionIndex);		
		FieldNode.removeChild(SelectionNode);
		objTemplate.checkReorderSelectionButton(iFieldIndex);
		showSelection(iFieldIndex);		
	}


	function toggleSelection(iFieldIndex, iSelectionIndex, obj) {
		var FieldNode = objTemplate.getFieldsNode().childNodes.item(iFieldIndex);
		var SelectionNode = objTemplate.getValueNodeList(iFieldIndex).item(iSelectionIndex);		

		var detailArea = document.getElementById(iFieldIndex+"."+iSelectionIndex+".detail");
		if (detailArea.innerHTML.length>0) {
			// let's collapse
			if (obj!=null) {obj.src = "../img/btn_plus.gif"; }
			detailArea.innerHTML = "";
			setExpand(SelectionNode, false);
		}
		// let's expand the content
		else {  if (obj!=null) {obj.src ="../img/btn_collapse.gif";}
			expandSelection(iFieldIndex,iSelectionIndex);
			setExpand(SelectionNode, true);
		}
		
	}

	function expandSelection(iFieldIndex, iSelectionIndex) {
		var workarea = document.getElementById(iFieldIndex+"."+iSelectionIndex + ".detail");		

		var FieldNode = objTemplate.getFieldsNode().childNodes.item(iFieldIndex);
		var SelectionNode = objTemplate.getValueNodeList(iFieldIndex).item(iSelectionIndex);		

//		var strSubText =  getSubstituteText(iFieldIndex, iSelectionIndex);
//		strSubText = html_escape(strSubText);
		var strSelectionName = getAtt(SelectionNode,"name");
		var strContent= 		
			"<table width=\"100%\" bgColor=\"#ffffff\" cellspacing=\"0\" cellpadding=\"0\" border=\"0\">" +
			"<!-- Margins ---->" +
			"<tr>" +
			"	<td width=\"10\" rowspan=\"10\"><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"1\" border=\"0\"></td>" +
			"	<td colspan=\"2\"><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"10\" border=\"0\"></td>" +
			"	<td width=\"10\" rowspan=\"10\"><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"1\" border=\"0\"></td>" +
			"</tr>" +
			"<!-- /Margins --->" +
			"<tr>" +
			"	<td width=\"75\"><span class=\"body_bold\">Selection Text :&nbsp;</span></td>" +
			"	<td colspan=2><input type=\"text\" name=\"selText1\" value=\""+strSelectionName+"\" size=\"60\" onBlur=\"setSelectionText("+iFieldIndex+","+iSelectionIndex+",this.value)\"></td>" +
			"</tr>" +
			"<tr>" +
			"	<td colspan=\"3\"><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"10\" border=\"0\"></td>" +
			"</tr>" +
//			"<tr>" +
//			"	<td width=\"75\"><span class=\"body_bold\">Inserted Text:&nbsp;</span></td>" +
//			"	<td colspan=2><input type=\"text\" ID=\"subText."+iFieldIndex+"."+iSelectionIndex+"\" size=\"60\"  value=\""+strSubText+"\" "+
//			"onBlur=\"setSubstituteText("+iFieldIndex+","+iSelectionIndex+",this.value)\""+
//			"onSelect=\"storeCaret(this);\""+
//			"onClick=\"storeCaret(this);\""+
//			"onKeyUp=\"storeCaret(this);\">"+			
//			"<input type=\"image\" src=\"../img/btn_insert_variable.gif\" onClick=\""+
//			"insertVariable('subText."+iFieldIndex+"."+iSelectionIndex+"');\">"+
//			"</td>" +
//			"</tr>" +
			"<tr>" +
			"	<td colspan=\"3\"><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"10\" border=\"0\"></td>" +
			"</tr>" +
			"</table>" ;
		workarea.innerHTML=strContent;
	}


	function setSelectionText(iFieldIndex, iSelectionIndex, strValue) {
		// find the node first..
		var FieldNode = objTemplate.getFieldsNode().childNodes.item(iFieldIndex);
		var SelectionNode = objTemplate.getValueNodeList(iFieldIndex).item(iSelectionIndex);		

		// now set their name attribute
		SelectionNode.setAttribute("name",strValue);
		// we will need to update GUI as well		
		drawSelection(iFieldIndex, iSelectionIndex,true);
	}

/*	
	function setSubstituteText(iFieldIndex, iSelectionIndex, strValue) {
		// find the node first.. there is only one
		var FragmentNode  = objTemplate.getFragNodeArray()[iFieldIndex-1];
		var FragsFragNode = FragmentNode.childNodes.item(iSelectionIndex-1);
		// first of all, we probably need to remove all nodes under
		for (var i=FragsFragNode.childNodes.length-1;i>=0;i--) {
			FragsFragNode.removeChild(FragsFragNode.childNodes.item(i));
		}

		
		strValue = makeVariable(strValue);		
		if (strValue == "" ) { return false;}
		var tmpxml = "<Fragment>"+strValue+"</Fragment>";
		var xmlobj = loadXMLFromString(tmpxml);
		setAtt(xmlobj.documentElement, "name", getAtt(FragsFragNode,"name"));
		if (xmlobj.documentElement.firstChild == null) { return;}
		var newobj = xmlobj.documentElement.cloneNode(true);	
		FragmentNode.replaceChild(newobj, FragsFragNode);
	}

	function getSubstituteText(iFieldIndex, iSelectionIndex) {
		// find the node first.. there is only one
		var FragmentNode  = objTemplate.getFragNodeArray()[iFieldIndex-1];
		var FragsFragNode = FragmentNode.childNodes.item(iSelectionIndex-1);
		
		// we have the selection node now... need to get everything under it as text
		var strRet = "";
		for (var i=0; i<FragsFragNode.childNodes.length; i++) {
			if (FragsFragNode.childNodes.item(i).nodeName == "Variable") {
				strRet = strRet + "["+ getAtt(FragsFragNode.childNodes.item(i),"name")+ "]";
			}
			else {
				strRet  = strRet + FragsFragNode.childNodes.item(i).xml;
			}
		}
		return strRet;
	}

*/

//======================== 	General XML	Functions	=====================

	function getFieldsNode() {
		var nlFields= objTemplate.root.getElementsByTagName("Fields");
		if (nlFields.length ==1)  { return nlFields.item(0);}
		
		else {
			// add the node here
			//alert("about to add Fields node");
			var nFields = this.doc.createElement("Fields");			
			this.root.appendChild(nFields);
			return nFields;
		}
	}
	TemplateXML.prototype.getFieldsNode = getFieldsNode;


	function getTagsNode() {
		
		var nlNodes= this.root.getElementsByTagName("Tags");
		if (nlNodes.length ==1)  { return nlNodes.item(0);}
		
		else {
			// add the node here
			//alert("about to add Fields node");
			var nTags = this.doc.createElement("Tags");			
			this.root.appendChild(nTags);
			return nTags;
		}
	}
	TemplateXML.prototype.getTagsNode = getTagsNode;


	function getDoctypeNode() {
		var nTags = this.getTagsNode();
		var nlNodes = nTags.getElementsByTagName("Node");
		for (var i=0;i<nlNodes.length;i++) {
			if (getAtt(nlNodes.item(i), "id").substr(0,3) == "DT_") {
				// this is the doctype node
				return nlNodes.item(i);
			}
		}
		var nDT = this.doc.createElement("Node");
		nTags.appendChild(nDT);
		return nDT;

	}
	TemplateXML.prototype.getDoctypeNode = getDoctypeNode;

	function setUI(iFieldIndex, iValue) {		
		var attrvalue = new Array ("dropdown", "display", "radiobutton", "text", "checkbox");
		var strValue= attrvalue[iValue];
		setAtt(objTemplate.getFieldsNode().childNodes.item(iFieldIndex),'type',strValue);
		if ((iValue ==0) || (iValue==2) || (iValue==4) || (iValue==3)) {
			showSelection(iFieldIndex);		
		}
		else { 
			var workarea = document.getElementById(iFieldIndex+".selections");
			workarea.innerHTML = "";
		}
	}

	function getValueNodeList(iFieldIndex) {
		var FieldNode = objTemplate.getFieldsNode().childNodes.item(iFieldIndex);
		var ValueNodeList = FieldNode.getElementsByTagName("val");
		return ValueNodeList;
	}
	TemplateXML.prototype.getValueNodeList = getValueNodeList;


	function getFieldCount() {
		var nlFields= this.root.getElementsByTagName("Fields");
		if (nlFields.length >0) { 
			return nlFields.item(0).childNodes.length;
		}
		else { return 0;}
		
	}
	TemplateXML.prototype.getFieldCount = getFieldCount;



	function getSelectionCount(iFieldIndex) {
		var nlValues = objTemplate.getValueNodeList(iFieldIndex);
		if (nlValues == null) { return 0;}
		return nlValues.length;
		
	}
	TemplateXML.prototype.getSelectionCount = getSelectionCount;


	function getStyleSheet() {
		var nlStyleSheet= objTemplate.root.getElementsByTagName("XSLT-Stylesheet");
		if (nlStyleSheet.length==0) { return "";}
		return nlStyleSheet.item(0).text;
	}
	TemplateXML.prototype.getStyleSheet = getStyleSheet;

	function setStyleSheet(strValue) {
		var nlStyleSheet= objTemplate.root.getElementsByTagName("XSLT-Stylesheet");
		if (nlStyleSheet.length==0) {
			var nStyleSheet = objTemplate.doc.createElement("XSLT-Stylesheet");	
			objTemplate.root.appendChild(nStyleSheet);
			var ntmp = objTemplate.doc.createTextNode(strValue);
		}
		else {
			nlStyleSheet.item(0).text = strValue;
		}
	}
	TemplateXML.prototype.setStyleSheet = setStyleSheet;
//======================== 	General XML	Functions	=====================
	function setAtt(tNode, attname, attvalue) {
		if(tNode !=null) { tNode.setAttribute(attname, attvalue);}
	}


	function getAtt(tNode, attname) {
		var ret = "";
		if (tNode == null) { return ret;}
		if (tNode.nodeType==1) {
			var ret = tNode.getAttribute(attname);	
		}
		if (ret == null) { return "";}
		return ret;
	}

//======================== 	IO	Functions	=====================
	function loadXMLFromURI(strURI){
		var nTmp;
		nTmp = new ActiveXObject("Microsoft.XMLDOM");
		nTmp.async = false;		
		nTmp.load(strURI);
		return nTmp;
	}
	TemplateXML.prototype.loadXMLFromURI = loadXMLFromURI;

	function loadXMLFromString(strXML){
		var nTmp;
		nTmp = new ActiveXObject("Microsoft.XMLDOM");
		nTmp.async = false;
		nTmp.loadXML(strXML);
		return nTmp;
	}
	TemplateXML.prototype.loadXMLFromString = loadXMLFromString;

	function newXML(strType){
		var nTmp;
		nTmp = new ActiveXObject("Microsoft.XMLDOM");
		var nRoot = nTmp.createElement(strType);
		nTmp.appendChild(nRoot);
		return nTmp;
	}
	TemplateXML.prototype.newXML = newXML;



//======================== 	General Utility		Functions	=====================

	function html_escape(strInput) {
		var output = "";
//		if (strInput ==null) { return "";}
		for (var i=0;i<strInput.length;i++) {
			mychar = strInput.charCodeAt(i);
			output = output+ "&#"+mychar+";";
		}
		return output;
	}

	function xml_escape(strInput) {
		var output = "";
		for (var i=0;i<strInput.length;i++) {
			mychar = strInput.charCodeAt(i);
			// <
			if (mychar == 38 ) { output= output + "&amp;";}
			else if (mychar == 60 ) { output= output + "&lt;"; }
			else if (mychar == 62 ) { output= output + "&gt;";}
			else if (mychar == 34 ) { output= output + "&quot;";}
			else if (mychar == 39 ) { output= output + "&apos;";}
			else {
				output = output+ strInput.charAt(i);
			}
		}
		return output;
	}

	function xml_unescape(strInput) {
		var output = "";
		output = strInput.replace(/\&amp;/, '&');
		output = strInput.replace(/\&lt;/, '<');
		output = strInput.replace(/\&gt;/, '>');
		output = strInput.replace(/\&quot;/, '\"');
		output = strInput.replace(/\&apos;/, '\'');
		return output;
	}
		

/*
	function makeVariable(strValue) {
		var newString = "";
		var myString = xml_escape(strValue);
		newString = myString;
		var myReg = /\[(\w*)\]/g;
		while (match = myReg.exec(myString)) {
			if (invalidValue(match[1])) { 				
				alert("Variable Name: " + invalidValue + " is invalid.");
				return null;
			}
			if (match[1].length >0) {
				newString = newString.replace(match[0], "<Variable name=\""+match[1]+"\"/>");
			}
		}
		return newString;
	}
*/

//******************************** work on this now ***************************
	function setExpand(nNode, bExpand) {
		var strValue = "false";
		if (bExpand) { strValue="true";}		
		nNode.setAttribute("expand", strValue);
	}

	function getExpand(nNode) {
		var ret = nNode.getAttribute("expand");
		if (ret == null) { return true;}
		else { if (ret == "true") { return true;}}
		return false;
	}
/*
	function setDirty(){
		bDirty = true;
	}
*/
	function setActiveText(obj) {
		objTemplate.activeText = obj.value;
	}
	
	function checkReorderPageButton() {
	}
	TemplateXML.prototype.checkReorderPageButton = checkReorderPageButton;
	
	function bIsAnyFieldNameEmpty() {
		// scan through all fields to see if there's any thing with empty id
		var lnFormElement = objTemplate.getFieldsNode().childNodes;
		for (i=0;i<lnFormElement.length;i++) {
			var id = getAtt(lnFormElement.item(i),"id");
			if ((id =="") || (id == null)) { return true; }
		}
		return false;
	}
	TemplateXML.prototype.bIsAnyFieldNameEmpty = bIsAnyFieldNameEmpty;


	function cleanup() {
	}
	TemplateXML.prototype.bIsAnyFieldNameEmpty = bIsAnyFieldNameEmpty;
	
	
	function deleteField(iFieldIndex) {
		// remove node. Two of them
		// find the node first.. there are actually two nodes to worry about
		var nFieldsNode = objTemplate.getFieldsNode();
		var nField = nFieldsNode.childNodes.item(iFieldIndex);
		nFieldsNode.removeChild(nField);
		objTemplate.drawContent();		
 		objTemplate.checkReorderPageButton();
	}
	TemplateXML.prototype.deleteField = deleteField;
	
	function checkReorderPageButton() {
		var workarea = document.getElementById("reorderpage");
		if (this.getFieldCount() >1) {
			workarea.innerHTML = "<input type=\"image\" src=\"../img/btn_reorderfields.gif\" alt=\"\" border=\"0\" onClick=\"sortPages()\">";
		}
		else {
			workarea.innerHTML = "";
		}
	}
	TemplateXML.prototype.checkReorderPageButton = checkReorderPageButton;

	function checkReorderSelectionButton(iFieldIndex) {
		var workarea = document.getElementById("reorderSelection."+iFieldIndex);
		if (objTemplate.getSelectionCount(iFieldIndex) > 1) {
			workarea.innerHTML = "<input type=\"image\" src=\"../img/btn_reorderselect.gif\" alt=\"\" border=\"0\" onClick=\"sortSelections("+iFieldIndex+")\">";
		}
		else {
			workarea.innerHTML = "";
		}
	}
	TemplateXML.prototype.checkReorderSelectionButton = checkReorderSelectionButton;
	
	
	function getFieldNames(){
		var retArr = new Array(this.getFieldCount());
		var nlFormElementNode = objTemplate.getFieldsNode().childNodes;
		if (nlFormElementNode.length>0) {
			for (var i=0;i<nlFormElementNode.length;i++) {
				retArr[i] = getAtt(nlFormElementNode.item(i), "id");				
			}
		}
		return retArr;

	}
	TemplateXML.prototype.getFieldNames = getFieldNames;



	function cloneFieldArray() {
		var retArr = new Array(this.getFieldCount());
		var nList = this.getFieldsNode().childNodes;
		if (nList.length>0) {
			for (var i=0;i<nList.length;i++) {			
				retArr[i] = nList.item(i).cloneNode(true);
			}
		}
		return retArr;
	}
	TemplateXML.prototype.cloneFieldArray = cloneFieldArray;

/*
	function cloneFragArray() {
		var retArr = new Array(this.getFieldCount());
		var nList = this.getFragNodeArray();
		if (nList.length>0) {
			for (var i=0;i<nList.length;i++) {			
				retArr[i] = nList[i].cloneNode(true);
			}
		}
		return retArr;
	}
	TemplateXML.prototype.cloneFragArray = cloneFragArray;
*/

	function cloneFieldSelectionArray(iFieldIndex) {
		var nlList = objTemplate.getValueNodeList(iFieldIndex);
		
		var retArr = new Array(this.getSelectionCount(iFieldIndex));
		for (var i=0;i<nlList.length;i++) {
			retArr[i] = nlList.item(i).cloneNode(true);
		}
		return retArr;
	}
	TemplateXML.prototype.cloneFieldSelectionArray = cloneFieldSelectionArray;

/*
	function cloneFragSelectionArray(iFieldIndex) {	
		objFrag = this.getFragNodeArray()[iFieldIndex];
		var retArr = new Array(this.getSelectionCount(iFieldIndex+1));
		var nList = objFrag.childNodes;
		if (nList.length>0) {
			for (var i=0;i<nList.length;i++) {			
				retArr[i] = nList.item(i).cloneNode(true);
			}
		}
		return retArr;
	}
	TemplateXML.prototype.cloneFragSelectionArray = cloneFragSelectionArray;
*/

	function sortPages(){
		bPrompt =false;
		objRedraw = objTemplate;
		if (objRedraw.getFieldCount() >1) {
			sortWin = window.open("tpEdit_Auth_Sort_Field.html","sortWin","height=300,width=420,top=0,left=0,statusbar=true");
		}
		else { 
			alert(CONST_WARN_REORDER_1); 
			if ((sortWin!=null) && (!(sortWin.closed))) { sortWin.close();}
		}
	}



	function sortSelections(iFieldIndex){	
		bPrompt =false;
		objRedraw  =  objTemplate.getFieldsNode().childNodes.item(iFieldIndex);
		if (objTemplate.getSelectionCount(iFieldIndex) >1) {
			sortWin = window.open("tpEdit_Auth_Sort_Selection.html?"+iFieldIndex,"sortWin","height=300,width=420,top=0,left=0,statusbar=true");
		}
		else { 
			alert(CONST_WARN_REORDER_1); 
			if ((sortWin!=null) && (!(sortWin.closed))) { sortWin.close();}
		}
	}
	TemplateXML.prototype.sortSelections = sortSelections;

/*****************************************************************************************
/*
/*		to be done  (add textdata into Field node )
/*
/*****************************************************************************************/

	function setDefaultText(iFieldIndex,strValue) {
		// need to find the <Text> node if not, will create
		var nField = objTemplate.getFieldsNode().childNodes.item(iFieldIndex);
		// remove text data and append new one
		if (nField.hasChildNodes) { 
			// identify text node first...
			for (var i=0;i<nField.childNodes.length;i++) {	
				if (nField.childNodes.item(i).nodeType == 3) {
					// this is a text node...
					nField.removeChild(nField.firstChild);
				}
			}
		}
		var textNode = objTemplate.doc.createTextNode(strValue);
		nField.appendChild(textNode);

	}
	
	function getDefaultText(iFieldIndex) {
		var nField = objTemplate.getFieldsNode().childNodes.item(iFieldIndex);
		if (nField == null) { return "";}
		// find text node first
		for (var i=0;i<nField.childNodes.length;i++) {	
			if (nField.childNodes.item(i).nodeType == 3) {
				// this is a text node...
				return nField.childNodes.item(i).text;
			}
		}
		return "";
	}

/*****************************************************************************************
/*
/*		to be done
/*
/*****************************************************************************************/


//******************************** work on this now ***************************



	function insertVariable(strControlName) {

		var TextAreaContent = document.getElementById(strControlName);

		if (!(TextAreaContent.createTextRange && TextAreaContent.caretPos)) {
	  		alert("Please select position to add Variable at");
	  		return;
	  	}

		var myvarname = prompt('Enter Variable here','VariableName');
		if ((myvarname == '') || (myvarname == null)) {return;}
		if (invalidValue(myvarname)) { 
			alert("A variable name can contain [a-z], [A-Z] and [0-9] only.\nPlease try again.");			
			insertVariable(strControlName);
			return;
		}
		insertAtCaret(TextAreaContent,myvarname);
		TextAreaContent.focus();

	}

	function storeCaret(TextAreaContent) {
		if (TextAreaContent.createTextRange) TextAreaContent.caretPos = document.selection.createRange().duplicate();
	}

	function insertAtCaret(TextAreaContent, strText) {
		var myVarName = strText;
		if (!(TextAreaContent.createTextRange && TextAreaContent.caretPos)) {
	  		alert("Please select position to add Variable at");
	  	}
	  	else {
	    		var caretPos = TextAreaContent.caretPos;
			caretPos.text = '['+myVarName+']';
	   	}
	}

	function invalidValue(str) {
		var strLength = str.length;
		var hasSpl = false;
		for (i = 0; i < str.length; i++) {
			if (str.charCodeAt(i) < 48) {
				if (str.charCodeAt(i) != 45) {hasSpl = true;}
			} else if (str.charCodeAt(i) > 57 && str.charCodeAt(i) < 65) {
				hasSpl = true;
			} else if (str.charCodeAt(i) > 90 && str.charCodeAt(i) < 97) {
				if (str.charCodeAt(i) != 95) {
					hasSpl = true;
				}
			} else if (str.charCodeAt(i) > 122) {
				hasSpl = true;
			}
		}
		return hasSpl;
	}


	function toggleAdvance(iFieldIndex) {
	
		workArea = document.getElementById("advanced."+iFieldIndex);		
		strContent= 
"<table cellpadding=\"0\" cellspacing=\"0\" width=\"100%\">" +
"<tr>" +
"<td colspan=\"3\"><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"7\" border=\"0\"></td>" +
"</tr>" +
/*
"<tr>" +
"<td width=\"90\"></td>"+
"<td><span class=\"body_bold\"><input type=\"checkbox\" name=\"toggleTaggingDetailCheck."+iFieldIndex+"\" onClick=\"toggleTaggingDetail("+iFieldIndex+", this)\">Tagging</span>&nbsp;</td>" +
"<td>&nbsp;</td>" +
"</tr>" +
*/
"<tr>" +
"<td colspan=\"3\"><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"5\" border=\"0\"></td>" +
"</tr>" +
"<tr><td><img src=\"../img/sp.gif\" alt=\"\" width=\"90\" height=\"5\" border=\"0\"></td><td colspan=\"2\">"+
"<span ID=\"taggingdetail."+iFieldIndex+"\">&nbsp;</span>"+
"</td></tr>"+
"<tr>" +
"<td colspan=\"3\"><img src=\"../img/sp.gif\" alt=\"\" width=\"1\" height=\"7\" border=\"0\"></td>" +
"</tr>" +
"</table>" +
"" ;
		toggleImg = document.getElementById("advanceImg");
		if (workArea.innerHTML.length ==0 ) {
		
			workArea.innerHTML = strContent;
//			document.forms["DSform"].elements["toggleTaggingDetailCheck."+iFieldIndex].checked=true;
			toggleTaggingDetail(iFieldIndex, document.forms["DSform"].elements["toggleTaggingDetailCheck."+iFieldIndex]);
			toggleImg.src="../img/rightarrow.gif";
		}
		else { 
			workArea.innerHTML = "";
			toggleImg.src="../img/adv_downarrow.gif";
		}

	}

	function toggleTaggingDetail(iFieldIndex, obj) {
		// GUI
		var myworkArea = document.getElementById("taggingdetail."+iFieldIndex);		
//		if (!(obj.checked)) { myworkArea.innerHTML = ""; return;}
		
		//Data
		arrRegions = new Array("ActivityTopicSpottingRegion","SymptomTopicSpottingRegion","ProductTopicSpottingRegion","ObjectTopicSpottingRegion");

		// find tags
		var FieldNode = objTemplate.getFieldsNode().childNodes.item(iFieldIndex);
		var strtags = getAtt(FieldNode, "tsRegions");
		arrTags = strtags.split(",");
		
		// construct GUI
		var iCols = 2;
		var strRegionTable = "<table width=100%>";
		for (var i=0;i<arrRegions.length;i++) {
			if ((i%iCols)==0) {strRegionTable =strRegionTable + "<tr>";}
			
			var strChecked = "";
			for (var j=0;j<arrTags.length;j++) {
				if (arrTags[j] == arrRegions[i]) {
					strChecked = "checked";
				}
			}			
			strRegionTable =strRegionTable + "<td><input type=\"checkbox\" name=\"tagging."+iFieldIndex+"\" value=\""+arrRegions[i]+"\" "+strChecked+" onClick=\"setRegion("+iFieldIndex+", this)\"><span class=\"body\">"+arrRegions[i]+"</span>";
			
			
			if ((i%iCols)== (iCols-1)) {strRegionTable =strRegionTable + "</tr>";}
		}
		strRegionTable =strRegionTable + "</table>";

		
		var strContent = 
		"<table><tr>"+
		"<td valign=\"top\" align=\"right\"><span class=\"body_bold\">Tagging To:</span>&nbsp;</td>" +
		"<td valign=\"top\">" +
		strRegionTable+
/*
		"	<table width=\"100%\">" +
		"		<tr>" +
		"			<td><input type=\"checkbox\" name=\"tagging."+iFieldIndex+"\" value=\"ActivityTopicSpottingRegion\" onClick=\"setRegion("+iFieldIndex+", this)\"><span class=\"body\">ActivityTopicSpottingRegion</span>" +
		"			<td><input type=\"checkbox\" name=\"tagging."+iFieldIndex+"\" value=\"SymptomTopicSpottingRegion\" onClick=\"setRegion("+iFieldIndex+", this)\"><span class=\"body\">SymptomTopicSpottingRegion</span>" +
		"		<tr>" +
		"			<td><input type=\"checkbox\" name=\"tagging."+iFieldIndex+"\" value=\"ProductTopicSpottingRegion\" onClick=\"setRegion("+iFieldIndex+", this)\"><span class=\"body\">ProductTopicSpottingRegion</span>" +
		"			<td><input type=\"checkbox\" name=\"tagging."+iFieldIndex+"\" value=\"ObjectTopicSpottingRegion\" onClick=\"setRegion("+iFieldIndex+", this)\"><span class=\"body\">ObjectTopicSpottingRegion</span>" +
		"	</table>" +
*/
		"</td>" +
		"</tr></table>";
		myworkArea.innerHTML = strContent;
	}

	function toggleRequire(iFieldIndex, obj) {
		var FieldNode = objTemplate.getFieldsNode().childNodes.item(iFieldIndex);
		if (obj.checked) {
			setAtt(FieldNode, "required", "true");
			return;
		}
		setAtt(FieldNode, "required", "false");
		
	}

	function setRegion(iFieldIndex) {
		var FieldNode = objTemplate.getFieldsNode().childNodes.item(iFieldIndex);
		var str="";
		var obj = document.forms[0].elements["tagging."+iFieldIndex];
		for (i=0;i<obj.length;i++) {
			if (obj[i].checked) {
				str=str + obj[i].value + "," ;
			}
		}
		str = str.substr(0,str.length-1);
		setAtt(FieldNode, "tsRegions", str);
	}

	function getNodeIDArray(){
		var nTags = objTemplate.getTagsNode();
		var nlNodes = nTags.getElementsByTagName("Node");
		var arrSize = 0;
		if (nlNodes.length >0) { 
			arrSize = nlNodes.length-1 ; 
		} else { return new Array(0);}
		var retArr = new Array(0);
		
		var iCounter = 0;
		for (var i=0;i<nlNodes.length;i++) {
			var nodeID= getAtt(nlNodes.item(i), "id");
			if ((nodeID.substr(0, 4) != "SAL_" ) && (nodeID.substr(0, 3) != "DT_" )&& (nodeID.substr(0, strProdPrefix.length) != strProdPrefix ) ) {
				// this is the doctype node
				retArr[iCounter] = getAtt(nlNodes.item(i), "id");
				iCounter++;
			}
		}
		if (iCounter==0) { return new Array(0);}		
		return retArr;		
	}
	TemplateXML.prototype.getNodeIDArray = getNodeIDArray;
	
	function getNodeNameArray() {
		var nTags = objTemplate.getTagsNode();
		var nlNodes = nTags.getElementsByTagName("Node");
		var arrSize=0;
		if (nlNodes.length >0) { 
			arrSize = nlNodes.length-1 ; 
		}
		else {return new Array(0);}


		var retArr = new Array(0);
		var jcounter = 0;
		
		for (var i=0;i<nlNodes.length;i++) {
			var nodeID= getAtt(nlNodes.item(i), "id");
			if ((nodeID.substr(0, 4) != "SAL_" ) && (nodeID.substr(0, 3) != "DT_" )&& (nodeID.substr(0, strProdPrefix.length) != strProdPrefix ) ) {
				// this is the doctype node
				if (getAtt(nlNodes.item(i), "name")== "") {
					retArr[jcounter] = getAtt(nlNodes.item(i), "id");
				}
				else {
					retArr[jcounter] = getAtt(nlNodes.item(i), "name");
				}
				jcounter++;
			}			
		}
		if (jcounter==0) { return new Array(0);}
		return retArr;		
	}
	TemplateXML.prototype.getNodeNameArray = getNodeNameArray;


	function cleanUpNodes() {
		var nTags = this.getTagsNode();
		var nlNodes = nTags.getElementsByTagName("Node");



		for (var i=0;i<nlNodes.length;i++) {
			var nodeID= getAtt(nlNodes.item(i), "id");
			if ((nodeID.substr(0, 4) != "SAL_" ) && (nodeID.substr(0, 3) != "DT_" )&& (nodeID.substr(0, strProdPrefix.length) != strProdPrefix ) ) {
				// this is not doctype. remove it
				nTags.removeChild(nlNodes.item(i));
			}
		}
	}
	TemplateXML.prototype.cleanUpNodes = cleanUpNodes;
	
	function addChoiceArrays(idArr,nameArr){
		var nTags = this.getTagsNode();	
		for (var i=0;i<idArr.length;i++) {
			var nTmp = this.doc.createElement("Node");
			setAtt(nTmp, "id", trim(idArr[i]));
			setAtt(nTmp, "name", trim(nameArr[i]));
			nTags.appendChild(nTmp);
		}
	}
	TemplateXML.prototype.addChoiceArrays = addChoiceArrays;

	function showConcpets(){
		var workarea = document.getElementById("concepts");
		var arrName = objTemplate.getNodeNameArray();
		if (arrName == null) { 
			workarea.innerHTML = "";
			return;
		}
		var strNames = "";
		for (var i=0;i<arrName.length;i++) {
			if ((arrName[i]!="" ) || (arrName[i] != null)) {
				strNames = strNames + ",&nbsp;&nbsp;&nbsp;&nbsp;" + "<b>"+arrName[i]+"</b>";
			}
		}
		workarea.innerHTML = strNames.substr(1) ;
	}


// deal with access and products

	function openAccess() {
		var salID = getAccessArray();
		var strexistingSAL = "";
		for (var i=0;i< salID.length;i++) {
			strexistingSAL = strexistingSAL + "$$" + salID[i][0];
		}
		strexistingSAL = strexistingSAL.substr(2);
		
		var strurl= "../authoring/select_entitlement.do?label=Access+Levels&nodeType=Entitlement&existingNodes="+strexistingSAL;
		var accesswin = window.open(strurl,"accesswin","toolbar=no,height=570,width=450,directories=no,status=no,scrollbars=yes,resizable=yes,menubar=no");
	}
	
	function openProducts() {
		var prodID = getProductsArray();
		var strexistingProd = "";
		for (var i=0;i< prodID.length;i++) {
			strexistingProd =  strexistingProd + "$$" + prodID[i][0];
		}
		strexistingProd = strexistingProd.substr(2);
		
		var strurl= "../authoring/select_product.do?label=Product&nodeType=Product&existingNodes="+strexistingProd;
		var prodwin = window.open(strurl,"prodwin","toolbar=no,height=570,width=450,directories=no,status=no,scrollbars=yes,resizable=yes,menubar=no");
	}


	function getNodeByPrefix(strPrefix) {
		var nTags = objTemplate.getTagsNode();
		var nlNodes = nTags.getElementsByTagName("Node");
		var arrSize = 0;
		if (nlNodes.length >0) { 
			arrSize = nlNodes.length-1 ; 
		} else { return null;}
		var retArr = new Array(0);

		var iCounter = 0;
		if (nlNodes.length==0) { return null;}
		for (var i=0;i<nlNodes.length;i++) {
			if (getAtt(nlNodes.item(i), "id").substr(0,strPrefix.length) == strPrefix) {
				// this is the doctype node
				retArr[iCounter] = new Array(2);
				retArr[iCounter][0] = getAtt(nlNodes.item(i), "id");
				var nname = getAtt(nlNodes.item(i), "name");
				if ((nname == "") || (nname == null)) {
					retArr[iCounter][1] = getAtt(nlNodes.item(i), "id");
				} else { retArr[iCounter][1] = getAtt(nlNodes.item(i), "name");}				
				iCounter++;
			}
		}
		return retArr;		
	}

	function getAccessArray() {
		return getNodeByPrefix("SAL_");
	}

	function getProductsArray() {
		return getNodeByPrefix(strProdPrefix);
	}


	function updateEntitlement(nodeName, nodeID, strDisplay){
		// breakdown nodename and nodeID. show display
		// update nodes and handle display
		arrnodeName = nodeName.split("$$");
		arrnodeID = nodeID.split("$$");
		var currentNode = getAccessArray();		
		var nTags = objTemplate.getTagsNode();
		var strIDPrefix = "SAL_";
		var nlNodes = nTags.getElementsByTagName("Node");

		// remove all nodes		
		for (var i=0;i<nlNodes.length;i++) {
			//if nTags is of product node... kill it
			if (getAtt(nlNodes.item(i), "id").substr(0,strIDPrefix.length) == strIDPrefix) {
				nTags.removeChild(nlNodes.item(i));
			}
		}
		
		//now add the nodes in
		for (var i=0;i<arrnodeID.length;i++) {
			var nTmp = objTemplate.doc.createElement("Node");
			setAtt(nTmp, "id", trim(arrnodeID[i]));
			setAtt(nTmp, "name", trim(arrnodeName[i]));
			nTags.appendChild(nTmp);
		}
		
		// now time to display
		showAccess();
		
	}
	
	function updateProduct(nodeName, nodeID, strDisplay) {
		// breakdown nodename and nodeID. show display
		// update nodes and handle display
		arrnodeName = nodeName.split("$$");
		arrnodeID = nodeID.split("$$");
		var currentNode = getProductsArray();		
		var nTags = objTemplate.getTagsNode();
		var nlNodes = nTags.getElementsByTagName("Node");

		// remove all nodes		
		for (var i=0;i<nlNodes.length;i++) {
			//if nTags is of product node... kill it
			if (getAtt(nlNodes.item(i), "id").substr(0,strProdPrefix.length) == strProdPrefix) {
				nTags.removeChild(nlNodes.item(i));
			}
		}
		//now add the nodes in
		for (var i=0;i<arrnodeID.length;i++) {
			var nTmp = objTemplate.doc.createElement("Node");
			setAtt(nTmp, "id", trim(arrnodeID[i]));
			setAtt(nTmp, "name", trim(arrnodeName[i]));
			nTags.appendChild(nTmp);
		}
		
		// now time to display
		showProducts();
	}


	function showAccess() {
		var workarea = document.getElementById("access");
		var arrAccess = getAccessArray();
		if (arrAccess == null) { 
			workarea.innerHTML = "";
			return;
		}
		var strNames = "";
		for (var i=0;i<arrAccess.length;i++) {
			if ((arrAccess[i][1]!="" ) || (arrAccess[i][1] != null)) {
				strNames = strNames + ",&nbsp;&nbsp;&nbsp;&nbsp;" + "<b>"+arrAccess[i][1]+"</b>";
			}
		}
		workarea.innerHTML = strNames.substr(1) ;
	}

	function showProducts() {
		var workarea = document.getElementById("products");
		var arrProd = getProductsArray();
		if (arrProd == null) { 
			workarea.innerHTML = "";
			return;
		}
		var strNames = "";
		for (var i=0;i<arrProd.length;i++) {
			strNames = strNames + ",&nbsp;&nbsp;&nbsp;&nbsp;" + "<b>"+arrProd[i][1]+"</b>";
		}
		workarea.innerHTML = strNames.substr(1) ;
	}


// util

	function trim(value) {
	   var temp = value;
	   var obj = /^(\s*)([\W\w]*)(\b\s*$)/;
	   if (obj.test(temp)) { temp = temp.replace(obj, '$2'); }
	   var obj = /  /g;
	   while (temp.match(obj)) { temp = temp.replace(obj, " "); }
	   return temp;
	}

	
var CONST_WARN_REORDER_1 = "You need to have more than 1 field to reorder the fields";
var CONST_WARN_REORDER_2 = "You need to have more than 1 selection to reorder the selections";