/**
 * @author Jason
 */

	var styleHolder = "";
	var hoverClass = "";
	var hoverColor = "";
	
	DataGrid = function(initObj){
			
			this.properties = initObj;
			this.columns = [];
			this.dataSource = null;
			this.colorStay = "purple";
			this.maxLength = (this.properties.maxLength) ? this.properties.maxLength : null;
			
			var ind = 0;  //Index
			var schema, key;
			schema = new Array();
			var data = this.dataSource = this.properties.data;
				
				//Object Reflection - Determine the column names from the first Object
			for (prop in data.rows[0]){
				key = prop.toString();
				schema[ind] = key;
				ind++;
			}
			
			this.columns = schema;
			
			this.render = function(){
				
				var grid = document.createElement("table");
				grid = this.createHeader(grid);
				var gridBody = document.createElement("tbody");
				var currObj, maxLength = 0;
				
				if(this.maxLength){
					if(data.rows.length >= this.maxLength)
						maxLength = this.maxLength;
					else
						maxLength = data.rows.length;
				} 
					
				
				for (i = 0; i < maxLength; i++){
					
					currObj = data.rows[i];
					currRow = document.createElement("tr");
					
					if(this.properties.itemTemplate){
						var template = this.properties.itemTemplate;
						
						for( a = 0; a < template.length; a++ ){
	           			
							if(this.properties.formatFunction){
								formatter = this.properties.formatFunction;
								data.rows[i] = formatter(data.rows[i]);
							}
							
							currCell = document.createElement("td");
		                	//cellText = document.createTextNode(data.rows[i][template[a]].toString());
		                	currCell.innerHTML = data.rows[i][template[a]];
		                	//currCell.appendChild(cellText);
							currCell.id = template[a];
		                	currRow.appendChild(currCell);
						
						}
						
					}
					else{
						for( a = 0; a < this.columns.length; a++ ){
		           			
							if(this.properties.formatFunction){
								formatter = this.properties.formatFunction;
								data.rows[i] = formatter(data.rows[i]);
							}
							
							currCell = document.createElement("td");
		                	cellText = document.createTextNode(data.rows[i][this.columns[a]].toString());
		                
		                	currCell.appendChild(cellText);
							currCell.id = this.columns[a];
		                	currRow.appendChild(currCell);
							
						}
					}
	           
			   		if(this.properties.editHandler && this.properties.primaryKeyColumn){
						var keyCol = currRow.getElementsByTagName("TD")[this.properties.primaryKeyColumn];
						// Row Edit function receives the index of the row in the data table and the primary key for that row.
						if(keyCol){
							keyCol.innerHTML = "<a href=\"javascript:" + this.properties.editHandler + "(" + i + "," + data.rows[i][this.properties.primaryKeyColumn] + ")\" title=\"Edit\">Edit</a> | ";
						}
					}
					
					if(this.properties.deleteHandler && this.properties.primaryKeyColumn){
						var keyCol = currRow.getElementsByTagName("TD")[this.properties.primaryKeyColumn];
						// Row Edit function receives the index of the row in the data table and the primary key for that row.
						if(keyCol){
							keyCol.innerHTML += " <a href=\"javascript:" + this.properties.deleteHandler + "(" + i + "," + data.rows[i][this.properties.primaryKeyColumn] + ")\" title=\"Delete\">Delete</a>";
						}
					}
					
					
					gridBody.appendChild(currRow);
		        
				}
				
				if(this.properties.ID){ grid.id = this.properties.ID;}
				grid.appendChild(gridBody);
				
				return this.formatGrid(grid);
			};
			
			this.createHeader = function(myGrid){
				var header = document.createElement("thead");
			    var hRow = document.createElement("tr");
				var hdTxt, hd, headerColumns, template;
				var hArray;
				
				//itemTemplate = An array of columns to display
				if(this.properties.itemTemplate){
					template = this.properties.itemTemplate;
					hArray = new Array();
					// Create Shallow copy of array
					for(a = 0; a < template.length; a++){
						hArray[a] = template[a];
					}
				}
				else{
					
					for(a = 0; a < this.columns.length; a++){
						
						// Create Shallow copy of array
						hArray = new Array();
						hArray[a] = this.columns[a];
					}
					
				}
				
				if(this.properties.headerFormat){
					hformat = this.properties.headerFormat;
					headerColumns = hformat(hArray);
				}
				else{
					headerColumns = hArray;
				}
				
				for (i = 0; i < headerColumns.length; i++){
					hd = document.createElement("th");
	        		hTxt = document.createTextNode(headerColumns[i]);
	        		hd.appendChild(hTxt);
	        		hRow.appendChild(hd);	
				}
				header.appendChild(hRow);
				myGrid.appendChild(header);
				return myGrid;
			};
			
			
			this.formatGrid = function(myGrid){
				var p = this.properties;
				
				if(p.cellspacing) { myGrid.cellSpacing = p.cellspacing;}
				if(p.cellpadding) { myGrid.cellPadding = p.cellpadding;}
				if(p.border) { myGrid.border = p.border}
				if(p.width){ myGrid.width = p.width}
				if(p.cssClass){ myGrid.className = p.cssClass}
				if(p.style){ 
					var key;
					var styleList = p.style.styles;
					for(prop in styleList){
						key = prop.toString();
						myGrid.style[key] = styleList[key];
					}
				}
				// Zebra stripes
				if(p.alternateRows){
					var mainBody = myGrid.getElementsByTagName("tbody")[0];  //Retrieve the Table Body
					var iRows = mainBody.getElementsByTagName("TR"); //Retrieve table rows in the table
					for(x = 0; x < iRows.length; x++){
						
			   		   if(((x + 1)%2) == 0){
			   		     iRows[x].className = p.alternateRows; //if even row, set class name to alternate row class;
			   		   }
					}
				}
				
				
				if(p.headerClass){
					var mainHeader = myGrid.getElementsByTagName("thead")[0];  //Retrieve the Table Header
					mainHeader.className = p.headerClass;
				}
				
				if(p.highlightClass){
					var mainBody = myGrid.getElementsByTagName("tbody")[0];  //Retrieve the Table Body
					var iRows = mainBody.getElementsByTagName("TR"); //Retrieve table rows in the table
					hoverClass = p.highlightClass;
					hoverColor = p.highlightColor;
					
					for(x = 0; x < iRows.length; x++){
							//iRows[x].setAttribute("onmouseover", "toggle();");// = function(){alert("Hello World");}//"DataGrid.toggle();";
							iRows[x].onmouseover = toggleIn;
							iRows[x].onmouseout = toggleOut;	
			   		   }
					
				}
				
				
				return myGrid;
			};
			
			
			function toggleIn(){
				styleHolder = this.style.backgroundColor;
				//this.className = hoverClass;
				this.style.backgroundColor = hoverColor;
			};
			
			function toggleOut(){
				//this.className = styleHolder;
				this.style.backgroundColor = styleHolder;
			}
			
		}
	
		//DataGrid.prototype.dataSource = new Object();
		
		DataGrid.prototype.dataBind = function(objName){	
			var container = document.getElementById(objName);
			if(!container){
				throw "DataBind Error - Invalid container " + container.toString(); 
			}
			container.innerHTML = "";
			var dGrid;
			
			if(container){
				dGrid = this.render();
				
				if(container.hasChildNodes){
					var tmp = container.childNodes;
					for(n = 0; n < tmp.length; n++){
						container.removeChild(tmp[n]);
					}
				}
				container.appendChild(dGrid);
			}
		}