Ext.ns('Ext.ux.tree');

/**
 * @class Ext.ux.tree.ColumnTree
 * @extends Ext.tree.TreePanel
 *
 * @xtype columntree
 */

Ext.ux.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.header.createChild({cls:'x-tree-headers'});

       
var cols = this.columns, c;
       
var totalWidth = 0;
       
var scrollOffset = 19; // similar to Ext.grid.GridView default

       
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+scrollOffset);
       
this.innerCt.setWidth(totalWidth);
   
}
});

Ext.reg('columntree', Ext.ux.tree.ColumnTree);

//backwards compat
Ext.tree.ColumnTree = Ext.ux.tree.ColumnTree;


/**
 * @class Ext.ux.tree.ColumnNodeUI
 * @extends Ext.tree.TreeNodeUI
 */

Ext.ux.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 = [
             
'
  • ',
                   
    '
    ',
                       
    '',this.indentMarkup,"",
                       
    '',
                       
    '',
                       
    '',
                       
    '', n.text || (c.renderer ? c.renderer(a[c.dataIndex], n, a) : a[c.dataIndex]),"
    ",
                   
    "
    "];
             
    for(var i = 1, len = cols.length; i < len; i++){
                 c
    = cols[i];

                 buf
    .push('
    ',
                           
    '
    ',(c.renderer ? c.renderer(a[c.dataIndex], n, a) : a[c.dataIndex]),"
    ",
                         
    "
    ");
             
    }
             buf
    .push(
               
    '
    ',
               
    '',
               
    "
  • ");

           
    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;
       
    }
    });

    //backwards compat
    Ext.tree.ColumnNodeUI = Ext.ux.tree.ColumnNodeUI;