var objClient;
var totalProjects;
var projectNumber;
var popupHeight = 484;
var popupWidth = 871;
var popupTop = 80;
var popupLeft = getPopupLeft();

function getPopupLeft(  ) {

	return ((window.getWidth() - popupWidth)/2).round();
}


function movePopup() {

	popupLeft = getPopupLeft();
	
	$('popup').setStyle('top', popupTop);
	$('popup').setStyle('left', popupLeft);
	$('popup').setStyle('width', popupWidth);
	$('popup').setStyle('height', popupHeight);
	
}

function chooseProject(pid) {
	projectNumber = pid;
}

function showPopup(client_id)
{

	projectNumber = 0;
	
	var title = client_id;
	if ($('filterType'))
	{
		$('filterType').style.display = 'none';
	}
	showOverlay();

	$('popup').setStyle('display','block');
	$('popup').setStyle('position', 'absolute');
	$('popup').setStyle('background-color', '#fff');
	$('popup').setStyle('z-index', '100');
	
	
	movePopup();

	var urlPop = '/services/GetClientPopup.php?client_id='+client_id;

	
	var myAjax = new Request({method: 'get',
		url:urlPop,
		onSuccess: function(client_info) {
						
		objClient = JSON.decode(client_info);
		totalProjects = objClient['projects'].length;
									
		var myOldName = objClient['client_name'].toString();
		var myNewName = myOldName.replace("\\'", "'");
		$('client_name').innerHTML = myNewName;
										
		updatePopup(projectNumber);	
									
		}								
	}).send();	
}

function updatePopup() {
	
	$('project_name').innerHTML = objClient['projects'][projectNumber]['project_name'];
	$('project_description').innerHTML = objClient['projects'][projectNumber]['project_description'];
	

	if (objClient['projects'][projectNumber]['project_url'] != null)
	{
		$('project_url').innerHTML = '<a href="'+objClient['projects'][projectNumber]['project_url']+'" class="popupLinks">View Website</a>';
	}
	else
	{
		$('project_url').innerHTML = new String();
	}
	
	if (so != undefined)
	{
		so.dispose();
	}
	
	if (totalProjects > 1)
	{
		$('other_projects').setStyle('display','block');
		
		var projects = "";
		
		for (var i = 0; i < totalProjects; i++)
		{
			
			if (i != projectNumber) {
				projects += '<a style="cursor:pointer;" onclick="nextProject('+i+');" class="popupLinks">'+objClient['projects'][i]['project_name']+'</a><br />';
			}
			else
			{
				projects += '<a style="margin-top:4px; color:#ccc;" class="popupLinks">'+objClient['projects'][projectNumber]['project_name']+'</a><br />';
			}
		}
		$('project_list').innerHTML = projects;
	}
	else
	{
		
		$('other_projects').setStyle('display','none');
	}
	if(objClient['projects'][projectNumber]['video_src'] != null)
	{
		var so = new SWFObject("/flash/player.swf", "videoPlayer", "480" , "400", "9", "#FFF");
		so.addParam('allowScriptAccess', 'always');
		so.addParam('allowFullScreen', 'true');
		so.addVariable('videoSrc',objClient['projects'][projectNumber]['video_src']);
		so.useExpressInstall('/flash/Sniffer/expressinstall.swf');
		so.write("videoPlayer_holder");
	}
}

function nextProject(i) {
	projectNumber=i;

	
	
	updatePopup();
}

function showOverlay()
{
	var overlay = new Element('div', {
		'id': 'overlay',
		'styles': {
			'position': 'absolute',
			'top': 0,
			'left': 0,
			'opacity': 0,
			'display': 'none',
			'background-color': '#000',
			'width': window.getScrollWidth(),
			'height': window.getScrollHeight()
		}
	}).injectInside(document.body);
	overlay.style.display = 'block';
	
	var overlayEffect = new Fx.Tween(overlay, {duration:400, 
									     wait:false
										 });
												
	overlayEffect.start('opacity',0,.7);

	window.addEvent('resize', function() {
			movePopup();
			
			$('overlay').setStyles({
				'width': window.getScrollWidth(),
				'height': window.getScrollHeight()
			});
		});
}

function hidePopup()
{

	try
	{
		$('videoPlayer').dispose();
	}
	catch(err)
	{
		$('videoPlayer_holder').innerHTML = "";
	}

	$('client_name').innerHTML = new String();
	$('project_name').innerHTML = new String();
	$('project_description').innerHTML = new String();
	$('project_url').innerHTML = new String();
	$('project_list').innerHTML = new String();
	
	$('popup').setStyle('display','none');
	hideOverlay();

}

function hideOverlay()
{
	$('overlay').dispose();
	window.removeEvents('resize');
}