src/tree/Column.js

   1 /**
   2  * @class Ext.tree.Column
   3  * @extends Ext.grid.column.Column
   4  *
   5  * Provides indentation and folder structure markup for a Tree taking into account
   6  * depth and position within the tree hierarchy.
   7  *
   8  * @private
   9  */
  10 Ext.define('Ext.tree.Column', {
  11     extend: 'Ext.grid.column.Column',
  12     alias: 'widget.treecolumn',
  13
  14     initComponent: function() {
  15         var origRenderer = this.renderer || this.defaultRenderer,
  16             origScope    = this.scope || window;
  17
  18         this.renderer = function(value, metaData, record, rowIdx, colIdx, store, view) {
  19             var buf   = [],
  20                 format = Ext.String.format,
  21                 depth = record.getDepth(),
  22                 treePrefix  = Ext.baseCSSPrefix + 'tree-',
  23                 elbowPrefix = treePrefix + 'elbow-',
  24                 expanderCls = treePrefix + 'expander',
  25                 imgText     = '<img src="{1}" class="{0}" />',
  26                 checkboxText= '<input type="button" role="checkbox" class="{0}" {1} />',
  27                 formattedValue = origRenderer.apply(origScope, arguments),
  28                 href = record.get('href'),
  29                 target = record.get('hrefTarget'),
  30                 cls = record.get('cls');
  31
  32             while (record) {
  33                 if (!record.isRoot() || (record.isRoot() && view.rootVisible)) {
  34                     if (record.getDepth() === depth) {
  35                         buf.unshift(format(imgText,
  36                             treePrefix + 'icon ' +
  37                             treePrefix + 'icon' + (record.get('icon') ? '-inline ' : (record.isLeaf() ? '-leaf ' : '-parent ')) +
  38                             (record.get('iconCls') || ''),
  39                             record.get('icon') || Ext.BLANK_IMAGE_URL
  40                         ));
  41                         if (record.get('checked') !== null) {
  42                             buf.unshift(format(
  43                                 checkboxText,
  44                                 (treePrefix + 'checkbox') + (record.get('checked') ? ' ' + treePrefix + 'checkbox-checked' : ''),
  45                                 record.get('checked') ? 'aria-checked="true"' : ''
  46                             ));
  47                             if (record.get('checked')) {
  48                                 metaData.tdCls += (' ' + Ext.baseCSSPrefix + 'tree-checked');
  49                             }
  50                         }
  51                         if (record.isLast()) {
  52                             if (record.isLeaf() || (record.isLoaded() && !record.hasChildNodes())) {
  53                                 buf.unshift(format(imgText, (elbowPrefix + 'end'), Ext.BLANK_IMAGE_URL));
  54                             } else {
  55                                 buf.unshift(format(imgText, (elbowPrefix + 'end-plus ' + expanderCls), Ext.BLANK_IMAGE_URL));
  56                             }
  57
  58                         } else {
  59                             if (record.isLeaf() || (record.isLoaded() && !record.hasChildNodes())) {
  60                                 buf.unshift(format(imgText, (treePrefix + 'elbow'), Ext.BLANK_IMAGE_URL));
  61                             } else {
  62                                 buf.unshift(format(imgText, (elbowPrefix + 'plus ' + expanderCls), Ext.BLANK_IMAGE_URL));
  63                             }
  64                         }
  65                     } else {
  66                         if (record.isLast() || record.getDepth() === 0) {
  67                             buf.unshift(format(imgText, (elbowPrefix + 'empty'), Ext.BLANK_IMAGE_URL));
  68                         } else if (record.getDepth() !== 0) {
  69                             buf.unshift(format(imgText, (elbowPrefix + 'line'), Ext.BLANK_IMAGE_URL));
  70                         }
  71                     }
  72                 }
  73                 record = record.parentNode;
  74             }
  75             if (href) {
  76                 formattedValue = format('<a href="{0}" target="{1}">{2}</a>', href, target, formattedValue);
  77             }
  78             if (cls) {
  79                 metaData.tdCls += ' ' + cls;
  80             }
  81             return buf.join("") + formattedValue;
  82         };
  83         this.callParent(arguments);
  84     },
  85
  86     defaultRenderer: function(value) {
  87         return value;
  88     }
  89 });