//var host = 'http://idlocal.local';
var host = 'http://ididid.eu';

function idididTip(groupID) { 
	var html = '<div class="ididid_tip_background"></div>';
	html+= '<div class="ididid_tip_win"></div>';
	html+= '<div class="ididid_tip_user_frame">';
		html+= '<div class="ididid_tip_user_avater"><img src="http://images.ididid.eu/files/0000/0000/0000/0000/0000/0000/0000/0000/0060/9612/125.jpg" border="0" /></div';
		html+= '<div class="ididid_tip_user_info"><p class="white">iDiDiD</p><p class="black">Doet mee, jij ook? </p></div>';
	html+= '</div>';
	html+= '<div class="ididid_tip_actie_info"></div>';
	html+= '<div class="ididid_tip_network_holder">';
		html+= '<img src="http://assets.ididid.eu/images/third-party/location/demeenthe/button_hyves.png" border="0" onclick="doSignup(\'hyves\', \''+groupID+'\')" />';
		html+= '<img src="http://assets.ididid.eu/images/third-party/location/demeenthe/button_facebook.png" border="0" onclick="doSignup(\'facebook\', \''+groupID+'\')" />';
		html+= '<img src="http://assets.ididid.eu/images/third-party/location/demeenthe/button_twitter.png" border="0" onclick="doSignup(\'twitter\', \''+groupID+'\')" />';
		html+= '<img src="http://assets.ididid.eu/images/third-party/location/demeenthe/button_ididid.png" border="0" onclick="doSignup(\'ididid\', \''+groupID+'\')" />';
	html+= '</div>';
	html+= '<div class="ididid_tip_banner_demeenthe"></div>';
	showOverlayHtml(html);
	resizeIframePopup(800, 483);
	getLastUser(groupID, 0);
}

function getLastUser(groupID, start) { 
	var queryString = '?groups&users&'+groupID+'&'+start+'&1';
	var i = 0;
	var start_row = start+1;
	$.getJSON("/apiparser"+queryString,
		        function(data){
		         
				$.each(data.root.result, function(i,item){
		        	  $(".ididid_tip_user_avater img").attr("src", 'http://images.ididid.eu/'+item.avatar+'125.jpg');
		        	  $("p.white").text(item.fullname);
		          });
				
				if(data.root.result.length > 0) {
					setTimeout("getLastUser("+groupID+","+start_row+")",1500);
				} else {
					setTimeout("getLastUser("+groupID+",0)",1500);
				}	
		        
	});
	
}

doSignup = function(network, group) {
	var ref = group;
	var type = 'promoLocation';
	switch(network) { 
		case 'hyves':
			
				// connect to hyves
				var network_site = '<div class="loadingPage">Bezig met laden van Hyves, dit kan even duren!</div>'; 
				network_site+= '<iframe border="0" frameborder="0" id="network_view" name="network_view" src="'+host+'/promo/explain?ref='+ref+'&type='+type+'&network=hyves" width="900" height="440" onload="clearLoading()" scrolling="no"></iframe>';
				resizeIframePopup(900, 450);
		break;
		case 'twitter':
			
				// connect to hyves
				var network_site = '<iframe border="0" frameborder="0" id="network_view" name="network_view" src="'+host+'/promo/explain?ref='+ref+'&type='+type+'&network=twitter" width="690" height="440" onload="clearLoading()" scrolling="no"></iframe>';
				resizeIframePopup(690, 450);		
		break;		
		case 'facebook':
			
		
				// connect to hyves
				var network_site = '<div class="loadingPage">Bezig met laden van Facebook, dit kan even duren!</div>'; 
				network_site+= '<iframe border="0" frameborder="0" id="network_view" name="network_view" src="'+host+'/promo/explain?ref='+ref+'&type='+type+'&network=facebook" width="900" height="440" onload="clearLoading()" scrolling="no"></iframe>';
				resizeIframePopup(900, 450);	
		break;
	}
	
	$('#ovarlayContent').html(network_site);
};

function overlayDetectMacXFF() {
	  var userAgent = navigator.userAgent.toLowerCase();
	  if (userAgent.indexOf('mac') != -1 && userAgent.indexOf('firefox')!=-1) {
	    return true;
	  }
}

createPopupIdidid = function(html) {
	if(html == undefined) { html = ''; }
	var popup = '<div class="popup_rounded" id="boxOverlayPopup"><div class="popup_wrapper"><div class="top_left">&nbsp;</div><div class="top">&nbsp;</div> ' +
		'<div class="top_right">&nbsp;</div>' +
		'<div class="left">&nbsp;</div>' +
		'<div class="right">&nbsp;</div>' +
		'<div class="bottom_left">&nbsp;</div>' +
		'<div class="bottom">&nbsp;</div>' +
		'<div class="bottom_right">&nbsp;</div><div class="background_top">&nbsp;</div>' +
		'<div class="background_content">&nbsp;</div>' +
		'<div class="background_bottom">&nbsp;</div>' +
		'<div class="sb_content"><div id="closePopupTip" onclick="closeCustomOverlay()"></div><div id="ovarlayContent">'+html+'</div></div>' +
		'</div></div>';
	return popup;
};

showOverlayHtml = function(html) {
	
	$("#popupOverlay").remove();
	$("#popupOverlayWindow").remove();
	
	$("body").append("<div id='popupOverlay' class='popupOverlayBG'></div><div id='popupOverlayWindow'>"+createPopupIdidid(html)+"</div>");
	
	if(overlayDetectMacXFF()){
		$("#popupOverlay").addClass("popupOverlayMacFFBGHack"); //use png overlay so hide flash
	}else{
		$("#popupOverlay").addClass("popupOverlayBG"); //use background and opacity
	}
};

closeCustomOverlay = function() { 
	$("#popupOverlay").fadeOut();
	$("#popupOverlayWindow").fadeOut();
	clearTimeout(0);
};

clearLoading = function() { 
	$('.loadingPage').hide();
}

function resizeIframePopup(width, height) {
	var heightFrame = height - 25;
	var marginLeft = width / 2;
	$("#boxOverlayPopup .sb_content").css( 
			{ 
				'width' : width+"px",
				'height' : height+"px" 
				
	});
	
	$("#boxOverlayPopup iframe").css( 
			{ 
				'width' : width+"px",
				'height' : heightFrame+"px" 
				
			});
	
	$('#popupOverlayWindow #boxOverlayPopup').css({ 'margin-left' : '-'+marginLeft+'px' });
}
