var fillBody = function() {
	getUser();
}

 function showRockyouAd(){
	try{
		_ryadConfig = new Object();
		_ryadConfig.placeguid='307AA24986';
		_ryadConfig.type='Leaderboard';
		
		_$("forTopAds").innerHTML = "<div id='_ryad_307AA24986'></div>"; 
		
		var head = document.getElementsByTagName("head");
		var script = document.createElement("script");
		script.setAttribute('src', 'http://cdn.rockyou.com/apps/ams/tag_os.js');
		script.setAttribute('type', 'text/javascript');
		head[0].appendChild(script);
	
	}catch(ex){
	;
	}
}

var fill = function() {
	allContent = _$("allContent");
	var html = '<table cellspacing=0 cellpadding=0 width="100%"><tbody>'+
					'<tr>'+
						'<td>'+
							'<table width="100%" cellspacing=0 cellpadding=0 style="margin-left: 10px;">'+
								'<tr class="tabs" id="tabContainer">'+
									'<td name=glitter id="chatTD"><a href="javascript:get_glitter()">Generate Text</a></td>'+
									'<td name=images id="gen_images"><a href="javascript:getGeneratedImages()">My Generated Texts</a></td>'+
									'<td name=share id="share" ><a href="javascript:getSharedStories()"><span style="color:red;">New ! </span> Shared Graphics </a></td>'+
									'<td name=hearts id="hearts"><a href="'+hearts_canvas_url+'" target="_blank">Send Glitter Hearts</a></td>'+
									'<td name=button id="button" width="15%"><a href="'+tease_canvas_url+'" target="_blank">Tease Friend</a></td>'+
									/*'<td name=logo id="logo" width="15%"><a href="'+funny_canvas_url+'" target="_blank">Make Your Funny Picture</a></td>'+*/
								'</tr>'+
							'</table>'+
						'</td>'+
					'</tr>'+
					/*'<tr>'+
						'<td id="forTopAds" style="padding-top: 15px;" align="center"></td>'+
					'</tr>'+*/
					"<tr style='background-color: white; border: 0px;'>"+
						"<td style='padding:3px;' align='center' >"+
							"<div align=center>"+
								'<div id="adPlaceholderTop"></div>'+
							"</div>"+
						"</td>"+
					"</tr>"+
					'<tr class=container>'+
						'<td style="padding-left: 20px;">'+
							'<div id=container style="padding-top: 10px; padding-bottom: 10px;"><div class=loading>Loading...</div></div>'+//style="height: 1000px;"
						'</td>'+
					'</tr>'+
					/*'<tr>'+
						'<td style="padding-top: 15px;" align="center">'+
							'<iframe id=adTop src="http://ads.socialmedia.com/myspace/monetize.php?width=645&height=60&pubid=2f26b06e4e0fa8510e08ce482739e7d7&bgcolor=FFFFFF&bordercolor=FFFFFF" border="0" width="700" height="60" name="socialmedia_ad" scrolling="no" frameborder="0"></iframe>'+
						'</td>'+
					'</tr>'+*/
					"<tr style='background-color: white; border: 0px;'>"+
						"<td style='padding:5px;' align='center' colspan='2'>"+
							"<div align=center>"+
								'<div id="adPlaceholderBottom"></div>'+
							"</div>"+
						"</td>"+
					"</tr>"+
					"<tr style='background-color: white; border: 0px;'>"+
						"<td style='padding:5px;' align='left'>"+
							'<iframe frameborder="0" src = "http://adturns.com/ad.php?c=46" width = "728" height = "60" style = "border: none; overflow: hidden" ></iframe>'+
						"</td>"+
					"</tr>"+
					'<tr>'+
						'<td><br><br><br><br></td>'+
					'</tr>'+
				'</tbody></table>';
	allContent.innerHTML = html;
	container = _$("container");

	appParams = opensocial.getEnvironment().getParams();

	if(appParams['senderId']) {
		senderId =  appParams['senderId'];
		senderThumbnail =  appParams['senderThumbnail'];
		senderName =  appParams['senderName'];
		senderProfile = appParams['senderProfile'];
		senderTypeId = appParams['senderTypeId'];
		giftTypeId = appParams['giftTypeId'];
		appId	= appParams['appId'];
		appName = appParams['appName'];

		recievers = appParams['recievers'];
		
	}

	get_glitter();

	//showRockyouAd();

        applyAds('adDivTop', 'adPlaceholderTop');
        applyAds('adDivBottom', 'adPlaceholderBottom');
	applyAds('adDivLeft', 'adPlaceholderLeft');
        applyAds('adDivRight', 'adPlaceholderRight');
//support socialreach ads
sr_gof();
}

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 get_glitter = function() {
	selectTab("glitter");
	var t =  Math.floor(Math.random()*110);
	var html = '<table><tbody><tr><td><div id="adPlaceholderLeft"></div></td><td><table cellpadding="5" cellspacing="0" align="center" width="100%">'+
					'<tr>'+
						'<td align="center" colspan="2"><img style="padding-top: 10px; cursor: pointer" src="'+IMG_URL+'buletin.png" onclick="postInvite()"></td>'+
					'</tr>'+
					'<tr>'+
						'<td align="center" colspan="2" id="forSpecialGifts"></td>'+
					'</tr>'+
					'<tr>'+
						'<td align="center" colspan="2" style="color:#685a68; font-size:17px; font-family:serif;"><b><i>Just change any of these attributes and get Your Text as Image !!!</i></b></td>'+
					'</tr>'+
					'<tr>'+
						'<td align="center" colspan="2" style="color:#4a114a; font-size:16px; font-family:serif;"><b><i>After changing "Text", "Width" and "Height" press on "Enter" to see changes !!</i></b></td>'+
					'</tr>'+
					'<tr>'+
						'<td width="50%" valign="top" style="border-right: 1px dotted #4a114a; padding-left: 100px;">'+
							'<table>'+
								'<tr>'+
									'<td class="text">Text Style:</td>'+
									'<td>'+
										'<table cellpadding="0" cellspacing="0" class="choose_font" onclick="openTextStyles(this)">'+
											'<tbody>'+
												'<tr>'+
													'<td width="210px" id="s_0"><img class="fonts" src="'+IMG_URL+'font_vibrato.jpg" /></td>'+
													'<td width="22px"align="center" style="border-left: 1px dotted #CCC; cursor: pointer;"><img src="'+IMG_URL+'arrow_down.png"></td>'+
												'<tr>'+
											'</tbody>'+
										'</table>'+
										'<div id="openedStyles" class="font_div" style="display: none; position: absolute;">'+
											'<table cellpadding="0" cellspacing="0" >';
												for(var i=0; i<styles.length; i++) {
													html += '<tr class="fonts_over">'+
																'<td onclick="selectStyle(this, \''+styles[i]+'\')" style="border-bottom: 1px dotted gray">'+
																	'<img class="fonts" src="'+IMG_URL+styles[i]+'.jpg" />'
																'</td>'+
															'</tr>';
												}
									html += '</table>'+
										'</div>'+
									'</td>'+
								'<tr>'+
								'<tr>'+
									'<td style="padding-top: 10px;" class="text">Text:</td>'+
									'<td style="padding-top: 10px;"><input value="Welcome" onchange="req_generateText()" style="border: 1px solid #CCCCCC; padding-left: 5px; height: 30px; width: 230px;" type="text" id="text" value="'+text+'"  onChange="req_generateButton()" /></td>'+
								'</tr>'+
								'<tr>'+
									'<td class="text">Font:</td>'+
									'<td>'+
										'<table cellpadding="0" cellspacing="0" class="choose_font" onclick="openFonts(this)">'+
											'<tbody>'+
												'<tr>'+
													'<td width="210px" id="tr_0"><img class="fonts" src="'+IMG_URL+'28DaysLater.png" /></td>'+
													'<td width="22px"align="center" style="border-left: 1px dotted #CCC; cursor: pointer;"><img src="'+IMG_URL+'arrow_down.png"></td>'+
												'<tr>'+
											'</tbody>'+
										'</table>'+
										'<div id="openedFonts" class="font_div" style="display: none; position: absolute;">'+
											'<table cellpadding="0" cellspacing="0" >';
												for(var i=0; i<images.length; i++) {
													html += '<tr class="fonts_over">'+
																'<td onclick="selectFont(this, \''+images[i]+'\')">'+
																	'<img class="fonts" src="'+IMG_URL+images[i]+'.png" />'
																'</td>'+
															'</tr>';
												}
									html += '</table>'+
										'</div>'+
									'</td>'+
								'<tr>'+
								'<tr>'+
									'<td class="text">Width:</td>'+
									'<td><input type="text" value="200" onchange="req_generateText()" id="width" style="border: 1px solid #CCCCCC; padding-left: 5px; height: 25px; width: 78px;"></td>'+
								'<tr>'+
								'<tr>'+
									'<td class="text">Height:</td>'+
									'<td><input type="text" value="100" onchange="req_generateText()" id="height" style="border: 1px solid #CCCCCC; padding-left: 5px; height: 25px; width: 78px;"></td>'+
								'<tr>'+
							'</table>'+
						'</td>'+
						'<td class="text" valign="top">'+
							'<table>'+
								'<tr>'+
									'<td class="text">Font color:</td>'+
									'<td class="text">'+
										'<form style="padding-top: 10px;"><input onclick="selectFontColor(\'colorpicker1\')" type="text" id="color1" name="color1" value="#9E4285" style="border: 1px solid #CCC; width: 80px; height: 30px; text-align: center; padding-top: 5px; background-color: #9E4285; color: #000"/></form>'+
										'<div id="colorpicker1" style="position: absolute; display: none;"></div>'+
									'</td>'+
								'</tr>'+
								'<tr>'+
									'<td class="text">Background color:</td>'+
									'<td class="text">'+
										'<form><input onclick="selectBackgroundColor(\'colorpicker2\')" type="text" id="color2" name="color2" value="#fdfdfc" style="border: 1px solid #CCC; width: 80px; height: 30px; text-align: center; padding-top: 5px; background-color: #fdfdfc; color: #000"/></form>'+
										'<div id="colorpicker2" style="position: absolute; display: none;"></div>'+
									'</td>'+
								'</tr>'+
								'<tr>'+
									'<td class="text">Shadow color:</td>'+
									'<td class="text">'+
										'<form><input onclick="selectShadowColor(\'colorpicker3\')" type="text" id="color3" name="color3" value="#685a68" style="border: 1px solid #CCC; width: 80px; height: 30px; text-align: center; padding-top: 5px; background-color: #685a68; color: #FFF"/></form>'+
										'<div id="colorpicker3" style="position: absolute; display: none;"></div>'+
									'</td>'+
								'</tr>'+
								'<tr>'+
									'<td class="text">Font size:</td>'+
									'<td>'+
										'<table cellpadding="0" cellspacing="0" class="choose_size" onclick="openSizes(this)">'+
											'<tbody>'+
												'<tr>'+
													'<td width="52px" style="color:#58616a" id="td_0">36px</td>'+
													'<td width="25px"align="center" style="border-left: 1px dotted #CCC; cursor: pointer;"><img src="'+IMG_URL+'arrow_down.png"></td>'+
												'<tr>'+
											'</tbody>'+
										'</table>'+
										'<div id="openedSizes" class="size_div" style="display: none; position: absolute;">'+
											'<table cellpadding="2" cellspacing="0" >';
												for(var j=8; j < 109; j+=2) {
													html += '<tr class="fonts_over">'+
																'<td style="color:#58616a; padding-left: 10px;" align="center" onclick="selectSize(this, \''+j+'\')">'+j+'px</td>'+
															'</tr>';
												}
									html += '</table>'+
										'</div>'+
									'</td>'+
								'</tr>'+
							'</table>'+
						'</td>'+
					'</tr>'+
					'<tr>'+
						'<td colspan="2" align="center"><div id=error style="font-size: 16px"></div></td>'+
					'</tr>'+
					'<tr>'+
						'<td class="text" valign="top" colspan="2">'+
							'<div style="font-size: 20px; padding-top: 15px;color: #D934FF" align="center"><b>Take Your Generated Text !!!<b></div>'+
							'<div style="padding-top: 10px;" align="center"><img src="'+IMG_URL+'3aniarr2.gif" /></div>'+
							'<div  id="genHeart" style="padding-top: 0px;" align="center">Generating...</div>'+
							'<div id="forSave" style="padding-top: 20px;display:none;cursor:pointer" align="center"><img border="0" src="'+IMG_URL+'save.png" onclick="saveButton()"><img border="0" src="'+IMG_URL+'share.png" onclick="shareStory()"></div>'+
						'</td>	<br/><br/><br/>'+
			
					'</tr>'+
				'</table></td><td><div id="adPlaceholderRight"></div></td></tdbody></table>';
				
		container.innerHTML = html;
		errorDiv = _$("error");
		req_generateText();
		if(appParams['senderId']) {
			var str = drawSelectedFriends();
			_$("forSpecialGifts").innerHTML = str; 
		}
		setTimeout("gadgets.window.adjustHeight()", 2000);
		setTimeout("gadgets.window.adjustHeight()", 5000);	
		
}

var saveButton = function() {
	var data = "userId=" + userId;
	Request.sendPOST(SERVER_URL+"copyText.php", data, resp_saveButton);
}

var resp_saveButton = function(response) {
	getGeneratedImages();
}

var getGeneratedImages = function() {
	var data = "userId=" + userId;
	Request.sendPOST(SERVER_URL+"generateAndDeleteImages.php?action=getImages", data, resp_getGeneratedImages);
}

var resp_getGeneratedImages = function(response) {
	selectTab("images");
	if(response.text != "none") {
		var t = new Date();
		t = t.getTime();
		var data = eval('('+response.text+')');
		var str = '<table cellpadding="5" cellspacing="0"><tr><td id="info" style="color: red; font-size:18px; font-family:serif;"></td></tr></table>'+
				  '<table class="blue_border" id="imagesTable" cellpadding="2" cellspacing="0" width="800px">'+
					'<tr class="blue_background"><td colspan="5" class="blue_text"> Your Generated Texts</td><tr>';
		for ( var i = 0; i < data.images.length; i++ ) {
			var imgSrc = data.images[i].imageSrc;
			str += '<tr id="img_'+imgSrc+'" >'+
						'<td width="400px" valign="middle" style="padding: 10px;border-bottom: 1px solid #9e4285;"><img src="'+SERVER_URL+'genimg/'+userId+'/'+imgSrc+'?t='+t+'" border="0px" style="max-width:400px;"></td>'+
						'<td width="100px" align="center" valign="middle" class="img_col"><a style="cursor:pointer" onclick="showInvite(\''+imgSrc+'\')">Send to Friends</a></td>'+
						'<td width="100px" align="center" valign="middle" class="img_col"><a style="cursor:pointer" onclick="postInvite_(\''+imgSrc+'\')">Post To Bulletin</a></td>'+
						'<td width="150px" align="center" valign="middle" class="img_col"><a style="cursor:pointer" onclick="addToProfile(\''+imgSrc+'\')">Place On My Profile</a></td>'+
						'<td width="50px"  align="center" valign="middle" class="img_col"><a style="cursor:pointer" onclick="deleteImage(\''+imgSrc+'\')">Delete</a></td>'+
					'</tr>';
		}
			
		str += '<tr><td id="forProfile" colspan="5" style="padding: 10px;display:none;"></td></tr>' +
				'<tr><td id="forMail" colspan="5" style="padding: 10px;display:none;"></td></tr>' +
				'<tr>'+
					'<td id="forSendMessage" colspan="5" style="vertical-align: top; padding-left: 10px; padding-right: 10px;">'+
						'<div id="friendsDiv"></div>'+
					'</td>'+
				'</tr>'+
			'</table>';
		
		container.innerHTML = str;
		//container.style.height =  (data.images.length)*100 +"px";
		setTimeout("gadgets.window.adjustHeight()", 5000);
		
	} else {
		container.innerHTML = "<span style='color: #3b6bb5; font-size:18px; font-family:serif;'>You have not generated images ! Start to generate and send it friends !!!</span>";
	}
}

var deleteImage = function(imgsrc) {
	_$("forMail").style.display = "none";
	_$("forProfile").style.display = "none";
	_$("forSendMessage").style.display = "none";
	var tr = _$("img_" + imgsrc);
	tr.parentNode.removeChild(tr);
	_$("imagesTable").style.borderBottom = "none";
	var data = "userId=" + userId + "&imgSrc=" + imgsrc;
	Request.sendPOST(SERVER_URL+"generateAndDeleteImages.php?action=deleteImages", data, resp_deleteImage);
}

var resp_deleteImage = function(response) {
	if(response.text == "ok"){
		_$("info").innerHTML = "Your selected Image has been deleted !!!!";
		setTimeout("hideInfoTr()", 5000);
	}
	setTimeout("gadgets.window.adjustHeight()", 2000);
}

var hideInfoTr = function() {
	_$("info").innerHTML = "";
}

var addToProfile = function(img) {
	var display = _$("forProfile").style.display;
	if(display == "none") {
		_$("forProfile").innerHTML = "";
		_$("forSendMessage").style.display = "none";
		_$("forMail").style.display = "none";
		var link = '<a href=\''+canvas_url+'\' target=\'_blank\' title=\'Glitter Text\'><img src=\''+SERVER_URL+'genimg/'+userId+'/'+img+'\' border=\'0\' /></a>';
		var profile = '<table cellpadding="0" cellspacing="0">'+
							'<tr>'+
								'<td style="color:#9e4285; font-size:18px; font-family:serif;">How put Generated Image on your Profile ?</td>'+
							'</tr>'+
							'<tr>'+
								'<td style="color:#333; font-size:13px; font-family:serif; padding: 10px;">'+
									'<b>Step 1.</b> Copy the Profile Code using Ctrl-C or Right-click+Copy . <br />'+
									'<b>Step 2.</b> On your MySpace home, click on \'Edit Profile\' .<br />'+
									'<b>Step 3.</b> Paste the code into one of the text boxes (About Me, Music, Books, Movies etc.) using Ctrl-V or Right-click+Paste .<br />'+
									'<b>Step 4.</b> Click on \'Save All Changes\'. Your profile page should now display your <b>Glitter Text!</b>'+
								'</td>'+
							'</tr>'+
							'<tr>'+
								'<td style="color:#9e4285; font-size:13px; font-family:serif;"><b>Code: </b></td>'+
							'</tr>'+
							'<tr>'+
								'<td>'+
									'<input type=text class="glitterCode" onfocus="this.select()" readonly="readonly"  value="'+link+'" />'+
								'</td>'+
							'</tr>'+
						'</table>';
		_$("forProfile").innerHTML = profile;
		_$("imagesTable").style.border = "1px solid #9e4285";
		_$("forProfile").style.display = "";
		setTimeout("gadgets.window.adjustHeight()", 2000);
	}else {
		_$("forProfile").style.display = "none";
		_$("imagesTable").style.borderBottom = "none";
	}
}

// ------------------------ Draw Selected Friends ------------------------------------ //
var drawSelectedFriends = function() {
	var recieversLength = recievers.length;
	if(isIE) recieversLength = recievers.length-1;
	var html = '<table cellpadding="0" cellspacing="0" align="center" width="820px">'+
					'<tr height="40px" style="border-bottom: 1px solid gray; background: url('+IMG_URL+'/space4.png);">'+
						'<td align="center">'+
							'<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.adobe.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="400" height="40">'+
								'<param name="movie" value="'+SERVER_URL+'banner.swf">'+
								'<param name="allowScriptAccess" value="always">'+
								'<embed type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" src="'+SERVER_URL+'banner.swf" width="400" height="40" allowScriptAccess="always"></embed>'+
							'</object><br />'+
						'</td>'+
					'<tr>'+
					'<tr>'+
						'<td align="center">'+
							'<table cellspacing="0" cellpadding="10">'+
								'<tr>';
									for(var i=0; i< recieversLength; i++) {
										var recieverImgUrl = recievers[i].recieverThunb;
										var recieverName = recievers[i].recieverName;
								html += '<td width="70px" style="font-size: 10px; color: #443C48;"><img class="friendImg"  src= '+recieverImgUrl+' /><br>'+recieverName+'</td>';	
									}
							html += '</tr>'+
							'</table>'+
						'</td>'+
					'</tr>'+
					'<tr>'+
						'<td align="center"><img style="cursor: pointer;" src="'+IMG_URL+'send.png" onclick="copySpecialGift()" /></td>'+
					'<tr>'+
					'<tr>'+
						'<td align="center" id="send" style="font-size: 15px; color:red;"></td>'+
					'<tr>'+
				'</table>';
	return  html;
}

// -------------------------------- Send Special Gift ----------------------- //

var copySpecialGift = function(){
	var data = "userId=" + userId;
	Request.sendPOST(SERVER_URL+"copySpecialGift.php", data, resp_copySpecialGift);
}

var resp_copySpecialGift = function(response) {
	_$("send").innerHTML = "";
	var giftUrl = response.text;
	var recieversLength = recievers.length;
	if(isIE) recieversLength = recievers.length-1;

	var receiverIds = "";
	var receiversInfo = '[';
					
	for(var i=0; i< recieversLength; i++) {
		receiverIds += 	recievers[i].recieverId + ",";
		receiversInfo += '{"recieverName" : "'+recievers[i].recieverName+'", "recieverProfile" : "'+recievers[i].recieverProfile+'", "recieverThunb" : "'+recievers[i].recieverThunb+'" },';
	}
	
	receiverIds = receiverIds.substring(0, receiverIds.length-1);
	receiversInfo = receiversInfo.substring(0, receiversInfo.length-1);
	receiversInfo += ']';

	var data = "query=addgift&senderThumbnail="+senderThumbnail+
				"&senderName="+encodeURIComponent(senderName)+
				"&senderId="+encodeURIComponent(senderId)+
				"&senderProfile="+encodeURIComponent(senderProfile)+
				"&senderTypeId="+encodeURIComponent(senderTypeId)+
				"&appId="+encodeURIComponent(appId)+
				"&appName="+encodeURIComponent(appName)+
				"&giftTypeId="+encodeURIComponent(giftTypeId)+
				"&giftType="+encodeURIComponent(giftType)+
				"&giftUrl="+encodeURIComponent(giftUrl)+
				"&receiverId=" + encodeURIComponent(receiverIds)+
				"&receiversInfo="+encodeURIComponent(receiversInfo);
	Request.sendPOST("http://funpuzzle.teaseplay.com/giftmanager/GiftService", data, resp_info);
}

var resp_info = function(response) {
	if(response.text == "ok") {
		_$("send").innerHTML = "<b><i> Gift was sent !</i></b>";
	}
}

// ----------------------------------------- Share Created Image With Everone -------------------------------- //

var shareStory = function() {
	var data = "userId=" + userId;
	Request.sendPOST(SERVER_URL+"shareImage.php", data, resp_shareStory);
}

var resp_shareStory = function(response) {
	lastSharedImgUrl = response.text;
	getSharedStories();
}

var getSharedStories = function() {
	var data = "userId=" + userId;
	Request.sendPOST(SERVER_URL+"generateAndDeleteImages.php?action=getSharedImages", data, resp_getSharedStories);
}

var resp_getSharedStories = function(response) {
	var cellCount=3;
	selectTab("share");
	if(response.text != "none") {
		var t = Math.floor(Math.random()*110);
		var data = eval('('+response.text+')');
		var str = 	'<div style="overflow: auto; height:300px; width: 820px;" id="sharedImg" valign="top" align="center">'+
					'<table cellpadding="5" cellspacing="5" width="700px" align="center" valign="top">';
						for ( var i = 0; i < data.images.length; i++ ) {
							if (i % cellCount == 0) str+= "<tr>";
							var imgSrc = data.images[i].imageSrc;
							str += 	'<td align="center" id="img_'+imgSrc+'" valign="top" style="padding:2px; width:200px; border: 3px outset #CE2CA6;">'+
										'<table cellpadding="0" cellspacing="0">'+
											'<tr>'+
												'<td>'+
													'<img style="cursor:pointer" onclick="showInvite(\''+imgSrc+'\', \'shared\')" src="'+IMG_URL+'sendFriends.png" />';
												'</td>';
												if(lastSharedImgUrl == imgSrc) {
										str += '<td>'+ 
													"<img style='cursor: pointer;' onclick='deleteLastShared(\""+imgSrc+"\")' src='"+IMG_URL+"delete.png' >"+
												'</td>';
												}
									str += '</tr>'+
											'<tr>'+
												'<td colspan="2" align="center">'+
													'<a target="_blank" href="'+SERVER_URL+'shared/'+imgSrc+'">'+
														'<img border="0" style="max-width:250px; max-height: 200px" src="'+SERVER_URL+'shared/'+imgSrc+'" />'+
													'</a>'+
												'</td>'+
											'</tr>'+
											'<tr>'+
												'<td colspan="2">'+
													/*'<img style="cursor:pointer" onclick="putOnProfile(\''+imgSrc+'\')" src="'+IMG_URL+'profile.png" />'+*/
													/*'<a target="_blank" href="'+userProfile+'" ><span id="viewProfile" style="display:none">View My Profile</span><a>'+*/
													'<img style="cursor:pointer" onclick="shareBulletin(\''+imgSrc+'\')" src="'+IMG_URL+'bulletinSharedStory.png" />'+
												'</td>'+
											'</tr>'+
										'</table>'+
									'</td>';
							if (i % cellCount == cellCount-1) str += "</tr>";
						}
					str += '</table>'+
						'</div>'+
						'<div id="friendsDiv"></div>';
		
		container.innerHTML = str;
		
	} else {
		container.innerHTML = "<span style='color: #35879A; font-size:17px; font-family:serif;'><i>There is not shared Love Stories ! Start to share Your Love Story with Your friends !!!</i></span>";
	}
}

// ----------------------------------------- Put On Profile ------------------------------------------------------ //

var putOnProfile = function(imgUrl) {
	if(imgUrl != undefined || imgUrl != "undefined" || imgUrl != "") {
		globalGenImage = imgUrl;
	} 
	var data = "userId=" + userId + "&selectedFriendId=" +globalGenImage+ "&type=shared";
	Request.sendPOST(SERVER_URL+"copyForProfile.php", data, resp_putOnProfile);
}

var resp_putOnProfile = function(response){
	if(_$("viewProfile")) {
		_$("viewProfile").style.display = "";
	}
}

// ----------------------------------------- Delete Last Shared Image -------------------------------------------- //

var deleteLastShared = function(imageSource) {
	var td = _$("img_" + imageSource);
	td.parentNode.removeChild(td);
	var data = "imgSrc=" + imageSource;
	Request.sendPOST(SERVER_URL+"generateAndDeleteImages.php?action=deleteShared", data, resp_deleteLastShared);
}

var resp_deleteLastShared = function(response) {
	if(response.text == "ok") {
		getSharedStories();
	}
}
