/**
 *
 * This plugin allows the user to configure the pivot grid using drag and drop.
 */
Ext.define('Ext.pivot.plugin.Configurator', {
    alternateClassName: [
        'Mz.pivot.plugin.Configurator'
    ],
 
    extend: 'Ext.AbstractPlugin',
 
    requires: [
        'Ext.util.DelayedTask',
        'Ext.menu.Menu',        
        'Ext.menu.CheckItem',        
        'Ext.pivot.plugin.configurator.Panel'
    ],
 
    alias: [
        'plugin.pivotconfigurator',
        'plugin.mzconfigurator'
    ],
    
    /**
     * @cfg {Array} fields This is the array of fields you want to be used in the configurator.
     * Each field is an object with the following properties: dataIndex, header.
     * If no fields are defined then all fields are fetched from the store model if
     * a {@link Ext.pivot.matrix.Local Local} matrix is used.
     *
     */
    fields:         [],
    
    /**
     * @cfg {Number} refreshDelay Number of miliseconds to wait for pivot refreshing when a config change occurred.
     */
    refreshDelay:   300,
 
    /**
     * @cfg {String} dock Docking position for the configurator panel. Possible values: top, right, bottom, left
     */
    dock: 'right',
 
    /**
     * @cfg {Boolean} collapsible Is the configurator panel collapsible?
     */
    collapsible: true,
 
    /**
     *  `"both"` (the default) - The plugin is added to both grids
     *  `"top"` - The plugin is added to the containing Panel
     *  `"locked"` - The plugin is added to the locked (left) grid
     *  `"normal"` - The plugin is added to the normal (right) grid
     *
     * @private
     */
    lockableScope:  'top',
 
    init: function(grid) {
        var me = this;
 
        //<debug> 
        // this plugin is available only for the pivot grid 
        if (!grid.isPivotGrid) {
            Ext.raise('This plugin is only compatible with Ext.pivot.Grid');
        }
        //</debug> 
 
        me.pivot = grid;
        me.fields = Ext.Array.from(me.fields);
 
        me.pivotListeners = me.pivot.on({
            beforerender:   me.onBeforeGridRendered,
            afterrender:    me.onAfterGridRendered,
            single:         true,
            scope:          me,
            destroyable:    true
        });
 
        me.callParent(arguments);
    },
 
    /**
     * @private
     * AbstractComponent calls destroy on all its plugins at destroy time.
     */
    destroy: function() {
        var me = this;
 
        Ext.destroyMembers(me, 'configCt', 'pivotListeners');
 
        me.pivot = me.fields = me.pivotListeners = me.configCt = null;
 
        me.callParent(arguments);
    },
    
    /**
     * Enable the plugin to show the configurator panel.
     *
     */
    enable: function() {
        var me = this;
 
        me.disabled = false;
        
        if(me.configCt){
            me.configCt.enable();
        }
        me.pivot.fireEvent('showconfigpanel', me.configCt);
    },
    
    /**
     * Disable the plugin to hide the configurator panel.
     *
     */
    disable: function() {
        var me = this;
 
        me.disabled = true;
        
        if(me.configCt){
            me.configCt.disable();
        }
        me.pivot.fireEvent('hideconfigpanel', me.configCt);
    },
    
    onBeforeGridRendered: function(){
        this.setDock(this.dock);
 
        /**
         * Fired on the pivot grid when the configuration changes.
         * Return false if you don't want to apply the new configuration to the pivot grid.
         *
         * @event configchange
         * @param {Ext.pivot.plugin.Configurator} panel
         * @param {Object} config 
         */
 
        /**
         * @event showconfigpanel
         * @param {Ext.pivot.plugin.configurator.Panel} panel
         */
 
        /**
         * @event hideconfigpanel
         * @param {Ext.pivot.plugin.configurator.Panel} panel
         */
 
    },
    
    onAfterGridRendered: function(){
        if(this.disabled === true){
            this.disable();
        }else{
            this.enable();
        }
    },
 
    /**
     * Change configurator panel position.
     *
     * @param {String} position Possible values: top, right, bottom, left.
     */
    setDock: function(position){
        var me = this,
            exists = Ext.isDefined(me.configCt);
 
        Ext.destroy(me.configCt);
        me.configCt = me.pivot.addDocked({
            xtype:          'pivotconfigpanel',
            dock:           position || me.dock,
            grid:           me.pivot,
            fields:         me.fields,
            refreshDelay:   me.refreshDelay,
            collapsible:    me.collapsible
        })[0];
 
        if(exists) {
            // we only initialize the fields if docking is changed 
            me.configCt.initPivotFields();
        }
    }
    
 
});