/*
 * Ext JS Library 2.0.2
 * Copyright(c) 2006-2008, Ext JS, LLC.
 * licensing@extjs.com
 * 
 * http://extjs.com/license
 */

Ext.onReady(function(){

    Ext.state.Manager.setProvider(new Ext.state.CookieProvider());

    var myData = [
        ['<a href="http://spreadsheets.google.com/ccc?key=tExGneaglfIRHNEAESQEoOw&output=html&gid=6" target="_blank" style="color:#15428b;">Quinn, A.</a>',7,18,19,10,15,19.29,4.14],
        ['<a href="http://spreadsheets.google.com/ccc?key=tExGneaglfIRHNEAESQEoOw&output=html&gid=9" target="_blank" style="color:#15428b;">Kumpf, J.</a>',3,6,0,2,0,0.00,0.666],
		['<a href="http://spreadsheets.google.com/ccc?key=tExGneaglfIRHNEAESQEoOw&output=html&gid=11" target="_blank" style="color:#15428b;">Witmer, D.</a>',3,5,2,9,7,21.00,3.66],
		['<a href="http://spreadsheets.google.com/ccc?key=tExGneaglfIRHNEAESQEoOw&output=html&gid=1" target="_blank" style="color:#15428b;">Garner, C.</a>',6,4,24,37,41,61.50,10.17],
		['<a href="http://spreadsheets.google.com/ccc?key=tExGneaglfIRHNEAESQEoOw&output=html&gid=2" target="_blank" style="color:#15428b;">Bozack, T.</a>',2,3,5,4,5,22.50,4.5],
		['<a href="http://spreadsheets.google.com/ccc?key=tExGneaglfIRHNEAESQEoOw&output=html&gid=4" target="_blank" style="color:#15428b;">Golden, K.</a>',5,8,35,13,37,66.60,9.6],
		['<a href="http://spreadsheets.google.com/ccc?key=tExGneaglfIRHNEAESQEoOw&output=html&gid=5" target="_blank" style="color:#15428b;">Tomson, D.</a>',3,0,3,2,1,3.00,1.66],
		['<a href="http://spreadsheets.google.com/ccc?key=tExGneaglfIRHNEAESQEoOw&output=html&gid=0" target="_blank" style="color:#15428b;">Clancy, J.</a>',2,2,7,6,7,31.50,6.5]
    ];

    // example of custom renderer function
    function change(val){
        if(val > 0){
            return '<span style="color:black;">' + val + '</span>';
        }else if(val < 0){
            return '<span style="color:black;">' + val + '</span>';
        }
        return val;
    }

    // example of custom renderer function
    function pctChange(val){
        if(val > 0){
            return '<span style="color:black;">' + val + '%</span>';
        }else if(val < 0){
            return '<span style="color:black;">' + val + '%</span>';
        }
        return val;
    }

    // create the data store
    var store = new Ext.data.SimpleStore({
        fields: [
           {name: 'player'},
           {name: 'inn', type: 'float'},
           {name: 'k', type: 'float'},
           {name: 'bbi', type: 'float'},
           {name: 'ha', type: 'float'},
		   {name: 'r', type: 'float'},
		   {name: 'era', type: 'float'},
		   {name: 'whip', type: 'float'}
        ]
    });
    store.loadData(myData);

    // create the Grid
    var grid = new Ext.grid.GridPanel({
        store: store,
        columns: [
            {id:'player', header: "Player", width:80, sortable: true, dataIndex: 'player'},
            {header: "INN", width:40, sortable: true, dataIndex: 'inn'},
            {header: "K", width:40, sortable: true, dataIndex: 'k'},
            {header: "BBI", width:40, sortable: true, dataIndex: 'bbi'},
            {header: "HA", width:40, sortable: true, dataIndex: 'ha'},
			{header: "R", width:40, sortable: true, dataIndex: 'r'},
            {header: "ERA", width:40, sortable: true, dataIndex: 'era'},
			{header: "WHIP", width:40, sortable: true, dataIndex: 'whip'}
        ],
        stripeRows: true,
        //autoExpandColumn: 'player',
        height:315,
        width:370,
        title:'2009 Pitchers'
    });

    grid.render('pitchers');

    grid.getSelectionModel().selectFirstRow();
});
