Ext.onReady(function(){
	var domId = 'left-nav-summary_of_reviews';
	var domNode = Ext.get(domId);
	if (domNode) {
		//get rest_id
		var domNode = Ext.get('req-param-restid');
		var rest_id = '';
		if (domNode) {
			rest_id = domNode.dom.innerHTML;
		}
		
		domNode = Ext.get('req-param-rest_name');
		var rest_name = '';
		if (domNode) {
			rest_name = domNode.dom.innerHTML;
		}
		
	    var reviewSummaryStore = new Ext.data.JsonStore({
			url: '/RestaurantBookingServlet?action=getRestaurantReviewsSummary&rest-id='+rest_id,
	    	root: 'results'
	       	,fields: ['expense_per_person', 'no_of_expense_per_person', 'no_of_recommended_reviews', 'total_reviews',
	       				'ranking_ambience', 'no_of_ranking_ambience', 'ranking_food', 'no_of_ranking_food', 'ranking_service', 'no_of_ranking_service', 
	       	 			'no_of_ranking_parking_1', 'no_of_ranking_parking_2', 'no_of_ranking_parking_3', 
	       	 			'no_of_ranking_recommend_to_frd_1', 'no_of_ranking_recommend_to_frd_2', 'no_of_ranking_recommend_to_frd_3', 'no_of_ranking_recommend_to_frd_4', 'no_of_ranking_recommend_to_frd_5', 
	       	 			'no_of_recommendation_for_occasion_1', 'no_of_recommendation_for_occasion_2', 'no_of_recommendation_for_occasion_3', 'no_of_recommendation_for_occasion_4', 'no_of_recommendation_for_occasion_5',
	       	 			'all_recommendedDishes']
	    });
	    reviewSummaryStore.on('load', function(){
	    	Ext.getCmp('menu-loading-left_nav_summary_of_reviews').hide();
	    	var resultSet = reviewSummaryStore.getCount();
	    	if (resultSet == 0) {
	    		//Ext.getCmp('left-nav-review_summary_panel').hide();
	    		Ext.get('left-nav-summary_of_reviews').dom.style.display = 'none';
	    	} else {
	    		//Ext.getCmp('left-nav-review_summary_panel').show();
	    	}
	    });

		ReviewSummaryPanel = Ext.extend(Ext.DataView, {
		    autoHeight: true,
		    frame:true,
		    cls:'',
		    itemSelector: 'div',
		    overClass: 'over',
		    
		    tpl : new Ext.XTemplate(
				"<div style='line-height:16px;'>",
			        '<tpl for=".">',
			        	"<div style='text-align:center;color:purple;padding-bottom:5px;'><b>"+rest_name+"</b></div>",
						"<div style='text-align:center;color:blue;padding-bottom:5px;border-bottom:1px solid #ddd;'><b>Total {total_reviews} {total_reviews:this.getReviewPlForm}<span style='{no_of_recommended_reviews:this.getDisplayRecommendedReviewsCss}'>, <a href='javascript:void(0)' onclick='show_recommended_reviews();'>{no_of_recommended_reviews} recommended</a></span></b></div>",
						"<div style='padding-top:5px;'><b>Ratings:</b></div>",
						"<div style='padding-bottom:5px;border-bottom:1px solid #ddd;'>",
							"<table width='100%' cellpadding='0' cellspacing='0'>",
								"<tr style='{id:this.displayOverall};'>",
									"<td width='45%' align='right' valign='middle'>Overall rating:</td>",
									//"<td width='58%' style='padding-left:10px;'><img style='padding-bottom:5px;{id:this.displayOverall}' src='http://chart.apis.google.com/chart?cht=gom&chs=80x50&chd=t:{id:this.getOverallRanking}&chl={id:this.getOverallRankingLabel}' ext:qtip='Overall rating {id:this.getOverallRankingLabel}'/></td>",
									"<td width='55%' style='padding-left:20px;'><div style='padding-bottom:5px;text-align:center;;line-height:48px;vertical-align:middle;font-size:20px;color:#E8171D;' class='review-overall-rating'><b>{id:this.getOverallRankingLabel}</b></span></td>",
								"</tr>",
								"<tr>",
									"<td width='45%' align='right' valign='middle'>Food:</td>",
									"<td width='55%' style='padding-left:10px;'><span style='{no_of_ranking_food:this.displayRankingImg}'><img src='{ranking_food:this.getRankingImg}' ext:qtip='average food rating {ranking_food:this.getRankingValue}'/></span><span style='padding-left:5px;color:#942727;{no_of_ranking_food:this.displayRankingNA}'><b>NA</b></span></td></td>",
								"</tr>",
								"<tr>",
									"<td align='right' valign='middle'>Ambience:</td>",
									"<td style='padding-left:10px;'><span style='{no_of_ranking_ambience:this.displayRankingImg}'><img src='{ranking_ambience:this.getRankingImg}' ext:qtip='average ambience rating {ranking_ambience:this.getRankingValue}'/></span><span style='padding-left:5px;color:#942727;{no_of_ranking_ambience:this.displayRankingNA}'><b>NA</b></span></td>",
								"</tr>",
								"<tr>",
									"<td align='right' valign='middle'>Service:</td>",
									"<td style='padding-left:10px;'><span style='{no_of_ranking_service:this.displayRankingImg}'><img src='{ranking_service:this.getRankingImg}' ext:qtip='average service rating {ranking_service:this.getRankingValue}'/></span><span style='padding-left:5px;color:#942727;{no_of_ranking_service:this.displayRankingNA}'><b>NA</b></span></td>",
								"</tr>",
							"</table>",
						"</div>",
						"<div style='padding-top:5px;padding-bottom:5px;border-bottom:1px solid #ddd;'><b>Expense per person:</b>&nbsp;&nbsp;&nbsp;&nbsp;<span style='color:#942727;'><b>{expense_per_person:this.getExpensePerPerson}</b></span></div>",
						"<div style='padding-top:5px;padding-bottom:3px;'>",
							"<b>Recommend this to friends?</b>",
						"</div>",
						"<div style='padding-bottom:5px;border-bottom:1px solid #ddd;'>",
							"<table width='100%' cellpadding='0' cellspacing='0' >",
								"<tr>",
									"<td width='45%' style='font-size:11px;'>Sure (<span style='color:#942727;'><b>{no_of_ranking_recommend_to_frd_5}</b></span>)</td>",
									"<td width='55%' style='font-size:11px;'>I think so (<span style='color:#942727;'><b>{no_of_ranking_recommend_to_frd_4}</b></span>)</td>",
								"</tr>",
								"<tr>",
									"<td style='font-size:11px;'>Not sure (<span style='color:#942727;'><b>{no_of_ranking_recommend_to_frd_3}</b></span>)</td>",
									"<td style='font-size:11px;'>Don't think so (<span style='color:#942727;'><b>{no_of_ranking_recommend_to_frd_2}</b></span>)</td>",
								"</tr>",
								"<tr>",
									"<td colspan='2' style='font-size:11px;'>Sure not (<span style='color:#942727;'><b>{no_of_ranking_recommend_to_frd_1}</b></span>)</td>",
								"</tr>",
							"</table>",
						"</div>",
						"<div style='padding-bottom:5px;border-bottom:1px solid #ddd;{id:this.displayRecommendationForOccasion}'>",
							"<div style='padding-top:5px;padding-bottom:3px;'>",
								"<b>This place is great for:</b>",
							"</div>",
							"<table width='100%' cellpadding='0' cellspacing='0'>",
								"<tr>",
									"<td colspan='4' style='font-size:11px;'>Business/Company (<span style='color:#942727;'><b>{no_of_recommendation_for_occasion_1}</b></span>)</td>",
								"</tr>",
								"<tr>",
									"<td width='21%' style='font-size:11px;'>Wedding</td>",
									"<td width='24%' style='font-size:11px;'>(<span style='color:#942727;'><b>{no_of_recommendation_for_occasion_2}</b></span>)</td>",
									"<td width='18%' style='font-size:11px;'>Friends</td>",
									"<td width='37%' style='font-size:11px;'>(<span style='color:#942727;'><b>{no_of_recommendation_for_occasion_4}</b></span>)</td>",
								"</tr>",
								"<tr>",
									"<td style='font-size:11px;'>Birthday</td>",
									"<td style='font-size:11px;'>(<span style='color:#942727;'><b>{no_of_recommendation_for_occasion_3}</b></span>)</td>",
									"<td style='font-size:11px;'>Lovers</td>",
									"<td style='font-size:11px;'>(<span style='color:#942727;'><b>{no_of_recommendation_for_occasion_5}</b></span>)</td>",
								"</tr>",
							"</table>",
						"</div>",
						"<div style='padding-bottom:5px;border-bottom:1px solid #ddd;{id:this.displayParking}'>",
							"<div style='padding-top:5px;padding-bottom:3px;'>",
								"<b>Parking:</b>",
							"</div>",
							"<div style='font-size:11px;'>",
								"Easy (<span style='color:#942727;'><b>{no_of_ranking_parking_1}</b></span>)",
								"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Normal (<span style='color:#942727;'><b>{no_of_ranking_parking_2}</b></span>)",
								"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Difficult (<span style='color:#942727;'><b>{no_of_ranking_parking_3}</b></span>)",
							"</div>",
						"</div>",
			        '</tpl>',
			        '<div style="padding:3px 0;text-align:center;"><a href="#write-review">Write</a> or <a href="#reviews">view more reviews</a></div>',
				"</div>",
			    {
			    	getRankingValue: function(rankingValue) {
		    			if (rankingValue == '0') {
		    				rankingValue = 'NA';
		    			}
		    			return rankingValue;
			    	}
			    },
			    {
			    	getExpensePerPerson: function(expensePerPerson) {
		    			if (expensePerPerson == '-1') {
		    				expensePerPerson = 'NA';
		    			} else {
		    				expensePerPerson = 'S$' + expensePerPerson;
		    			}
		    			return expensePerPerson;
			    	}
			    }
			    ,{
			    	getDisplayRecommendedReviewsCss: function(num) {
			    		if (!num || num=='0') {
			    			return 'display:none;';
			    		}
			    		return '';
			    	}
			    }
				,{
					getReviewPlForm: function(num) {
						if (num=='1' || num=='0') {
							return 'review';
						}
						return 'reviews';
					}
				}
			    ,{
			    	getRankingImg: function(ranking) {
			    		return '/shared/sir/images/ranking-'+ranking+'.gif';
			    	}
			    },
			    {
			    	displayRankingImg: function(no_of_reviews) {
		    			var displayStyle = '';
		    			if (no_of_reviews == '0') {
		    				displayStyle = 'display:none;';
		    			}
		    			return displayStyle;
			    	}
			    },
			    {
			    	displayNoOfEPP: function(no_of_epp) {
		    			var displayStyle = '';
		    			if (no_of_epp == '0') {
		    				displayStyle = 'display:none;';
		    			}
		    			return displayStyle;
			    	}
		    	},
			    {
			    	displayRankingNA: function(no_of_reviews) {
		    			var displayStyle = '';
		    			if (no_of_reviews != '0') {
		    				displayStyle = 'display:none;';
		    			}
		    			return displayStyle;
			    	}
		    	},
		    	{
		    		displayOverall: function(id) {
		    			var r = reviewSummaryStore.getAt(0);
		    			var food = r.get('ranking_food');
		    			var ambience = r.get('ranking_ambience');
		    			var service = r.get('ranking_service');
		    			
		    			var displayStyle = '';
		    			if (food=='0' && ambience=='0' && service=='0') {
		    				displayStyle = 'display:none';
		    			}
		    			return displayStyle;
		    		}
		    	},
		    	{
		    		getOverallRanking: function(id) {
		    			var r = reviewSummaryStore.getAt(0);
		    			var food = new Number(r.get('ranking_food'));
		    			var ambience = new Number(r.get('ranking_ambience'));
		    			var service = new Number(r.get('ranking_service'));
		    			
		    			var overall = 0;
		    			var count = 0;
		    			if (food != 0) {
		    				overall += food;
		    				count++;
		    			}
		    			if (ambience != 0) {
		    				overall += ambience;
		    				count++;
		    			}
		    			if (service != 0) {
		    				overall += service;
		    				count++;
		    			}
						if (count!=0) {
							overall = Math.round((overall/count)*10);
						}
						return overall;
	    			}
		    	},
		    	{
		    		getOverallRankingLabel: function(id) {
		    			var r = reviewSummaryStore.getAt(0);
		    			var food = new Number(r.get('ranking_food'));
		    			var ambience = new Number(r.get('ranking_ambience'));
		    			var service = new Number(r.get('ranking_service'));
		    			
		    			var overall = 0;
		    			var count = 0;
		    			if (food != 0) {
		    				overall += food;
		    				count++;
		    			}
		    			if (ambience != 0) {
		    				overall += ambience;
		    				count++;
		    			}
		    			if (service != 0) {
		    				overall += service;
		    				count++;
		    			}
						if (count!=0) {
							overall = Math.round((overall/count)*10);
						}
						overall = overall/10;
						if (overall==0) {
							overall = 'NA';
						}
						return overall;
	    			}
			    }
			    ,{
			    	displayRecommendationForOccasion: function(id) {
		    			var r = reviewSummaryStore.getAt(0);
		    			var val_1 = r.get('no_of_recommendation_for_occasion_1');
		    			var val_2 = r.get('no_of_recommendation_for_occasion_2');
		    			var val_3 = r.get('no_of_recommendation_for_occasion_3');
		    			var val_4 = r.get('no_of_recommendation_for_occasion_4');
		    			var val_5 = r.get('no_of_recommendation_for_occasion_5');
		    			
		    			var displayStyle = '';
		    			if (val_1=='0' && val_2=='0' && val_3=='0' && val_4=='0' && val_5=='0') {
		    				displayStyle = 'display:none;';
		    			}
		    			return displayStyle;
			    	}
			    }
			    ,{
			    	displayParking: function(id) {
		    			var r = reviewSummaryStore.getAt(0);
		    			var val_1 = r.get('no_of_ranking_parking_1');
		    			var val_2 = r.get('no_of_ranking_parking_2');
		    			var val_3 = r.get('no_of_ranking_parking_3');
		    			
		    			var displayStyle = '';
		    			if (val_1=='0' && val_2=='0' && val_3=='0') {
		    				displayStyle = 'display:none;';
		    			}
		    			return displayStyle;
			    	}
			    }
			    
		    )
		});
		
		var panel = new Ext.Panel({
			id:'left-nav-review_summary_panel',
            title: '<span class="home-centerpanel-header">Overall Review <span style="font-weight:normal;">&#35780;&#35770;&#32508;&#36848;</span></span>',
            iconCls:'icon-chart-bar',
            frame: true,
            style:'',
            bodyStyle: 'padding-left:5px;font-size:12px',
            layout: 'fit',
            height: 'auto',
			items: [
				new ReviewSummaryPanel({
		            store: reviewSummaryStore
		        })
		        ,{
		        	id:'menu-loading-left_nav_summary_of_reviews',
		        	html:'<span style="padding:7px;"><img src="/shared/sir/images/loading.gif" /> Loading...</span>'
		        }
			]
		});
		
		Ext.getCmp('menu-loading-left_nav_summary_of_reviews').on('render', function(){
			reviewSummaryStore.load();
		});
		panel.render(domId);
	}

});
function show_recommended_reviews() {
	var cmp = Ext.getCmp('reviews-panel');
	cmp.activate('recommended-reviews-panel');
	window.location='#recommended-reviews';
}