/* ------------------------------------------------------------------------------------
Function list
	nav(type) - function to move the grid
		type - First, Previous, Next, Last, None
	onUpdate() - function called when grid is updates, you can define this function
Parameters
	Name - Grid Name
	destination_div - div name for the destination of the grid
	proc_page - File used by the ajax call to load the data.  Returns data with a delimiter and each row seperated with a line break.
	options - defines the operations of the grid
		Navigation:true/false
		Filter:true/false
		Grid_Size:1-100
		Delimiter:','
	columns - array of columns and their options
	rowfunc - function used when there is a click on the row
	btns - Array of button setting following are the button setting required
		'name':''
		'Handler':function(){} 
		'Image':''

7/2/2009

*/

function dg(name, destination_div, proc_page, options, columns, rowfunc, btns)
{	
	this.Display = function()
	{
		this.div.style.display = 'block';
		this.GreyOut(true, {'zindex':'98', 'bgcolor':'#FFFFFF', 'opacity':'70'});
		this.center(this.div);		
	};
	
	this.LoadNav = function(){
		
		var a = new sack();
		a.requestFile = this.page;
		a.setVar("GridName", this.dgName);
		a.setVar("type", "init");
		a.setVar("pos", this.position);
		a.setVar("height", this.options.Grid_Size);
		a.setVar("sortcol", this.sortcol);
		a.setVar("filter", this.filter);		
		a.onCompletion = function(){ 
							var data = a.response;
							if(data.substring(0, 5) === "Error"){
								navWords.innerHTML = data;
								exit;
							}

							var rows = data.split("\n");
							for(i = 0; i < rows.length; i++)
							{
								var td = rows[i].split("=");
								self.options[td[0]] = td[1];
							}
							
							self.nav("First");
						};
		a.runAJAX();
	

	};
	
	this.nav = function (moveType)
	{ 
		if(navWords.innerHTML === "Loading...") 
		{
			return;
		}
		
		if(moveType  === "First")
		{
			mov = -1*(this.position);
		} else if(moveType  ===  "Previous")
		{
				if(this.position - this.options.Grid_Size < 0){
					mov = -1*(this.position);
				} else {
					mov = -1*(this.options.Grid_Size);
				}
		} else if(moveType  ===  "Next")
		{
				if(this.position + this.options.Grid_Size > this.options.datasize){
					return;
				} else {
					mov = this.options.Grid_Size;
				}
		} else if(moveType  ===  "Last")
		{
			if(this.options.datasize > this.options.Grid_Size+this.position){
				mov = (this.options.datasize) - (this.options.datasize % this.options.Grid_Size);
			} else {
				return;
			}
		} else {
				mov = 0;
		}
	  navWords.innerHTML="Loading...";
	  
		var a = new sack();
		a.requestFile = this.page;
		a.setVar("GridName", this.dgName);
		a.setVar("type", "nav");
		a.setVar("pos", this.position+mov);
		a.setVar("height", this.options.Grid_Size);
		a.setVar("sortcol", this.sortcol);
		a.setVar("filter", this.filter);
		a.setVar("delimiter", this.options.Delimiter);
		//a.setVar("where",  this.buildfilter());
		if(this.options.SQL) a.setVar("sql" , this.options.SQL);
		this.position = this.position +mov;
		a.onCompletion = function(){self.LoadData(a);};
		a.runAJAX();
	};
	
	this.LoadData = function(a, pos)
	{
		var data = a.response;
		pos = pos || this.position;
		if(data.substring(0, 5) === "Error"){
			navWords.innerHTML = data;
			exit;
		}
		navWords.innerHTML='&nbsp;&nbsp;&nbsp;&nbsp;Page '+Math.ceil((pos+1)/this.options.Grid_Size)+' of '+ Math.ceil(this.options.datasize/this.options.Grid_Size);
		
		//navWords.innerHTML='Page '+(pos+1)+' of '+ Math.ceil(this.options.datasize/this.options.Grid_Size);
		while(this.gridTbl.getElementsByTagName('tbody')[0].hasChildNodes())
		{
			if(this.gridTbl.getElementsByTagName('tbody')[0].children.length === 1 && this.options.Filter === true){break;}
			this.gridTbl.getElementsByTagName('tbody')[0].removeChild(this.gridTbl.getElementsByTagName('tbody')[0].lastChild);
		}
				
		var headrow = document.createElement("tr");
		headrow.className = "dg_grid_th";
		headrow.id = "dgheader";

		if(this.options.subgrid){
                    headrow.appendChild(document.createElement("th"));
		}

		if(this.btns){
			for(var i = 0; i < this.btns.length; i++)
			{
				headrow.appendChild(document.createElement("th"));
				headrow.lastChild.innerHTML = this.btns[i].name;
			}
		}
		
		for(var i = 0; i < this.col.length; i++)
		{
			if(this.col[i].Hidden !== true)
			{
				headrow.appendChild(document.createElement("th"));
				var temp = headrow.lastChild;
				if(this.col[i].Sort !== true){
					addEvent(headrow.lastChild, "click", function() 
														{self.sortcol = self.col[i].name;  
															self.nav("None");
														});

				}	
				headrow.lastChild.innerHTML = this.col[i].name;
			}
		}
		this.gridTbl.getElementsByTagName('tbody')[0].appendChild(headrow);
		
		var rows = data.split("\n");
		
		for(var i = 0; i < rows.length; i++)
		{
			this.addRow(rows[i].split(this.options.Delimiter), i);
		}
		this.onUpdate(rows);
	};
//Private functions
	this.changefilter = function()
	{
		this.buildfilter();
		this.nav("NONE");
	};
	
	this.addbtn = function(row, data, position)
	{
		if(this.btns){
			for(var i = 0; i < this.btns.length; i++){
				row.appendChild(document.createElement('td'));
				var timg = document.createElement('img');
				timg.src = this.btns[i].Image;
				timg.id = row.id;
				addEvent(timg, 'click', this.btns[i].Handler);
				row.lastChild.appendChild(timg);
			}
		}
	};
	
	this.buildfilter = function ()
	{
		var output = "text:NONO";
		for(var i = 0; i < this.col.length; i++)
		{
			if(this.col[i].Filter === true)
			{
				var temp = document.getElementById(this.col[i].name)
				if(temp.value !== ""){
					output = output+", "+this.col[i].name+":"+temp.value;
				}
			}
		}
		var tfilter = output.split(", ");
		if(tfilter.length > 1){
			var l = new Array();
			for(var j = 1; j < tfilter.length; j++){
				l[j-1] = tfilter[j].split(":").join(" like '%")+"%'";
			}
			output = " where "+ l.join(" and ");
		} else {
			output = "NONE";
		}
		this.filter = output;
	};
	
	this.addRow = function(dt, location)
	{
		var tr = document.createElement("tr");
		if(this.RowFunction) addEvent(tr, "click", this.RowFunction);
		
		addEvent(tr, "mouseover", function(){self.toggleRow(tr);});
		addEvent(tr, "mouseout", function(){self.toggleRow(tr);});
		this.gridTbl.getElementsByTagName('tbody')[0].appendChild(tr);
		if(location%2 == 0){tr.className = "dg_even";} else {tr.className = "dg_odd";}

                if(dt[1])
		{
			tr.id = dt[1].trim();
                        this.addbtn(tr, dt, location);
		}

		for(var j = 0; j < dt.length; j++)
		{
			if(this.col[j].Hidden !== true)
			{
				tr.appendChild(document.createElement('td'));
				if(this.col[j].Edit !== true)
				{
					if(this.col[j].Image === true)
					{
						tr.lastChild.appendChild(document.createElement('img'));
						tr.lastChild.lastChild.src = this.options.ImageDir+"/mini-"+dt[j].trim();
						setStyle(tr, "width", "100px"); 
						setStyle(tr, "height", "100px");
						tr.lastChild.lastChild.width = "100";
						tr.lastChild.lastChild.height = "100";
						//tr.lastChild.lastChild.setAttribute("width", "100px");
						//tr.lastChild.lastChild.setAttribute("height", "100px");
					} else {
						tr.lastChild.innerHTML = dt[j].trim();
					}
				} else {
					tr.lastChild.innerHTML = "<input type='text' id='"+this.col[j].name+"' style='overflow:auto' onChange='Order(\"\" , this.value.trim(), \""+tr.id+"\");' value='"+dt[j].trim()+"'/>";
//					tr.lastChild.innerHTML = "<textarea id='"+this.col[j].name+"' rows='j' style='overflow:auto' onChange='Order(this.value.trim(), \""+tr.id+"\", );'>"+dt[j]+"</textarea>";
				}
			}
		}
		if(this.options.subgrid){
                    this.addsubgrid(tr.id);
                    addEvent(tr, "click", function(){$("subgrid"+tr.id).toggle();});
		}
	};

        this.addsubgrid = function(id)
        {
		var tr = document.createElement("tr");
                var td = document.createElement("td");
		tr.id = "sub"+id;
                tr.appendChild(td);
                td.colspan = this.col.length+this.btn.length;

                td.appendChild(document.createElement('div'));
		td.lastChild.id = "subgrid"+id;
                this.options.subgrid.options.FilterVal.replace(/'||<ID>||'/g, id);
		var tgrid = new dg(tr.lastChild.id, tr.lastChild.id, "data/projectwizard/systemgrid.php",  this.options.subgrid.options, this.options.subgrid.columns);
                $(td.lastChild).hide();
        }

	this.toggleRow = function(row)
	{
		if(row.className === "dg_hoover"){
			row.className = this.toggleholder;
		} else {
			this.toggleholder = row.className;
			row.className = "dg_hoover";
		}
	}

	this.onUpdate = function() {};
	this.dgName = name;
	this.div = document.getElementById(destination_div);
	this.RowFunction = rowfunc || function() {};
	var self = this;
	this.col = columns;
	this.options = options || {'TitleBar':"Title", 'Display':true, "Grid_Size":15};
	this.header = document.createElement("div");
	this.position = 0;
	this.gridTbl = document.createElement("table");
	this.gridTbl.appendChild(document.createElement('tbody'));
	this.page = proc_page;
	this.sortcol = options.SortCol || "NONE";
	this.filter = options.FilterVal || "NONE";
	this.datasize = 0;
	this.btns = btns;
	this.options.Delimiter = this.options.Delimiter || ",";
	this.options.Index = this.options.Index || "define an index";
	this.options.Table = this.options.Table || "define a table";
        this.subgrids = Array();

	this.div.appendChild(this.header);
	var griddiv = document.createElement("div");
	griddiv.className = "dg_grid_div";
	this.gridTbl.className = "dg_grid_tbl";
	griddiv.appendChild(this.gridTbl);
	this.div.appendChild(griddiv);
	
	if(this.options.TitleBar)
	{
		var titleb = document.createElement("div");
		var titleWords = document.createElement('h1');
		titleWords.innerHTML = this.options.TitleBar;
		titleb.className = "dg_titlebar";
		titleb.appendChild(titleWords);
		this.header.appendChild(titleb);
	}

	if(this.options.Navigation === true)
	{
		var navbar = document.createElement("div");
		navbar.className = "dg_nav";
		
		var navTbl = document.createElement('table');
		navTbl.appendChild(document.createElement('tbody'));
		navTbl.className = "dg_nav_tbl";
		
		var navRow = document.createElement('tr');
		var navFirst = document.createElement('td');
		var navPrev = document.createElement('td');
		var navNext = document.createElement('td');
		var navLast = document.createElement('td');
		var navWords = document.createElement('td');
		setStyle(navWords, "margin-left", "30px");
		navFirst.className = "dg_nav_td";
		navPrev.className = "dg_nav_td";
		navNext.className = "dg_nav_td";
		navLast.className = "dg_nav_td";
		
		navFirst.innerHTML = "|&lt;";
	  navPrev.innerHTML = "&lt;&lt;";
	  navNext.innerHTML = "&gt;&gt;";
	  navLast.innerHTML = "&gt;|";

		addEvent(navFirst, "click", function(){self.nav("First")});
		addEvent(navPrev, "click", function(){self.nav("Previous")});
		addEvent(navNext, "click", function(){self.nav("Next")});
		addEvent(navLast, "click", function(){self.nav("Last")});
		
		navRow.appendChild(navFirst);
		navRow.appendChild(navPrev);
		navRow.appendChild(navNext);
		navRow.appendChild(navLast);
		navRow.appendChild(navWords);
		navTbl.getElementsByTagName('tbody')[0].appendChild(navRow);
				
		navbar.appendChild(navTbl);
		this.header.appendChild(navbar);

	}
	
	if(this.options.Filter === true)
	{
		var filterrow = document.createElement('tr');	
		filterrow.className = "dg_grid_filter";

		if(this.btns){
			for(var i = 0; i < this.btns.length; i++)
			{
				filterrow.appendChild(document.createElement("th"));
			}
		}

		for(var i = 0; i < this.col.length; i++)
		{
			if(this.col[i].Hidden !== true)
			{
				filterrow.appendChild(document.createElement("td"));
				var temp = filterrow.lastChild;
				if(this.col[i].Filter === true)
				{
					temp.innerHTML = "<input id='"+this.col[i].name+"' name='"+this.col[i].name+"' type='text'>";
					addEvent(temp.lastChild, "keyup", function(){self.changefilter()});
				}
			}
		}
		this.gridTbl.getElementsByTagName('tbody')[0].appendChild(filterrow);
	}
	
	
	this.LoadNav();
};