Ext.namespace("WeShotJr");
WeShotJr.grid;
WeShotJr.window;

Ext.onReady(function() {
   Ext.namespace("WeShotJr");
   Ext.QuickTips.init();

   var reader = new Ext.data.JsonReader({root:"data"}, [
      {name: 'date', type: 'date', dateFormat: 'Y-m-d'},
      {name: 'time'},
      {name: 'cover'},
      {name: 'city'},
      {name: 'venue'},
      {name: 'description'}
   ]);

   WeShotJr.grid = 
      new Ext.grid.GridPanel({
         store: new Ext.data.GroupingStore({
            reader: reader,
            baseParams:{cmd:'getShows', source:'user'},
            url: 'controller.php',
            sortInfo:{field: 'date', direction: "ASC"},
            groupField:'date',
            autoLoad:true
         }),

         columns: [
            {header: "Date", width: 70, sortable: true, renderer: Ext.util.Format.dateRenderer('l M d, Y'), dataIndex: 'date'},
            {header: "Time", width: 55, sortable: true, dataIndex: 'time'},
            {header: "Cover", width: 47, sortable: true, dataIndex: 'cover'},
            {header: "City", width: 58, sortable: true, dataIndex: 'city'},
            {header: "Venue", width: 115, sortable: true, dataIndex: 'venue'},
            {header: "Description", width: 300, sortable: true, dataIndex: 'description'}
         ],

        view: new Ext.grid.GroupingView({
            hideGroupedColumn:true,
            groupTextTpl: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Shows" : "Show"]})'
        }),

        frame:false,
        width: 600,
        height: 800,
        iconCls: 'icon-grid',
        renderTo: 'table',
        loadMask: true,
        tbar:[{
               text:'Add New Show',
               tooltip:{showDelay:10,text:'Add a new show to our database!'},
               handler:WeShotJr.launchAddForm
            },{
               text:'Refresh List',
               tooltip:{showDelay:10,text:'Refresh the list of shows!'},
               scope:this,
               handler:function(){
                  WeShotJr.grid.getStore().reload();
               }
            }]
    });
});