var container;
var contentWithoutTabs;
var tabContainer;
var errorDiv;
var serverURL = "http://mp.playgamesite.com/fs_fungames/";
//var serverURL = "http://localhost:8081/fs_fungames/";
var serviceURL =serverURL+"GameService";
var GAME_IMG_URL="http://www.playgamesite.com/arcade/img/";
var IMG_URL = serverURL+"img/";
var MENU_IMG_URL = IMG_URL+"menu_icon/";
var FS_IMG_URL = serverURL+"mp_img/";
var COMMENT_COUNT = 5;
var RANDOM_GAME_COUNT = 8;
var HOME_APP_COUNT = 9;
var allContent;
var APP_COUNT = 16;
var PLAYERS_COUNT= 20;
var RECOMMENDED_COUNT = 8;
var Request = new Object();
var user = null;
var userThumbnail, userName, userProfile, userCountry, userCity,
	userRegion, userPostalCode, userAge, userGender,userKey;
var GAME_URL = "http://widgets.friendster.com/"; 
var monthname=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec");
var categoryArray = new Array("All","Action","Arcade","Casino","Dress-up","Driving","Puzzle","Sports","Other");
var GALLERY_APP_COUNT = 35;
var SMALL_AD = {height:60, width:645};
var LARGE_AD = {height:90, width:728};
var TAB_CONFIG;
var IS_LIVE = true;
var CONFIG = null;
var  styleJson = null;

var SUPER_URL = GAME_URL;
////////////////////////Style///////////

var superStyleJson = {bgColor: "#ffffff", bgImage: false, flashWithAd: true, AD_CONFIG: {top: {code: "ddddddd", show: false, id: "-1"}, right: {code: "", show: false, id: "-1"}, bottom: {code: "ddddddd", show: false, id: "-1"}, left: {code: "", show: false, id: "-1"}}, TAB_CONFIG: {items: [{name: "play", link: "javascript:play()", displayName: "Play", show: true}, {name: "invite", link: "javascript:showInvite()", displayName: "Challenge Friends", show: true}, {name: "allgames", link: "javascript:showAllGames()", displayName: "Huge Games Selection", show: true}, {name: "favorites", link: "javascript:showUserFavorites(1)", displayName: "My Favorites", show: true}, {name: "players", link: "javascript:showPlayers()", displayName: "Players", show: true}, {name: "comments", link: "javascript:showComments()", displayName: "Comments", show: true}], bgColor: "#cccccc", borderColor: "#5e5a5a", color: "#000000", selectedBgColor: "#EB7436", selectedColor: "#000000"}, width: "650", height: "400", commentsWithGame: false, highLightedTextColor: "#FE7200", textColor: "#71af08"};

var defaultJson = {bgColor:"",titleColor:"",titleBackground:"",tabTextColor:"",textColor:"#000000",classV:""};

///////////////////////////////////////

var _$ = function(id){
	return document.getElementById(id);
}


var getRandomGames = function(callBack){
    Request.sendGET(serviceURL+"/getRandomGames/"+RANDOM_GAME_COUNT, callBack);
}


var resp_getRandomGames = function(response){
  
    var json=response.data;
    var apps = json.apps;
    var str="";
     str +='<table style="border:1px solid #999999"><tr>';
     
     for (var i=0;i<apps.length;i++){
        var app = apps[i];
	    var appUrl = GAME_URL + app.gameId;
        str += '<td><a  href="javascript:loadGame('+app.gameId+')"><img border="none"  style="margin-right:5px;width:60px;height:60px;" src="'+app.imgPath + app.gameId+'_75.png"/></a></td>'
     }
     str +='</tr></table>';
       _$("rundomGames").innerHTML = str;
}


var getProfile = function(){
    getRandomGames(resp_getProfile);
  }


var resp_getProfile = function(response){

   var json=response.data;
   var apps = json.apps;
   var leftContainer = _$("leftContainer");
   var rightContainer = _$("rightContainer");
   var leftStr="";
   var rightStr="";
   var appUrl="";
    for (var i=0;i<apps.length/2;i++){
			app = apps[i];
			 appUrl = GAME_URL + app.gameId;
		      leftStr += '<div style="margin-bottom:30px;height:42px;padding-left:2px;padding-top:2px;width:82px;cursor:pointer;border:1px solid #DDDDDD;"><a href="javascript:loadGame('+app.gameId+')"><img border="none"  style="margin-right:5px;width:80px;height:40px;" src="'+app.imgPath + app.gameId+'_75.png"/></a></div>';
	     }
	     
	for (var i=apps.length/2;i<apps.length;i++){
			app = apps[i];
			 appUrl = GAME_URL + app.gameId;
		      rightStr += '<div style="margin-bottom:30px;height:42px;padding-left:2px;padding-top:2px;width:82px;cursor:pointer;border:1px solid #DDDDDD;" ><a href="javascript:loadGame('+app.gameId+')"><img border="none"  style="margin-right:5px;width:80px;height:40px;" src="'+app.imgPath + app.gameId+'_75.png"/></a></div>';
	     }  
	        
   leftContainer.innerHTML = leftStr;
   rightContainer.innerHTML = rightStr;
   gadgets.window.adjustHeight();      
} 



var fillBody = function(){
  if (typeof gadgets == "undefined"){IS_LIVE = false;}
  if (typeof is_super == "undefined") is_super = false;

    Request.sendGET(serviceURL+"/version?appId="+gameId,response_getAppVersion);
}



var fillBodySuperStart = function(){
     window.startTime = new Date();
     allContent = _$("allContent");
  	 var header = '<table cellspacing=0 cellpadding=0><tr><td><div id="curGame" style="margin-bottom: 10px;margin-top:10px;"/></td></tr></table>';
	 var tabs = '<table cellspacing=0 cellpadding=0>'+
	                '<tr class="tabs" id="tabContainer">';
     var _class = "";  
   
        tabs += '<td class="lastTab ui-widget-content ui-corner-all" style="border-color:'+CONFIG.TAB_CONFIG.borderColor+';background:'+CONFIG.TAB_CONFIG.bgColor+'" name="home" >'+
	    	    '<a style="color:'+CONFIG.TAB_CONFIG.color+';" href="javascript:showHome()">Home</a></td>';
	    var _class = "lastTab ui-widget-content ui-corner-all";
	    var items = CONFIG.TAB_CONFIG.items;
	    for (var i=0;i<items.length;i++){
	    	if (items[i].name == "favorites"){
	    		showFavorite = items[i].show;
	    	}
	    	if (!items[i].show) continue;
	    	tabs += '<td class="'+_class+'" style="border-color:'+CONFIG.TAB_CONFIG.borderColor+';background:'+CONFIG.TAB_CONFIG.bgColor+'" name="'+items[i].name+'" >'+
	    	'<a style="color:'+CONFIG.TAB_CONFIG.color+';" href="'+items[i].link+'">'+getTabDisplayName(items[i])+'</a></td>';
	    }
	tabs += '</tr></table>';
	////////////////nuyn////
  	  var topBanner = '<div align=center style="font-size:15px;font-weight:bold;">';
	  topBanner+= '<div style="margin:30px 7px 0px;" class=menu id=menuTop>'+getSuperMenu()+'</div>'+
	 		         '<div id=topAd></div>'+
                  '</div>';
       
  	  var cont =  '<div id=error style="display: none"></div>'+
		          '<div id=container style="margin-top: 20px;"><div class=loading>Loading...</div></div>';
	
	  var bottomBanner ='<div align=center style="font-size:15px;font-weight:bold;">'+ 
	                         '<div id=bottomAd></div>'+
	                         '<div style="margin:7px 0px;" class=menu id=menuBottom>'+getSuperMenu()+'</div>'+
                       '</div><br/><br/><div align=center id=rundomGames></div>';
                
  
       bottomBanner+='<div align=center><img style="cursor:pointer; margin:7px 0px;" src="'+IMG_URL+'sharegame.png" onclick="javascript:inviteFriend()"></div>';
       bottomBanner+='<div align=center id=bottomAd2></div>';
	
	
	if (CONFIG.bgColor){
		document.body.style.backgroundColor = CONFIG.bgColor;
	}

    var str = header + tabs +"<div>"+ topBanner + cont + bottomBanner;
 
	allContent.innerHTML = str;
	container = _$("container");
	errorDiv = _$("error");
	tabContainer = _$("tabContainer");
	refreshAd();
	getRandomGames(resp_getRandomGames);
    getUser();  
}



var getSuperMenu = function(){
  var menuStr = 
  '<span ><a style="color:'+CONFIG.highLightedTextColor+'" target="_blank" href="http://www.playgamesite.com"><img  src="'+MENU_IMG_URL+'playgamesite.png" class=icon />PlayGameSite</a></span>'+
  '<span><a style="color:'+CONFIG.highLightedTextColor+'" target="_blank" href="'+getFullScreenURL()+'" ><img src="'+MENU_IMG_URL+'fullScreen.png" /> FullScreen</a></span>'+
  '<span ><a style="color:'+CONFIG.highLightedTextColor+'" href="javascript:inviteFriend()"><img  src="'+MENU_IMG_URL+'post_bulletin.png" class=icon /> Post Bulletin </a></span>' +
  '<span id=favorite></span>'+
  '<span id=recommend></span>';
  return menuStr;
}


var getTabDisplayName = function(tabItem){
	switch(tabItem.name){
		case "invite" : return "Spread Game";
		default: return tabItem.displayName;
	}
}


var defaultFlag = false;

var setDefaultApp = function(){
   if(defaultFlag == false){
      Request.sendGET(serviceURL+"/getRandomGames/"+1, resp_setDefaultApp); 	    
    }
}


var resp_setDefaultApp = function(response){
    
    defaultFlag =true;
    var json=response.data;
    var apps = json.apps;
    
     for (var i=0;i<apps.length;i++){
        var app = apps[i];
	    gameTitle = app.gameName;
	    gameId = app.gameId;
	    gameDesc = app.description;
	    swf = new Object();
	    swf.url = "http://www.playgamesite.com/arcade/"+app.flashUrl;
	    swf.width = app.width;
	    swf.height = app.height;
	    gameURL = GAME_URL + gameId;
	    gameImgUrl="http://www.playgamesite.com/arcade/img/"+app.imageLarge;;
     
     }    
    
   fillBodySuperStart();
}  

var showDefault = function(){
   var str = '<center>';
   if(!is_super) str + '<div><img style="cursor:pointer; margin:7px 0px;" src="'+IMG_URL+'sharegame.png" onclick="inviteFriend()"></div>';
   str+='<div>'+getAd()+'</div>'+
		'<div><iframe id=gameframe src="'+swf.url+'"width="'+swf.width+'" height="'+swf.height+'" name="game" scrolling="no" frameborder="0" ></iframe></div>'+
		'<div>'+getAd()+'</div>'+
		'</center>';
	allContent = _$("allContent");
	allContent.innerHTML = str;
}
  
 
var response_getAppVersion = function(response){
    styleJson = eval("("+response.data.json+")");
   
    if(styleJson==undefined || styleJson==null){
       styleJson = defaultJson;
    }
    if(is_super){
        CONFIG = styleJson;
        getUser();  
        setDefaultApp();   
   }
}    

 
function applyAds(adDiv, adHolderDiv){
    var adTop = document.getElementById(adDiv);
        adTop.parentNode.removeChild(adTop);
    var adHolder = document.getElementById(adHolderDiv);
        adHolder.appendChild(adTop);
        adTop.style.display='block';

}

var refreshMenu = function(){
  _$("commentContainer").innerHTML="";
}
/*    
var refreshAd = function (){
    _$("topAd").innerHTML = '<iframe frameborder="0" src = "http://adturns.com/ad.php?c=79" width = "728" height = "90" border="0" style = "border: none; overflow: hidden" frameborder="0"  scrolling="no" />';
     _$("bottomAd").innerHTML = '<iframe frameborder="0" src = "http://adturns.com/ad.php?c=80" width = "728" height = "90" border="0" style = "border: none; overflow: hidden" frameborder="0"  scrolling="no" />';	
  
}
*/

var refreshAd = function(){
	 applyAds('adDivTop', 'topAd');
	 applyAds('adDivBottom', 'bottomAd');
}

function storeDuration(){

	if (userKey == null || userKey == "null") return;
	var duration=Math.ceil(((new Date()).getTime()- window.startTime.getTime())/1000);
	var data="query=durationUpdate&userKey="+userKey+"&appId="+gameId+"&duration="+duration;
	Request.sendPOST(serviceURL, data, resp_duration);
}

var resp_duration=function(response){}


var getUserPostData = function(){
	var str = "userName="+encodeURIComponent(userName)+
			  "&thumbnail="+userThumbnail+
			  "&country="+encodeURIComponent(userCountry)+
			  "&city="+encodeURIComponent(userCity)+
			  "&region="+encodeURIComponent(userRegion)+
	    	  "&postalCode="+encodeURIComponent(userPostalCode)+
    		  "&profile="+userProfile+
    		  "&gender="+userGender+
    		  "&age="+userAge+
	    	  "&userKey="+userKey;
	
	  return str;
	
}

function getUser() {
  if (!IS_LIVE){
	   	user = {};
		userKey = "04627876712353616756";
		userAge = 2;
	    userGender = 1;
		userThumbnail = "http://c1.ac-images.myspacecdn.com/images02/18/s_d3c05914e1664ea4b08def3a557efb20.jpg";
	    //userThumbnail = "aaa.jpg";
		userName = "Lusine";
		userProfile = "http://profile.com";
	    userCountry = "am";
	    userCity = "yerevan";
	    userRegion = "yerevan";
	    userPostalCode = "374";
		var data="query=adduser&"+getUserPostData()+"&appId="+gameId;
 		Request.sendPOST(serviceURL,data, resp_addUser);
 	   
 	  if(defaultFlag || !is_super) start();
		
	}else{

        application_id = gadgets.util.getUrlParameters()["gadgetId"];
        osContainer = opensocial.Container.get();
	    var req = opensocial.newDataRequest();
	   // req.add(req.newFetchPersonRequest(opensocial.DataRequest.PersonId.OWNER), "owner");
	    var paramViewer = {};
	    paramViewer[opensocial.DataRequest.PeopleRequestFields.PROFILE_DETAILS] =
	    [opensocial.Person.Field.ADDRESSES,
	     opensocial.Person.Field.CURRENT_LOCATION,
	     
	     opensocial.Person.Field.THUMBNAIL_URL, 
	     opensocial.Person.Field.NAME, 
	     opensocial.Person.Field.AGE,
	     opensocial.Person.Field.GENDER,
	     opensocial.Person.Field.PROFILE_URL];
	   
	     req.add(req.newFetchPersonRequest(opensocial.DataRequest.PersonId.OWNER, paramViewer), "owner");
	     req.send(resp_getUser);
	    } 
};





function resp_getUser(data) {
	var user = data.get('owner').getData();
	    userKey = user.getId();
	    
	    userThumbnail = user.getField(opensocial.Person.Field.THUMBNAIL_URL);
	    userName = user.getDisplayName();
	    userProfile = user.getField(opensocial.Person.Field.PROFILE_URL);
	    userGender = user.getField(opensocial.Person.Field.GENDER).getKey(); 
	    
	    var address = user.getField(opensocial.Person.Field.CURRENT_LOCATION);
	        userCity = address.getField(opensocial.Address.Field.LOCALITY);
	        userCountry = address.getField(opensocial.Address.Field.COUNTRY);
	        userRegion = address.getField(opensocial.Address.Field.REGION);
	        userPostalCode = address.getField(opensocial.Address.Field.POSTAL_CODE);
	        userAge = user.getField(opensocial.Person.Field.AGE);
	  
	       if (typeof userAge == "undefined" || userAge == null){
		         userAge = 0;
	            }
	      if (typeof userPostalCode == "undefined" || userPostalCode == null){
		          userPostalCode = "";
	        }
	    
     
	 
	    var data="query=adduser&"+getUserPostData()+"&appId="+gameId;
 		Request.sendPOST(serviceURL,data, resp_addUser);
        initSuper();
		
}




var selectedTab = "";

var selectTab = function(tabName){
    if(tabName == "play"){
        window.startTime = new Date();
    }else{
	  storeDuration();
    }
	var tabDivs = _$("tabContainer").getElementsByTagName("td");	
	for (var i=0;i<tabDivs.length;i++){
		if (tabDivs[i].getAttribute("name") == tabName){
			tabDivs[i].firstChild.style.color = CONFIG.TAB_CONFIG.selectedColor;
			tabDivs[i].style.background = CONFIG.TAB_CONFIG.selectedBgColor;
		}else{
			tabDivs[i].firstChild.style.color = CONFIG.TAB_CONFIG.color;
			tabDivs[i].style.background = CONFIG.TAB_CONFIG.bgColor;
		}
	}
	selectedTab = tabName;
}


var initSuper = function(){

 if(IS_LIVE){
  	 var params = gadgets.util.getUrlParameters()["view-params"];
  	 if(params){
  	    var json = eval('(' + params + ')');
  	    var id = json.gameId;
        loadGame(id);
	 }else{
	    showHome();
	  }
   }else{
      showHome();
   }
  
}





var gameObj;
var loadGame = function(gameId){
	
	if (typeof gadgets == "undefined"){
		window.gadgets = {
			window : {
				adjustHeight: function(){}
			 }
		}
	 IS_LIVE =false;
	}
   isUploaded = false;
   if(gameId){
     access_to_play = false;
     Request.sendGET(serviceURL+"/getApp/"+gameId, resp_loadGame);
    }
}

var resp_loadGame = function(response){

    if (response.errorCode){
		return;
	}else{
	   var json = response.data;

	   gameTitle = json.title;
	   gameId = json.id;
	   gameDesc = json.description;
	   gameImgUrl= "http://www.playgamesite.com/arcade/img/"+json.imgLargeUrl;
	   gameRate = json.rate;
	   swf = new Object();
	   swf.url = "http://www.playgamesite.com/arcade/"+json.flashUrl;
	   swf.width = json.width;
	   swf.height = json.height;
	     
	  if(swf.width == 0 || swf.width == null) swf.width = 640;
	  if(swf.height == 0 || swf.height == null) swf.height = 480;
	   canvas_url = 'http://profile.myspace.com/Modules/Applications/Pages/Canvas.aspx?appId='+json.url;
	   gameURL = 'http://www.myspace.com/'+json.mpAppId;
	   
	   play();
	  
	}

}


//--============================== Home =============================

var showHome = function(){
   selectTab("home");
   showLoading();
    if(is_super) var _class = ' ui-widget-content ui-corner-all';
    else         var _class = '';   
	container.innerHTML = 
	 "<div class='title "+_class+"'  id=newestGamesTitle style='color:"+CONFIG.TAB_CONFIG.selectedColor+";background:"+CONFIG.textColor+";border:1px solid "+CONFIG.TAB_CONFIG.borderColor+"' >Newest Games *</div>"+
	 "<div class='content "+_class+"' id=newestGames style='border:1px solid "+CONFIG.TAB_CONFIG.borderColor+"'><div class=loading>Loading...</div></div>"+
	 "<div class='title "+_class+"' id=recentlyPopularTitle  style='color:"+CONFIG.TAB_CONFIG.selectedColor+";background:"+CONFIG.textColor+";border:1px solid "+CONFIG.TAB_CONFIG.borderColor+"'>Recently Popular </div>"+
	 "<div class='content "+_class+"' id=recentlyPopular style='border:1px solid "+CONFIG.TAB_CONFIG.borderColor+"'><div class=loading>Loading...</div></div>"+
	 "<div class='title "+_class+"' id=mostPopularTitle style='color:"+CONFIG.TAB_CONFIG.selectedColor+";background:"+CONFIG.textColor+";border:1px solid "+CONFIG.TAB_CONFIG.borderColor+"'>Most Popular </div>"+
	 "<div class='content "+_class+"' id=mostPopular style='border:1px solid "+CONFIG.TAB_CONFIG.borderColor+"'><div class=loading>Loading...</div></div>"
  showNewestGames();
  setTimeout(" showRecentlyPopular()",2000);
  setTimeout(" showMostPopular()",2500);
  
}
//- ===== request
var showNewestGames = function(){
  var request_URL = serviceURL+"/publicgame/"+HOME_APP_COUNT+"/All/";
  var page = 1;
  Request.sendGET(request_URL+page, resp_showNewestGames);
}

var showRecentlyPopular = function(){
   var request_URL = serviceURL+"/activegame/"+HOME_APP_COUNT+"/All/";
   var page = 1;
   Request.sendGET(request_URL+page,resp_showRecentlyPopular);
}

var showMostPopular = function(){
   var request_URL = serviceURL+"/populargame/"+HOME_APP_COUNT+"/All/";
   var page = 1;
   Request.sendGET(request_URL+page,resp_showMostPopular);
}
//- ======  response
var resp_showNewestGames = function(response){
    if(response)
      _$("newestGames").innerHTML=getHomeHTML(response.data,"newestGames");
    gadgets.window.adjustHeight();
}
var resp_showRecentlyPopular = function(response){
    if(response)
      _$("recentlyPopular").innerHTML=getHomeHTML(response.data,"recentlyPopular");
    gadgets.window.adjustHeight();
}
var resp_showMostPopular = function(response){
    if(response)
      _$("mostPopular").innerHTML=getHomeHTML(response.data,"mostPopular");
    gadgets.window.adjustHeight();
}


var getHomeHTML = function(data,divID){

	if(data == null || data.totalCount == 0 ){
	 _$(divID).parentNode.removeChild( _$(divID));
	 _$(divID+"Title").parentNode.removeChild( _$(divID+"Title"));
	}
	var colCount = 3;
	var str = "<table id='tableimages' cellspacing='0' width='100%'>";
	for(var i = 0;i<data.app.length;i++){
	   
	//-==- rate	   
	    var rate=0; 
	    if(data.app[i].rate != 'null') rate = data.app[i].rate;
		if(i%colCount==0){
			str+="<tr>";
		}
    //-==- link,target
		///////var  link = 'http://www.myspace.com/'+data.app[i].mpAppId;
		var link  = SUPER_URL+"&appParams=%7B%22gameId%22%3A"+data.app[i].id+"%7D";
		var  target  = '_blank';
		if(is_super) {
		  link = 'javascript:loadGame('+data.app[i].id+')';
		  target = ''; 
		}
	//-==- img	
		var img_src = '';
		if(divID == "newestUploaded"){
		  img_src = FS_IMG_URL + data.app[i].imgLarge;		
		}else{
			if(typeof data.app[i].imgLarge == "undefined") img_src = FS_IMG_URL+data.app[i].id+"_75.png";
			else                                           img_src = GAME_IMG_URL+data.app[i].imgLarge;
		}	
   //-==- totalplays
		if(data.app[i].totalplays == null  || typeof data.app[i].totalplays == "undefined") data.app[i].totalplays = 0;
   //-==- creator
        var creatorStr = "";
        if(data.app[i].creatorId != null  || typeof data.app[i].creatorId != "undefined"){
	        var date = new Date(data.app[i].createdOn);
			var hours = date.getHours();
			var minutes=date.getMinutes();
			    minutes=((minutes < 10) ? "0" : "") + minutes;
			var dateStr = monthname[date.getMonth()] + " " + date.getDate() + " , " +
						  date.getFullYear() + " " + hours + ":" + minutes;
			 if( data.app[i].creatorName.length > 20) data.app[i].creatorName = data.app[i].creatorName.substring(0,20);
	         creatorStr = '<tr><td><b>Creator:    </b><div class=userDiv><a target="_blank" href="'+data.app[i].creatorProfile+'">'+'<img src="'+data.app[i].creatorImg+'" class=userImg /><label class=userText>'+ data.app[i].creatorName+'</label></a><div>'+'</td></tr>'+ 
						  '<tr><td><b>Created On: </b>'+dateStr+'</td></tr>'; 
   	   }
   	//-==- description,gamename
         if(data.app[i].desc.length > 150) data.app[i].desc = data.app[i].desc.substring(0,150);
         if( data.app[i].gamename.length > 20) data.app[i].gamename = data.app[i].gamename.substring(0,20);
        
   	
		str+='<td>'+
				//"<a style='color:"+CONFIG.highLightedTextColor+";font-size:10px;' href='"+link+"' target='"+target+"'>"+
				//"<img src='"+img_src+"' id='"+data.app[i].id+"' index='"+i+"' border='none' style='margin-right:8px'  width='64px' height='64px'></img>";	
		//str+=showRate(rate,10);
		//str+="<div style='width:100px; overflow:hidden'>"+data.app[i].gamename+"</div></a>  "+data.app[i].totalplays+"</td>";
		
	        '<div class="box_row" style="width: 95%;" >'+
			'<div class="tr" style="background-image: url('+IMG_URL+'tr.gif);"></div>'+
			'<div class="tl" style="background-image: url('+IMG_URL+'tl.gif);"></div>'+
			'<div class="br" style="background-image: url('+IMG_URL+'br.gif);"></div>'+
			'<div class="bl" style="background-image: url('+IMG_URL+'bl.gif);"></div>'+
			'<div class="border" >'+
				'<table cellspacing="0" cellpadding="0" style="margin-left: 5px; margin-right: 5px;">'+
				  '<tr>'+
					   '<td>'+
					    '<a style="color:'+CONFIG.highLightedTextColor+';font-size:10px;" href="'+link+'" target="'+target+'">'+
					     '<img src="'+img_src+'" id="'+data.app[i].id+'" index="'+i+'" border="1px solid gray" style="margin-right:8px"  width="80px" height="80px"></img>'+
					     showRate(rate,10)+
					    '</a>'+
					   '</td>'+
					   '<td>'+
					    // '<div class=homeText width="110px">'+'<b>'+data.app[i].gamename+'</b><br/><br/>'+data.app[i].desc+'</b><br/><br/>'+creatorStr+
					       '<table class=homeText><tr><td>'+'<b>'+data.app[i].gamename+'</b>'+'</td></tr>'+
					              '<tr><td>'+data.app[i].desc+'</td></tr>'+  
                                   creatorStr+
					       '</table>'+       
					   '</td>'+
				   '</tr>'+
				   '<tr>'+
				 	   '<td>'+
	                     '<div style="margin-top: 2px; font-size: 11px; color: gray;">Played: '+data.app[i].totalplays+'</div>'+
					   '</td>'+
					   '<td>'+
					     '<a style="border: medium none ;" href="'+link+'" target="'+target+'">'+
	                       '<img src="'+IMG_URL+'play_now.png" class="playnow_btn" />'+
	                     '</a>'+
					   '</td>'+      
				   '</tr>'+
				 '</table>'+
			  '</div>'+
			'</div>';		  
			     
		if(i%colCount == colCount){
			str+="</tr>";
		}
	}
	str += "</table>";
	return str;
}

//--=================================================================================


var resp_addUser=function(response){
	//Request.sendGET(serviceURL+"/checkForFavorite/"+userKey+"/"+gameId, resp_checkForFavorite); 	
}

function getFullScreenURL() {
	var myWidth = 0, myHeight = 0;
    if (window.screen){
    	myWidth = window.screen.width;
    	myHeight = window.screen.height;
    }else if( typeof( window.innerWidth ) == 'number' ) {
          myWidth = window.innerWidth;
          myHeight = window.innerHeight;
    }else if(document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
          myWidth = document.documentElement.clientWidth;
          myHeight = document.documentElement.clientHeight;
    }else if(document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
         myWidth = document.body.clientWidth;
         myHeight = document.body.clientHeight;
   	}
   	var url=swf.url;
	if(gameId){
   		url = "http://www.playgamesite.com/playgame1.php?getgame="+gameId+"&width=" + myWidth + "&height=" + myHeight;	 
	}	
   	return url;
}


var play = function(){
    selectTab("play");
	getFlash();
	if(!access_to_play)  showGameMask();
	
	 var str ="<table>"+
				   "<tr>"+
					  "<td>"+
					      "<img class='ui-widget-content ui-corner-all' src='"+gameImgUrl+"'  width='100px' height='100px'>"+  
					  "</td>"+
					  "<td>"+
					    "<h1>"+gameTitle+"</h1>";
				 if(typeof gameRate != "undefined")
	              str+= showRate(gameRate,13)+"<br/>";
				  str+=	"<div style='color: #999999;overflow:hidden;height:30px;width:250px;'>"+gameDesc+"</div>"+   
				      "</td>"+
					"</tr>"+
			  "</table>";

	      _$("curGame").innerHTML = str;
	
	setTimeout("req_checkFavorite()",500);
	setTimeout("req_checkRecommand()",500);

}


var getFlash = function(){
 var gameStr = 
	'<center><div id="game_container">'+
	  	//'<iframe   id=gameframe src="'+swf.url+'"width="'+swf.width+'" height="'+swf.height+'" name="game" scrolling="no" frameborder="0">'+
	  	'<embed  wmode="transparent" id=gameframe src="'+swf.url+'"width="'+swf.width+'" height="'+swf.height+'" name="game" scrolling="no" frameborder="0" >'+
	  	'</embed>'+
	'</div></center>';
	container.innerHTML = gameStr;
}

var access_to_play = false;

function showGameMask(games_str){
	 
	/* var mask_google_ad = '<iframe src="'+serverURL+'preloading_ad.html" scrolling="no" frameborder="0"  width="336" height="280" ></iframe><br/>'+
	                      '<p style="font-size:12px;font-weight:bold;">Please wait...<img style="border:none;" src="'+serverURL+'img/loading.png"/></p><br/>';
	   
	 var mask_opensotial_ad = '<iframe width="300" height="250" frameborder="0"  scrolling="no"  border="0" src="http://ads.socialmedia.com/myspace/monetize.php?width=300&height=250&pop=1&pubid=d12e15f11d632c0a68e80b98085e63b8&bgcolor=FFFFFF&bordercolor=FFFFFF" id="ad1"></iframe>';
	 
	 var mask_ad_array = new Array(mask_google_ad,mask_opensotial_ad);
	 var random = Math.round(Math.random()); 
*/
	access_to_play = true;                    
	var bodyMask = document.createElement("div");
	bodyMask.className = "game-mask";
	bodyMask.id = "game-mask";
	bodyMask.onclick = function(ev){
		if (window.event) ev = window.event;
		ev.cancelBubble = true;
		return false;
	}
	_$("game_container").appendChild(bodyMask);
	var preloadingBox  = document.createElement("div");
	preloadingBox.className = "preloading-dlg-super";
	preloadingBox.id = "preloading-dlg-super";
	//preloadingBox.innerHTML =mask_ad_array[random];
	
	
	 _$("game_container").appendChild(preloadingBox);
	 applyAds('adDivSquare', 'preloading-dlg');
	 setTimeout("removeGameMask()",20000);
	
}

var removeGameMask = function(){
   _$("game-mask").parentNode.removeChild(_$("game-mask"));
   _$("preloading-dlg-super").parentNode.removeChild(_$("preloading-dlg-super"));

}

var resp_maskRandomGames = function(response){
    var data = response.data;
	var str = "<table  cellspacing='0' style='margin-top:10px;width:100%;'>";
	for(var i = 0;i<data.apps.length;i++){
	    var title = data.apps[i].gameName;
	    if(title.length > 20) title = title.substring(0,20);
		str+="<td valign=top>"+
				"<a style='font-size:8px;' href='javascript:loadGame("+data.apps[i].id+")' >"+
				"<img  border='none' width='60px' height='60px'  src='"+FS_IMG_URL+ data.apps[i].id+"_75.png'></img>";
		str+="<div style='width:55px; overflow:hidden'>"+title+"</div></a></td>";
	
	}
	str += "</table>";
	showGameMask(str);
}




var req_checkFavorite = function(){
  Request.sendGET(serviceURL+"/checkForFavorite/"+userKey+"/"+gameId, resp_checkForFavorite);
}

var resp_checkForFavorite=function(response){
	var json=response.data;

	if(json.totalCount==0){
  		_$("favorite").innerHTML = '[ <img  src="'+MENU_IMG_URL+'favorite.png" class="icon" /><a style="color:'+CONFIG.highLightedTextColor+'" href="javascript:req_addToFavorites()" />Add to Favorites</a> ]';
	}

  	gadgets.window.adjustHeight();
}




var req_checkRecommand = function(){
  Request.sendGET(serviceURL+"/checkForRecommend/"+userKey+"/"+gameId, resp_checkForRecommand);
}

var resp_checkForRecommand=function(response){
	var json=response.data;

	if(json.totalCount==0){
  			_$("recommend").innerHTML = '[<a style="color:'+CONFIG.highLightedTextColor+'" href="javascript:req_addToRecommend()"><img  src="'+MENU_IMG_URL+'recommend.png" class=icon />Recommend</a>]';
	}
	
  	gadgets.window.adjustHeight();
}


var showInvite = function(){
  	var str =
  
  	"<div style='margin: 30px 0px;'>"+
  	    "<div class='titleGeneral title"+styleJson.classV+"'>Invite Friends</div>"+
	    "<div class=content"+styleJson.classV+" id=friend style='padding-bottom:0px;'><div class=loading>Loading...</div></div>"+
	    "<div id=inviteAllFriend align='center'><img class='sendButtonInvite' src='"+IMG_URL+"sharegame.png' onclick='inviteFriend()' ></div>"+
	"</div>";
    _$("container").innerHTML = str;
     Invite.show();
}



////////////////////////////
var Invite = function(){
	var curPage = 1;
	var containerId = "friend";
	var receivedFriendsCount = 0;
	var friendsTotalCount = 0;
	var cellCount=8;
	
	return {
		prev: function(){
			_$(containerId+"_"+curPage).style.display = "none";
			_$(containerId+"_"+(curPage-1)).style.display = "";
			curPage--;
			_$(containerId).setAttribute("curPage", curPage);
		},
			
		next: function(){
			var nextPage = curPage + 1;
			if (_$(containerId+"_"+nextPage)){
				_$(containerId+"_"+nextPage).style.display = "";
				_$(containerId+"_"+(nextPage-1)).style.display = "none";
			}else{
				var height = _$(containerId+"_"+curPage).offsetHeight;
				_$(containerId+"_"+curPage).style.display = "none";
				_$(containerId).innerHTML += "<div id="+containerId+"_"+nextPage+"><div class=loading style='height:"+height+"px;'>Loading...</div></div>";
				Invite.req_getFriends(nextPage);
			}
			curPage++;
			_$(containerId).setAttribute("curPage", curPage);
		},
		
		req_getFriends: function(page){
			var req = opensocial.newDataRequest();
			opensocial.DefaultPageSize = cellCount*4;
			var params = {}; 
	   		params[opensocial.DataRequest.PeopleRequestFields.FIRST] = (page-1)*opensocial.DefaultPageSize;
			req.add(req.newFetchPeopleRequest("VIEWER_FRIENDS", params), "friends");
			req.send(Invite.resp_getFriends);
		},
		
		resp_getFriends: function(response){
			var friends = response.get("friends").getData().asArray();
			allFriends = allFriends.concat(friends);
			receivedFriendsCount += friends.length;
			friendsTotalCount = response.get('friends').getData().getTotalSize();
			var str = "<table width=100%>";
			for(var i=0; i<friends.length;i++) {
				if (i % cellCount == 0) str+= "<tr>";
				var friendId = friends[i].getField(opensocial.Person.Field.ID);
		        var name = friends[i].getDisplayName();
			    if(name.length>15){
	        	    name = name.substring(0,15)+"\n"+name.substring(15);
	              }
			  
			    var thumbnail = friends[i].getField(opensocial.Person.Field.THUMBNAIL_URL);
			    var profile = friends[i].getField(opensocial.Person.Field.PROFILE_URL);
			    str += "<td name=userCell class=friendBox width="+(100/cellCount)+"% >"+
							"<table valign=top width=100%>"+
								"<tr>"+
		        					"<td style='font-size:10px;color:#333333' title='"+name+"'>"+name+"</td>"+
			        				"<td style='display:none' align=right><input checked type=checkbox name='checkBox' id='"+friendId+"' /></td>"+
	           					"</tr>"+
	           					"<tr>"+    
									"<td><img style='cursor:pointer' onclick='inviteFriend(\""+friendId+"\")' class=smallImg src='"+thumbnail+"' /></td>"+
								"</tr>"+
							"</table>"+
						"</td>";
				if (i % cellCount == cellCount-1) str += "</tr>";
			}
			var available = receivedFriendsCount < friendsTotalCount;
			if (available || curPage>1){
				str += "<tr><td colspan="+cellCount+" align=right>";
							if (curPage>1)
							str+=
							"<a href='javascript:Invite.prev()' style='margin-right:10px;font-size:16px;font-weight:bold;'>Previous</a>";
							if (available)
							str+=
							"<a href='javascript:Invite.next()' style='margin-right:10px;font-size:16px;font-weight:bold;'>Next</a>"+
						"</td></tr>";
			}
			str += "</table>";
			_$(containerId+"_"+curPage).innerHTML = str;
			gadgets.window.adjustHeight();
		},
		
		getSelectedFriends:  function(){
			var friends = [];
			var pg = _$("friend").getAttribute("curPage");
			var inputs = _$("friend_"+pg).getElementsByTagName("input");
			for (var i=0;i<inputs.length;i++){
				if (inputs[i].checked && inputs[i].getAttribute("hasTaken")!="true"){
					var id = inputs[i].id;
					if (id != 6221){
						friends[friends.length] = id;
					}
				}
			}
			return friends;
		},
		
		show: function(id, title, img){
			var cont = _$(containerId);
			allFriends = [];
			curPage = 1;
			receivedFriendsCount = 0;
			friendsTotalCount = 0;
			var table = document.createElement("table");
			table.width="100%";
			var sendCont = document.createElement("tbody");
			var row2 = document.createElement("tr");
			sendCont.appendChild(row2);
			var cell2 = document.createElement("td");
			cell2.align = "center";
			row2.appendChild(cell2);
		
			table.appendChild(sendCont);
			cont.parentNode.appendChild(table);
			
			cont.innerHTML = "<div id="+containerId+"_1></div>";
			cont.setAttribute("curPage", 1);
			
			Invite.req_getFriends(curPage);
		}
	};
}();


var inviteFriend = function(friendId){
      var content = "I've found this cool game. ADIIIIIICTIVE! <br><br>"+
	    "<p>Play now!</p>" + GAME_URL + application_id;
          postTo_("OMG! Check this out!", content, friendId, "SEND_MESSAGE");
}


var postTo_ = function(subject, content, receiver){
   		if(receiver!=null){
				var message = opensocial.newMessage(content);
				message.setField(opensocial.Message.Field.TITLE, subject);
				message.setField(opensocial.Message.Field.TYPE, opensocial.Message.Type.EMAIL);
				opensocial.requestSendMessage(receiver, message);
			}else{
				postMessage(subject,content);
			}
		
		}
		
//////////// For All
var postMessage = function(subject, content){
	
	var message = opensocial.newMessage(content);
	message.setField(opensocial.Message.Field.TITLE, subject);
	message.setField(opensocial.Message.Field.TYPE, opensocial.Message.Type.PRIVATE_MESSAGE);
	opensocial.requestSendMessage("VIEWER_FRIENDS", message);
	
} 

/////////////////////////////////////////////////////////


var resp_getNewApps = function(response){
	_$("newApps").innerHTML = response.text; 
	gadgets.window.adjustHeight();
}


var req_addToFavorites=function(){
	var data="query=addFavorite&userKey="+userKey+"&appId="+gameId;
    Request.sendPOST(serviceURL,data, resp_addToFavorites);
}

var resp_addToFavorites=function(response){
    var favDiv=_$("favorite"); 
   	if (response.text == "ok"){
	   favDiv.innerHTML="";
	}
}



var req_addToRecommend=function(){
	var data="query=addRecommend&userKey="+userKey+"&appId="+gameId;
    Request.sendPOST(serviceURL,data, resp_addToRecommend);
}


var resp_addToRecommend=function(response){
    var favDiv=_$("recommend"); 
   	if (response.text == "ok"){
	   favDiv.innerHTML="";
	}
}




var showUserFavorites=function(page){  
    page=1;
    selectTab("favorites");
    Request.sendGET(serviceURL+"/getFavorites/"+userKey+"/"+APP_COUNT+"/"+page, resp_showUserFavorites);
  }




var resp_showUserFavorites=function(response)
{
  var json=response.data;
  var userFavorites = json.favorites;
  var currentPage=json.page;
  var str="";
     if(json.totalCount!=0)
     {
       str+="<div align='center' style='margin-top:20px' id='removeConfirm'></div>";
       str+="<table cellspacing=12>";
       for (var i=0;i<userFavorites.length;i++){
			fav = userFavorites[i];
			fav.appUrl = GAME_URL + fav.gameId;
			if ( i % 4 == 0) str += "<tr>";
			str += "<td><table><tr>"+
					"<td><img src='"+IMG_URL+"remove.png' style='cursor:pointer;' onclick='javascript:showDeleteFavorite("+fav.gameId+")'><div><a  href='javascript:loadGame("+fav.gameId+")'><img width=80px height=80px src='"+GAME_IMG_URL+fav.imageUrl+"' /></a></div></td>"+	
					"<td valign='top' style='padding-top:10px;'><div style='width:60px;'>"+
						"<a target=_blank href='"+fav.appUrl+"'><b>"+fav.gameName+"</b></a>"+
						"<div style='margin:3px 0px;'>"+fav.gameCat+"</div>"+
					"</div></td>"+
				  "</tr></table></td>";
		  	if ( i % 4 == 3) str += "</tr>";
		}
      
       var pageCount = Math.ceil(json.totalCount / APP_COUNT);
       if (pageCount>1){
			str += "<tr><td colspan=4 align=right>";
			for (var p = currentPage-2; p<currentPage+2;p++){
				if (p > 0 && p <= pageCount){
					var color = p == currentPage ? "color: black" : "";
					str += "<a style='margin: 0px 7px;"+color+"' href='javascript:showUserFavorites("+p+")' >"+p+"</a>";
				}
			}
			if (currentPage < pageCount){
				str += "<a style='margin: 0px 7px;' href='javascript:showUserFavorites("+(currentPage+1)+")'>Next</a>";
			}
			str += "</td><tr>";
		}
		str += "</table>";
     }
     else 
     {
     str+="<center><div style='height:50px; padding-top:25px; font-size:15px;font-weight:bold;'>You have no favorite game.</center>";
     }
      container.innerHTML=str;
}
////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////

var showDeleteFavorite = function(gameId){
   var confirmBox = document.getElementById('removeConfirm');
   var content="";
       content += "<div align='center' class='confirmBox"+styleJson.classV+"'>"+
                       "Are you sure you want to remove from favorites?"+
                       "<div class='buttonlist' style='margin-top:10px;color:"+styleJson.titleColor+"'><a href='javascript:deleteFavorite("+gameId+")'>Yes</a><a href='javascript:showUserFavorites(1)'>No</a></div>"
                 "</div>"; 
    confirmBox.innerHTML=content;
  
}

var deleteFavorite = function(gameId){
     var confirmBox = document.getElementById('removeConfirm');
     confirmBox.innerHTML = "<img src='"+IMG_URL+"loading"+styleJson.classV+".gif'>";
     Request.sendGET(serviceURL+"/removeFavorite/"+userKey+"/"+gameId, resp_deleteFavorite);
}

var resp_deleteFavorite = function(response){
   showUserFavorites(1);
}

/////////////////////////////////////////////////////////////

var showPlayers=function(){
	selectTab("players");
    if(is_super) var _class = ' ui-widget-content ui-corner-all';
    else         var _class = '';   
	container.innerHTML = 
	 "<div class='title "+_class+"' style='color:"+CONFIG.TAB_CONFIG.selectedColor+";background:"+CONFIG.TAB_CONFIG.selectedBgColor+";border:1px solid "+CONFIG.TAB_CONFIG.borderColor+"' >Recent Players</div>"+
	 "<div class='content "+_class+"' id=recentUsers style='border:1px solid "+CONFIG.TAB_CONFIG.borderColor+"'><div class=loading>Loading...</div></div>"+
	 "<div class='title "+_class+"' style='color:"+CONFIG.TAB_CONFIG.selectedColor+";background:"+CONFIG.TAB_CONFIG.selectedBgColor+";border:1px solid "+CONFIG.TAB_CONFIG.borderColor+"'>Active Players</div>"+
	 "<div class='content "+_class+"' id=activeUsers style='border:1px solid "+CONFIG.TAB_CONFIG.borderColor+"'></div>";	
	req_getRecentUsers();
	req_getActiveUsers(1);
}

var req_getActiveUsers=function(page){
	_$("activeUsers").innerHTML = "<div class=loading>Loading...</div>";
	Request.sendGET(serviceURL+"/getMostPlayed/"+PLAYERS_COUNT+"/"+page, resp_getActiveUsers);
}

var resp_getActiveUsers=function(response){
	var hours,minutes,seconds,remainder; 
  	var json=response.data;
 	var userList = json.users;
  	var currentPage=json.page;
  	var str="<table width=100%>";
	var colCount = 4;
  	for (var i=0;i<userList.length;i++){
		var user = userList[i];
		if ( i % colCount == 0) str += "<tr>";
		 hours=(user.duration-user.duration%3600)/3600;
     	 remainder=user.duration%3600;
      	 minutes=(remainder-((remainder)%60))/60;
		str += "<td><table><tr>"+
			"<td><a target=_blank href='"+user.profileUrl+"'><img src='"+user.thumbnailUrl+"' /></a></td>"+	
			"<td valign='top'>"+
				"<div class=fixedText style='height:70px;width:100px;overflow:hidden;'>"+
				      "<div style='margin-bottom:5px;color:#8C8C8C;height:15px;overflow:hidden;'><a style='color:#02679C;' target=_blank href='"+user.profileUrl+"'>"+user.userName.substring(0,10)+"...</b></a></div>"+
				      "<span style='color:#999999'>played:</span>"+
				      "played <b style='color:#5CC46B;'>"+hours+"h "+minutes+"min</b></div>"+
			    "</div>"+
			"</td>"+
		  "</tr></table></td>";
	  	if ( i % colCount == (colCount - 1) ) str += "</tr>";
	} 
    var pageCount = Math.ceil(json.totalCount / PLAYERS_COUNT);
    if (pageCount>1){
		str += "<tr><td colspan="+colCount+" align=right>";
		for (var p = currentPage-2; p<currentPage+2;p++){
			if (p > 0 && p <= pageCount){
				var color = p == currentPage ? "color: black" : "";
				str += "<a style='margin: 0px 7px;"+color+"' href='javascript:req_getActiveUsers("+p+")' >"+p+"</a>";
			}
		}
		if (currentPage < pageCount){
			str += "<a style='margin: 0px 7px;' href='javascript:req_getActiveUsers("+(currentPage+1)+")'>Next</a>";
		}
		str += "</td><tr>";
	}
	str += "</table>";
   	_$("activeUsers").innerHTML=str;
   	gadgets.window.adjustHeight();
}


var req_getRecentUsers=function(){
	Request.sendGET(serviceURL+"/recentusers", resp_getRecentUsers);
}


var resp_getRecentUsers=function(response){
	var userList = response.data;
	var str = "<table width=100%>";
	var colCount = 4;
	for (var i=0;i<userList.length && i<colCount*7;i++){
  		var user = userList[i].user;
		var app = userList[i].app;
	
		if ( i % colCount == 0) str += "<tr>";		
		str += "<td><table><tr>"+
			"<td><a target=_blank href='"+user.profile+"'><img src='"+user.thumbnail+"' /></a></td>"+	
			"<td valign='top'>"+
				"<div class=fixedText style='color:"+CONFIG.textColor+";height:70px;width:100px;overflow:hidden;'>"+
				      "<div style='margin-bottom:5px;color:#8C8C8C;height:15px;overflow:hidden;'><a style='color:#02679C;' target=_blank href='"+user.profile+"'>"+user.name.substring(0,10)+"...</b></a></div>"+
				      "<span style='color:#999999'>played:</span>"+
				      "<a  href='loadgame("+app.id+")' style='color:"+CONFIG.highLightedTextColor+";font-weight:bold;'>"+app.title+"</a>"+
			    "</div>"+
			"</td>"+
		  "</tr></table></td>";
  		if ( i % colCount == (colCount -1) ) str += "</tr>";
	}
    str += "</table>";
    _$("recentUsers").innerHTML=str;
    gadgets.window.adjustHeight();
}



var showAllGames = function(){
	selectTab("allgames");
	
	Request.sendGET(serviceURL+"/getCategories", resp_getCategories);
	container.innerHTML ="<table width='100%'><tr>"+
	 "<td valign='top'><div id='leftBox'><div class=loading>Loading...</div></div></td>"+
	 "<td valign='top'>"+
	 "<table><tr><td>"+
	 "<table id='gameTypes' style='font-size:14px;'><tr><td name='new'>"+
	 "<a style='color:"+CONFIG.highLightedTextColor+"' href=javascript:selectType('new'); >New Games</a></td>"+
	 "<td> | </td><td name='popular'>"+
	 "<a style='color:"+CONFIG.highLightedTextColor+"' href=javascript:selectType('popular'); >Popular Games </a></td>"+
	 "<td> | </td><td name='active'>"+
	 "<a style='color:"+CONFIG.highLightedTextColor+"' href=javascript:selectType('active'); >Active Today</a></td>"+
	 "<td><div id='search_form'></div></td></tr></table></td></tr>"+
	 "<tr>"+
	 "<td valign='top'><div id='categoryGames'></div>"+
	 "</td></tr></table></td>"+
   	 
	 "<td valign='top'><div style='width:180px'>"+
	   "<div style='height:20px;font-size:14px;padding-top:5px;border:1px solid "+CONFIG.TAB_CONFIG.borderColor+";color:"+CONFIG.TAB_CONFIG.selectedColor+";background:"+CONFIG.TAB_CONFIG.selectedBgColor+";font-weight:bold;padding-left:10px;'>Recommendations</div>"+
	   "<div id=recommendation style='padding-bottom:0px;'><div class=loading>Loading...</div></div>"+
	   "</div>"+
	 "</td></tr></table>";	
	 
	 Request.sendGET(serviceURL+"/getRecommendedGames/"+RECOMMENDED_COUNT,resp_getReccomended);
  	 search_button();
}


var resp_getReccomended = function(response){

   	var recommend =  _$("recommendation"); 
    var json = response.data;
    var dataList = json.data;
   	var str = "<table width=100% cellspacing='2' style='border:1px solid "+CONFIG.TAB_CONFIG.borderColor+";'>";
    for (var i=0;i<dataList.length;i++){
  		var data = dataList[i];
  	
  		////////var  link = CANVAS_URL + data.appUrl;
  	   var link  = SUPER_URL+"&appParams=%7B%22gameId%22%3A"+data.id+"%7D";
		var  target  = '_blank';
		if(is_super) {
		  link = 'javascript:loadGame('+data.id+')';
		  target = ''; 
		}

		str += "<tr>"+
		           '<td style="cursor:pointer;color:'+CONFIG.TAB_CONFIG.color+'; background:'+CONFIG.bgColor+';">'+
		              "<div style='height:13px;overflow:hidden;'><a style='color:"+CONFIG.textColor+";' target=_blank href='"+data.userProfile+"'>"+data.name+"</b></a></div>"+
		              "<table cellspacing=0>"+
		                 "<tr>"+
		                     "<td>"+
		                       "<div><a target=_blank href='"+data.userProfile+"'><img  style='width:35px;height:35px;' src='"+data.thumbnail+"' /></a></div>"+
		                  	 "</td>"+
		                  	 "<td style='padding-left:5px;'>"+
		                     	"<div style='color:"+CONFIG.textColor+"'>recommended:</div>"+
		                     	"<div style='height:30px;width:90px;overflow:hidden;'><a target='"+target+"'   href='"+link+"' style='color:"+CONFIG.highLightedTextColor+";font-weight:bold;'>"+data.gamename+"</a></div>"+
			                 "</td>"+
		               	"</tr>"+
		             "</table>";
		str+="</td></tr>";
	}
 	str += "</table>";
  	recommend.innerHTML = str;
}


var resp_getCategories = function(response){
	var json=response.data.categories;
	selectedType='new';
	if(is_super)  var _class = 'ui-widget-content ui-corner-all';
	else          var _class = '';
	str='<div class="categoryTitle" style="color:'+CONFIG.highLightedTextColor+'">Categories</div>'+
	    '<table  class="'+_class+'" id="CategoryContainer" cellspacing="2" style="border:1px solid '+CONFIG.TAB_CONFIG.borderColor+'";>'+
		'<tr><td class="'+_class+'"  onclick="selectCategoryStyle(\'All\')" onmouseover="changeCategoryStyle(\'All\')" onmouseout="changeCategoryStyle(\'\')" name="All" style="cursor:pointer;color:'+CONFIG.TAB_CONFIG.color+'; background:'+CONFIG.TAB_CONFIG.bgColor+';">'+
		'<a href=# style="color:'+CONFIG.TAB_CONFIG.color+';"><b>All</b></a></td></tr>';  
	for(var i=0;i<json.length;i++){
	   if(json[i] != "")
    	str+='<tr><td class="'+_class+'" onclick="selectCategoryStyle(\''+json[i]+'\')" onmouseover="changeCategoryStyle(\''+json[i]+'\')" onmouseout="changeCategoryStyle(\'\')" name="'+json[i]+'" style="cursor:pointer;color:'+CONFIG.TAB_CONFIG.color+'; background:'+CONFIG.TAB_CONFIG.bgColor+';">'+
    	'<a href=# style="color:'+CONFIG.TAB_CONFIG.color+';"><b>'+json[i]+"</b></a></td></tr>";
   	}
   	str+="</table></div>";
    _$("leftBox").innerHTML=str;
    selectCategory("All");
    selectType('new');
    	
}


var search_button=function(response)
 {
    var search_div = _$("search_form"); 
    var str='<form name="search" onsubmit="return false"><table >'+
        	"<tr>"+
        		"<td ><input type='text' name='gameName'/></td>"+
        		"<td colspan=3 align='right'><input style='color:"+CONFIG.TAB_CONFIG.selectedColor+"; background:"+CONFIG.TAB_CONFIG.selectedBgColor+"; border:1px solid "+CONFIG.TAB_CONFIG.borderColor+"' type='submit' value='Search' onclick='getCategoryGames(1)' /></td>"+
          "</tr></table></form>";
    str+="<div id='searchResult' ></div>";      
          
     search_div.innerHTML=str;
 }
 
 
 var getCategoryGames=function(page)
  {
  var category = selectedCategory; 
  var type = selectedType;
  if (type == "RandomGames") type = "popular";
  var gameName = document.search.gameName.value;
  var result=_$("categoryGames");
  if(gameName=="" || category=="")
   {
    return;
   }
   else 
   {
    result.innerHTML = "<div  id=catGames></div>";
    request_URL = serviceURL+"/getCategoryGames/"+category+"/"+gameName+"/"+GALLERY_APP_COUNT+"/"+type+"/";
    Request.sendGET(request_URL+page, resp_getNewApps2);
   }
    
  }
 var changeCategoryStyle = function(catName)
{
    var tabDivs = _$("CategoryContainer").getElementsByTagName("td");
    for (var i=0;i<tabDivs.length;i++){
		if (tabDivs[i].getAttribute("name") == catName){
			tabDivs[i].firstChild.style.color = CONFIG.TAB_CONFIG.selectedColor;
			tabDivs[i].style.background = CONFIG.TAB_CONFIG.selectedBgColor;
		}else{
			tabDivs[i].style.color = CONFIG.TAB_CONFIG.color;
			tabDivs[i].firstChild.style.color = CONFIG.TAB_CONFIG.color;
			if(tabDivs[i].getAttribute("name") == selectedCategory)
			{
			tabDivs[i].style.background =CONFIG.TAB_CONFIG.selectedBgColor;
			}
			else 
			{
			tabDivs[i].style.background = CONFIG.TAB_CONFIG.bgColor;
			}
		}
		
}
}
var selectCategoryStyle = function(catName)
{
  var type = selectedType;
      selectCategory(catName);
      selectType(type);
}


var global_request = function(page){
    Request.sendGET(request_URL+page,resp_getApps);
 }


var req_getApps = function(page,categoryName){
    _$("otherApps").innerHTML = "<center><img src='"+IMG_URL+"loading"+styleJson.classV+".gif' ></center>";
    request_URL = serviceURL+"/publicgame/"+GALLERY_APP_COUNT+"/"+categoryName+"/";
	Request.sendGET(request_URL+page, resp_getApps);
}

var resp_getApps = function(response){
		PUBLIC_APPS = response.data;
		var str = getAppsHTML(PUBLIC_APPS);
		_$("otherApps").innerHTML = str; 
		gadgets.window.adjustHeight();
}


var selectCategory = function(catName){
    var tabDivs = _$("CategoryContainer").getElementsByTagName("td");
    for (var i=0;i<tabDivs.length;i++){
		if (tabDivs[i].getAttribute("name") == catName){
		    tabDivs[i].firstChild.style.fontStyle = "italic";
			tabDivs[i].style.background = CONFIG.TAB_CONFIG.selectedBgColor;
		}else{
			tabDivs[i].firstChild.style.fontStyle = "normal";
			tabDivs[i].style.background = CONFIG.TAB_CONFIG.bgColor;
		}
		
}
    selectedCategory = catName;
}

var selectTypeStyle = function(tabName){
    var links = _$("gameTypes").getElementsByTagName("a");
    for (var i=0;i<links.length;i++){
		links[i].style.fontWeight = links[i].parentNode.getAttribute("name") == tabName ? "bold" : "normal"; 
	}
 	selectedType = tabName;
}

var selectContainer = function(id){
	if (id == "container"){
		_$(id).style.display = "";
		_$("flashContainer").style.display = "none";
	}else
	  if( id == "flashContainer"){
		_$("container").style.display = "none";
		_$(id).style.display = "";
	}
}
var selectType =function(tabName)
{
   var catName = selectedCategory;
   selectTypeStyle(tabName);
   if(tabName == 'new')
   {
   req_getNewApps2(1,catName);
   }
   
   else if(tabName == 'popular')
   {
    req_getPopularApps(1,catName);
   }
   else if(tabName =='active')
   {
      req_getActiveApps(1,catName);
   }
   
}

var req_getNewApps2 = function(page,categoryName){
    selectCategory(categoryName);
    request_URL = serviceURL+"/publicgame/"+GALLERY_APP_COUNT+"/"+categoryName+"/";
	Request.sendGET(request_URL+page, resp_getNewApps2);
}

var req_getNewApps = function(page){
    var url = serverURL+"publicApps.jsp?page="+page;
    if(is_super)  url+="&is_super="+is_super;
	Request.sendGET(url, resp_getNewApps);
}
var req_getPopularApps = function (page,categoryName){
    selectCategory(categoryName);
    request_URL = serviceURL+"/populargame/"+GALLERY_APP_COUNT+"/"+categoryName+"/";
    Request.sendGET(request_URL+page,resp_getNewApps2);
}
req_getActiveApps =function(page,categoryName){
   selectCategory(categoryName);
   request_URL = serviceURL+"/activegame/"+GALLERY_APP_COUNT+"/"+categoryName+"/";
   Request.sendGET(request_URL+page,resp_getNewApps2);
}

var resp_getNewApps = function(response){
	_$("newApps").innerHTML = response.text; 
	gadgets.window.adjustHeight();
}
var resp_getNewApps2 = function(response){
	PUBLIC_APPS = response.data;
	var str = getAppsHTML(PUBLIC_APPS);
	if(is_super)   var style = "border:1px solid "+CONFIG.TAB_CONFIG.selectedBgColor+";background:"+CONFIG.bgColor+";"; 
	else           var style = "border:1px solid "+CONFIG.TAB_CONFIG.borderColor+";background:"+CONFIG.TAB_CONFIG.selectedBgColor+";"; 
	_$("categoryGames").innerHTML = "<div id='aboutDiv' onmouseout='divmouseout()' onmouseover='divmouseover()' class='aboutDiv ui-widget-content ui-corner-all' style='display:none;"+style+"'></div>"+str; 
	gadgets.window.adjustHeight();
}

var showRate = function(rate,h){
    var str="";
    str ="<div style='width:90px'>";
    for(var j=0;j<5;j++){
			          if(j<rate)
			             str += '<span><img src="'+IMG_URL+'star.png" style="height:'+h+'px"></span>';
			          else  
			            str += '<span><img src="'+IMG_URL+'blankstar.png" style="height:'+h+'px"></span>';
			       }
	 str += "</div>"; 
   return str;
}


var getAppsHTML = function(data){
	var colCount = 5;
	var currentPage = data.page;
	
	var str = "<table width='100%'>";
	for(var i = 0;i<data.app.length;i++){
		if(i%colCount==0){
			str+="<tr>";
		}
		str+="<td valign=top style='width:100px;'>"+
				"<a style='color: #3B5998; font-size:10px;' href='javascript:loadGame("+data.app[i].id+")'>"+
				"<img class='gameSmallImg' id='"+data.app[i].id+"' index='"+i+"' border='none' style='margin-right:8px' src='"+FS_IMG_URL+ data.app[i].id+"_75.png'></img>";
			
		str+=showRate(data.app[i].rate,10);
		str+=		
				"<div style='width:80px; overflow:hidden'>"+data.app[i].gamename+"</div></a>"+
			 "</td>";
		if(i%colCount == colCount-1){
			str+="</tr>";
		}
	}
	
	var pageCount = Math.ceil(data.totalCount / GALLERY_APP_COUNT);
	if (pageCount>1){
		str += "<tr><td colspan="+colCount+" align=right style='padding-right:20px'>";
		for (var p = currentPage-2; p<currentPage+2;p++){
			if (p > 0 && p <= pageCount){
			
				var color = p == currentPage ? "color:"+styleJson.textColor+"" : "";
				
				str += "<a style='margin: 0px 7px;"+color+"' href=javascript:global_request("+p+"); >"+p+"</a>";
				
				
			}
		}
		if (currentPage < pageCount){
				str += "<a style='margin: 0px 7px;"+color+"' href=javascript:global_request("+(currentPage+1)+"); >Next</a>";
				
		}
		str += "</td><tr>";
	}
	str+="</table>";
	return str;
}

	 
function resp_showAllGames(response){
    var html = response.text;
    document.getElementById('otherApps').innerHTML = html;
	gadgets.window.adjustHeight();
}

function resp_showTopGames(response){
    var html = response.text;
    document.getElementById('topApps').innerHTML = html;
	gadgets.window.adjustHeight();
}
function resp_showNewGames(response){
    var html = response.text;
    document.getElementById('newApps').innerHTML = html;
	gadgets.window.adjustHeight();
}


var req_getNewApps = function(page){
	Request.sendGET(serverURL+"publicApps.jsp?page="+page, resp_showAllGames);
}

var selectContainer = function(id){

	if (id == "container"){
		_$(id).style.display = "";
		_$("flashContainer").style.display = "none";
	}else
	  if( id == "flashContainer"){
		_$("container").style.display = "none";
		_$(id).style.display = "";
	}
}

var showLoading = function(){
	container.innerHTML = "<div style='border: none;'>  Loading...</div>";
	showError("");
}

var showError = function(str){
	if (str == ""){
		errorDiv.style.display = "none";
	}else{
		errorDiv.style.display = "";
		errorDiv.innerHTML = str;
	}
}

var showComments = function(){
	selectTab("comments");
    container.innerHTML = "<div  id='commentContainer'></div>";
	request_getComments(1);
}

function resp_addComment(response){
	if (response.text == "ok"){
		  request_getComments(1);
	}
}

function request_getComments(page){
	_$("commentContainer").innerHTML = "Loading...";
	Request.sendGET(serviceURL+"/getcomment/"+gameId+"/"+page+"/"+COMMENT_COUNT,response_getComments);
}

function addComment(){

	if (userKey == null || userKey=="null") return;
	var rate=5;
	var form = document.commentAndRate["rate"];
	
    for (i=0; i < form.length; i++ ){
   	     if ( form[i].checked) 
   	        rate = form[i].value;
       }

	var tObj = document.getElementById("textArea");
	var textValue = tObj.value;	
	data = "comment="+encodeURIComponent(textValue)+"&appId="+gameId+"&query=addcomment&userKey="+userKey+"&rate="+rate;
	Request.sendPOST(serviceURL, data, resp_addComment);
}

var replaceAll = function(oldStr,findStr,repStr) {
	var srchNdx = 0;
 	var newStr = "";
 	while (oldStr.indexOf(findStr,srchNdx) != -1) {
  		newStr += oldStr.substring(srchNdx,oldStr.indexOf(findStr,srchNdx));
		newStr += repStr;
		srchNdx = (oldStr.indexOf(findStr,srchNdx) + findStr.length);
 	}
	newStr += oldStr.substring(srchNdx,oldStr.length);
	return newStr;
}



function response_getComments(response){
	var json = response.data;
	var jsonArray = json.comments;
	var str="";

	str +=
	 '<form name="commentAndRate">'+
	 '<div class="commentDiv">'+
	    '<table class="commentTable" style="background:'+CONFIG.TAB_CONFIG.bgColor+';">'+
	         '<tr><td style="color:'+CONFIG.TAB_CONFIG.color+'"><b>Add Comment and Rate this game:</b></td></tr>'+    
	         '<tr><td>'+
	             '<table style="color:'+CONFIG.TAB_CONFIG.color+'">'+
	                '<tr>'+
	                   '<td><b>Rate: </b></td>'+
	                   '<td><input type="radio" name="rate" value="1">1</td>'+
	                   '<td><input type="radio" name="rate" value="2">2</td>'+
	                   '<td><input type="radio" name="rate" value="3">3</td>'+
	                   '<td><input type="radio" name="rate" value="4">4</td>'+
	                   '<td><input type="radio" name="rate" value="5" checked>5</td>'+
	                 '</tr>'+
	             '</table>'+   
	         '</td></tr>'+
	         '<tr><td><textarea id="textArea" style="font-size: 15px;width: 600px;  border: 1px solid '+CONFIG.TAB_CONFIG.borderColor+';"></textarea></td></tr>'+
	         '<tr><td><input class="sumbitComment" type="button" style="background:'+CONFIG.TAB_CONFIG.selectedBgColor+';border-color:'+CONFIG.TAB_CONFIG.borderColor+';color:'+CONFIG.TAB_CONFIG.selectedColor+';margin-left: 500px;" value="Add Comment" onclick="javascript:addComment()"/></td></tr>'+

	      '</table>'+
	 '</div>'+
	'</form>';
	  str += "<table width=100%>";	
	var jsonObj = null;
	var currentPage = json.page;
	for(var i = 0; i < jsonArray.length ; i++){
		jsonObj = jsonArray[i];
		var date = new Date(jsonObj.date);
		
		var hours = date.getHours();
		var minutes=date.getMinutes();
		minutes=((minutes < 10) ? "0" : "") + minutes;
		var dateStr = monthname[date.getMonth()] + " " + date.getDate() + " , " +
					  date.getFullYear() + " " + hours + ":" + minutes;
					
		str += 
		"<tr style='1px solid black'>"+
			
			"<td valign=top width=120px align=center>"+
			    '<div style="margin-bottom:5px;">';
			      str += showRate(jsonObj.rate,13);
	     str += '</div>'+
				'<a target="_blank" href="'+jsonObj.profileUrl+'"><img  style="width:35px;height:35px;" src="'+jsonObj.thumbnailUrl+'"/></a>'+
		    "</td>"+
		    
		    
		    "<td valign=top class=curlycontainer>"+
		        '<span style="overflow: hidden; margin-bottom: 5px; height: 15px;width:100px;"><a target="_blank" style="color:#6696C6;font-size: 13px" href="'+jsonObj.profileUrl+'">'+jsonObj.name+':&nbsp&nbsp</a></span><span style="color:'+styleJson.textColor+'">'+
				replaceAll(jsonObj.comment, "\n", "</span><br/>")+
				'<div class="date">'+dateStr+'</div>'+
			"</td>"+
		"</tr>"+
		"<tr><td colspan=2><hr style='border:0; background:#EEEEEE; margin-left:20px;margin-right:50px;margin-top:0px;height:1px;' /></td></tr>";
	}
	var pageCount = Math.ceil(json.total / COMMENT_COUNT);
		if (pageCount>1){
			str += "<tr><td colspan=2 align=right style='padding-right: 50px;'>";
			for (var p = currentPage-2; p<currentPage+2;p++){
				if (p > 0 && p <= pageCount){
					var color = p == currentPage ? "color:"+styleJson.textColor+"" : "";
					str += "<a class='paging' style='"+color+"' href='javascript:request_getComments("+p+")'>"+p+"</a>";
				}
			}
			if (currentPage < pageCount){
				str += '<a class="paging" href="javascript:request_getComments('+(currentPage+1)+')">Next</a>';
			}
			str += "</td><tr>";
		}		
	str += "</table>";
	str +="</div></div>";
	
	_$("commentContainer").innerHTML = str;
    gadgets.window.adjustHeight();
}



/////////////////////////////////////////////
/////////////////////////////////////////////
var adjustHeight = function(mandatory,addSize){
	if (allContent.offsetHeight > 800 || mandatory){
		resizer.resizePanel(allContent.offsetHeight+addSize);
	}
}


Request.send = function(url, method, responseHandler, data, urlencoded) {

	var req;	
	if (window.XMLHttpRequest) {
		req = new XMLHttpRequest();
	} else if (window.ActiveXObject) {
		req = new ActiveXObject("Microsoft.XMLHTTP");
	}
	req.onreadystatechange = function() {
		if (req.readyState == 4) {// only if req shows "loaded"
			if (req.status < 400) {// only if "OK"
				 try{
				 	req.data = eval("("+req.responseText+")"); 
				 }catch(ex){
				 	
				 }
				 req.text = req.responseText;
				 responseHandler(req);
			}
		}
	}
	if (method=="POST") {
		req.open("POST", url, true);
		if (urlencoded) req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
		req.send("" + data);
	}else{
		req.open("GET", url, true);
		req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
		req.send(null);
	}
	
	return req;
}

Request.sendPOST = function(url, data, responseHandler) {
	if (IS_LIVE){
		var os_params = {};
		os_params[gadgets.io.RequestParameters.METHOD] = gadgets.io.MethodType.POST;
		os_params[gadgets.io.RequestParameters.CONTENT_TYPE] = gadgets.io.ContentType.JSON;
		os_params[gadgets.io.RequestParameters.POST_DATA] = data;
		gadgets.io.makeRequest(url, responseHandler, os_params);
	}else{
		if(undefined == data) data = '';
		Request.send(url, "POST", responseHandler, data, true);
	}
}

Request.sendGET = function(url, responseHandler) {
	if (IS_LIVE){
		var os_params = {};
		os_params[gadgets.io.RequestParameters.METHOD] = gadgets.io.MethodType.GET;
		os_params[gadgets.io.RequestParameters.CONTENT_TYPE] = gadgets.io.ContentType.JSON;
		gadgets.io.makeRequest(url, responseHandler, os_params);
	}else{
		Request.send(url, "GET", responseHandler);
	}
}
