Ext.onReady(function(){

    // create the Data Store
    var ds = new Ext.data.Store({
        // load using HTTP
        url: '../cron/nse-indices.xml',

       // the return will be XML, so lets set up a reader
        reader: new Ext.data.XmlReader({
               // records will have an "Item" tag
               record: 'Index',
               id: 'Name',
               totalRecords: '@total'
           }, [
               // set up the fields mapping into the xml doc
               // The first needs mapping, the others are very basic
               'Name' , 'CurVal', 'PerChange','Open', 'High', 'Low', 'PrevClose'
           ])
    });


function pctChange(val){
        if(val > 0){
            return '<div class="gainerLoserTable" align="center"><span style="color:green; font-weight:bold; ">' + '<img src="images/greenarrow-small.jpg"> &nbsp;&nbsp;' +
	    val + 
		'%</span></div>';
        }else if(val < 0){
            return '<div class="gainerLoserTable" align="right"><span style="color:red;  font-weight:bold; ">' + '<img src="images/redarrow-small.jpg"> &nbsp;&nbsp;'  
		+ val + '%</span></div>';
        }
        return val;
    }

function normalRender(val){
        return '<div class="gainerLoserTable" align="right"> ' + val + '</div>';
}


    var cm = new Ext.grid.ColumnModel([
            {header: 'Name', width: 130, sortable: true,  menuDisabled :true, dataIndex: 'Name'},
		{header: "Last", renderer: normalRender, width: 65, sortable: true,  menuDisabled :true, dataIndex: 'CurVal'},
		{header: "% Chg", renderer: pctChange, width: 70, sortable: true,  menuDisabled :true, dataIndex: 'PerChange'},
                {header: "Open", renderer: normalRender, width: 65, sortable: true,  menuDisabled :true, dataIndex: 'Open'},
                {header: "High", renderer: normalRender, width: 65, sortable: true,  menuDisabled :true, dataIndex: 'High'},
                {header: "Low", renderer: normalRender, width: 65, sortable: true,  menuDisabled :true, dataIndex: 'Low'},
		{header: "Prev Close", renderer: normalRender, width: 70, sortable: true,  menuDisabled :true, dataIndex: 'PrevClose'}
        ]);
    cm.defaultSortable = true;

    // create the grid
    var grid = new Ext.grid.GridPanel({
        ds: ds,
        cm: cm,
        renderTo:'nse-indices-grid',
        width:540,
        height:250,
	title:'NSE Indices'
    });

    ds.load();
});