/**
 * PST.cmp.Events
 * @desc Shows the most recent events - must have help from a Google Calendar feed.
 * @author Brandon Grady
 */
Ext.ns('PST.cmp');

PST.cmp.Events = Ext.extend(Ext.grid.GridPanel, {
    constructor: function(config){
		if (!config) {
			config = {};
		}

		// Definitions
		this.weeksAhead = 8; // TODO - see if we can do the query in here...
		// Perhaps we could take the google service and do the query in here???
		// Ah, who cares - just take the res.
		
		// TODO - make a GoogleCalendarReader class...  That's probably the best idea.
		
		if (config.weeksAhead && config.weeksAhead !== null) {
			this.weeksAhead = config.weeksAhead;
		}
		// this.evtUrl = 'ctrl.php?c=evt2&verb=list&weeks_ahead=' + this.weeksAhead; // TODO this goes away
		
		this.eventRes = {};
		if (config.eventRes && config.eventRes !== null) {
			this.eventRes = config.eventRes;
		}
		
        // Defaults
		Ext.applyIf(config, {
			title: "Upcoming Events (click a row for details)",
			id: "eventGrid",
			autoHeight: false,
			height: 300
		})
		
        PST.cmp.Events.superclass.constructor.call(this, config);
    },

    initComponent: function() {
		// Loop through the event res and create an array
		var gcalData = [];
		for (var ii = 0; ii < this.eventRes.feed.entry.length; ii++) {
			var eventEntry = this.eventRes.feed.entry[ii];
			var locations = eventEntry.getLocations();
			var tmpArr = [
				gcalData.length,
				eventEntry.getTitle().getText(),    // Title
				locations[0].getValueString(), // Location
				(eventEntry.getContent() ? eventEntry.getContent().getText() : ""), // Content 
				eventEntry.getTimes()[0].startTime, // Start Time
				eventEntry.getTimes()[0].endTime,   // End Time
			];
			
			// Add this entry
			gcalData[gcalData.length] = tmpArr;
		}
		
		var aStore = new Ext.data.ArrayStore({
		    autoDestroy: true,
		    storeId: 'myStore',
		    // reader configs
		    idIndex: 0,
			sortInfo: {
				field: 'start',
				direction: 'ASC'
			},
		    fields: [
				'id',
				'title',
				'location',
				'content',
				{name: 'start', type: 'date', dateFormat: 'c'},
				{name: 'end', type: 'date', dateFormat: 'c'}
		    ],
			data: gcalData
		});
		
		Ext.apply(this, {
			loadMask: true,
			// REMOVE THIS STORE
			store: aStore,
			cm: new Ext.grid.ColumnModel([
				// {id: 'date', header: 'Date', renderer: this.dateRender, scope: this},
				{id: 'title', header: 'Title', dataIndex: 'title'},
				{id: 'evtDate', header: 'Date', dataIndex: 'start', renderer: Ext.util.Format.dateRenderer('Y-m-d H:i:s')}
			]),
			autoExpandColumn: "title"
		});
		
        // Call the superclass.
        PST.cmp.Events.superclass.initComponent.call(this);
		
		// Tie in the rowclick
		this.on('rowclick', function(grid, rowIndex, e) {
			var row = grid.store.getAt(rowIndex);
			var title = row.get("title");
			var location = row.get("location");
			var content = row.get("content");
			var start = row.get("start");
			var end = row.get("end");
			var locText = '';
			
			if (location.length > 0) {
				locText = '<b>Location:</b> ' + location + '<br/>'; 
			}
			
			var message =
				'<b>Time:</b> ' + Ext.util.Format.date(start, 'h:i A') + ' to ' +
				Ext.util.Format.date(end, 'h:i A') + '<br/>' +
				locText +
				'<br/><br/>' +
				content;
			
			Ext.Msg.show({
				title: Ext.util.Format.date(start, 'm/d/Y') + ' - ' + title,
				width: 400,
				buttons: Ext.MessageBox.OK,
				msg: message 
			});
		});
    },
	
	dateRender: function(value, metaData, record, rowIndex, colIndex, store) {
		return record.data.date.us_dt;
	}
});