/*
 * 2009.2.11
 * 列表绑定对象，改自静态方法 Fpi.Util.createTableList
 * 从静态方法绑定改为对象绑定，可以保存绑定的数据并任意添加事件
 */
var TableList = function(tableObj, datas, noDatasMsg, isShowCheckbox, tableStyles) {
	this.tableObj = tableObj;
	this.datas = datas || [];
	this.noDatasMsg = noDatasMsg || 'no-datas-found';
	this.isShowCheckbox = isShowCheckbox;
	this.selectedIndex = -1; // 当前选中的行
	
	this.allowEvents = ['onRowClick'];
	this.eventHandlers = {};
	
	if(!tableStyles) {
		return;
	}
	
	this.tableStyles = {};
	
	if(typeof tableStyles == 'string') {
		var styleObjArr = tableStyles.split(';');
		
		for(var i = 0, len = styleObjArr.length; i < len; i++) {
			
			var styleObj = styleObjArr[i].split(':');
		
			if(styleObj.length !=2) {
				continue;
			}
			
			this.tableStyles[styleObj[0]] = styleObj[1];
		}
		
	} else {
		this.tableStyles = tableStyles;
	}
}

TableList.prototype = {
	// 显示列表
	render		:	function() {
		if(!this.tableObj) {
			this.tableObj = document.createElement('table');
		}
		
		var tableObj = this.tableObj;
		
		if(this.tableStyles) {
			jQuery.extend(tableObj.style, this.tableStyles);
		}
		
		// clear rows
		jQuery(tableObj).children(' tr').remove();
		
		// create header
		var headers = this.datas.headers;
		if(headers && headers.length > 0){
			
			// add thead
			var thead = jQuery('<thead></thead>');
			thead.appendTo(tableObj);
			
			// add header
			var headerRow = jQuery('<tr class="portlet-section-header"></tr>');
			headerRow.appendTo(thead);
			
			// header checkbox
			if(this.isShowCheckbox){
				jQuery('<th><input type="checkbox" /></th>').appendTo(headerRow).find('input[@type="checkbox"]').
					click(function(){
						jQuery(tableObj).find('tbody tr').find('td:first input[@type="checkbox"]').attr('checked', this.checked);
					});
			}
			
			for(var i = 0; i < headers.length; i++){
				var th = document.createElement('th');
				
				// add column(th)
				headerRow.append(th);
				
				/*
				 * header example
				 * {
				 * 		name : 第一列,
				 * 		field	:	'name',
				 * 		className : 'header-one',
				 *  	styles{
				 * 			background	:	'red',
				 * 			align		:	'center'
				 * 		},
				 * 		maxLength		: 40,
				 * 		
				 * }
				 */
				
				var head = headers[i];
				var headName = head.name || '';
				var headClassName = head.className;
				var styles = head.styles;
				
				if(headClassName){
					th.className = headClassName;
				}
				// set th style
				for(var style in styles){
					th.style[style] = styles[style];
				}
				
				var innerHeadDiv = document.createElement('div');
				
				th.appendChild(innerHeadDiv);
				
				getInnerHTMLWithStyle(innerHeadDiv, head, headName)
			}
		}
		
		// if no datas
		if(!this.datas || this.datas.length == 0) {
			var tr = createRow(0);
			jQuery(tableObj).append(tr);
			
			var td = createColumn();
			tr.appendChild(td);
			
			if(headers){
				td.colSpan = headers.length + (this.isShowCheckbox ? 1 : 0);
			}
			
			td.align = 'center';
			td.innerHTML = this.noDatasMsg;
				
			return tableObj;
		}
		
		// add datas
		for(var i = 0; i < this.datas.length; i++){
			var data = this.datas[i];
			
			var tr = createRow(i);
			
			// 事件绑定
			jQuery(tr).click(this.onRowClick.bind(this, data, i, tr));
			
			jQuery(tableObj).append(tr);
			
			if(headers && headers.length > 0){ // has headers
				
				// checkbox column
				if(this.isShowCheckbox){
					var checkTd = createColumn();
					tr.appendChild(checkTd);
				
					var ck = document.createElement('input');
					ck.type = 'checkbox';
					checkTd.appendChild(ck);
					
					jQuery(ck).click(changeCheck);
				}	
					
				for(var j = 0; j < headers.length; j++){
					
					var td = createColumn();
			
					tr.appendChild(td);
			
					var header = headers[j];
					var field = header.field; // 获取数据字段或显示方式
					
					if(typeof(field) == 'function'){
						//field(td, data);
						var returnData = field(td, data);
						
						// 如果有返回值，则表示需要格式化
						if(returnData && !returnData.tagName){
							var innerDiv = document.createElement('div');
						
							td.appendChild(innerDiv);
							getInnerHTMLWithStyle(innerDiv, header, returnData);
						}
					}else{
						var tdDatas = data[field];
						
						var innerDiv = document.createElement('div');
						
						td.appendChild(innerDiv);
						
						getInnerHTMLWithStyle(innerDiv, header, tdDatas);
					}
				}
			}else{
				for(var field in data){ // no headers, show all data field
					var td = createColumn();
					tr.appendChild(td);
					
					var innerDiv = document.createElement('div');
					td.appendChild(innerDiv);
					
					getInnerHTMLWithStyle(innerDiv, null, data[field])
				}
			}
		}
		
		return tableObj;
		
		// 复选框选中状态更改
		function changeCheck(){
			var checkboxCount = jQuery(tableObj).find('tbody tr').length;
			
			var checkedCount = jQuery(tableObj).find('tbody tr').find('td:first input[@type="checkbox"]:checked').length;
			
			jQuery(tableObj).find('thead tr th:first input[@type="checkbox"]').attr('checked', (checkboxCount == checkedCount));
		}
		
		// 格式化文本
		function getInnerHTMLWithStyle(innerDiv, header, tdDatas){
			
			innerDiv.style.whiteSpace = 'nowrap';
			innerDiv.style.textOverflow  = 'ellipsis';
			innerDiv.style.overflow = 'hidden';
			
			innerDiv.title = Fpi.Util.sub_str(Fpi.Util.decodeHTML(tdDatas), 800, 'left');
			
			if(!header){
				innerDiv.innerHTML = Fpi.Util.sub_str(tdDatas, 40, 'left');
				return;
			}
			
			if(header.width || (header.styles && header.styles.width)){ 
				innerDiv.style.width = header.width || header.styles.width;
			}
			
			if(header.maxLength){ // 最大长度限制
				innerDiv.innerHTML = Fpi.Util.sub_str(tdDatas, header.maxLength, 'left');
			}else if(!header.width){ // 没有最大宽度限制时，默认取 40 个字符（每个中文视为两个字符）
				innerDiv.innerHTML = Fpi.Util.sub_str(tdDatas, 40, 'left');
			} else{ // 有最大宽度限制时，默认取 400个字符（根据限制宽度，会自动取适合长度的字符串，限制取400个字符是当字符串长度太长时，浏览器长时间没有反应）
				innerDiv.innerHTML = Fpi.Util.sub_str(tdDatas, 400, 'left');
			}
		}
		
		function createRow(i) {
			var tr = document.createElement("tr");
			
			var classname = 'portlet-section-body';
			
			if(i % 2 != 0) {
				classname = 'portlet-section-alternate';
			}
			
			tr.className = classname;
			
			jQuery(tr).mouseover(function(){
				jQuery(this).removeClass(classname);
				jQuery(this).addClass(classname + '-hover');
			});
			
			jQuery(tr).mouseout(function(){
				jQuery(this).removeClass(classname + '-hover');
				jQuery(this).addClass(classname);
			});
			/*
			if(i % 2 ==0){
				//tr.setAttribute("className","portlet-section-body");
				//tr.onmouseleave  = function(){this.className = 'portlet-section-body';};
				tr.className = "portlet-section-body ";
				tr.onmouseout =  function(){this.className = 'portlet-section-body';};
				tr.onmouseover  =  function(){this.className = 'portlet-section-body-hover';} ;
			}else{
				//tr.setAttribute("className","portlet-section-alternate");
				//tr.onmouseleave  = function(){this.className = 'portlet-section-alternate';};
				tr.className = "portlet-section-alternate ";
				tr.onmouseout =  function(){this.className = 'portlet-section-alternate';};
				tr.onmouseover  =  function(){this.className = 'portlet-section-alternate-hover';} ;
			} */
			//tr.onmouseenter  =  function(){this.className = 'portlet-section-body-hover';} ;
			
			return tr;
		}
		
		function createColumn() {
			var td = document.createElement("td");
			td.style.wordBreak  = 'keep-all';
			//td.width = '200px';
			td.style.textOverflow  = 'ellipsis';
			return td;
		}
	},
	// 获取checkbox选中的记录列表
	getCheckedRowDatas		:	function() {
		var checkedDatas = [];
		
		var datas = this.datas;
		
		jQuery(this.tableObj).find('tbody tr').each(function(index, tr){
			var checkbox = jQuery(this).find('td:first input[@type="checkbox"]').get(0);
			
			if(checkbox && checkbox.checked) {
				checkedDatas.push(datas[index]);
			}
		});
		
		return checkedDatas;
	},
	// 获取当前选中行的数据
	getSelectData			:	function() {
		if(this.selectedIndex == -1) {
			return null;
		}
		
		return this.datas && this.datas[this.selectedIndex];
	}
}

// 继承事件类，添加行点击事件
jQuery.extend(TableList.prototype, new EventObject(), {
	onRowClick				:	function(data, rowIndex, row) {
		this.selectedIndex = rowIndex;
		jQuery(this.tableObj).find('tbody tr.selected').removeClass('selected');
		jQuery(row).addClass("selected");
		this.fireEvent('onRowClick', [data, rowIndex, row]);
	},
	attachOnRowClickEvents	:	function(rowClickHandler) {
		this.attachEvent('onRowClick', rowClickHandler);
	},
	detachOnRowClickEvents	:	function(rowClickHandler) {
		this.detachEvent('onRowClick', rowClickHandler);
	},
	clearOnRowClickEvents	:	function() {
		this.clearEvent('onRowClick');
	}
});