// setting a global variable be used for accessing the images hosted at s3


var userInfoBoxArray = new Hash();
var browser_is = Prototype.Browser.Opera ? 'opera' : 'other';
// This flag is deciding if nn box has been given rounder corner call or not.
// when ever user box is display lock this by making its value 1. open when nn box alone has to diaplay.
var round_to_nn_box_lock = 0;

var populateUserInfoArray = function (user_details){
	if (!userInfoBoxArray.get(user_details.user_id ? user_details.user_id : user_details.id)) {
		var userInfoValues = new Array();
		user_id = user_details.user_id ? user_details.user_id : user_details.id;
		userInfoValues["user_id"] = user_id;
		userInfoValues["f_name"] = user_details.f_name;
		userInfoValues["l_name"] = user_details.l_name;
		userInfoValues["city"] = user_details.city;
		userInfoValues["state"] = user_details.state;
		userInfoValues["country"] = user_details.country;
		userInfoValues["company"] = user_details.company;
		userInfoValues["job_title"] = user_details.job_title;
		userInfoValues["industry"] = user_details.industry;
		//alert(user_details.n_e_thing);
		userInfoValues["n_e_thing"] = user_details.n_e_thing;
		//alert(user_details.n_e_thing);
		userInfoValues["socialmedian_url"] = user_details.socialmedian_url;
		userInfoValues["fb_user_id"] = ((user_details.fb_connect_status == "connected" || user_details.fb_connect_status == "merged") ? user_details.fb_user_id : 0);
		// For Newsmaker and Follower functionalities
		userInfoValues["nm_id"] = user_details.newsmaker_id;
		userInfoValues["fwr_id"] = user_details.follower_id;
		userInfoValues["mutual"] = user_details.mutual;
		//alert(userInfoValues["user_id"]+"---"+user_details.newsmaker_id+"---"+user_details.mutual);
		userInfoValues["pref"] = user_details.pref;

		userInfoBoxArray.set( user_id , userInfoValues);
	}
}

/**
 * Show hide user information box
 */
var showUserInfoBox = function (event, divID) {
	$(divID).style.display='block';
	if(window.event) {	//ie events
		try {
			event = window.event;
			event.returnValue = false;
			event.cancelBubble = true;
		}catch(e) {alert(e);}
	}
	else { //eveyone else
		try {
			event.preventDefault();
			event.stopPropagation();
		}catch(e) {alert(e);}
	}
}

var recent_activity_user = "";
// this variable is used to update follow image on user mini-profile-info
// this is used in follow user functionality
var SHORT_INFO_DIV_ID = "";
var createUserShortInfoTemplate = function (user_id, user_short_info_div_id, current_user_name, mypage, from_replize_link){
	recent_activity_user = current_user_name;
	SHORT_INFO_DIV_ID = user_short_info_div_id;
	round_to_nn_box_lock = 1;
	$(user_short_info_div_id).style.display = (from_replize_link != null ? 'inline' : 'block');
	$(user_short_info_div_id).innerHTML ='<div align="center" style="width:40px;padding:10px;margin:0px;top:0px;left:0px;border:1px solid grey;overflow:visible;position:absolute;background:#F7F7F7;">'
									    +'	<img src="'+S3_STATIC_ASSETS_PATH+'/images/loader.gif" />'
									    +'</div> ';
	var user_details = userInfoBoxArray.get(user_id);
	if(user_details){
		createUserShortInfoHtml(user_id, user_details, user_short_info_div_id, current_user_name, mypage);
	}else{
	 	var postParameters = "user_id="+user_id;
		var ajaxRequestOptions = {
			// Use POST
			method: 'post',
			// Send this lovely data
			postBody: postParameters,
			// Handle successful response
			onSuccess: function(response){getUserInfoCallback(response, user_id, user_short_info_div_id, current_user_name, mypage);},
			// Handle 404
			on404: getUserInfo404Callback,
			// Handle other errors
			onFailure: getUserInfoFailureCallback
		}
		new Ajax.Request('/user-info', ajaxRequestOptions);
	}
}
/**
 * Get user's info for hover success callback.
 */
var getUserInfoCallback = function (response, user_id, user_short_info_div_id, current_user_name, mypage){
	//eval the json object
	response_data = eval('(' + response.responseText + ')');
	//check if there is an error
	if (response_data.ok) {
		populateUserInfoArray(response_data.user_details);
		var user_details = userInfoBoxArray.get(user_id);
		createUserShortInfoHtml(user_id, user_details, user_short_info_div_id, current_user_name, mypage);
	} else {
	}
}
/**
 * Get user's info for hover  failure callback function
 */
var getUserInfoFailureCallback = function (){
	alert("Error on page");
}
/**
 * Get user's info for hover 404 callback function
 */
var getUserInfo404Callback= function (){
	alert("Error page is not found");
}
var createUserShortInfoHtml = function (user_id, user_details, user_short_info_div_id, current_user_name, mypage){
	var user_city = (user_details.city != null) ? (user_details.city != '') ? user_details.city : '' : '';
	var user_state = (user_details.state != null) ? (user_details.state != '') ? ', '+user_details.state : '' : '';
	var user_country = (user_details.country != null) ? (user_details.country != '') ? ', '+user_details.country : '' : '';
	var user_f_name = (user_details.f_name != null) ? (user_details.f_name != '') ? user_details.f_name : '' : '';
	var user_l_name = (user_details.l_name != null) ? (user_details.l_name != '') ? user_details.l_name : '' : '';
	var user_shortnote = (user_details.n_e_thing != null) ? (user_details.n_e_thing != '') ? user_details.n_e_thing : '' : '';

	var userShortInfoDivContents =  '<div id="inner_'+user_short_info_div_id+'"class="userShortDetailsOnHotlist" style="width:350px;padding:10px;margin:0px;top:10px;left:0px;border:1px solid #5F5F5F;overflow:visible;position:absolute;background:#F7F7F7;z-index:200">'
								 +	'	<div style="margin:0px;padding:0px 0px 5px 0px;">'
								 +  '	<div align="left" style="float:left;width:100px;padding:0px 0px 2px 0px;margin:0px;background:url(\''+S3_STATIC_ASSETS_PATH+'/images/loader.gif\') no-repeat center;">'
								 +	'		<div style="margin:0px;padding:0px;width:100px;">'
								 +	'			<a href="/'+user_details.socialmedian_url+'">';
								 if(user_details.fb_user_id > 0) {
								 if(Prototype.Browser.IE && parseInt(navigator.userAgent.substring(navigator.userAgent.indexOf("MSIE")+5)) == 6){
								 userShortInfoDivContents = userShortInfoDivContents
								 +	'				<img id="miniProfilePic'+user_short_info_div_id+'-'+user_details.fb_user_id+'" style="border:1px solid #5F5F5F;padding:1px;margin:0px;" />';
								 }else{
								 userShortInfoDivContents = userShortInfoDivContents
								 +	'				<div class="fb-user-profile-image" style="float:left;position:relative;">'
								 +	'		    		<img id="miniProfilePic'+user_short_info_div_id+'-'+user_details.fb_user_id+'" />'
								 +	'		    		<img class="fb-favicon" src="http://static.ak.fbcdn.net/images/icons/favicon.gif" />'
								 +	'		    	</div>'
								 +	'				<br clear="all"/>';
								 }
								 } else {
								 	userShortInfoDivContents = userShortInfoDivContents
								 +	'				<img src="'+S3_DYNAMIC_ASSETS_PATH +'/user-images/'+ user_details.user_id +'-large.jpg" style="border:1px solid #5F5F5F;padding:1px;margin:0px;">';
								 }
								 userShortInfoDivContents = userShortInfoDivContents
								 + 	'			</a>'
								 +	'		</div>'
								 +	'		<div id="followSuccessMsg'+SHORT_INFO_DIV_ID+'" style="margin:0px;padding:5px 0px 5px 0px;text-align:center;">';
	if(globalUserId != user_id){
		var key1 = globalUserId+"-"+user_id;
		var key2 = user_id+"-"+globalUserId;
		if(followRelation[key2] != null && followRelation[key2][globalUserId] == 'y') {
			userShortInfoDivContents = userShortInfoDivContents
											 +	'<div style="padding:2px 0px 0px 0px;margin:0px;width:98px;">'
											 +		'<div style="padding:0px;margin:0px;float:left;font-family:Arial;font-size:12px;font-weight:bold;color:#568BBE"><a href="/users?s=my-readers" style="color:#568BBE;cursor:pointer;text-decoration:none;">Following you</a></div>'
											 +		'<div style="padding:0px 0px 0px 4px;margin:0px;float:left;"><span class="arrowDownFollow"></span></div>'
											 +		'<br clear="all"/>'
											 +	'</div>'
											 +	'<div style="padding:5px 0px 0px 0px;margin:0px;width:100px;">'
											 +		'<div style="padding:0px;margin:0px;float:left;font-family:Arial;font-size:12px;font-weight:bold;color:#568BBE"><a href="/users?s=my-newsmakers" style="color:#568BBE;cursor:pointer;text-decoration:none;">Newsmaker</a></div>'
											 +		'<div style="padding:0px 0px 0px 4px;margin:0px;float:left;"><span class="arrowUpFollow"></span></div>'
											 +		'<br clear="all"/>'
											 +	'</div>';
		} else if((followRelation[key1] != null && followRelation[key1][globalUserId] == 'n') || (followRelation[key2] != null && followRelation[key2][globalUserId] == 'n')) {
			userShortInfoDivContents = userShortInfoDivContents
											 +	'<div style="padding:2px 0px 0px 0px;margin:0px;width:100px;">'
											 +		'<div style="padding:0px;margin:0px;float:left;font-family:Arial;font-size:12px;font-weight:bold;color:#568BBE"><a href="/users?s=my-newsmakers" style="color:#568BBE;cursor:pointer;text-decoration:none;">Newsmaker</a></div>'
											 +		'<div style="padding:0px 0px 0px 4px;margin:0px;float:left;"><span class="arrowUpFollow"></span></div>'
											 +		'<br clear="all"/>'
											 +	'</div>';
		} else if((followRelation[key1]!= null && followRelation[key1][user_id] == 'n') || (followRelation[key2] != null && followRelation[key2][user_id] == 'n')) {
			userShortInfoDivContents = userShortInfoDivContents
											 +	'<div style="padding:2px 0px 0px 0px;margin:0px;width:98px;">'
											 +		'<div style="padding:0px;margin:0px;float:left;font-family:Arial;font-size:12px;font-weight:bold;color:#568BBE"><a href="/users?s=my-readers" style="color:#568BBE;cursor:pointer;text-decoration:none;">Following you</a></div>'
											 +		'<div style="padding:0px 0px 0px 4px;margin:0px;float:left;"><span class="arrowDownFollow"></span></div>'
											 +		'<br clear="all"/>'
											 +	'</div>'
											 +	'<div style="padding:5px 0px 0px 0px;margin:0px;width:100px;height:19px;" onclick="showPreference('+user_id+',\''+userInfoBoxArray.get(user_id).socialmedian_url+'\');">'
											 +		'<img style="width: 74px; height: 19px;" src="'+S3_STATIC_ASSETS_PATH+'/images/Followon-White.png"/>'
											 +	'</div>';
		} else {
			userShortInfoDivContents = userShortInfoDivContents
											 +	'<div style="padding:5px 0px 0px 0px;margin:0px;width:100px;height:19px;" onclick="showPreference('+user_id+',\''+userInfoBoxArray.get(user_id).socialmedian_url+'\');">'
											 +		'<img style="width: 74px; height: 19px;" src="'+S3_STATIC_ASSETS_PATH+'/images/Followon-White.png"/>'
											 +	'</div>';
		}
	}
	userShortInfoDivContents = userShortInfoDivContents
								 +	'		</div>'
								 + 	'	</div>'
								 +	'	<div id="user_info_on_hover" style="overflow:hidden;width:210px;margin:0px;padding:0px  0px 0px 10px;float:left;">'
								 + 	'		<div style="width:209px;padding:0px 0px 0px 0px;margin:0px;" >'
								 + 	'			<div align=left style="width:100%;padding:3px 0px 0px 0px;margin:0px;font-family:arial;">'
								 +  '	           <div style="float:left;padding:0px;margin:0px;">'
								 +	'					<a href="/'+user_details.socialmedian_url+'" style="color:#DC6B03;text-decoration:none;font-weight:bold;font-size:14px;">';
	if((user_f_name != '') || (user_l_name != '') ){
		userShortInfoDivContents = userShortInfoDivContents
								 +							user_f_name
								 +	'						&nbsp;'
								 +							user_l_name;
	} else {
		userShortInfoDivContents = userShortInfoDivContents
								 +							user_details.socialmedian_url;
	}
	userShortInfoDivContents = userShortInfoDivContents
								 +  '                   </a>'
								 +	'				</div>'
								 +	'				<div style="float:right;padding:0px;margin:0px;">'
								 +	'					<a href="/'+user_details.socialmedian_url+'" style="color:#7F7F7F;text-decoration:underline;font-size:11px;">'
								 +	'						View Page'
								 +	'					</a>'
								 +	'				</div>'
								 +	'				<br clear="all">'
								 +	'			</div>'
								 +	'			<div style="padding:0px;margin:0px;font-family:arial;color:#2364A9;font-size:11px;">'
								 +					user_city + user_state + user_country
								 +	'			</div>';
	try {
		userShortInfoDivContents =  userShortInfoDivContents + (CURRENT_USER_IS_ADMIN_USER==1 ? '<div OnClick="javascript: new Ajax.Updater(this, \'/admin-get-user-contact\', { method:\'get\', parameters:\'id='+user_details.user_id+'\' }); return false;" style="color:#000000;text-decoration:underline;cursor:pointer;font-weight:bold;padding:0px 0px 10px 0px;">Get Email</div>' : '');
	} catch(e) {}
	if(user_details.company != null) {
	  if(user_details.company != ''){
		userShortInfoDivContents = userShortInfoDivContents
								 +	'			<div style="width:100%;padding:5px 0px 0px 0px;margin:0px;">'
								 +	'				<div align=left style="padding:0px;margin:0px;font-family:arial;color:#000;font-size:11px;">'
								 +	'					Company - '
								 +						user_details.company
								 +	'				</div>'
								 +	'			</div>';
	  }
	 }
	 if(user_details.job_title != null) {
	  if(user_details.job_title != ''){
		userShortInfoDivContents = userShortInfoDivContents
								 +	'			<div style="width:100%;padding:5px 0px 0px 0px;margin:0px;">'
								 +	'				<div align=left style="padding:0px;margin:0px;font-family:arial;color:#000;font-size:11px;">'
								 +	'					Job title - '
								 +						user_details.job_title
								 +	'				</div>'
								 +	'			</div>';
	  }
	 }
	 if(user_details.industry != null) {
	  if(user_details.industry != ''){
		userShortInfoDivContents = userShortInfoDivContents
								 +	'			<div style="width:100%;padding:5px 0px 0px 0px;margin:0px;">'
								 +	'				<div align=left style="padding:0px;margin:0px;font-family:arial;color:#000;font-size:11px;">'
								 +	'					Industry - '
								 +						user_details.industry
								 +	'				</div>'
								 +	'			</div>';
	  }
	 }

	 userShortInfoDivContents = userShortInfoDivContents
								 +	'		</div>';
	if(user_shortnote != ''){
		userShortInfoDivContents = userShortInfoDivContents
								 +	'		<div align=left style="width:100%;padding:5px 0px 0px 0px;margin:0px;font-family:arial;color:#8F8F8F;font-size:11px;">'
								 +	'			<img src="'+S3_STATIC_ASSETS_PATH+'/images/Inveted-CommaL.png" /> ';
		if(user_shortnote.length > 150) {
			userShortInfoDivContents = userShortInfoDivContents
								 + 					user_shortnote.truncate(150,' ...')
								 +	'				<a href="/'+user_details.socialmedian_url+'" style="text-decoration:underline;color:#7F7F7F;">'
								 +	'					more'
								 +	'				</a> ';
	 	}else{
	 		userShortInfoDivContents = userShortInfoDivContents
								 + 					user_shortnote;
		}
		userShortInfoDivContents = userShortInfoDivContents
								 +  '			<img src="'+S3_STATIC_ASSETS_PATH+'/images/Inveted-CommaR.png" />'
								 +	'		</div>';
	}
	userShortInfoDivContents = userShortInfoDivContents
								 +	'	</div>'
								 +	'	<br clear="all">'
								 +	'	</div>'
								 +	'</div>';
	$(user_short_info_div_id).innerHTML = userShortInfoDivContents;
      settings = {
          tl: { radius: 10 },
          tr: { radius: 10 },
          bl: { radius: 10 },
          br: { radius: 10 },
          antiAlias: true,
          autoPad: true,
          validTags: ["div"]
      }
      if(browser_is == 'opera'){
      	$('inner_'+user_short_info_div_id).style.top = '0px';
      	$('inner_'+user_short_info_div_id).style.left = '0px';
      }else {
      	var myBoxObject = new curvyCorners(settings, 'userShortDetailsOnHotlist');
      	myBoxObject.applyCornersToAll();
      }
      // get image from fb
      if(user_details.fb_user_id > 0) {
      	var imgSize = ((Prototype.Browser.IE && parseInt(navigator.userAgent.substring(navigator.userAgent.indexOf("MSIE")+5)) == 6) ? "large" : "normal");
      	setUserImage([user_details.fb_user_id], imgSize, ["miniProfilePic"+user_short_info_div_id]);
      	//FB.XFBML.Host.parseDomTree();
      }
}



var nnShortDetailsHash = new Hash();
var nn_div_to_display
var public_page
// this is also used in application.rb to identify span of quit join..
var hotlist_nn_quit_join_counter = 0;
var user_url = "";
var requestToCreateNNShortInfoTemplate = function (nn_short_info_div_id, nn_id, current_user_name, mypage){
		user_url = current_user_name
		round_to_nn_box_lock = 0;
		nn_div_to_display_id = nn_short_info_div_id;
		public_page = mypage;
		if(nnShortDetailsHash.get(nn_id)){
			$(nn_div_to_display_id).style.display = 'block';
			createNNShortInfoTemplate(nn_div_to_display_id, nnShortDetailsHash.get(nn_id), current_user_name, public_page);
		}else{
			//Display the nn details div with loading image.
			$(nn_div_to_display_id).style.display = 'block';
			$(nn_div_to_display_id).innerHTML = '<div align="center" style="width:40px;padding:10px;margin:0px;top:0px;left:0px;border:1px solid grey;overflow:visible;position:absolute;background:#F7F7F7;">'
											   +'	<img src="'+S3_STATIC_ASSETS_PATH+'/images/loader.gif" />'
											   +'</div> ';

			var postParameters = "nn_id=" + nn_id;
			var ajaxRequestOptions = {
				// Use POST
				method: 'post',
				// Send this lovely data
				postBody: postParameters,
				// Handle successful response
				onSuccess: requestToCreateNNShortInfoTemplateCallback,
				// Handle 404
				on404: requestToCreateNNShortInfoTemplate404Callback,
				// Handle other errors
				onFailure: requestToCreateNNShortInfoTemplateFailureCallback
			}
			new Ajax.Request('/nn-short-details', ajaxRequestOptions);
		}
}

var requestToCreateNNShortInfoTemplateCallback = function (response){
	//eval the json object
	var response_data = response.responseText.evalJSON();
	if(response_data.ok == true)
	{
		response_data.nn_details.joined_nn_or_not = response_data.joined_nn_or_not
		nnShortDetailsHash.set(response_data.nn_details.id, response_data.nn_details);
//		alert(nnShortDetailsHash.get(response_data.nn_details.id).name);
		createNNShortInfoTemplate(nn_div_to_display_id, response_data.nn_details, response_data.current_user_name, public_page);
	}
	else{
//		$('news_network_change_error_box').innerHTML = response_data.message;
	}
}
/**
 * removeUserFavoriteSource failure callback function
 */
var requestToCreateNNShortInfoTemplate404Callback = function (){
		alert("Error on page.");
}
/**
 * removeUserFavoriteSource 404 callback function
 */
var requestToCreateNNShortInfoTemplateFailureCallback = function (){
	alert("Error page is not found");
}

var createNNShortInfoTemplate = function (nn_short_info_div_id, nn_details, current_user_name, mypage){
	var nn_day_total_stories = nn_details.day_stories != null ? nn_details.day_stories : 0;
	var nn_week_total_stories = nn_details.week_stories != null ? nn_details.week_stories : 0;
	var nn_name = nn_details.name.truncate(50,' ');
	var join_quit
	if(nn_details.joined_nn_or_not == 'no')
		join_quit = '<a onclick="joinOrQuitNewsNetwork('+ nn_details.id +',\'join\',0);" style="color:#5F5F5F;cursor:pointer;text-decoration:underline;">Join</a>';
	else
		join_quit = '<a onclick="joinOrQuitNewsNetwork('+ nn_details.id +',\'quit\',0);" style="color:#5F5F5F;cursor:pointer;text-decoration:underline;">Quit</a>';
	var nn_total_stories = (nn_details.total_story + nn_details.total_snip + nn_details.total_news);

	hotlist_nn_quit_join_counter ++;

	var nnShortInfoDivContents = '<div class="userShortDetailsOnHotlist" id="inner_'+nn_short_info_div_id+'" style="width:320px;padding:10px;margin:0px;top:10px;left:0px;border:1px solid grey;overflow:visible;position:absolute;background:#F7F7F7;z-index:100">'
								+'	<div style="padding:0px 0px 8px 0px;">'
								+'		<span style="float:left;padding:0px;margin:0px;">'
								+'			<img src="'+S3_STATIC_ASSETS_PATH+'/images/NN-hotlist-icon.png" />'
								+'		</span>'
								+'		<span style="float:left;padding:0px 0px 0px 7px;margin:0px;font-family:arial;font_weight:bold;color:#DC6B03;font-size:16px;">'
								+			nn_name
								+'		</span>'
								+'		<span style="float:right;padding:0px 7px 10px 0px;margin:0px;font-family:arial;font_weight:bold;color:#5F5F5F;font-size:11px;">'
								+'			<span id="hotlist_join_quit_nn'+nn_details.id+'_'+hotlist_nn_quit_join_counter+'">'
								+				join_quit
								+'			</span>'
								+'			<span style="padding:0px 0px 0px 10px;margin:0px;">'
								+'				<a href="/network/'+ nn_details.name_permalink +'" style="color:#5F5F5F;text-decoration:underline;"> Visit </a>'
								+'			</span>'
								+'		</span>'
								+'		<br clear="all">'
								+'	</div>'
								+'	<div style="padding:0px 0px 10px 30px;margin:0px;font-family:arial;font_weight:bold;color:black;font-size:11px;">'
								+'		<font style="font-weight:bold;">Users </font> '
								+'		<font style="color:#2364A9;">'
								+ 			nn_details.total_user
								+'		</font>'
								+'	</div>'
								+'	<div style="padding:0px 7px 10px 30px;;margin:0px;font-family:arial;font_weight:bold;color:black;font-size:11px;">'
								+'		<font style="font-weight:bold;">Topics</font> '
								+'		<font style="color:#2364A9;">'
								+'			('+nn_details.total_tag+')'
								+'		</font>-'
								+'		<font style="color:#5F5F5F;">'
								+			nn_details.nc_tags
								+'		</font>'
								+'		<a href="/network/'+ nn_details.name_permalink +'" style="color:#5F5F5F;text-decoration:underline;"> more </a>'
								+'	</div>'
								+'	<div style="padding:0px 0px 10px 30px;margin:0px;font-family:arial;font_weight:bold;color:black;font-size:11px;">'
								+'		<font style="font-weight:bold;"> Stories </font>  '
								+'		<span style="padding:0px 0px 0px 10px;">'
								+'			<font style="color:#2364A9">&nbsp;Today</font> ' + nn_day_total_stories
								+'			<font style="color:#2364A9">&nbsp;This week</font> ' + nn_week_total_stories
								+'			<font style="color:#2364A9">&nbsp;Total</font> ' + nn_total_stories
								+'		</span>'
								+'	</div>'
							 	+'	<div align="center" style="margin:0px;padding:0px">';
	if(mypage == -1) {
		nnShortInfoDivContents = nnShortInfoDivContents
								+'		<a href="/'+ user_url +'/hotlist-items?activity_of_network='+nn_details.id+'"> <img src="'+S3_STATIC_ASSETS_PATH+'/images/Zoom-to-button.png" /> </a>';
	} else if(mypage != 1){
		// here 'selectedFeedTab' variable contains selected tab on home page, which was set on account layout
		nnShortInfoDivContents = nnShortInfoDivContents
								+'		<a href="/'+ current_user_name +'/home?s='+selectedFeedTab+'&activity_of_network='+nn_details.id+'"> <img src="'+S3_STATIC_ASSETS_PATH+'/images/Zoom-to-button.png" /> </a>';
	} else {
		// here 'selectedFeedTab' variable contains selected tab on home page, which was set on account layout
		nnShortInfoDivContents = nnShortInfoDivContents
								+'		<a href="/'+ user_url +'?activity_of_network='+nn_details.id+'"> <img src="'+S3_STATIC_ASSETS_PATH+'/images/Zoom-to-button.png" /> </a>';
	}
		nnShortInfoDivContents = nnShortInfoDivContents
								+'	</div>'
								+'</div>';
	$(nn_short_info_div_id).innerHTML = nnShortInfoDivContents;
	/*
      The new 'validTags' setting is optional and allows
      you to specify other HTML elements that curvyCorners
      can attempt to round.

      The value is comma separated list of html elements
      in lowercase.

      validTags: ["div", "form"]

      The above example would enable curvyCorners on FORM elements.
      */
      settings = {
          tl: { radius: 10 },
          tr: { radius: 10 },
          bl: { radius: 10 },
          br: { radius: 10 },
          antiAlias: true,
          autoPad: true,
          validTags: ["div"]
      }

      /*
      Usage:

      newCornersObj = new curvyCorners(settingsObj, classNameStr);
      newCornersObj = new curvyCorners(settingsObj, divObj1[, divObj2[, divObj3[, . . . [, divObjN]]]]);
      */
      if(browser_is == 'opera'){
      	$('inner_'+nn_short_info_div_id).style.top = '0px';
      	$('inner_'+nn_short_info_div_id).style.left = '0px';
      }else if(round_to_nn_box_lock == 0){
	      var myBoxObject = new curvyCorners(settings, 'userShortDetailsOnHotlist');
	      myBoxObject.applyCornersToAll();
	  }
}

/**
 * function to handle hotlist tab action
 * fnn = featured news network (added by ajay agrawal)
 */
var newsNetworkRecentStories = new Hash();
function getHotNRecentStories(aId, nnId, tab, user, fnn) {
	// check whether call from featured news network or not
	if(fnn == null){
		fnn = 0;
	}
	if(tab == "hot_now") {
		// change tab color
		$('recent_stories_tab_'+aId).style.color = "#828282";
		$('hot_right_now_stories_tab_'+aId).style.color = "#DB742F";
		// show "hot right now tab"
		$('recent_story_contents_'+aId).style.display = 'none';
		$('hot_right_now_story_contents_'+aId).style.display = 'block';
	} else if(tab == "recent") {
		// change tab color
		$('hot_right_now_stories_tab_'+aId).style.color = "#828282";
		$('recent_stories_tab_'+aId).style.color = "#DB742F";
		// show "hot right now tab"
		$('hot_right_now_story_contents_'+aId).style.display = 'none';
		$('recent_story_contents_'+aId).style.display = 'block';
		if (!newsNetworkRecentStories.get(nnId)) {
			//send request
			getRecentStoriesOfNN(aId, nnId, fnn);
		}
	}
}

/**
 * get recent stories from news networks
 */
 var getRecentStoriesOfNN = function (aId, nnId, fnn){
 	//show loading image
 	$('recent_story_contents_'+aId).innerHTML = '<div style="padding:8px 0px 8px 50px;margin:0px;font-size:13px;font-family:arial;font-weight:normal;width:150px;">'+
		'<div style="float:left;padding:0px;margin:0px;"><img src="'+S3_STATIC_ASSETS_PATH+'/images/loader.gif"></div>'+
		'<div style="float:left;padding:0px 0px 0px 5px;margin:0px;">Loading...</div>'+
		'<br clear="all">'+
	'</div>';

 	var postParameters = "network_id="+nnId+"&act_id="+aId;
	var ajaxRequestOptions = {
		// Use POST
		method: 'post',
		// Send this lovely data
		postBody: postParameters,
		// Handle successful response
		onSuccess: function(response){getRecentStoriesOfNNCallback(response, fnn);},
		// Handle 404
		on404: getRecentStoriesOfNN404Callback,
		// Handle other errors
		onFailure: getRecentStoriesOfNNFailureCallback
	}
	new Ajax.Request('/network-recent-stories', ajaxRequestOptions);
}

/**
 * get recent stories from news networks success callback
 */
var getRecentStoriesOfNNCallback = function (response, fnn){
	//eval the json object
	response_data = eval('(' + response.responseText + ')');
	//check if there is an error
	if (response_data.error == 1) {
		//alert the error
		alert(response_data.message);
	} else {
		populateNewsNetworkRecentStories(response_data.act_id, response_data.nn_stories, response_data.user, fnn, response_data.story_info);
		newsNetworkRecentStories.set(response_data.network_id, response_data.nn_stories);
	}
}
/**
 * get recent stories from news networks failure callback function
 */
var getRecentStoriesOfNNFailureCallback = function (){
	alert("Error on page");
}
/**
 * get recent stories from news networks 404 callback function
 */
var getRecentStoriesOfNN404Callback= function (){
	alert("Error page is not found");
}
var CURRENT_USER_SOCIALMEDIAN_URL = '';
function populateNewsNetworkRecentStories(aId, data, user, fnn, story_info) {
	var htmlHolder = "";
	var extra_div_flag = 0;
	var displayNumberOfRecords = (fnn == 1 ? 2 : 3);
	if(data.length > 0) {
		for(i=0;i<data.length;i++) {
			var vote = 0;
			var totalVote = 0;
			var totalLikes = 0;
			var totalDislikes = 0;
			var percentageLikesVote = 0;
			var percentageUnlikesVote = 0;
			var displayLikePersentage = 50;
			var displayUnlikePersentage = 49;
			vote = (data[i].user_vote != null ? data[i].user_vote : 0);
			totalLikes = story_info[data[i].story_id].total_likes;
			totalDislikes = story_info[data[i].story_id].total_unlikes;
			totalVote = parseInt(totalLikes) + parseInt(totalDislikes);
			if(totalVote > 0){
				percentageLikesVote = Math.round((totalLikes * 100)/totalVote);
				percentageUnlikesVote = 100 - parseInt(percentageLikesVote);
				displayLikePersentage = (percentageLikesVote == 0 ? 10 : (percentageLikesVote == 100 ? 90 : percentageLikesVote));
				displayUnlikePersentage = 99 - parseInt(displayLikePersentage);
			}
			HAVE_MOOD_DATA.set("Recent_"+aId, 0);
			/**
			*	Updating the tweet array
			*   tweet_story_info
			*/
			if (data[i].story_type != 'story'){
				if(tweet_story_info[data[i].id] == null){
					if(data[i].story_image_extension ==''||data[i].story_image_extension==null)
					 {
					 	var story_image = '';
					 }
					else{
					 var story_image=S3_DYNAMIC_ASSETS_PATH+'/story-images/'+data[i].id+'-73x73.' + data[i].story_image_extension;
					 }
					var story_title = escape((data[i].title == '') ? '' : data[i].title);
					var story_description = escape((data[i].description == '') ? '' : data[i].description.truncate(119))
					tweet_story_info[data[i].id] = [data[i].story_type, story_title,story_description,data[i].story_permalink,story_image];
				}
			}else{
				if(tweet_story_info[data[i].id] == null){
					if(data[i].story_image_extension ==''||data[i].story_image_extension==null)
					 {
					 	var story_image = '';
					 }
					else{
					 var story_image=S3_DYNAMIC_ASSETS_PATH+'/story-images/'+data[i].id+'-73x73.' + data[i].story_image_extension;
					 }
					var story_title = escape((data[i].title == "") ? '' : data[i].title);
					var story_description = escape((data[i].feed_title == '' ) ? '' : data[i].feed_title);
					tweet_story_info[data[i].id] = [data[i].story_type, story_title,"", story_description,data[i].story_permalink,story_image];
				}
			}
			// set the story_info
			title = (data[i].title == "" ? escape(data[i].description.truncate(30)) : escape(data[i].title));
			permalink = escape(data[i].story_permalink);
			if(i == displayNumberOfRecords) {
				htmlHolder +='  <div id="newsNetworkRecentStoriesShowMoreLess'+aId+'" style="margin:0px;padding:0px;display:none;">';
				extra_div_flag = 1;
			}
			htmlHolder 	   +='		<div style="margin:0px;padding:0px;">'
					   	   + '			<div style="float:left;width:52px;padding:0px 0px 0px 0px;margin:0px;">'
			if(story_info[data[i].story_id].user_clipped_stories_id != null) {
				eval('user_clipped_story'+data[i].id+'=0');
				htmlHolder +='				<div id="clipUnclipStory_hotlist_'+data[i].id+'" class="clippedStoryPin" title="Remove this Clip" onClick="javascript: showCommentBox('+data[i].id+','+eval('user_clipped_story'+data[i].id)+',\''+aId+""+i+'\'); return false;">'
						   + '					<div align="center" class="clipCountHolder">'+story_info[data[i].story_id].total_clip+'</div>'
						   + '					<div align="center" class="clipText">';
				if(story_info[data[i].story_id].total_clip == 0 || story_info[data[i].story_id].total_clip > 1) {
					htmlHolder += '					Clips';
				} else {
					htmlHolder += '					Clip';
				}
				htmlHolder +='					</div>'
						   + '				</div>';
			}else{
				eval('user_clipped_story'+data[i].id+'=1');
				htmlHolder +='				<div id="clipUnclipStory_hotlist_'+data[i].id+'" class="unclippedStoryPin" title="Add to my Clips" onClick="javascript: showCommentBox('+data[i].id+','+eval('user_clipped_story'+data[i].id)+',\''+aId+""+i+'\'); return false;">'
						   + '					<div align="center" class="clipCountHolder">'+story_info[data[i].story_id].total_clip+'</div>'
						   + '					<div align="center" class="clipText">';
				if(story_info[data[i].story_id].total_clip == 0 || story_info[data[i].story_id].total_clip > 1) {
					htmlHolder += '					Clips';
				} else {
					htmlHolder += '					Clip';
				}
				htmlHolder +='					</div>'
						   + '				</div>';
			}
			htmlHolder     +='			</div>'
			htmlHolder     +='			<div style="padding:0px;margin:0px;width:600px;float:left">'
					       + '				<div style="margin: 0px; padding: 0px; float: left; '+(data[i].story_image_extension != null ? 'width:510px;' : 'width:600px;')+' font-size: 12px; color: #000; display: block; background-color: rgb(254, 255, 255);" id="activity_'+aId+""+i+'_done_by_div"></div>'
					       + '				<div style="float:left;'+(data[i].story_image_extension != null ? 'width:510px;' : 'width:600px;')+'">';// open div for story title, discription, and images if any
			if(data[i].story_type == "snip" || data[i].title != null) {
				htmlHolder += '					<div style="padding:5px 0px 0px 0px;margin:0px;color:#2364a9;font-size:14px;font-weight:bold">';
				if(data[i].story_type == "snip") {
					htmlHolder += '					<div style="padding:0px 0px 0px 0px;margin:0px;color:#2364a9;font-size:14px;font-weight:bold">'
							+ ' 						<a href="/story/'+data[i].id+'/'+data[i].story_permalink+'" style="text-decoration:none;color:#2364a9;">'+data[i].description.stripTags().truncate(60)+'</a>'
							+ ' 					</div>';
				} else if(data[i].title != null) {
					htmlHolder += '					<div style="padding:0px 0px 0px 0px;margin:0px;color:#2364a9;font-size:14px;font-weight:bold">'
							+ ' 						<a href="/story/'+data[i].id+'/'+data[i].story_permalink+'" style="text-decoration:none;color:#2364a9;">'+data[i].title+'</a>'
							+ ' 					</div>';
				}
				htmlHolder += '					</div>';
			}
			htmlHolder 	   += '					<div id="clipCommentRsponse_hotlistRecent'+data[i].id+'" style="padding:0px 0px 0px 2px;font-size:13px;font-weight:normal;font-family:arial;width:98%;display:none;font-size:12px;"></div>'
						   + '					<div id="clip_comment_holder'+aId+""+i+'" align="centre" style="position: relative;padding:1px;width:98%;display:none"></div>'
						   + '					<div style="padding:2px 10px 2px 0px;margin:0px;font-size:11px;">';
			if(data[i].feed_title && data[i].story_type!="snip" && data[i].story_type!="news") {
				htmlHolder +='						<font style="color:#6F6F6F;font-size:11px;">Source: <a href="/feed/'+((data[i].rss_parent_id == null) ? data[i].feed_id : data[i].rss_parent_id)+'/'+data[i].rss_permalink+'" style="color:#6F6F6F;text-decoration:none;">'+data[i].feed_title+'</a></font>';
			} else {
				htmlHolder +='						<font style="margin:0px;padding:0px;color:#6F6F6F;font-size:11px;">Submitted by&nbsp;</font>';
				if(user == data[i].socialmedian_url) {
					htmlHolder += '					<a href="/'+data[i].socialmedian_url+'/home" style="font-size:11px;text-decoration:underline;color:#6F6F6F;">'
						   + '							You'
						   + ' 						</a>';
				} else {
					htmlHolder += '					<a href="/'+data[i].socialmedian_url+'" style="font-size:11px;text-decoration:underline;color:#6F6F6F;">'
						   + 							data[i].socialmedian_url.capitalize()
						   + '						</a>';
				}
				htmlHolder += '						&nbsp;'+
				((data[i].sent_by_email == 'n') ? '' : '<a href="/labs" style="color:#639F27;font-size:11px;text-decoration:none;">from email</a>&nbsp;')+
				((data[i].user_service_url_name == null) ? '' : '<font style="margin:0px;padding:0px;color:#6F6F6F;font-size:11px;">from</font> <a href="'+data[i].user_service_url+'" target="_blank" class="snap_noshots" style="color:#639F27;">'+data[i].user_service_url_name+'</a>');
			}
				htmlHolder += '					</div>';
			if(data[i].story_type != "snip" && data[i].description != null && data[i].content != null) {
				htmlHolder += '					<div style="padding:4px 0px 5px 0px;margin:0px;font-size:11px;">';
				if(data[i].description != null) {
					htmlHolder += data[i].description.stripTags().truncate(180)+' <font style="color:#6F6F6F;font-size:11px;">(<a href="/story/'+data[i].id+'/'+data[i].story_permalink+'" class="read_more_link">Read More</a>)</font>';
				} else {
					htmlHolder += data[i].content.stripTags().truncate(180)+' <font style="color:#6F6F6F;font-size:11px;">(<a href="/story/'+data[i].id+'/'+data[i].story_permalink+'" class="read_more_link">Read More</a>)</font>';
				}
				htmlHolder += '					</div>';
			}
			htmlHolder += '					</div>' // closed div for story title, discription, and images if any
			if(data[i].story_image_extension) {
				htmlHolder += '				<div style="float:right;width:75px;" align="center">'
							+ '					<div style="margin:1px 8px 2px 2px;padding:0px;">'
						    + '						<table cellspacing="0" cellpadding="0" border="0">'
							+ '							<tr>'
							+ '								<td>'
							+ '									<div align="right" style="padding:2px;margin:0px;position:relative;border: 1px solid rgb(153, 153, 153)">'
							+ '										<a href="/story/'+data[i].id+'/'+data[i].story_permalink+'"><img src="'+S3_DYNAMIC_ASSETS_PATH+'/story-images/'+data[i].id+'-73x73.'+data[i].story_image_extension+'"></a>';
				if(data[i].story_content_type == 'video'){
					htmlHolder += '									<div  id="videoZoomedPlayText_'+data[i].id+'" align="center" style="padding:0px;margin:0px;font-family:Arial;font-size:11px;">'
							+ '											<a href="" style="text-decoration:none;" onclick="javascript: getStoryVideo('+data[i].id+', '+data[i].id+');return false;">Play</a>'
							+ '										</div>'
							+ '										<div id="videoZoomed_'+data[i].id+'" style="cursor:pointer;padding:0px;margin:0px;position:absolute;top:25%;left:38%;">'
							+ '											<a href="" class="play-button" style="text-decoration:none;" onclick="javascript: getStoryVideo('+data[i].id+', '+data[i].id+');return false;"></a>'
							+ '										</div>';
				}else if(data[i].story_content_type == 'image'){
					htmlHolder += '									<div  id="imageZoomedPlayText_'+data[i].id+'" align="center" style="padding:0px;margin:0px;font-family:Arial;font-size:11px;">'
							+ '											<a href="" style="text-decoration:none;" onclick="javascript: getStoryImage('+data[i].id+','+data[i].id+');return false;">Enlarge</a>'
							+ '										</div>'
							+ '										<div id="imageZoomed_'+data[i].id+'" style="cursor:pointer;padding:0px;margin:0px;position:absolute;top:25%;left:38%;">'
							+ '											<a href="" class="image-zoom-button" style="text-decoration:none;" onclick="javascript: getStoryImage('+data[i].id+', '+data[i].id+');return false;"></a>'
							+ '										</div>';
				}
				htmlHolder += '									</div>'
						   +  '								</td>'
						   +  '							</tr>'
					       +  '						</table>'
				           +  '					</div>'
				           +  '				</div>';
			}
			htmlHolder += '						<br clear="all"/>';

			/*<!-- Div containing enlarge images/videos -->*/
			if(data[i].story_content_type != 'text'){
				htmlHolder += '				<div align="center" id="storyZoomed'+data[i].story_content_type.capitalize()+'_'+data[i].id+'" style="padding:0px;margin:0px;width:525px;">'
						    + '					<div id="story'+data[i].story_content_type.capitalize()+'LoadingIcon_'+data[i].id+'" style="padding:15px 0px 0px 10px;margin:0px;display:none;">'
							+ '						<div style="float:left;padding:0px;margin:0px;"><img src="'+ S3_STATIC_ASSETS_PATH +'/images/loader.gif"></div>'
					    	+ '						<div class="f_normal_12" style="float:left;padding:0px 0px 0px 5px;margin:0px;">Loading...</div>'
					     	+ '						<br clear="all"/>'
							+ '					</div>'
							+ '				</div>';
			}
			// contain the comment box
			/*<!-- comment div started -->*/
			htmlHolder += '					<div style="padding:5px 0px 5px 0px;margin:0px;font-size:11px;">'
						+ '						<div id="comment_link_Recent'+data[i].id+'_div" class="commentStoryBackgroundInactive" style="width:135px;font-size:11px;font-family:arial;text-decoration:none;float:left;padding:0px;">'
						+ '							<div id="comment_link_inner_div_Recent'+data[i].id+'" style="padding:3px 0px 0px 30px;margin:0px;">';
			if(data[i].total_comment > 1){
					htmlHolder += '						<a style="text-decoration:none;color:inherit;cursor:pointer;" id="comment_link_Recent'+data[i].id+'" href="javascript:void(0);" onclick="Javascript: '+(globalUserId != null ? 'getStoryCommentsInfo': '')+'(\'Recent'+data[i].id+'\', '+data[i].id+', '+globalUserId+', \''+CURRENT_USER_SOCIALMEDIAN_URL+'\');">'+data[i].total_comment+' Comments</a>';
			}else if(data[i].total_comment == 1){
					htmlHolder += '						<a style="text-decoration:none;color:inherit;cursor:pointer;" id="comment_link_Recent'+data[i].id+'" href="javascript:void(0);" onclick="Javascript: '+(globalUserId != null ? 'getStoryCommentsInfo': '')+'(\'Recent'+data[i].id+'\', '+data[i].id+', '+globalUserId+', \''+CURRENT_USER_SOCIALMEDIAN_URL+'\');">'+data[i].total_comment+' Comment</a>';
			}else{
					htmlHolder += '						<a style="text-decoration:none;color:inherit;cursor:pointer;" id="comment_link_Recent'+data[i].id+'" href="javascript:void(0);" onclick="Javascript: '+(globalUserId != null ? 'displayNoCommentsBox': '')+'(\'Recent'+data[i].id+'\', '+data[i].id+', '+globalUserId+', \''+CURRENT_USER_SOCIALMEDIAN_URL+'\');">Add Comment</a>';
			}
			openShareBoxFunction = 'onclick="getUsersNewsNetworks('+data[i].id+',\'Recent'+data[i].id+'\',\'regular\');"'
			htmlHolder  +='							</div>'
						+ '						</div>'
						+ '						<div id="share_link_Recent'+data[i].id+'_div" class="shareStoryBackgroundInactive" style="font-size:11px;font-family:arial;text-decoration:none;float:left;" '+openShareBoxFunction+'>'
						+ '							<div style="padding:3px 0px 0px 65px;margin:0px;">'
					    + '								<a style="text-decoration:none;color:inherit;cursor:pointer;" id="share_link_Recent'+data[i].id+'" href="javascript:void(0);">Share</a>'
						+ '							</div>'
						+ '						</div>'
						+ '						<div style="padding:0px;margin:0px;font-family:Arial;font-size:11px;color:#000;font-weight:normal;float:right;">'
						+ '							<div id="unlikeFace_Recent_'+aId+'_'+data[i].id+'" style="padding:0px;margin:0px;float:left;position:relative;">'
						+ '								<div id="unlikeTextBox_Recent_'+aId+'_'+data[i].id+'" style="padding:0px;margin:0px;position:absolute;top:-16px;left:-4px;display:none;font-family:Arial;font-size:11px;">Dislike</div>'
						+ '								<span id="unlikeFaceImage_Recent_'+aId+'_'+data[i].id+'" style="display:'+(vote == -1 ? 'none' : 'block')+';">'
						+ '									<a href="" onclick="javascript: updateUserLikeUnlikeVote(\''+data[i].id+'\',\'Recent_'+aId+'\',\'-1\', \''+title+'\', \''+permalink+'\'); return false;" class="unlike-icon" onmouseover="javascript:$(\'unlikeTextBox_Recent_'+aId+'_'+data[i].id+'\').style.display=\'block\';return false;" onmouseout="javascript:$(\'unlikeTextBox_Recent_'+aId+'_'+data[i].id+'\').style.display=\'none\';return false;"></a>'
						+ '								</span>'
						+ '								<span id="unlikeFaceImageActive_Recent_'+aId+'_'+data[i].id+'" style="display:'+(vote == -1 ? 'block' : 'none')+';">'
						+ '									<a href="" onclick="javascript:return false;" class="unlike-active-icon" onmouseover="javascript:$(\'unlikeTextBox_Recent_'+aId+'_'+data[i].id+'\').style.display=\'block\';return false;" onmouseout="javascript:$(\'unlikeTextBox_Recent_'+aId+'_'+data[i].id+'\').style.display=\'none\';return false;"></a>'
						+ '								</span>'
						+ '							</div>'
						+ '							<div id="userVotingOuterDiv_Recent_'+aId+'_'+data[i].id+'" style="padding:6px 0px 0px 2px;margin:0px;float:left;width:50px;position:relative;">'
						+ '								<div id="unlikeVotePercentage_Recent_'+aId+'_'+data[i].id+'" class="'+(vote != 0 ? 'opacity_100' : 'opacity_50')+'" style="background-color:#EF481B;width:'+displayUnlikePersentage+'%;" onmouseover="javascript:$(\'unlikeVotePercentageBox_Recent_'+aId+'_'+data[i].id+'\').style.display=\'block\';return false;" onmouseout="javascript:$(\'unlikeVotePercentageBox_Recent_'+aId+'_'+data[i].id+'\').style.display=\'none\';return false;">&nbsp;</div>'
						+ '								<div id="unlikeVotePercentageBox_Recent_'+aId+'_'+data[i].id+'" style="padding:0px;margin:0px;position:absolute;top:-8px;left:5px;display:none;font-size:11px;color:#8C8C8C">'+percentageUnlikesVote+'%</div>'
						+ '								<div id="likeVotePercentage_Recent_'+aId+'_'+data[i].id+'" class="'+(vote != 0 ? 'opacity_100' : 'opacity_50')+'" style="background-color:#82CA38;width:'+displayLikePersentage+'%;" onmouseover="javascript:$(\'likeVotePercentageBox_Recent_'+aId+'_'+data[i].id+'\').style.display=\'block\';return false;" onmouseout="javascript:$(\'likeVotePercentageBox_Recent_'+aId+'_'+data[i].id+'\').style.display=\'none\';return false;">&nbsp;</div>'
						+ '								<div id="likeVotePercentageBox_Recent_'+aId+'_'+data[i].id+'" style="padding:0px;margin:0px;position:absolute;top:-8px;left:30px;display:none;font-size:11px;color:#8C8C8C">'+percentageLikesVote+'%</div>'
						+ '								<br clear="all"/>'
						+ '								<div id="unlikeLikeAcitvityIcon_Recent_'+aId+'_'+data[i].id+'" align="center" style="padding:0px;margin:0px;display:block;display:none;position:relative">'
						+ '									<img src="'+S3_STATIC_ASSETS_PATH+'/images/loader.gif" style="position:absolute;left:17px;top:-5px;"/>'
						+ '								</div>'
						+ '							</div>'
						+ '							<div id="likeFace_Recent_'+aId+'_'+data[i].id+'" style="padding:0px 0px 0px 2px;margin:0px;float:left;position:relative;">'
						+ '								<div id="likeTextBox_Recent_'+aId+'_'+data[i].id+'" style="padding:0px;margin:0px;position:absolute;top:-16px;left:0px;display:none;font-family:Arial;font-size:11px;">Like</div>'
						+ '								<span id="likeFaceImage_Recent_'+aId+'_'+data[i].id+'" style="display:'+(vote == 1 ? 'none' : 'block')+';">'
						+ '									<a href="" onclick="javascript: updateUserLikeUnlikeVote(\''+data[i].id+'\',\'Recent_'+aId+'\',\'1\', \''+title+'\', \''+permalink+'\'); return false;" class="like-icon" onmouseover="javascript:$(\'likeTextBox_Recent_'+aId+'_'+data[i].id+'\').style.display=\'block\';return false;" onmouseout="javascript:$(\'likeTextBox_Recent_'+aId+'_'+data[i].id+'\').style.display=\'none\';return false;"></a>'
						+ '								</span>'
						+ '								<span id="likeFaceImageActive_Recent_'+aId+'_'+data[i].id+'" style="display:'+(vote == 1 ? 'block' : 'none')+';">'
						+ '									<a href="" onclick="javascript:return false;" class="like-active-icon" onmouseover="javascript:$(\'likeTextBox_Recent_'+aId+'_'+data[i].id+'\').style.display=\'block\';return false;" onmouseout="javascript:$(\'likeTextBox_Recent_'+aId+'_'+data[i].id+'\').style.display=\'none\';return false;"></a>'
						+ '								</span>'
						+ '							</div>'
						+ '							<div id="moodDiv_Recent_'+aId+'_'+data[i].id+'" style="padding:0px 0px 0px 4px;margin:0px;float:left;">'
						+ '								<a href="" id="moodIconClass_Recent_'+aId+'_'+data[i].id+'" onclick="javascript: $(\'moodIconClass_Recent_'+aId+'_'+data[i].id+'\').className = \'mood-active-icon\'; getUsersStoryLikeUnlikeStats(\''+data[i].id+'\',\'Recent_'+aId+'\');return false;" class="mood-inactive-icon" style="text-decoration:none;">'
						+ '									<div align="center" style="padding:2px 0px 0px 0px;margin:0px;">mood</div>'
						+ '								</a>'
						+ '							</div>'
						+ '							<br clear="all"/>'
						+ '						</div>'
						+ '						<br clear="all"/>'
						+ '					</div>'
						+ '					<div id="userStoryLikeUnlikeStatsPaddingDiv_Recent_'+aId+'_'+data[i].id+'" style="padding:10px 0px 0px 0px;margin:0px;line-height:0px;display:none;"></div>'
						+ '					<div id="userStoryLikeUnlikeStatsOuterBox_Recent_'+aId+'_'+data[i].id+'" class="userStoryLikeUnlikeStats" style="padding:5px;margin:0px 0px 15px 0px;width:600px;background-color:#F7F7F7;border:1px solid #8E8E8E;display:none;">'
						+ '						<div id="userStoryLikeUnlikeStatsBox_Recent_'+aId+'_'+data[i].id+'" style="padding:5px 0px 0px 15px;margin:0px;width:90%;float:left;"></div>'
						+ '						<div style="padding:3px 0px 0px 0px;margin:0px;width:5%;float:right;">'
						+ '							<a href="" class="close-icon" onclick="javascript:closeMoodStatsBox(\''+data[i].id+'\', \'Recent_'+aId+'\');return false;"></a>'
						+ '						</div>'
						+ '						<br clear="all"/>'
						+ '					</div>'
						+ '					<div id="commentShareBoxHolderRecent'+data[i].id+'" align="left" style="margin: 0px; padding: 3px 0px; display: none;"></div>'
						+ '				</div>'
						+ '				<br clear="all"/>';
						// show more or less link
			htmlHolder 	+='			</div>';
		}
		if(extra_div_flag == 1) {
				htmlHolder 	+='		</div>';
		}
		if(data.length > displayNumberOfRecords) {
			htmlHolder += '				<div align="left" id="network_recent_stories_show_more'+aId+'" style="margin:0px;padding:5px 0px 5px 10px;font-size:11px;font-weight:normal;font-family:arial;">'
						+ '					<a style="color:#6F6F6F;cursor:pointer;text-decoration:underline;" onclick="$(\'network_recent_stories_show_more'+aId+'\').style.display = \'none\';$(\'network_recent_stories_show_less'+aId+'\').style.display = \'block\';$(\'newsNetworkRecentStoriesShowMoreLess'+aId+'\').style.display = \'block\';">Show more</a>'
						+ '				</div>'
						+ '				<div align="left" id="network_recent_stories_show_less'+aId+'" style="margin:0px;padding:5px 0px 5px 10px;font-size:11px;font-weight:normal;font-family:arial;display:none;">'
						+ '					<a style="color:#6F6F6F;cursor:pointer;text-decoration:underline;" onclick="$(\'network_recent_stories_show_less'+aId+'\').style.display = \'none\';$(\'network_recent_stories_show_more'+aId+'\').style.display = \'block\';$(\'newsNetworkRecentStoriesShowMoreLess'+aId+'\').style.display = \'none\';">Show less</a>'
						+ '				</div>';
		}
	} else {
		htmlHolder += 'Stories not found';
	}
	htmlHolder += '<br clear="all"/>';
	$('recent_story_contents_'+aId).innerHTML = htmlHolder;
	$('recent_story_contents_'+aId).style.display = 'block';
}