Ext.namespace('cmv.slider');

cmv.slider.Panel = Ext.extend(Ext.Panel,{
  minValue : 1154901600,//minimum date slider position
  maxValue : new Date().format(Date.patterns.Unix),//maximum date slider position
  startDate: new Date().add(Date.MONTH,-3),//slider 1 handle position
  endDate  : new Date(),//slider 2 handle position
  dtfield1 : undefined,
  dtfield2 : undefined,
  slider   : undefined,
  store    : undefined,//News or Activites
  displayed:false,
  increment: 86400,//Slider incremental step, default 1 day
  constructor: function(config){
    this.slider = new Ext.Slider({
      topThumbZIndex: 1000,//Solves bug, where the second slider knob is visible through modal windows.
      width   : 600,
      values  :[this.minValue,this.maxValue],
      increment: this.increment,
      plugins : [
      new Ext.slider.Tip({
        getText: function(thumb) {
          dt = Date.parseDate(thumb.value,Date.patterns.Unix);
          return Ext.util.Format.capitalize(dt.format(Date.patterns.LongDate));
        }
      })
      ]
    });
    this.dtfield1=new Ext.form.DateField({
      format: Date.patterns.ShortDate
    });
    this.dtfield2=new Ext.form.DateField({
      format: Date.patterns.ShortDate
    });
    config = Ext.apply({
      title:'',
      id:'',
      iconCls: 'icon-grid',
      padding: 20,
      margins: '0 5 0 5',
      collapsible: true,   // make collapsible
      titleCollapse: true,
      autoScroll: true,
      cmargins: '0 5 0 5', // adjust top margin when collapsed
      layout: 'anchor',
      unstyled: false,
      split: false,
      border: true,
      frame:true,
      tbar  : [
      'Sæt dato interval:', ' ',
      this.dtfield1, ' ',
      this.slider, ' ',
      this.dtfield2
      ]
    }, config);
    cmv.slider.Panel.superclass.constructor.call(this, config);
    this.dtfield1.on({
      valid : function( field ){
        var pnl=this.ownerCt.ownerCt;
        pnl.slider.setValue(0, field.getValue().format(Date.patterns.Unix));
        pnl.dtfield2.setMinValue(field.getValue());
      }
    });
    this.dtfield2.on({
      valid : function( field ){
        var pnl=this.ownerCt.ownerCt;
        pnl.slider.setValue(1, field.getValue().format(Date.patterns.Unix));
        pnl.dtfield1.setMaxValue(field.getValue());
      }
    });
    this.dtfield1.setMinValue(Date.parseDate(this.minValue,Date.patterns.Unix));
    this.dtfield1.setValue(this.startDate);
    this.dtfield2.setMaxValue(Date.parseDate(this.maxValue,Date.patterns.Unix));
    this.dtfield2.setValue(this.endDate);
    this.slider.setMinValue(this.minValue);
    this.slider.setMaxValue(this.maxValue);
    this.store.setBaseParam('dt1', this.startDate);
    this.store.setBaseParam('dt2', this.endDate);
    this.slider.on({
      change: {
        buffer: 150,
        fn    : function(){
          var pnl=this.ownerCt.ownerCt;
          var values  = this.getValues();
          var startDate = Date.parseDate(values[0],Date.patterns.Unix);
          var endDate = Date.parseDate(values[1],Date.patterns.Unix);
          pnl.store.setBaseParam('dt1', startDate.format(Date.patterns.ISO8601Date)+' 00:00:00');
          pnl.store.setBaseParam('dt2', endDate.format(Date.patterns.ISO8601Date)+' '+new Date().format(Date.patterns.ISO8601Time));
          pnl.dtfield1.setValue(startDate);
          pnl.dtfield2.setValue(endDate);
          if(pnl.displayed)
            pnl.store.load({
              scope:pnl
            });
        }
      }
    });
    this.store.on({
      load: {
        fn: function(store, record, operation){
          var pnl=operation.scope;
          pnl.removeAll(true);
          this.each(function(record)
          {
            pnl.add(new Ext.Spacer({
              height: 5
            }));
            pnl.add(new cmv.news.Panel({
              record:record
            }));
          });
          pnl.doLayout();
        }
      }
    }
    );
  }
});

Ext.reg('cmvsliderpanel', cmv.slider.Panel);

cmv.slider.ActivityPanel = Ext.extend(cmv.slider.Panel,{
  increment: 604800,
  store2 : undefined,//Helpers
  store3 : undefined,//Routes
  sponsorstore: undefined,
  constructor: function(config){
    config = Ext.apply({},config);
    cmv.slider.ActivityPanel.superclass.constructor.call(this, config);
    this.sponsorstore.setBaseParam('dt1', Date.parseDate(this.minValue,Date.patterns.Unix).format(Date.patterns.ISO8601Long));
    this.sponsorstore.setBaseParam('dt2', Date.parseDate(this.maxValue,Date.patterns.Unix).format(Date.patterns.ISO8601Long));
    this.store2.on({
      load: {
        fn: function(storehelpers, record, operation){
          var pnl=operation.scope;
          pnl.removeAll(true);
          operation.storeact.each(function(record)
          {
            pnl.add(new Ext.Spacer({
              height: 5
            }));
            pnl.add(new cmv.acts.Panel({
              record:record,
              helpersstore: storehelpers,
              sponsorstore: pnl.sponsorstore,
              showmap:(pnl.store3.findExact('idx',record.get('idx'))!=-1)
            }));
          });
          pnl.doLayout();
        }
      }
    }
    );
    this.store.on({
      load: {
        fn: function(storeact, record, operation){
          var pnl=operation.scope;
          pnl.store3.setBaseParam('dt1', storeact.baseParams.dt1);
          pnl.store3.setBaseParam('dt2', storeact.baseParams.dt2);
          pnl.store3.load({
            scope:pnl,
            storeact:pnl.store
          });
        }
      }
    }
    );
    this.store3.on({
      load: {
        fn: function(storeroute, record, operation){
          var pnl=operation.scope;
          var storeact=operation.storeact;
          pnl.store2.setBaseParam('dt1', storeact.baseParams.dt1);
          pnl.store2.setBaseParam('dt2', storeact.baseParams.dt2);
          pnl.store2.load({
            scope:pnl,
            storeact:pnl.store
          });
        }
      }
    }
    );
    this.sponsorstore.on({
      load: {
        fn: function(store, record, operation){
          var pnl=operation.scope;
          pnl.store.load({
            scope:pnl
          });
        }
      }
    }
    );
  }
});

Ext.reg('cmvslideractivitypanel', cmv.slider.ActivityPanel);