/*
 * Ext JS Library 2.2.1
 * Copyright(c) 2006-2009, Ext JS, LLC.
 * licensing@extjs.com
 * 
 * http://extjs.com/license
 */

Ext.onReady(function(){
    var ds = new Ext.data.Store({
        proxy: new Ext.data.ScriptTagProxy({
            url: 'index.php?op=product&active=search'
        }),
        reader: new Ext.data.JsonReader({
            root: 'Products',
            totalProperty: 'totalCount',
            id: 'ProductID'
        }, [
            {name: 'Series', mapping: 'Series'},
            {name: 'CatID', mapping: 'CatID'},			
            {name: 'ProductID', mapping: 'ProductID'},
            {name: 'ProductNumber', mapping: 'ProductNumber'},
            {name: 'ProductDesc', mapping: 'ProductDesc'},	
            {name: 'PicFiles', mapping: 'PicFiles'},
            {name: 'DirName', mapping: 'DirName'},
            {name: 'lastPost', mapping: 'post_time', type: 'date', dateFormat: 'timestamp'}

        ])
    });

    // Custom rendering Template
    var resultTpl = new Ext.XTemplate(
        '<tpl for="."><div class="search-item">',
			'<div class="ProductImg"><img src="upload/images/{DirName}/50x50/{PicFiles}.jpg" width="50" height="50"></div>',
            '<div class="ProductNumber">{ProductNumber} &nbsp;&nbsp;&nbsp;<span class="ProductSeries">{Series}</span></div>',
			'<div class="ProductDesc">{ProductDesc}</div>',
        '</div></tpl>'
    );

    
    var search = new Ext.form.ComboBox({
        store: ds,
        displayField:'title',
        typeAhead: false,
        loadingText: 'Searching...',
        width: 150,
		minChars:2,
		listWidth:300,
		emptyText:'Please enter keyword',
        pageSize:15,
        hideTrigger:true,
        tpl: resultTpl,
        applyTo: 'search',
        itemSelector: 'div.search-item',
        onSelect: function(record){ // override default onSelect to do redirect
			//console.dir(record);
			window.location =String.format('index.php?op=product&active=ShowProduct&ProductID={0}&CatID={1}', record.data.ProductID, record.data.CatID);
        },
		getParams: function(q){
			var p = {};
			//p[this.queryParam] = q;
			CatId=this.getCatlogValue();
			if(CatId){
				p.CatId=CatId;
			}
			if (this.pageSize) {
				p.start = 0;
				p.limit = this.pageSize;
			}
			
			return p;
		},
		getCatlogValue : function(){
			data=Ext.get('seriers').getValue();
			return data;	
		}
    
    });
});