/*
 * Ext JS Library 2.2
 * Copyright(c) 2006-2008, Ext JS, LLC.
 * licensing@extjs.com
 * 
 * http://extjs.com/license
 */

Ext.tree.ColumnTree = Ext.extend(Ext.tree.TreePanel, {
	lines:false,
	borderWidth: Ext.isBorderBox ? 0 : 2, // the combined left/right border for each cell
	cls:'x-column-tree',

	onRender : function(){
		Ext.tree.ColumnTree.superclass.onRender.apply(this, arguments);
		this.headers = this.body.createChild(
			{cls:'x-tree-headers'},this.innerCt.dom);

		var cols = this.columns, c;
		var totalWidth = 0;

		for(var i = 0, len = cols.length; i < len; i++){
			 c = cols[i];
			 totalWidth += c.width;
			 this.headers.createChild({
				 cls:'x-tree-hd ' + (c.cls?c.cls+'-hd':''),
				 cn: {
					 cls:'x-tree-hd-text',
					 html: c.header
				 },
				 style:'width:'+(c.width-this.borderWidth)+'px;'
			 });
		}
		this.headers.createChild({cls:'x-clear'});
		// prevent floats from wrapping when clipped
		this.headers.setWidth(totalWidth);
		this.innerCt.setWidth(totalWidth);
	}
});

Ext.tree.ColumnNodeUI = Ext.extend(Ext.tree.TreeNodeUI, {
	focus: Ext.emptyFn, // prevent odd scrolling behavior

	renderElements : function(n, a, targetNode, bulkRender){
		this.indentMarkup = n.parentNode ? n.parentNode.ui.getChildIndent() : '';

		var t = n.getOwnerTree();
		var cols = t.columns;
		var bw = t.borderWidth;
		var c = cols[0];

		var buf = [
			 '<li class="x-tree-node"><div ext:tree-node-id="',n.id,'" class="x-tree-node-el x-tree-node-leaf ', a.cls,'">',
				'<div class="x-tree-col" style="width:',c.width-bw,'px;">',
					'<span class="x-tree-node-indent">',this.indentMarkup,"</span>",
					'<img src="', this.emptyIcon, '" class="x-tree-ec-icon x-tree-elbow">',
					'<img src="', a.icon || this.emptyIcon, '" class="x-tree-node-icon',(a.icon ? " x-tree-node-inline-icon" : ""),(a.iconCls ? " "+a.iconCls : ""),'" unselectable="on">',
					'<a hidefocus="on" class="x-tree-node-anchor" href="',a.href ? a.href : "#",'" tabIndex="1" ',
					a.hrefTarget ? ' target="'+a.hrefTarget+'"' : "", '>',
					'<span unselectable="on">', n.text || (c.renderer ? c.renderer(a[c.dataIndex], n, a) : a[c.dataIndex]),"</span></a>",
				"</div>"];
		 for(var i = 1, len = cols.length; i < len; i++){
			 c = cols[i];

			 buf.push('<div class="x-tree-col ',(c.cls?c.cls:''),'" style="width:',c.width-bw,'px;">',
						'<div class="x-tree-col-text">',(c.renderer ? c.renderer(a[c.dataIndex], n, a) : a[c.dataIndex]),"</div>",
					  "</div>");
		 }
		 buf.push(
			'<div class="x-clear"></div></div>',
			'<ul class="x-tree-node-ct" style="display:none;"></ul>',
			"</li>");

		if(bulkRender !== true && n.nextSibling && n.nextSibling.ui.getEl()){
			this.wrap = Ext.DomHelper.insertHtml("beforeBegin",
								n.nextSibling.ui.getEl(), buf.join(""));
		}else{
			this.wrap = Ext.DomHelper.insertHtml("beforeEnd", targetNode, buf.join(""));
		}

		this.elNode = this.wrap.childNodes[0];
		this.ctNode = this.wrap.childNodes[1];
		var cs = this.elNode.firstChild.childNodes;
		this.indentNode = cs[0];
		this.ecNode = cs[1];
		this.iconNode = cs[2];
		this.anchor = cs[3];
		this.textNode = cs[3].firstChild;
	}
});