Ext.onReady(function(){

    //addtax
    new Ext.Button({
            id:"addtax",
            renderTo:"addtax",
            text: lang('Add Tax Rule'),
            iconAlign: 'left',
            handler:function(){
                addTaxRule();
            }
    });

    var gridstore = new Ext.data.JsonStore({
            id: "gridstore",
            root: 'taxes',
            totalProperty: 'totalcount',
            idProperty: 'id',
            remoteSort: true,
            baseParams: {
            filter: "",
            customerid: "0"
        },
                    fields: [
                            'id','name','country', 'state','rate','vat','name','level','compound','delCountry','delState','delLevel'
                    ],
                    // load using script tags for cross domain, if the data in on the same domain as
                    // this page, an HttpProxy would be better
                    proxy: new Ext.data.HttpProxy({
                            url: 'index.php?fuse=admin&action=GetTaxRules'
                    })
    });
    gridstore.setDefaultSort('id', 'asc');

    function renderCountry(value, p, record){
        country = record.data.country
        if(country=="COUNTRYALL") country = lang("All") + " - " + lang("tax default if not otherwise specified");
        return country;
    }
    
    function renderState(value, p, record){
        state = record.data.state
        if(state=="STATEALL") state = lang("All") + " - " + lang("country default if not otherwise specified");
        return state;
    }
    
    function renderCompound(value, p, record){
        compound = record.data.compound
        if(compound=="N/A") compound = lang("N/A");
        else if (compound=="NO") compound = lang("No"); 
        else if (compound == "YES") compound = lang("Yes"); 
        return compound;
    }
    
    function renderVAT(value, p, record){
        vat = record.data.vat
        if (vat=="NO") vat = lang("No"); 
        else if (vat == "YES") vat = lang("Yes"); 
        return vat;
    }
    
    function renderAction(value,p,record){
        deleteurl = String.format("<a href='index.php?fuse=admin&action=DeleteTaxRules&country={1}&state={2}&level={3}'>{0}</a>",
                                   lang("Delete"),record.data.delCountry,record.data.delState,record.data.delLevel);
        return deleteurl;
    }

    var grid = new Ext.grid.GridPanel({
        id: 'tax-grid',
        el: 'tax-grid',
        autoHeight:true,
        store: gridstore,
        trackMouseOver:true,
        disableSelection:true,
        loadMask: true,

        // grid columns
        columns:[{
            id: 'name', // id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })
            header: lang("Name"),
            width: 60,	
    		dataIndex : "name",
            sortable: false
        },
        {
            id: 'country', // id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })
            header: lang("Country"),
            width: 220,	
    		dataIndex : "country",
    		renderer: renderCountry,
            sortable: false
        },{
            id: 'state', // id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })
            header: lang("State"),
            width: 200,	
    		dataIndex : "state",
    		renderer: renderState,
            sortable: false,
            align:'center'
        },{
            id: 'level', // id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })
            header: lang("Level"),
            width: 30,	
    		dataIndex : "level"
        },{
            id: 'compound', // id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })
            header: lang("Compound"),
            width: 55,	
    		dataIndex : "compound",
    		renderer: renderCompound,
            align:'center'
        },{
            id: 'vat', // id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })
            header: lang("VAT"),
            width: 35,	
    		dataIndex : "vat",
    		renderer: renderVAT,
            align:'center'
        },{
            id: 'rate', // id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })
            header: lang("Rate"),
            width: 35,	
    		dataIndex : "rate",
            align:'center'
        },{
            id: 'action', // id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })
            header: lang("Actions"),
            width: 45,	
    		dataIndex : "action",
    		renderer: renderAction,
            align:'center'
        }
        ],
		stripeRows: true,
        // customize view config
        viewConfig: {
            forceFit:true,
            enableRowBody:true,
            emptyText: lang("There are no taxes available to view at this time"),
            scrollOffset:1
        }

    });

    // render it
    grid.render();
    gridstore.setBaseParam('limit', 50);
    gridstore.load({params:{start:0}});

});