Ext.onReady(function(){
	
	var ctDomNode = Ext.get('latest-reviews');
	if (ctDomNode) {
		//config
		var num_of_latest_reviews_displayed = 5;
		
		//tpl
	    var reviewTpl = new Ext.XTemplate(
	    	'<div style="line-height:16px;padding-top:5px;">',
		    	'<table width="98%" cellspacing="0" cellpadding="0" border="0">',
			    '<tpl for=".">',
	    			'<tr valign="top">',
				    	"<td width='9%' style='padding-left:3px;'><img style='padding-top:3px;' src='/shared/sir/images/comment.png' height='16' width='16'/></td>",
				    	"<td valign='middle' width='55%' style='padding-top:1px;'>{user}</td>",
				    	"<td width='36%' style='text-align:right;padding-top:1px;font-size:11px;color:#888888;'>{review_time}</td>",
				    '</tr>',
	    			'<tr>',
	    				'<td>&nbsp;</td>',
				    	"<td colspan='2' style='padding-bottom:7px;'><a href='/singapore/hotel/{name_identifier}/#reviews' ext:qtip='{user} commented on <b>{hotel_name}</b> at {review_time}'>{content}</a></td>",
				    '</tr>',
			    '</tpl>',
			    '</table>',
	    	'</div>'
	    );
	    
		var LatestReviews = Ext.extend(Ext.DataView, {
		    autoHeight: true,
		    itemSelector: 'table',
			tpl: reviewTpl
		});

	    var latest_review_store = new Ext.data.JsonStore({
			url: '/HotelServlet?action=getHotelLatestReviews&num='+num_of_latest_reviews_displayed,
	    	root: 'results'
	       	,fields: ['hotel_id', 'content', 'user', 'review_time', 'hotel_name', 'name_identifier']
	    });
	    latest_review_store.on('load', function(){
	    	Ext.getCmp('menu-loading-home_hotel_latest_reviews').hide();
	    });
		
/*		var panel_title_icon_el = Ext.get("req-param-hotel-panel-title-hotel_latest_reviews-icon");
		var panel_title_icon = '';
		if (panel_title_icon_el) {
			panel_title_icon = Url.replaceEscape(panel_title_icon_el.dom.innerHTML);
		}
		
		var panel_title_text_el = Ext.get("req-param-hotel-panel-title-hotel_latest_reviews-text");
		var panel_title_text = undefined;
		if (panel_title_text_el) {
			panel_title_text = Url.replaceEscape(panel_title_text_el.dom.innerHTML);
		}
*/		
	    var panel = new Ext.Panel({
	        height: 270,
	        width: 265,
	        //autoScroll: true,
	        frame: true,
	        iconCls: 'icon-comments',
	        title: '<span class="home-centerpanel-header">Latest Reviews</span>',
            //iconCls: panel_title_icon,
	        //title: panel_title_text,
	        items: [
		        new LatestReviews({
		            store: latest_review_store
		        })
		        ,{
		        	id:'menu-loading-home_hotel_latest_reviews',
		        	html:'<span style="padding:7px;"><img src="/shared/sir/images/loading.gif" /> Loading...</span>'
		        }
		    ]
	    });

		
	    // trigger the data store load
	    Ext.getCmp('menu-loading-home_hotel_latest_reviews').on('render', function(){
		    latest_review_store.load();
	    });
	    
		panel.render('latest-reviews');
	}
});


