/**
 * This class is created by a {@link Ext.grid.Grid grid} to manage each record. Rows act
 * as containers for {@link Ext.grid.cell.Base cells}.
 *
 * Row does not extend {@link Ext.Container} to keep overhead to a minimum. Application
 * code should not need to create instances of this class directly. Rows are created by
 * the {@link Ext.dataview.List} base as configured by {@link Ext.grid.Grid}.
 */
Ext.define('Ext.grid.Row', {
    extend: 'Ext.Component',
    xtype: 'gridrow',
 
    requires: [
        'Ext.grid.cell.Cell',
        'Ext.grid.RowBody'
    ],
 
    mixins: [
        'Ext.mixin.Queryable',
        'Ext.dataview.GenericItem',
        'Ext.dataview.Pinnable'
    ],
 
    isGridRow: true,
    isRecordRefreshable: true,
    hasGridCells: true,
 
    cachedConfig: {
        collapsed: true
    },
 
    config: {
        /**
         * @cfg {Object} body
         * A config object for this row's {@link Ext.grid.RowBody Row Body}.
         * When a {@link Ext.grid.plugin.RowExpander Row Expander} is used all row bodies
         * begin collapsed, and can be expanded by clicking on the row expander icon.
         * When no Row Expander is present row bodies are always expanded by default but
         * can be collapsed programmatically using {@link #collapse}.
         *
         * Be aware that if you specify a row body, the owning grid is automatically configured
         * with `{@link Ext.dataview.List#variableHeights}: true`.
         */
        body: null,
 
        /**
         * @cfg {String} expandedField
         * The name of a `boolean` field in the grid's record which is to be used to check
         * expanded state.
         *
         * Note that this field should be `true` to indicate expanded, and `false` to
         * indicate collapsed. By default the expanded state of a record is stored on the
         * associated `grid` component allowing that record to have different expand/collapse
         * states on a per-grid basis.
         */
        expandedField: null,
 
        /**
         * @cfg {String} defaultCellUI
         * A default {@link #ui ui} to use for {@link Ext.grid.cell.Base cells} in this row.
         */
        defaultCellUI: null,
 
        /**
         * @private
         */
        stickyVisibility: null,
 
        /**
         * @cfg {Boolean} flexbox
         * Set to true to use a flexbox layout instead of table. This allows for cells to
         * be configured with flex sizing.
         */
        flexbox: false
    },
 
    classCls: [
        Ext.baseCSSPrefix + 'listitem',
        Ext.baseCSSPrefix + 'gridrow'
    ],
 
    inheritUi: true,
 
    expandedCls: Ext.baseCSSPrefix + 'expanded',
 
    flexboxCls: Ext.baseCSSPrefix + 'flexbox',
 
    element: {
        reference: 'element',
        children: [{
            reference: 'cellsElement',
            className: Ext.baseCSSPrefix + 'cells-el'
        }]
    },
 
    constructor: function(config) {
        this.cells = [];
        this.columnMap = {};
 
        this.callParent([config]);
    },
 
    updateFlexbox: function(value) {
        this.cellsElement.el.toggleCls(this.flexboxCls, value);
    },
 
    doDestroy: function() {
        var me = this;
 
        me.setRecord(null);
        me.setBody(null);
        me.cells = Ext.destroy(me.cells);
 
        me.callParent();
    },
 
    /**
     * Collapses the row {@link #body}
     */
    collapse: function() {
        this.setCollapsed(true);
    },
 
    /**
     * Expands the row {@link #body}
     */
    expand: function() {
        this.setCollapsed(false);
    },
 
    toggleCollapsed: function() {
        this.setCollapsed(!this.getCollapsed());
    },
 
    updateCollapsed: function(collapsed) {
        var me = this,
            body = me.getBody(),
            grid = me.getParent(),
            record = me.getRecord(),
            expandField = me.getExpandedField(),
            expandedCls = me.expandedCls,
            expanderCell = me.expanderCell,
            recordsExpanded;
 
        // Set state correctly before any other code executes which may read this.
        if (record) {
            // We have to track the state separately, if we are not using a record
            // field to track expanded state.
            if (expandField) {
                record.set(expandField, !collapsed);
            }
            else {
                recordsExpanded = grid.$recordsExpanded || (grid.$recordsExpanded = {});
 
                if (collapsed) {
                    delete recordsExpanded[record.internalId];
                }
                else {
                    recordsExpanded[record.internalId] = true;
                }
            }
        }
 
        if (expanderCell) {
            expanderCell.setCollapsed(collapsed);
        }
 
        if (body) {
            if (collapsed) {
                body.hide();
                me.removeCls(expandedCls);
            }
            else {
                body.show();
                me.addCls(expandedCls);
            }
        }
    },
 
    // // Rows shrinkwrap content, so no callParent.
    // // However their headers must be widthed.
    // updateWidth: function(width) {
    //     // Do not trigger its creation, just see if we have one.
    //     var header = this.getConfig('header', false, true);
    //
    //     if (header) {
    //         header.setWidth(width);
    //     }
    // },
 
    applyBody: function(config, existing) {
        return Ext.updateWidget(existing, config, this, 'createBody');
    },
 
    createBody: function(body) {
        return Ext.merge({
            xtype: 'rowbody',
            ownerCmp: this,
            row: this,
            hidden: true
        }, body);
    },
 
    updateBody: function(body) {
        var me = this,
            grid = me.getParent();
 
        if (body) {
            me.bodyElement.appendChild(body.element);
 
            if (me.rendered && !body.rendered) {
                body.setRendered(true);
            }
        }
 
        if (grid) {
            grid.setVariableHeights(true);
 
            if (!grid.hasRowExpander) {
                me.expand();
            }
        }
    },
 
    onAdded: function(grid) {
        var me = this,
            cells = me.cells,
            cell, col, columns, i, k, n;
 
        me.callParent(arguments);
 
        if (grid) {
            columns = grid.getColumns();
 
            for (i = 0, n = columns.length; i < n; i++) {
                cell = cells[i];
                col = columns[i];
 
                // Rows can be removed and added back (due to itemCache), so make sure
                // the cells (if they exist) have the proper column. If not, we need to
                // remove all cells from that index to the end. We do that backwards to
                // make things more efficient.
                if (cell) {
                    if (cell.getColumn() === col) {
                        continue; // keep what we can
                    }
 
                    for (k = cells.length; k-- > i; /* empty */) {
                        cell = cells[k];
                        me.removeColumn(cell.getColumn());
                    }
                }
 
                me.addColumn(columns[i]);
            }
        }
    },
 
    addColumn: function(column) {
        this.insertColumn(this.cells.length, column);
    },
 
    /**
     * Returns the cells owned by this Row.
     *
     * Optionally filters the results by the passed {@link Ext.ComponentQuery
     * ComponentQuery} selector.
     * @param {String} [selector] The {@link Ext.ComponentQuery ComponentQuery} selector
     * to filter the results by.
     * @returns {Ext.grid.cell.Cell[]} The matching cells.
     */
    getCells: function(selector) {
        return selector ? Ext.ComponentQuery.query(selector, this.cells) : this.cells;
    },
 
    getRefItems: function(deep) {
        var result = [],
            body = this.getConfig('body', false, true),  // Don't initialize lazy
            cells = this.cells,
            len = cells && cells.length,
            i, cell;
 
        for (i = 0; i < len; i++) {
            cell = cells[i];
            result.push(cell);
 
            if (deep && cell.getRefItems) {
                result.push.apply(result, cell.getRefItems());
            }
        }
 
        if (body) {
            result.push(body);
 
            if (deep && body.getRefItems) {
                result.push.apply(result, body.getRefItems());
            }
        }
 
        return result;
    },
 
    insertColumn: function(index, column) {
        var me = this,
            cells = me.cells,
            cell;
 
        if (column.isHeaderGroup) {
            return;
        }
 
        cell = me.createCell(column);
 
        if (index >= cells.length) {
            me.cellsElement.appendChild(cell.element);
            cells.push(cell);
        }
        else {
            cell.element.insertBefore(cells[index].element);
            cells.splice(index, 0, cell);
        }
 
        me.columnMap[column.getId()] = cell;
 
        if (cell.isExpanderCell) {
            me.expanderCell = cell;
        }
 
        if (me.rendered) {
            cell.setRendered(true);
        }
    },
 
    insertColumnBefore: function(column, ref) {
        var me = this,
            map = me.columnMap,
            id = column.getId(),
            cell = map[id],
            cells = me.cells,
            refCell, refIndex, index;
 
        if (ref) {
            refCell = me.getCellByColumn(ref);
            refIndex = cells.indexOf(refCell);
        }
        else {
            refIndex = cells.length - (cell ? 1 : 0);
        }
 
        if (cell) {
            // Moving an existing column
            index = cells.indexOf(cell);
            Ext.Array.move(cells, index, refIndex);
 
            if (refCell) {
                cell.element.insertBefore(refCell.element);
            }
            else {
                me.cellsElement.appendChild(cell.element);
            }
        }
        else {
            me.insertColumn(refIndex, column);
        }
    },
 
    removeColumn: function(column) {
        var me = this,
            columnMap = me.columnMap,
            columnId = column.getId(),
            cell = columnMap[columnId];
 
        if (cell) {
            Ext.Array.remove(me.cells, cell);
            delete columnMap[columnId];
            cell.destroy();
        }
    },
 
    updateRecord: function(record) {
        if (!this.destroyed && !this.destroying) {
            this.refresh();
        }
    },
 
    setColumnWidth: function(column) {
        var cell = this.getCellByColumn(column);
 
        if (cell) {
            cell.setWidth(column.getComputedWidth());
        }
    },
 
    showColumn: function(column) {
        this.setCellHidden(column, false);
    },
 
    hideColumn: function(column) {
        this.setCellHidden(column, true);
    },
 
    getCellByColumn: function(column) {
        return this.columnMap[column.getId()];
    },
 
    getColumnByCell: function(cell) {
        return cell.getColumn();
    },
 
    updateStickyVisibility: function(value) {
        this.fireEvent('stickyvisiblitychange', value);
    },
 
    refresh: function(context) {
        var me = this,
            cells = me.cells,
            body = me.getBody(),
            len = cells.length,
            expandField = me.getExpandedField(),
            grid = me.getParent(),
            sm = grid.getSelectable(),
            selection = sm.getSelection(),
            isCellSelection = selection.isCells || selection.isColumns,
            i, visibleIndex, cell, record, recordsExpanded;
 
        // Allows cells/body to know we are bulk updating so they can avoid
        // things like calling record.getData(true) multiple times.
        me.refreshContext = context = me.beginRefresh(context);
 
        record = context.record;
 
        me.syncDirty(record);
 
        for (i = 0, visibleIndex = 0; i < len; ++i) {
            cell = cells[i];
 
            if (!context.summary || !cell.getColumn().getIgnore()) {
                if (cell.getRecord() === record) {
                    cell.refresh(context);
                }
                else {
                    cell.refreshContext = context;
                    cell.setRecord(record);
                    cell.refreshContext = null;
                }
 
                if (isCellSelection) {
                    cell.toggleCls(grid.selectedCls,
                                   sm.isCellSelected(me._recordIndex, visibleIndex));
                }
            }
 
            // Cell and column selection work on visible index.
            if (!cell.isHidden()) {
                visibleIndex++;
            }
        }
 
        context.cell = context.column = context.dataIndex = context.scope = null;
 
        if (body) {
            body.refreshContext = context;
 
            if (body.getRecord() === record) {
                body.updateRecord(record);
            }
            else {
                body.setRecord(record);
            }
 
            body.refreshContext = null;
 
            // If the plugin knows that the record contains an expanded flag
            // ensure our state is synchronized with our record.
            // Maintainer: We are testing the result of the assignment of expandedField
            // in order to avoid a messy, multiple level if...else.
            if (expandField) {
                me.setCollapsed(!record.get(expandField));
            }
            else {
                recordsExpanded = grid.$recordsExpanded || (grid.$recordsExpanded = {});
 
                if (grid.hasRowExpander) {
                    me.setCollapsed(!recordsExpanded[record.internalId]);
                }
            }
        }
 
        me.refreshContext = null;
    },
 
    privates: {
        refreshContext: null,
 
        beginRefresh: function(context) {
            var me = this,
                grid = me.getParent();
 
            context = context || {};
 
            //<debug>
            context.from = context.from || 'row';
            //</debug>
            context.grid = grid;
            context.record = me.getRecord();
            context.row = me;
            context.store = grid.store;
 
            return context;
        },
 
        createCell: function(column) {
            var cell = column.createCell(this);
 
            cell = Ext.create(cell);
            delete cell.$initParent;
 
            if (cell.inheritUi) {
                cell.doInheritUi();
            }
 
            // The cell element must accept focus for navigation to occur.
            // The cell component must not be focusable. It must not participate in a
            // FocusableContainer relationship with the List's container,
            // and must not react to focus events or its focus API itself.
            // It is a slave of the NavigationModel.
            cell.el.setTabIndex(-1);
 
            return cell;
        },
 
        setCellHidden: function(column, hidden) {
            var cell = this.getCellByColumn(column);
 
            if (cell) {
                cell.setHidden(hidden);
            }
        },
 
        getGrid: function() {
            return this.grid || this.getParent();  // backwards compat
        }
    }
});