add extjs 6.0.1 sources

[extjs.git] / extjs / packages / ux / classic / src / grid / TransformGrid.js

/**\r
 * A Grid which creates itself from an existing HTML table element.\r
 */\r
Ext.define('Ext.ux.grid.TransformGrid', {\r
    extend: 'Ext.grid.Panel',\r
\r
    /**\r
     * Creates the grid from HTML table element.\r
     * @param {String/HTMLElement/Ext.Element} table The table element from which this grid will be created -\r
     * The table MUST have some type of size defined for the grid to fill. The container will be\r
     * automatically set to position relative if it isn't already.\r
     * @param {Object} [config] A config object that sets properties on this grid and has two additional (optional)\r
     * properties: fields and columns which allow for customizing data fields and columns for this grid.\r
     */\r
    constructor: function(table, config) {\r
        config = Ext.apply({}, config);\r
        table = this.table = Ext.get(table);\r
\r
        var configFields = config.fields || [],\r
            configColumns = config.columns || [],\r
            fields = [],\r
            cols = [],\r
            headers = table.query("thead th"),\r
            i = 0,\r
            len = headers.length,\r
            data = table.dom,\r
            width,\r
            height,\r
            store,\r
            col,\r
            text,\r
            name;\r
\r
        for (; i < len; ++i) {\r
            col = headers[i];\r
\r
            text = col.innerHTML;\r
            name = 'tcol-' + i;\r
\r
            fields.push(Ext.applyIf(configFields[i] || {}, {\r
                name: name,\r
                mapping: 'td:nth(' + (i + 1) + ')/@innerHTML'\r
            }));\r
\r
            cols.push(Ext.applyIf(configColumns[i] || {}, {\r
                text: text,\r
                dataIndex: name,\r
                width: col.offsetWidth,\r
                tooltip: col.title,\r
                sortable: true\r
            }));\r
        }\r
\r
        if (config.width) {\r
            width = config.width;\r
        } else {\r
            width = table.getWidth() + 1;\r
        }\r
\r
        if (config.height) {\r
            height = config.height;\r
        }\r
\r
        Ext.applyIf(config, {\r
            store: {\r
                data: data,\r
                fields: fields,\r
                proxy: {\r
                    type: 'memory',\r
                    reader: {\r
                        record: 'tbody tr',\r
                        type: 'xml'\r
                    }\r
                }\r
            },\r
            columns: cols,\r
            width: width,\r
            height: height\r
        });\r
        this.callParent([config]);\r
        \r
        if (config.remove !== false) {\r
            // Don't use table.remove() as that destroys the row/cell data in the table in\r
            // IE6-7 so it cannot be read by the data reader.\r
            data.parentNode.removeChild(data);\r
        }\r
    },\r
\r
    onDestroy: function() {\r
        this.callParent();\r
        this.table.remove();\r
        delete this.table;\r
    }\r
});