Ext.ns('Sight');
Sight.NewsViewGridPanel = Ext.extend(Ext.grid.GridPanel, {		
	serviceURL: '/sight?service=news&operation=list'	 	
	,pageSize:2
	,notifySelection:function() { 		
 	}
	,initComponent:function() {
		
		var renderContent = function(value, p, r) {						
			var newsDate = new Date(r.data.lastUpdate).dateFormat('m/d/Y');
			return '<div class="fragment-title"><p/>'+r.data.title+', posted by: '+r.data.author+' on '+newsDate+'<p/></div>';			
		};
    	    	        	    	    	
		// News store     			
    	var newsStore = new Ext.data.Store({        
        	proxy: new Ext.data.HttpProxy({
				url: this.serviceURL
			}),        
        	reader: new Ext.data.JsonReader({
            	root: 'data',
            	totalProperty: 'count',
            	fields: [
            		'id',
                	'date',
                	'lastUpdate',
                	'author',
                	'title', 
                	'content', 
                	'activated'
            	]
        	}),        
        	remoteSort: true
    	});
    	newsStore.setDefaultSort('date', 'desc');
    	
        		
        // News model	
    	var newsColumnModel = new Ext.grid.ColumnModel(
    		[{           
           		id:'id',           		
           		dataIndex: 'id',           		
           		renderer: renderContent
        	}
        ]);
		newsColumnModel.defaultSortable = true;
    			
    	var nwsgrid = this;
    	    	
		Ext.apply(this, {			
			margins:'5 5 5 0',			
			store: newsStore,			
			cm: newsColumnModel,
			trackMouseOver:false,			
			loadMask: true,		
			disableSelection:true,
			viewConfig: {				
				forceFit:true,
				enableRowBody:true,
				showPreview:true,
				getRowClass : function(record, rowIndex, p, store){										
					if(this.showPreview){						
						var myHTML = record.data.content; 						
						p.body = '<div class="fragment-content">'+myHTML+'</div>';
						return 'x-grid3-row-expanded';
					} 
					return 'x-grid3-row-collapsed';
				}
			},
			bbar: new Ext.PagingToolbar({
				pageSize: parseInt(this.pageSize),
				store: newsStore,
				displayInfo: true,
				displayMsg: "<div class='label-element'>News {0} - {1} of {2}</div>",
				emptyMsg: "No news to be displayed.",
				items:[
					'-', {
						pressed: true,
						enableToggle:true,
						text: "<span class='label-element'>Details</span>",
						cls: 'x-btn-text-icon details',
						toggleHandler: function(btn, pressed){
        					var view = nwsgrid.getView();
        					view.showPreview = pressed;
        					view.refresh();
    					}
					 }]
			})
		}); // eo apply	
		
		// Call parent 
        Sight.NewsViewGridPanel.superclass.initComponent.apply(this, arguments);
        
						    	 
	} // eo function initComponent                 
	,refresh:function() {
    	this.store.reload();    	
    }            
});