/*
 * Ext JS Library 2.1
 * Copyright(c) 2006-2008, Ext JS, LLC.
 * licensing@extjs.com
 * 
 * http://extjs.com/license
 */

Ext.onReady(function(){

    // create the Data Store
    var store = new Ext.data.Store({
        // load using HTTP
        url: 'features.xml',

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

	
    // create the grid
    var grid = new Ext.grid.GridPanel({
        store: store,
        columns: [
			{header: "", width: 25, dataIndex: 'image', sortable: false, renderer: IColumn},
            {header: "Name", width: 120, dataIndex: 'name', sortable: true},
            {header: "Description", width: 450, dataIndex: 'description', sortable: true}
        ],
		
		frame:true,
		collapsible: true,
        renderTo:'features-grid',
		title: 'Features',
        width:675,
        height:200
    });

    store.load();
});

function IColumn(ImageName) {

return "<img src='/images/v/" + ImageName + ".png' />";

}