Ext.onReady(function(){
    Ext.QuickTips.init();
	
	function rating(v) {
        if (v == 0) return "No";
        if (v == 1) return "Yes";
    }
 	 var xg = Ext.grid;
	 
	 var sm2 = new xg.CheckboxSelectionModel({
        listeners: {
        selectionchange: function(sm) {
                if (sm.getCount()) {
                    grid.removeButton.enable();
                } else {
                    grid.removeButton.disable();
                }
            }
        }
    });  
	 
	var encode = false;
	var local = false;
	
	function confirmdeleteSchool(){
		if(grid.selModel.getCount() == 1)
		{
		  Ext.MessageBox.confirm('Confirmation','You are about to delete a Product. Continue?', deleteSchool);
		} else if(grid.selModel.getCount() > 1){
		  Ext.MessageBox.confirm('Confirmation','Delete these Product(s)?', deleteSchool);
		} 
  } 
function deleteSchool(btn){
    if(btn=='yes'){
         var selections = grid.selModel.getSelections();
         var prez = [];
         for(i = 0; i< grid.selModel.getCount(); i++){
          prez.push(selections[i].json.product_id);
         }
         var encoded_array = Ext.encode(prez);
		
         Ext.Ajax.request({  
            waitMsg: 'Please Wait',
            url:'data/product-grid-delete.php', 
            params: { 
               task: "DELETEEMP", 
               ids:  encoded_array
			   }, 
            success: function(response){
              var result=eval(response.responseText);
              switch(result){
              case 1: 
			  	store.reload();
                break;
              default:
                Ext.MessageBox.alert('Warning','Could not delete the entire selection.');
                break;
              }
            },
            failure: function(response){
              var result=response.responseText;
              Ext.MessageBox.alert('error','could not connect to the database. retry later');      
              }
         });
      }  
  }
  
store = new Ext.data.JsonStore({
       	autoDestroy: true,
        url:'data/product-grid-filter.php',
        remoteSort: true,
        sortInfo: {
            field: 'product_id',
            direction: 'ASC'
        },        
        idProperty: 'product_id',
        root: 'data',
        totalProperty: 'total',
        fields: [{
            name: 'product_id',
			type: 'int'
        }, {
            name: 'product_name'
        },{
			name:'product_measurement'
		},{
            name: 'product_price'
        }, {
            name: 'product_active',
			type: 'int'
        }, {
            name: 'product_description',
			type: 'string'
        }
		] 
    });
    var filters = new Ext.ux.grid.GridFilters({
        encode: encode,
        local: false,                                      
		filters: [{
				  type: 'numeric',
            dataIndex: 'product_id',
			 phpMode: true
        }, {
			type: 'string',
            dataIndex: 'product_name',
			phpMode: true

        }, {
            dataIndex: 'product_price',
			type: 'numeric'
        },{
            dataIndex: 'product_measurement',
			type: 'string'
        }, 
		{			
			type: 'list',
            dataIndex: 'product_active',
			options : ['Yes','No'],
			 phpMode: true
        }]
    });
	
var createColModel = function (finish, start) {
        var columns = [
		sm2,
		{
			header: "Edit",	
			width:40,
		    renderer: function(value, metaData, record, rowIndex, colIndex, store) {
		   		return '<a href="addedit-product.php?ID='+ record.get('product_id') +'">Edit</a>';
			}
		},
		{
			width:40,
            dataIndex: 'product_id',
			header: 'Product ID',
			hidden:true,
			filterable: true
        }, {
			width:200,
            dataIndex: 'product_name',
			header: 'Product Name',
			filterable: true
        }, {
			width:60,
            dataIndex: 'product_measurement',
			header: 'Measure'
        }, {
			width:60,
            dataIndex: 'product_price',
			header: 'Price'
        }, {
			width:45,
            dataIndex: 'product_active',
			header: 'Active',
			renderer: rating
        },{
			width:225,
            dataIndex: 'product_description',
			header: 'Description'
        }];
		return new Ext.grid.ColumnModel({
            columns: columns.slice(start || 0, finish),
            defaults: {
                sortable: true
            }
        });
    };
	
var grid = new Ext.grid.GridPanel({
        store: store,
        colModel: createColModel(40), 
        loadMask: true,
		frame: true,
		enableColLock:false,
		//height: 450,    
       // width: 400,
        layout: 'fit',
		columnLines:true,
    	selModel: new Ext.grid.RowSelectionModel({singleSelect:false}),
        plugins: [filters],
		sm: sm2,
        listeners: {
            render: {
                fn: function(){
                    store.reload({
                        params: {
                            start: 0,
                            limit: 10  
                        }
                    });
                }
            }
        }  ,
		tbar:[
         { 
		    	iconCls: 'icon-add',
           		text: 'Add Product',
				ref: '../removeButton',
            	handler: function() {
               location.href="addedit-product.php"; }
              
		            
      		},'-',
			{text: 'Delete Product',
            handler: confirmdeleteSchool,  
            iconCls:'remove',
			ref: '../removeButton',
			disabled: true
			}
	  ], 
        bbar: new Ext.PagingToolbar({
            store: store,
            pageSize: 10,
			displayInfo: true,
            plugins: [filters]
        })
    });

    grid.getBottomToolbar().add([
        '->',
      {
            text: 'Clear Filter Data',
            handler: function () {
                grid.filters.clearFilters();
            } 
        }    
    ]);
	
	store.on({
		'beforeload': {
    		fn: function(store, options){
            	options.params || (options.params = {}); 
            	Ext.apply(options.params, {
            		pageNo: this.pageNumber
            	});
        	},
        	scope: this
    	}
	});
	
	grid.on('render', function() {
    grid.tip = new Ext.ToolTip({
    view: grid.getView(),
    target: grid.getView().mainBody,
    delegate: '.x-grid3-row',
    trackMouse: true,
    renderTo: document.body,
    listeners: {
     beforeshow: function updateTipBody(tip) {
      tip.body.dom.innerHTML = "Click on Edit Link To Edit Record.";
     }
    }
   });
  });
	
	 var SchoolWindow = new Ext.Window({
        title: 'View Product Information',
        height: 400,
        width: 700,
		modal:true,
		border: false,
        layout: 'fit',
		closeAction:'close',
		collapsible:'true',
        items: grid
    }).show();
	 
	var varWidth =  (screen.width - SchoolWindow.width)/2;
	SchoolWindow.setPosition(varWidth,((screen.height/4)-100));
});