/**
 * Ext.ux.ip2.dmd.columnsExplorer.Explorer
 * UX that uses the CreateGrid and TreeView of columns
 * @extend Ext.tab.Panel
 *
 * @requires {@link Ext.ux.ip2.dmd.columnsExplorer.PropertyGrid}
 * @requires {@link Ext.ux.ip2.dmd.columnsExplorer.Tree}

 * @alias dmdColumnsExplorer
 * 
 */

Ext.define('Ext.ux.dmd.columnsexplorer.Explorer', {

	requires: [
		'Ext.ux.dmd.columnsexplorer.PropertyGrid',
		'Ext.ux.dmd.columnsexplorer.Tree'
	],

	extend: 'Ext.tab.Panel',
	alias: ['widget.dmdColumnsExplorer'],

	layout: 'fit',

	/**
	 * @method addColumns
	 * Loads a column into the tree of the explorer panel - mapped to the tree component
	 *
	 * @param {Array/Boolean} [columns=null] The columns object to load, clears the current columns if null or no argument is passed
	 * 
	 * @chainable
	 */
	addColumns: function(columns) {

		columns || ( columns = null );

		var columnsExplorer = this,
			tree = columnsExplorer.down('[name="tree"]');

		tree.loadColumns.apply(tree, arguments);

		return columnsExplorer;
	},


	/**
	 * @method insertColumn
	 * Insert a single column object into the tree - mapped to the tree component
	 *
	 * @param {Object} column A single column object to insert
	 * @param {Number} [index] A index number to use for inserting the column object, if none is supplied object is inserted last
	 * 
	 * @chainable
	 */
	insertColumn: function(column, index) {
		
		var columnsExplorer = this,
			tree = columnsExplorer.down('[name="tree"]');

		return tree.insertColumn.apply(tree, arguments);		
	},


	/**
	 * @method getColumns
	 * Get the columns object back from the explorer - mapped to the tree component
	 *
	 * @return {Array} columns The columns array
	 */
	getColumns: function() {
		
		var columnsExplorer = this,
			tree = columnsExplorer.down('[name="tree"]');

		return tree.getColumns.apply(tree, arguments);
	},


	items: [
		{
			xtype: 'dmdColumnsTree',
			title: 'View',
			name: 'tree'
		},{
			xtype: 'dmdColumnsPropertyGrid',
			title: 'Create',
			name: 'propertygrid'
		}
	],

	initComponent: function() {

		this.callParent(arguments);

		var columnsExplorer = this,
			propertygrid = columnsExplorer.down('[name="propertygrid"]'),
			tree = columnsExplorer.down('[name="tree"]');

		propertygrid.on('createColumn', function() {
			console.log('hit');
		});

	}
});