function getCheckBox(name, label, defaultValue, disableStatus, eventName, eventHandle, eventName1, eventHandle1){
	 
	var htmlString = "<input type=\"checkbox\" name=\""+ name +"\" id=\""+ name +"\" ";
	if (defaultValue == "true")	{
		htmlString += "checked=\"checked\" ";
	}
	if (eventName && eventHandle)	{
		htmlString += eventName+"=\""+eventHandle+";\" ";
	}
	
	if (eventName1 && eventHandle1)	{
		htmlString += eventName1+"=\""+eventHandle1+";\" ";
	}

	if (disableStatus == "true")
	{
		htmlString += "disabled=\"disabled\" ";
	}
	if (label)	{
		htmlString += "><label>"+label+"</label></input>";
	}else{
		htmlString += " />";
	}
	
	return htmlString;
}

function getTextBox(name, defaultValue, eventName, eventHandle, size){
	var htmlString = "<input type=\"text\" size=\"30\" name=\""+ name +"\" id=\""+ name +"\" ";
	if (defaultValue){
		htmlString += "value=\""+defaultValue+"\" ";
	}
	if (eventName && eventHandle){
		htmlString += eventName+"=\""+eventHandle+";\" ";
	}
	if (size){
		htmlString += " size=\""+size+"\" ";
	}	
	htmlString += " />";
	return htmlString;
}

function getButton(name, label, eventName, eventHandle, size){
	var htmlString = "<input type=\"button\" name=\""+ name +"\" id=\""+ name +"\" align=\"center\" ";
	if (label)	{
		htmlString += "value=\""+label+"\" ";
	}
	if (eventName && eventHandle){
		htmlString += eventName+"=\""+eventHandle+";\" ";
	}
	if (size){
		htmlString += " size=\""+size+"\" ";
	}	
	htmlString += " />";
	return htmlString;
}

function getRadio(name, label, defaultValue, eventName, eventHandle){
	var htmlString = "<input type=\"radio\" name=\""+ name +"\" id=\""+ name +"\" ";
	if (defaultValue == "true")	{
		htmlString += "checked=\"checked\" ";
	}
	if (eventName && eventHandle)	{
		htmlString += eventName+"=\""+eventHandle+";\" ";
	}
	if (label)	{
		htmlString += "><label>"+label+"</label></input>";
	}else{
		htmlString += " />";
	}
	return htmlString;
}

function getHeaderRow(label, styleClass){
	var htmlString = "<h1 class=\""+ styleClass +"\" >" + label + "</h1>";
	return htmlString;
}

function renderXML(){
	try{ //Internet Explorer
	  xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
	}catch(e){
		try{ //Firefox, Mozilla, Opera, etc.
			xmlDoc=document.implementation.createDocument("","",null);
		}catch(e) {alert(e.message)}
	}
	try {
		 xmlDoc.async=false;
		 xmlDoc.load("scripts/componentConfig/component.xml");		
		}
		catch(e) {
			 try
	         {       // for Safari
	                 xmlDoc = new XMLHttpRequest();
	                 xmlDoc.open("GET", "scripts/componentConfig/component.xml", false);
	                 xmlDoc.send();
	                 xmlDoc=xmlDoc.responseXML;                 
	         }
	         catch(e)
	         {
	                 alert(e.message)
	                 return; // return with nothing
	         }		
			}
	groups = xmlDoc.documentElement.childNodes; 
	searchGrpHtml = "";
	customHtml = "";
	rowId = 0;
	for (g=0;g < groups.length;g++){ 
		if (groups[g].nodeType !=1)  continue;	
		group = groups[g];
		groupId = "";
		gpsAttrs = group.attributes;			
		if (gpsAttrs.length > 0 && gpsAttrs.getNamedItem("grpid") ){
				 groupId = gpsAttrs.getNamedItem("grpid").value;			 
		}		
		if (groupId == "search"){			  
			searchGrpHtml += "<div >";
			searchGrpHtml += getGroupHtml(group);
			searchGrpHtml += "</div><br/>"; 
		}else{
			customHtml += "<div id=\"" + getGroupClass(rowId++) + "\" >"  ;
			customHtml += getGroupHtml(group);
			customHtml += "</div><br/>"; 
		}
	}
	customHtml = "<div style='height: 440px; overflow-X: hidden; overflow-Y: scroll; width:280px;'><table width='280' height='440'><tr><td>"+customHtml+"</td></tr></table></div>";
	//document.getElementById("searchBlock").innerHTML=searchGrpHtml; 
	document.getElementById("disptext").innerHTML=customHtml;
}
	
function getGroupClass(rowId){

	if(rowId %2 == 0 )
		 return "chkbox1"; 
	else
		//return "chkbox";	
	return "";
}


function toggleCustomBlock(srcId){   
   if (document.getElementById(srcId).style.display==''){
	document.getElementById("togglelink").innerHTML = "Show";
	document.getElementById(srcId).style.display = 'none';
   }else{
	document.getElementById(srcId).style.display = '';
	document.getElementById("togglelink").innerHTML = "Hide";
   }
}

function getGroupHtml(group){ 
	var headerText = "";
	var items = "1";
	gpsAttrs = group.attributes;	
	if (gpsAttrs.length > 0 )	{
		if (gpsAttrs.getNamedItem("hdrText")){
			 headerText = "<h2>"+gpsAttrs.getNamedItem("hdrText").value+"</h2>";
		 }
		if (gpsAttrs.getNamedItem("itemsPerRow")){
			 items = gpsAttrs.getNamedItem("itemsPerRow").value;		
		}
	} 
	styleClass = "style1";
	var headerHtml = headerText;
	groupHtml = "<table cellspacing=\"2\" cellpadding=\"2\" width=\"auto\"><tr><th align=\"left\" colspan=\""+ items+ "\" >" + headerHtml + "</th></tr>";
	var fields = group.childNodes;
	fieldCol = 0;
	fieldsHtml = "<tr class=\"tablerow\"><td>";
	for (f=0; f < fields.length; f++ )	{
		field  = fields[f];
		if (field.nodeType != 1) continue;
		fieldCol ++;
		fieldsHtml += "<tr><td  nowrap=\"false\" width=\"auto\" >" + getFieldHtml(field)+"</td></tr>"
		if((fieldCol % items)==0){
			fieldsHtml +="</td></tr><tr class=\"tablerow\">";		 		
	 	}
	}
	groupHtml += fieldsHtml + "</tr></table>";
	return groupHtml;
}

function getFieldHtml(field){
	var type = "";
	var name = "";
	var label = "";
	var styleClass = "";
	var defaultValue="";
	var disableStatus="";
	var eltsize = "";
	var eventName = "";
	var eventHandle="";
	var eventName1 = "";
	var eventHandle1="";

	fieldHtml = "";
	fieldElements = field.childNodes;

	for (fe = 0; fe < fieldElements.length ; fe++){
		fieldElement = fieldElements[fe];
		if (fieldElement.nodeType != 1) continue;
		if (fieldElement.nodeName == "type"){
			type = fieldElement.firstChild.nodeValue;
		}else if (fieldElement.nodeName == "name" && fieldElement.firstChild){
			name = fieldElement.firstChild.nodeValue;
		}else if (fieldElement.nodeName == "fieldLabel" && fieldElement.firstChild)	{
			label = fieldElement.firstChild.nodeValue;
		}else if (fieldElement.nodeName == "styleClass" && fieldElement.firstChild){
			styleClass = fieldElement.firstChild.nodeValue;
		}else if (fieldElement.nodeName == "defaultValue" && fieldElement.firstChild){
			defaultValue = fieldElement.firstChild.nodeValue;
		}else if (fieldElement.nodeName == "disableStatus" && fieldElement.firstChild){
			disableStatus = fieldElement.firstChild.nodeValue;
		}else if (fieldElement.nodeName == "size" && fieldElement.firstChild){
			eltsize = fieldElement.firstChild.nodeValue;
		}else if (fieldElement.nodeName == "event-name" && fieldElement.firstChild){
			eventName = fieldElement.firstChild.nodeValue;
		}else if (fieldElement.nodeName == "event-handle" && fieldElement.firstChild){
			eventHandle = fieldElement.firstChild.nodeValue;
		}else if (fieldElement.nodeName == "event-name1" && fieldElement.firstChild){
			eventName1 = fieldElement.firstChild.nodeValue;
		}else if (fieldElement.nodeName == "event-handle1" && fieldElement.firstChild){
			eventHandle1 = fieldElement.firstChild.nodeValue;
		}
	}

	if (type && type == "checkbox"){
		fieldHtml = getCheckBox(name, label, defaultValue, disableStatus, eventName, eventHandle, eventName1, eventHandle1);		
	}else if (type && type == "text"){
		fieldHtml = getTextBox(name, defaultValue, eventName, eventHandle, eltsize);		
	}else if (type && type == "button"){		
		fieldHtml = getButton(name, label, eventName, eventHandle, eltsize);		
	}else if (type && type == "label"){
		fieldHtml = getHeaderRow(label, 'style1');	
	}else if (type && type == "select"){
		fieldHtml = getComboBox(name, label, defaultValue, eventName, eventHandle);		
	} else if ( type && type == "radio" )  {
		fieldHtml = getRadio(name, label, defaultValue, eventName, eventHandle);		
	}
	else{
		alert('Unsupported element type...... Check the XML');
	}

	return fieldHtml;
}