123 lines
4.6 KiB
JavaScript
123 lines
4.6 KiB
JavaScript
/*
|
|
This file is part of Ext JS 3.4
|
|
|
|
Copyright (c) 2011-2013 Sencha Inc
|
|
|
|
Contact: http://www.sencha.com/contact
|
|
|
|
GNU General Public License Usage
|
|
This file may be used under the terms of the GNU General Public License version 3.0 as
|
|
published by the Free Software Foundation and appearing in the file LICENSE included in the
|
|
packaging of this file.
|
|
|
|
Please review the following information to ensure the GNU General Public License version 3.0
|
|
requirements will be met: http://www.gnu.org/copyleft/gpl.html.
|
|
|
|
If you are unsure which license is appropriate for your use, please contact the sales department
|
|
at http://www.sencha.com/contact.
|
|
|
|
Build date: 2013-04-03 15:07:25
|
|
*/
|
|
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 = [
|
|
'<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;
|
|
}
|
|
});
|
|
|
|
//backwards compat
|
|
Ext.tree.ColumnNodeUI = Ext.ux.tree.ColumnNodeUI;
|