Ext.namespace( 'instore.extlib.ui.grid' );

instore.extlib.ui.grid.FilterBarPlugin = function(filterConfigs) {
  if(filterConfigs)
    this.filterConfigs = Ext.isArray(filterConfigs) ? filterConfigs : [filterConfigs];
  else
    return;
};

instore.extlib.ui.grid.FilterBarPlugin.prototype = {
  grid: null,

  setFilterValue: function(filterName, filterValue) {
    if(this[filterName])
      this[filterName].setValue(filterValue);
  },

  doFilter: function() {
    var filterParams = [];
    Ext.each(this.filterFields, function(field) {
      var value = field.getValue();
      if(value != null && value !== "")
        filterParams.push({property: field.filterTarget, value: value});
    });
    this.params.start = 0; //vpol: set the start of fetch result to 0, because the start page must be reset when using the filter bar
    this.load({searchParams: filterParams});
  },

  resetFilters: function() {
    Ext.each(this.filterFields, function(field) { field.setValue(null); });
  },

  addFilterField: function(config) {
    if(config.xtype && config.filterTarget) {
      Ext.applyIf(config, {width: 100});

      if(config.xtype == "combo") {
        Ext.applyIf(config, {triggerAction: "all"});
        if(!config.store || !Ext.isArray(config.store)) {
          Ext.apply(config, {store: [[]]});
          this.grid.on("afterloaddata", function(grid, store) {
            if(grid[config.id])
              grid[config.id].store.loadData(store.fields.get(config.filterTarget.split('.')[0]).editorConfig.store);
          });
        }
      } else if(config.xtype == "datefield")
        Ext.apply(config, {format: 'd/m/Y'});

      var field = Ext.ComponentMgr.create(config, "textfield");
      instore.extlib.ui.util.Util.assignSpecialKeys(field, this.grid.doFilter);
  
      this.grid[config.id] = field;
      this.grid.filterFields.push(this.grid[config.id]);
    }
  },

  alterGridTopToolbar: function() {
    var tbarorig = this.grid.getTopToolbar();
    if(tbarorig && this.grid.filterFields) {
      tbarorig.id = "tbarorig";
      Ext.ComponentMgr.register(tbarorig);

      var searchBarItems = [{xtype: "tbtext", text: instore.enat.Messages.labels.search}];
      Ext.each(this.grid.filterFields, function(field) {
        searchBarItems.push(field);
        searchBarItems.push({xtype: "tbspacer"});
      })
      searchBarItems.push({id: "clearBtn", text: instore.extlib.ui.Messages.buttons.clear, handler: function() { this.grid.resetFilters(); this.grid.doFilter(); }, scope: this});

      this.grid.topToolbar = new Ext.Panel({items: [ tbarorig, new Ext.Toolbar({items: searchBarItems }) ]});
      this.grid.getTopToolbar = function() { return Ext.getCmp("tbarorig"); }
    }
  },

  init: function(grid) {
    Ext.apply(grid, {
      filterFields: [],
      doFilter: this.doFilter.createDelegate(grid),
      resetFilters: this.resetFilters.createDelegate(grid),
      setFilterValue: this.setFilterValue.createDelegate(grid)
    });
    this.grid = grid;

    Ext.each(this.filterConfigs, function(config) { this.addFilterField(config); }.createDelegate(this));
    this.alterGridTopToolbar();
  }
};