lbgm.plpsearchbox = Ext.extend (Ext.form.ComboBox, {
    //store: ds,
    displayField:this.tpl,
    typeAhead: false,
    loadingText: 'Searching...',
    margins: '0 0 0 0',
    width: 242,
    style: 'margin-top:4px',
    pageSize:30,
    minChars:3,
    maxHeight: 300,
    hideTrigger:true,
    triggerAction: 'all',
    //title: 'Please specify your serch criteria (min 4 characters)',
    hideLabel:true,
    //tpl: resultTpl,
    itemSelector: 'div.search-item',
    listWidth: 500,
    initComponent: function(){
        //Ext.applyIf(this, config);

        this.store = new Ext.data.Store({
          proxy: new Ext.data.HttpProxy({
                url: 'src/php/conn/plp.conn.php?key=' + lbgm.layout.key + '&request=searchPlps'
          }),
          reader: new Ext.data.JsonReader({
                totalProperty: "recordCount",
                root: 'Root'
            }, [
                {name: 'code', mapping: 'code'},
                {name: 'altcode', mapping: 'altcode'},
                {name: 'name', mapping: 'name'},
                {name: 'altname', mapping:'altname'}
            ])
        });

        this.tpl = new Ext.XTemplate(
            '<tpl for="."><div class="search-item" Ext:qtip="{code} {name} {altname}">',
                '<p><b>{code}</b> - {name} {altname}</p>',
            '</div></tpl>'
        );
        lbgm.mapsearch.superclass.initComponent.call(this);
    },
    onSelect: function(record){ // override default onSelect to do redirect
        this.clearSearch();
        lbgm.plp.showSinglePlpByCode(record.data.code, record.data.altcode, true);
    },
    clearSearch: function() {
        this.setValue('');
        this.collapse();
    },
    clearSelection: function() {
        Ext.get('search-results').dom.innerHTML = '';
    }
});

Ext.reg('lbgm.plpsearchbox', lbgm.plpsearchbox);







var ds = new Ext.data.Store({
  autoLoad: true,
  baseParams: {"category": ""},
  proxy: new Ext.data.HttpProxy({
        url: 'src/php/conn/plp.conn.php?key=' + lbgm.layout.key + '&request=loadPlpsCombo'
  }),
  reader: new Ext.data.JsonReader({
        totalProperty: "recordCount",
        root: 'Root'
    }, [
        {name: 'code', mapping: 'code'},
        {name: 'name', mapping: 'name'}
    ])
});

var ds2 = new Ext.data.Store({
  autoLoad: true,
  baseParams: {"code": ""},
  proxy: new Ext.data.HttpProxy({
        url: 'src/php/conn/plp.conn.php?key=' + lbgm.layout.key + '&request=loadPlpsComboAlt'
  }),
  reader: new Ext.data.JsonReader({
        totalProperty: "recordCount",
        root: 'Root'
    }, [
        {name: 'id', mapping: 'id'},
        {name: 'altname', mapping: 'altname'}
    ])
});


var ds3 = new Ext.data.Store({
  autoLoad: true,  
  proxy: new Ext.data.HttpProxy({
        url: 'src/php/conn/plp.conn.php?key=' + lbgm.layout.key + '&request=loadPlpCategoriesCombo'
  }),
  reader: new Ext.data.JsonReader({
        totalProperty: "recordCount",
        root: 'Root'
    }, [
        {name: 'id', mapping: 'id'},
        {name: 'title', mapping: 'title'}
    ])
});

lbgm.plpsearch = Ext.extend (Ext.form.ComboBox, {
    store: ds,
    displayField:this.tpl,
    typeAhead: false,
    loadingText: 'Searching...',
    margins: '0 0 0 0',
    width: 242,
    forceSelection: true,
    hideTrigger:false,
    triggerAction: 'all',
    hideLabel:true,
    listWidth: 500,
    mode: 'remote',
    selectOnFocus: true,
    editable: false,
    alwaysLoad: true,
    itemSelector: 'div.search-item',
    emptyText:'Select...',

    altsearch: null,
    
    initComponent: function(){
        //Ext.applyIf(this, config);
        this.tpl = new Ext.XTemplate(
            '<tpl for="."><div class="search-item" Ext:qtip="{code} {name}">',
                '<p>{code} - {name}</p>',
            '</div></tpl>'
        );

        this.on('beforequery', function(qe){
            if(this.alwaysLoad)
                delete qe.combo.lastQuery;
        });

        lbgm.plpsearch.superclass.initComponent.call(this);
    },
    onSelect: function(record){
       this.setValue(record.data.code + ' - ' + record.data.name);
       this.collapse();
       this.altsearch.setValue('');

       ds2.baseParams.code = record.data.code;
    },
    clearSearch: function() {
        this.setValue('');
        this.collapse();
    },
    clearSelection: function() {
        Ext.get('search-results').dom.innerHTML = '';
    }
});

Ext.reg('lbgm.plpsearch', lbgm.plpsearch);

lbgm.plpaltsearch = Ext.extend (Ext.form.ComboBox, {
    store: ds2,
    displayField:this.tpl,
    typeAhead: false,
    loadingText: 'Searching...',
    margins: '0 0 0 0',
    width: 242,
    forceSelection: true,
    hideTrigger:false,
    triggerAction: 'all',
    hideLabel:true,
//    listWidth: 500,
    mode: 'remote',
    selectOnFocus: true,
    editable: false,
    alwaysLoad: true,
    itemSelector: 'div.search-item',
    emptyText:'Select...',
    valueField:'id',
    displayField:'altname',
    hiddenName:'id',

    initComponent: function(){
        //Ext.applyIf(this, config);
        this.tpl = new Ext.XTemplate(
            '<tpl for="."><div class="search-item" Ext:qtip="{altname}">',
                '<p>{altname}</p>',
            '</div></tpl>'
        );

        this.on('beforequery', function(qe){
            if(this.alwaysLoad)
                delete qe.combo.lastQuery;
        });

        lbgm.plpaltsearch.superclass.initComponent.call(this);
    },
    /*onSelect: function(record){
       //this.setValue(record.data.altname);
       this.selectByValue(record.data.id);
       this.collapse();
    },*/
    clearSearch: function() {
        this.setValue('');
        this.collapse();
    },
    clearSelection: function() {
        Ext.get('search-results').dom.innerHTML = '';
    }
});

Ext.reg('lbgm.plpaltsearch', lbgm.plpaltsearch);

lbgm.plpbtnsearch = Ext.extend (Ext.Button, {
    text:'Display',
    valueSearch: null,
    style: {'float': 'left', 'padding': '5px'},
    initComponent: function(){
        //Ext.applyIf(this, config);
        lbgm.plpbtnsearch.superclass.initComponent.call(this);
    },
    handler: function(btn) {
        var id = this.valueSearch.getValue();

        if(id == '') {
            //alert("Please select a route first");
            Ext.Msg.alert(lbgm.options.appname, "Please select a type/route/to first");
            return;
        }
      
        lbgm.plp.showPlps(id, true);
    }
});

Ext.reg('lbgm.plpbtnsearch', lbgm.plpbtnsearch);

lbgm.plpbtnclear = Ext.extend (Ext.Button, {
    text:'Clear',
    searchCmp: null,
    searchAltCmp: null,
    categoriesCmp: null,
    searchBoxCmp: null,
    style: {'float': 'left', 'padding': '5px'},
    initComponent: function(){
        //Ext.applyIf(this, config);
        lbgm.plpbtnsearch.superclass.initComponent.call(this);
    },
    handler: function(btn) {
        lbgm.plp.clearAll();
    }
});

Ext.reg('lbgm.plpbtnclear', lbgm.plpbtnclear);


lbgm.plpcategories = Ext.extend (Ext.form.ComboBox, {
    store: ds3,
    displayField:this.tpl,
    typeAhead: false,
    loadingText: 'Searching...',
    margins: '0 0 0 0',
    width: 242,
    forceSelection: true,
    hideTrigger:false,
    triggerAction: 'all',
    hideLabel:true,
//    listWidth: 500,
    mode: 'remote',
    selectOnFocus: true,
    editable: false,
    alwaysLoad: true,
    itemSelector: 'div.search-item',
    emptyText:'Select...',
    valueField:'id',
    displayField:'altname',
    hiddenName:'id',

    search: null,
    altsearch: null,

    initComponent: function(){
        //Ext.applyIf(this, config);
        this.tpl = new Ext.XTemplate(
            '<tpl for="."><div class="search-item" Ext:qtip="{title}">',
                '<p>{title}</p>',
            '</div></tpl>'
        );

        this.on('beforequery', function(qe){
            if(this.alwaysLoad)
                delete qe.combo.lastQuery;
        });

        lbgm.plpcategories.superclass.initComponent.call(this);
    },
    onSelect: function(record){
       this.setValue(record.data.title);
       this.collapse();
       this.search.setValue('');
       this.altsearch.setValue('');

       ds.baseParams.category = record.data.id;
       ds2.baseParams.code = '';
    },
    clearSearch: function() {
        this.setValue('');
        this.collapse();
    },
    clearSelection: function() {
        Ext.get('plp-search-results').dom.innerHTML = '';
    }
});

Ext.reg('lbgm.plpcategories', lbgm.plpcategories);