/*
|
This file is part of Ext JS 4.2
|
|
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-05-16 14:36:50 (f9be68accb407158ba2b1be2c226a6ce1f649314)
|
*/
|
/**
|
* Provides indentation and folder structure markup for a Tree taking into account
|
* depth and position within the tree hierarchy.
|
*
|
* @private
|
*/
|
Ext.define('Ext.tree.Column', {
|
extend: 'Ext.grid.column.Column',
|
alias: 'widget.treecolumn',
|
|
tdCls: Ext.baseCSSPrefix + 'grid-cell-treecolumn',
|
|
autoLock: true,
|
lockable: false,
|
draggable: false,
|
hideable: false,
|
|
iconCls: Ext.baseCSSPrefix + 'tree-icon',
|
checkboxCls: Ext.baseCSSPrefix + 'tree-checkbox',
|
elbowCls: Ext.baseCSSPrefix + 'tree-elbow',
|
expanderCls: Ext.baseCSSPrefix + 'tree-expander',
|
textCls: Ext.baseCSSPrefix + 'tree-node-text',
|
innerCls: Ext.baseCSSPrefix + 'grid-cell-inner-treecolumn',
|
isTreeColumn: true,
|
|
cellTpl: [
|
'<tpl for="lines">',
|
'<img src="{parent.blankUrl}" class="{parent.childCls} {parent.elbowCls}-img ',
|
'{parent.elbowCls}-<tpl if=".">line<tpl else>empty</tpl>"/>',
|
'</tpl>',
|
'<img src="{blankUrl}" class="{childCls} {elbowCls}-img {elbowCls}',
|
'<tpl if="isLast">-end</tpl><tpl if="expandable">-plus {expanderCls}</tpl>"/>',
|
'<tpl if="checked !== null">',
|
'<input type="button" role="checkbox" <tpl if="checked">aria-checked="true" </tpl>',
|
'class="{childCls} {checkboxCls}<tpl if="checked"> {checkboxCls}-checked</tpl>"/>',
|
'</tpl>',
|
'<img src="{blankUrl}" class="{childCls} {baseIconCls} ',
|
'{baseIconCls}-<tpl if="leaf">leaf<tpl else>parent</tpl> {iconCls}"',
|
'<tpl if="icon">style="background-image:url({icon})"</tpl>/>',
|
'<tpl if="href">',
|
'<a href="{href}" target="{hrefTarget}" class="{textCls} {childCls}">{value}</a>',
|
'<tpl else>',
|
'<span class="{textCls} {childCls}">{value}</span>',
|
'</tpl>'
|
],
|
|
initComponent: function() {
|
var me = this;
|
|
me.origRenderer = me.renderer;
|
me.origScope = me.scope || window;
|
|
me.renderer = me.treeRenderer;
|
me.scope = me;
|
|
me.callParent();
|
},
|
|
treeRenderer: function(value, metaData, record, rowIdx, colIdx, store, view){
|
var me = this,
|
cls = record.get('cls'),
|
renderer = me.origRenderer,
|
data = record.data,
|
parent = record.parentNode,
|
rootVisible = view.rootVisible,
|
lines = [],
|
parentData;
|
|
if (cls) {
|
metaData.tdCls += ' ' + cls;
|
}
|
|
while (parent && (rootVisible || parent.data.depth > 0)) {
|
parentData = parent.data;
|
lines[rootVisible ? parentData.depth : parentData.depth - 1] =
|
parentData.isLast ? 0 : 1;
|
parent = parent.parentNode;
|
}
|
|
return me.getTpl('cellTpl').apply({
|
record: record,
|
baseIconCls: me.iconCls,
|
iconCls: data.iconCls,
|
icon: data.icon,
|
checkboxCls: me.checkboxCls,
|
checked: data.checked,
|
elbowCls: me.elbowCls,
|
expanderCls: me.expanderCls,
|
textCls: me.textCls,
|
leaf: data.leaf,
|
expandable: record.isExpandable(),
|
isLast: data.isLast,
|
blankUrl: Ext.BLANK_IMAGE_URL,
|
href: data.href,
|
hrefTarget: data.hrefTarget,
|
lines: lines,
|
metaData: metaData,
|
// subclasses or overrides can implement a getChildCls() method, which can
|
// return an extra class to add to all of the cell's child elements (icon,
|
// expander, elbow, checkbox). This is used by the rtl override to add the
|
// "x-rtl" class to these elements.
|
childCls: me.getChildCls ? me.getChildCls() + ' ' : '',
|
value: renderer ? renderer.apply(me.origScope, arguments) : value
|
});
|
}
|
});
|
