/*
	comp_table.js
*/

/*
	rows format look like this:
	[
	{'c': [<col1>, <col2>, <col3>], 'p': {<param1>: <value1>, <param2>: <value2>}},
	{'c': [<col1>, <col2>, <col3>], 'p': {<param1>: <value1>, <param2>: <value2>}},
	{'c': [<col1>, <col2>, <col3>], 'p': {<param1>: <value1>, <param2>: <value2>}}
	]
*/

function Table()
{
	this.id = '';
	this.rows = {};
	this.num_rows = 0;
	this.columns = {};
	this.html = '';
	
	this.clear = function ()
	{
		this.html = '';
	}
	
	this.beginHeader = function (xtra)
	{
		xtra = xtra || '';
		this.html = '<table id="Table_' + this.id + '_Header" style="width:' + this.table_width + '"' + xtra + '>\n';
	}
	
	this.endHeader = function ()
	{
		this.html += '</table>';
	}
	
	this.begin = function (xtra)
	{
		xtra = xtra || '';
		this.html = '<table id="Table_' + this.id + '_Body" style="width:' + this.table_width + '"' + xtra + '>\n';
	}
	
	this.end = function ()
	{
		this.html += '</table>';
	}
	
	this.trBegin = function (row_id, xtra)
	{
		xtra = xtra || '';
		this.html += '<tr id="Row_' + this.id + '_' + row_id + '" ' + xtra + '>';
	}
	
	this.trEnd = function ()
	{
		this.html += '</tr>';
	}
	
	this.th = function (html, xtra)
	{
		xtra = xtra || '';
		this.html += '<th ' + xtra + '>' + html + '</th>';
	}
	
	this.td = function (html, xtra)
	{
		xtra = xtra || '';
		this.html += '<td ' + xtra + '>' + html + '</td>';
	}
	
	this.defRow = function ()
	{
		this.html += '<tr style="height: 1px; font-size: 0px">';
		for (i in this.columns)
		{
			this.html += '<td style="width:'+this.columns[i].w+'px; height: 1px; font-size: 0px"></td>';
		}
		this.html += '</tr>';
	}
	/*
	this.output = function (id)
	{
		var e = document.getElementById(id);
		if (e)
		{
			e.innerHTML = this.html;
			alert(this.html);
		}
	}
	*/
	this.output = function (e)
	{
		e.innerHTML = this.html;
	}
	
	this.onScroll = function (ev)
	{
		ev = ev || window.ev;
		
		//if (ev.mouseButton)
		//alert("Scroll");
		//this.obj.div_h.scrollLeft = this.obj.div_b.scrollLeft;
		this.obj.div_hs.scrollLeft = this.obj.div_b.scrollLeft;
		//this.obj.tbl_h.style.marginLeft = -this.obj.div_b.scrollLeft;
	}
	
	this.setup = function ()
	{
		this.obj = 
		{
			'div': document.getElementById('TableDiv_'+this.id),
			'div_h': document.getElementById('TableDiv_'+this.id+'_Header'),
			'div_hs': document.getElementById('TableDiv_'+this.id+'_HeaderScroll'),
			'div_b': document.getElementById('TableDiv_'+this.id+'_Body')
		};
	}
	
	this.display = function (header_xtra, body_xtra)
	{
		header_xtra = header_xtra || '';
		body_xtra = body_xtra || '';
		
		this.funcStart();
		
		this.table_width = 0;
		for (i in this.columns)
		{
			this.table_width += this.columns[i].w;
		}
		
		this.clear();
		this.beginHeader(header_xtra);
		this.funcHeader();
		this.endHeader();
		
		this.output(this.obj.div_hs);
		
		//alert(this.html);
		
		this.clear();
		this.begin(body_xtra);
		this.defRow();
		
		for (i = 0; i < this.num_rows; i++)
		{
			this.funcRow(i, this.rows[i].c, this.rows[i].p);
		}
		
		this.end();
		
		this.output(this.obj.div_b);
		
		this.funcFinish();
		
		this.obj.tbl_h = document.getElementById('Table_'+this.id+'_Header');
		this.obj.tbl_t = document.getElementById('Table_'+this.id+'_Body');
		
		//alert(this.html);
	}
}