var windowWidth = 0;var windowHeight = 0;

var viewportwidth;
var viewportheight;


function getBrowserDimension() //full content
{
	windowWidth = document.documentElement.scrollWidth || document.body.scrollWidth ;
	windowHeight = document.documentElement.scrollHeight || document.body.scrollHeight ;
	
	alert('Height: ' + windowWidth + ' Width: ' + windowHeight);
	
	if(windowHeight > 640)
	{
		$("#light").css("margin-top", "-320px");
	}
	else
	{
		$("#light").css("margin-top", "0");	
	}
}

function getViewportDimension() //full content
{
	// the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
 
	if (typeof window.innerWidth != 'undefined')
	{
		viewportwidth = window.innerWidth,
		viewportheight = window.innerHeight
	}
	 
	// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
	
	else if (typeof document.documentElement != 'undefined'
	&& typeof document.documentElement.clientWidth !=
	'undefined' && document.documentElement.clientWidth != 0)
	{
		viewportwidth = document.documentElement.clientWidth,
		viewportheight = document.documentElement.clientHeight
	}
	 
	// older versions of IE
	 
	else
	{
		viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
		viewportheight = document.getElementsByTagName('body')[0].clientHeight
	}

	
	if(viewportheight > 640)
	{
		$("#light").css("margin-top", "-320px");
		$("#light").css("top", "50%");
		//$("#light").css("bottom", "50%");
		//alert("tall");
	}
	else
	{
		$("#light").css("margin-top", "20px");
		$("#light").css("top", "0%");
		//$("#light").css("bottom", "0");
		//alert("not tall");
	}
}

$(document).ready(function()
{
	getViewportDimension();
});

$(window).resize(function(){
	getViewportDimension();
});

function showScreenshot(id, projectName, div)
{
	$("#img_screenshot").attr('src','../images/portfolio/' + projectName + '/screen' + id + '.jpg');
	$("#large_screen").attr('src','../images/portfolio/' + projectName + '/large' + id + '.jpg');

	
	//cleear previous active border classes
	$(".project_thumbnails > *").addClass("thumbnail");
	$(".project_thumbnails > *").removeClass("thumbnail_Active");
	//$(".project_thumbnails").css("display", "none");
	
	//set active border class
	$(div).addClass("thumbnail_Active");
}