ExtJs grid cell detalization on ellipsis

Ext.ux.grid.plugin.CellDetalization.js

Ext.define('Ext.ux.grid.plugin.CellDetalization', {
    extend: 'Ext.AbstractPlugin',
    alias: 'plugin.cell-detalization',

    statics: {
        ignoredXTypes: ['commandcolumn', 'componentcolumn', 'imagecommandcolumn', 'actioncolumn', 'header-action']
    },

    constructor: function () {
        var me = this;
        me.callParent(arguments);
        me.metric = new Ext.util.TextMetrics();
    },

    init: function (grid) {
        var me = this;

        grid.on('viewready', function (g) {
            var view = grid.getView();
            me.tip = me.createToolTip(view);
        });
    },

    createToolTip: function (view) {
        var me = this;
        var tooltip = Ext.create('Ext.tip.ToolTip', {
            target: view.el,
            delegate: '.x-grid-cell',
            trackMouse: true,
            renderTo: Ext.getBody(),
            listeners: {
                beforeshow: me.onTipBeforeShow,
                scope: me
            }
        });
        return tooltip;
    },

    onTipBeforeShow: function (tip) {
        var me = this;
        var view = me.getCmp().getView();
        var position = view.getPositionByEvent(tip.triggerEvent);
        var column = position.column;
        if (me.self.ignoredXTypes.reduce(function (x, y) {
            return column.isXType(y) || x;
        }, false)) {
            return false;
        }
        var colIndex = position.colIdx;
        var el = Ext.fly(tip.triggerElement);
        var value = el.down('.x-grid-cell-inner').getHtml();
        if ((view.ownerCt.columns[colIndex].getWidth() || 10) <= (me.metric.getSize(value).width + 15 || 0)) {
            tip.update(value);
            return true;
        }
        return false;
    },

    destroy: function () {
        var me = this;
        me.metric.destroy();
        me.metric = null;
        me.tip.destroy();
        me.tip = null;
        me.callParent(arguments);
    }
})