Ext.override(Ext.grid.ColumnModel,{
    getColumnType : function(index){
        return this.config[index].type;
    }
});

Ext.ns('Ext.ux.grid');

Ext.ux.grid.DemonFilter = function(config) {
	
	Ext.apply(this, config);
	this.addEvents(
		'show'
		,'cancel'
		,'submit'
		,'reset'
	);
	Ext.ux.grid.DemonFilter.superclass.constructor.call(this);

	var type;
	var fieldSetFilterValue = new Ext.form.FieldSet({
		title: this.valueTitle,
		collapsed: false,
		columnWidth: 0.39,
		style: 'margin:2px 2px 2px 2px;padding:5px;',
		listeners: {
			render: function(){
				var dis;
				for (i = 1, j = 2; i <= this.defaultFields; i++, j++) {
					if (i == 1) {
						dis = false;
					}
					else {
						dis = true;
					}
					type = 'textfield';
					fieldSetFilterValue.add(Ext.ComponentMgr.create({
						name: 'textFieldFilterValue' + i,
						width: 240,
						hideLabel: true,
						disabled: dis,
						allowBlank: false
					}, type))
				}
			},
			scope: this
		}
	
	});
	

	
	var simpleStoreFilterCondition = new Ext.data.SimpleStore({
		fields: ['condition', 'label'],
		data: [['<=', '<='], ['<>', '<>'], ['==', '=='], ['*=', '*='], ['=*', '=*'], ['*=*', '*=*']]
	});
	
	var fieldSetFilterCondition = new Ext.form.FieldSet({
		title: this.conditionTitle,
		collapsed: false,
		columnWidth: 0.10,
		style: 'margin:2px 2px 2px 2px;padding:5px;',
		listeners: {
			render: function(){
				var dis;
				for (i = 1, j = 2; i <= this.defaultFields; i++, j++) {
					if (i == 1) {
						dis = false;
					}
					else {
						dis = true;
					}
					type = 'combo';
					fieldSetFilterCondition.add(Ext.ComponentMgr.create({
						store: simpleStoreFilterCondition,
						mode: 'local',
						name: 'comboBoxFilterCondition' + i,
						displayField: 'condition',
						valueField: 'label',
						width: 50,
						bodyStyle: 'padding:5px',
						forceSelection: true,
						selectOnFocus: true,
						triggerAction: 'all',
						editable: false,
						hideLabel: true,
						allowBlank: false,
						disabled: dis
					}, type))
				}
			},
			scope: this
		}
	
	});
	
	var simpleStoreFilterConditionSpecial = new Ext.data.SimpleStore({
		fields: ['condition', 'label'],
		data: [['', ''],[this.andText, 'AND'], [this.orText, 'OR']]
	});
	

	var fieldSetFilterConditionSpecial = new Ext.form.FieldSet({
		title: this.conditionSpecialTitle,
		collapsed: false,
		columnWidth: 0.10,
		style: 'margin:2px 2px 2px 2px;padding:5px;',
		listeners: {
			render: function(){
				var dis;
				for (i = 1, j = 2; i <= this.defaultFields; i++, j++) {
					if (i == 1) {
						dis = false;
					}
					else {
						dis = true;
					}
					type = 'combo';
					fieldSetFilterConditionSpecial.add(Ext.ComponentMgr.create({
						store: simpleStoreFilterConditionSpecial,
						mode: 'local',
						name: 'textFieldFilterValue' + i,
						displayField: 'condition',
						valueField: 'label',
						hiddenName: 'comboBoxFilterConditionSpecial' + i,
						width: 50,
						bodyStyle: 'padding:5px',
						forceSelection: true,
						selectOnFocus: true,
						triggerAction: 'all',
						editable: false,
						allowBlank: true,
						hideLabel: true,
						disabled: dis,
						scope: this,
						listeners: {
							select: function(comboBox){
								if (comboBox.getValue() == '') {
									for (i = comboBox.name.substr(-1); i <= fieldSetFilterValue.items.items.length; i++) {
										if (fieldSetFilterConditionSpecial.items.items.length != i) {
											fieldSetFilterConditionSpecial.items.items[i].disable();
											fieldSetFilterConditionSpecial.items.items[i].reset();
											fieldSetFilterColumn.items.items[i].disable();
											fieldSetFilterColumn.items.items[i].reset();
											fieldSetFilterCondition.items.items[i].disable();
											fieldSetFilterCondition.items.items[i].reset();
											fieldSetFilterValue.items.items[i].disable();
											fieldSetFilterValue.items.items[i].reset();
										}
									}
								}
								else {
									if (fieldSetFilterConditionSpecial.items.items.length != comboBox.name.substr(-1)) {
										fieldSetFilterConditionSpecial.items.items[comboBox.name.substr(-1)].enable();
										fieldSetFilterColumn.items.items[comboBox.name.substr(-1)].enable();
										fieldSetFilterCondition.items.items[comboBox.name.substr(-1)].enable();
										fieldSetFilterValue.items.items[comboBox.name.substr(-1)].enable();
									}
								}
							}
						}
					}, type))
				}
			},
			scope: this
		}
	});
	
	var comboBoxFilterColumn1 = new Ext.form.ComboBox({
		store: new Ext.data.SimpleStore({
			fields: ['header', 'column']
		}),
		mode: 'local',
		name: 'comboBoxFilterColumn1',
		displayField: 'header',
		valueField: 'column',
		width: 250,
		triggerAction: 'all',
		editable: false,
		allowBlank: true,
		hideLabel: true,
		listeners: {
			render: function(comboBox){
				var not = ['expander', 'checker', 'numberer', 'actions'];
				var data = [];
				for (var i = 0, n = this.colModel.getColumnCount(); i < n; i++) {
					if (not.indexOf(this.colModel.getColumnId(i)) == -1) {
						data[data.length] = [this.colModel.getColumnHeader(i), this.colModel.getColumnId(i)];
					}
				}
				comboBox.getStore().loadData(data);
			},
			scope: this
		}
	});
	
	var fieldSetFilterColumn = new Ext.form.FieldSet({
		title: this.columnTitle,
		collapsed: false,
		columnWidth: 0.40,
		style: 'margin:2px 2px 2px 2px;padding:5px;',
		listeners: {
			render: function(){
				var dis;
				for (i = 1, j = 2; i <= this.defaultFields; i++, j++) {
					if (i == 1) {
						dis = false;
					}
					else {
						dis = true;
					}
					type = 'combo';
					fieldSetFilterColumn.add(Ext.ComponentMgr.create({
						store: new Ext.data.SimpleStore({
							fields: ['header', 'column']
						}),
						mode: 'local',
						name: 'comboBoxFilterColumn' + i,
						displayField: 'header',
						valueField: 'column',
						width: 250,
						triggerAction: 'all',
						editable: false,
						allowBlank: false,
						disabled: dis,
						hideLabel: true,
						listeners: {
							render: function(comboBox){
								var not = ['expander', 'checker', 'numberer', 'actions'];
								var data = [];
								for (var i = 0, n = this.colModel.getColumnCount(); i < n; i++) {
									if (not.indexOf(this.colModel.getColumnId(i)) == -1) {
										data[data.length] = [this.colModel.getColumnHeader(i), this.colModel.getColumnId(i)];
									}
								}
								comboBox.getStore().loadData(data);
							},
							scope: this
						}
					}, type))
				}
			},
			scope: this
		}
	});
	
	var keys = [{
        key     : [10,13],
		scope: this,
        handler: function(){
         this.submit();
      }
    }];
	
	this._formPanel = new Ext.form.FormPanel({
		border: true,
		autoScroll: true,
		layout: 'column',
		keys: keys,
		layoutConfig: {
			columns: 4
		},
		frame: true,
		bodyStyle: 'padding:5px;',
		waitMsgTarget: true,
		items: [fieldSetFilterColumn, fieldSetFilterCondition, fieldSetFilterValue, fieldSetFilterConditionSpecial]
	});
	
	this._spotlight = new Ext.DemonSpotlight({duration:0.1});
	
	this._window = new Ext.ux.DemonWindow({
		title: this.title
		,border: false
		,layout: 'fit'
		,width: 700
		,height: 250
		,resizable: false
		,draggable: true
		,closable: false
		,modal: this.modal
		,iconCls: 'iconFilter'
		,title: this.title
		,items: [this._formPanel]
		,buttons: [
					{
						text: this.searchTitle,
						iconCls: 'iconSearch',
						handler: this.submit,
						scope: this
					}, {
						text: this.closeTitle,
						iconCls: 'iconClose',
						handler: this.hide,
						scope: this
					}, {
						text: this.resetTitle,
						iconCls: 'iconReset',
						handler: this.reset,
						scope: this
					}
		]
	});
	
	this._window.on('show', function(){
		this.fireEvent('show', this);
	}, this);

	this._buttonFilter = new Ext.Button({ 
						xtype:'tbbutton', 
						text: this.titleFilter, 
						iconCls:'iconFilter',
						tooltip :'Filtrowanie tabeli',
						handler: this.show,
						scope: this
	});

	this._buttonReset = new Ext.Button({ 
						xtype:'tbbutton', 
						text:this.titleReset, 
						iconCls:'iconReset',
						tooltip :'Resetowanie filtra',
						handler: this.reset,
						scope: this
	});		
};
 
Ext.extend(Ext.ux.grid.DemonFilter, Ext.util.Observable, {

	defaultFields: 5
    
	,title: 'Filtr Aplikacji'
	
    ,titleFilter: 'Filtr Aplikacji'
	
	,titleReset: 'Resetuj Filtr'

	,columnTitle: 'Kolumna'
	
	,conditionTitle: 'Warunek'
	
	,conditionSpecialTitle: 'AND/OR'
	
	,andText: 'i'
	
	,orText: 'lub'
	
	,valueTitle: 'Wartość'
	
	,searchTitle: 'Szukaj'
	
	,closeTitle: 'Zamknij'
	
	,resetTitle: 'Resetuj'
	
	,modal: false	
	
	,_window: null	
	
	,_spotlight: null
	
	,colModel: null
	
	,_formPanel : null
	
	,_headPanel : null
	
	,init:function (grid) {
        this.grid = grid;
		this.colModel = this.grid.getColumnModel();
		grid.on({
			 scope:this
			,render:this.onRender
		});
		
	}
	
	,show: function(el){
		this._window.show(el);
		if (typeof(this._spotlight) != 'undefined') { this._spotlight.show(); }
	}
	
	,hide: function(){
		if (typeof(this._spotlight) != 'undefined') {this._spotlight.hide(); }
		this._window.hide()
	}
	
	,destroy: function(){
		this._window.hide();
		this.purgeListeners();
		var self = this;
		delete self;
	}
	
	,submit: function(){
			var filters = [];
			for (var i = 0, j = 1; i < this._formPanel.items.items[0].items.items.length; i++, j++) {
				filters[i] = '' +
				this._formPanel.items.items[2].items.items[i].getValue() +
				';' +
				this._formPanel.items.items[0].items.items[i].getValue() +
				';' +
				this._formPanel.items.items[1].items.items[i].getValue() +
				';' +
				this._formPanel.items.items[3].items.items[i].getValue() +
				'';
			}
		this.grid.store.baseParams.filters = filters.join(',');
		this.grid.getBottomToolbar().doRefresh();
	}
	,reset: function(){
		this._formPanel.getForm().reset();
		this.grid.getStore().baseParams.filters	= '';
		this.grid.getStore().reload();
	}	
	
	,onRender:function() {
		this.tbar = this.grid.getTopToolbar();
		this.tbar.add('->');
		this.tbar.add(this._buttonFilter);
		this.tbar.add('-');		
		this.tbar.add(this._buttonReset);
	}

});

Ext.reg('DemonFilter', Ext.ux.grid.DemonFilter);