var lang;
var DataStore;         // this will be our datastore
var ColumnModel;       // this will be our columnmodel
var ListingEditorGrid;
var ListingWindow;

var ListingSelectedRow;

var controller = "events";
var itemName = "seminars";



Ext.onReady(function(){
	Ext.QuickTips.init();
  	
	var HTMLScriptElements = document.getElementsByTagName("script");
	for (var i=0; i<HTMLScriptElements.length; i++) {
	 	if (HTMLScriptElements[i].src.match(/events_seminars\.js\?(.*)?$/)){
	 		var param = RegExp.$1;
	 		var params = param.split("=");
	 		lang = params[1];
	 	}
	}


	/**
	 * data store for server data 
	 */
	// create the Data Store
    var DataStore = new Ext.data.JsonStore({
        root: 'results',
        totalProperty: 'total',
	    id: 'id',
        remoteSort: true,

        fields: [ 
        	{name: 'event_id', type: 'int', mapping: 'event_id'},
        	{name: 'date', type: 'date', mapping: 'date', dateFormat: 'd.m.Y'},
        	{name: 'city', type: 'string', mapping: 'city'},
        	{name: 'title', type: 'string', mapping: 'title'},
	        {name: 'details', type: 'string', mapping: 'details'}
     	], 
        proxy: new Ext.data.HttpProxy({
            url: '/' + lang + '/' + controller + '/database/task/listing/event-type/' + itemName
        })
    });
	DataStore.setDefaultSort('date', 'desc');	
	
	// render functions
    function renderDateTime(value, p, record){
        return String.format(
                '<b>{0}</b><br />{3}',
                value, record.data.date, record.id, record.data.time);
    }
	// render functions
    function renderTitleCity(value, p, record){
        return String.format(
                '<b>{0}</b><br />{3}',
                value, record.data.title, record.id, record.data.city);
    }
	
	ColumnModel = new Ext.grid.ColumnModel([
		{
	        header: '#',
	        readOnly: true,
	        dataIndex: 'event_id', // this is where the mapped name is important!
	        width: 35,
      		sortable: true,
	        hidden: true
      	},
		{
      		header: Bitskin.lang.event,
      		dataIndex: 'title',
      		width: 385,
      		sortable: true,
			renderer: renderTitleCity,
      	},
      		{
      		header: Bitskin.lang.date,
      		dataIndex: 'date',
      		width: 80,
			renderer: Ext.util.Format.dateRenderer('d.m.Y'),
      		sortable: true
      	},
      	{
	        header: Bitskin.lang.details,
	        readOnly: true,
	        dataIndex: 'details',
      		sortable: true,	        
	        width: 70 // hidden: true   blendet die Spalte anfangs aus
	    }
	]);
    
    ListingEditorGrid =  new Ext.grid.EditorGridPanel(
		{
			id: 'ListingEditorGrid',
			store: DataStore,     // the datastore is defined here
			cm: ColumnModel,      // the columnmodel is defined here
			enableColumnResize:false,
			stripeRows:false,
			autoHeight: true,
	        width:540,
	    	selModel: new Ext.grid.RowSelectionModel({singleSelect:true}),
		    tbar: [
					new Ext.app.SearchField(
						{
							store: DataStore,
							width: 534
						}
					)
				  ]
		}
	);

	
	DataStore.reload();      // Load the data
	
    ListingEditorGrid.render('grid');
  
});