Ext.onReady(function(){

    Ext.BLANK_IMAGE_URL = 'js/extjs/resources/images/default/s.gif';
    
    var reader = new Ext.data.JsonReader({
            root: 'results',
            totalProperty: 'total',
            fields: [
                {name: 'Placering', type: 'int'}, 
                {name: 'Tid'},
		{name: 'Namn'},
		{name: 'Klubb'},
		{name: 'Stad'},
		{name: 'Klass'}
            ]
        });

    var proxy = new Ext.data.HttpProxy({
            url: 'results-data.php'
        });

    var store = new Ext.data.GroupingStore({
            reader: reader,
            proxy: proxy,
            remoteSort: true,
            groupField: 'Klubb',
            autoLoad: true
        });

    store.setDefaultSort('Namn', 'asc');

    var cm = new Ext.grid.ColumnModel([{
           header: "Klass",
           dataIndex: 'Klass',
           width: 150
        },
        {
           header: "Placering",
           dataIndex: 'Placering',
           width: 70
        },
        {
           header: "Tid",
           dataIndex: 'Tid',
           width: 80
        },
        {
           header: "Namn",
           dataIndex: 'Namn',
           width: 180
        },
        {
           header: "Stad",
           dataIndex: 'Stad',
           width: 150
        },
        {
           header: "Klubb",
           dataIndex: 'Klubb',
           width: 150,
	   hidden: true
        }
    ]);

    cm.defaultSortable = true;

    var grid = new Ext.grid.GridPanel({
        store: store,
        cm: cm,
        view: new Ext.grid.GroupingView({
            forceFit:true,
	    emptyGroupText: "Klubblös",
	    startCollapsed: true,
            groupTextTpl: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Personer" : "Person"]})'
        }),
        title: 'Resultat Prinsens Minne 2008 - Klubbresultat',
        width: 760,
	autoHeight: true,
        trackMouseOver: true,
        loadMask: true,
        enableHdMenu: false,
	renderTo: 'grid-results'
    });
});