
var popupBox =	function (src){	
	var doc = document;	
	var $q_overlay = $("<div id='q_overlay'></div>").css({'opacity':'0.5'}).appendTo('body');
	var $q_popupContainer = $("<div id='q_popup-container'><img id='q_img' /></div>").hide().appendTo('body');
	
	var img = document.getElementById('q_img');
	
	var newImg= new Image();
	
	newImg.onload = function(){
		
		var newWidth= newImg.width;
		var newHeight = newImg.height;
		
		img.src = newImg.src;
		img.width = newWidth;
		img.height = newHeight
		
		var centerPosX = Math.round( ($q_overlay.width() - newWidth) / 2);
		var centerPosY = Math.round( ($q_overlay.height() - newHeight) / 2);
		
		$q_popupContainer
		.css({'top': centerPosY + 'px', 'left': centerPosX + 'px', 'width': newWidth + 'px', 'height': newHeight + 'px'})
		
		var $closeButtonContainer = $("<div id='closeButtonContainer'><a id='close' href='#close'>Close</a></div>")				
		.appendTo($q_popupContainer);		
		
		$closeButtonContainer.click(function(){				
			killAll();
			
			return false;		
		});		
	}
	
	newImg.src = src;
	$q_popupContainer.fadeIn();
		
	doc.onkeypress = function(e){
		if (!e)	 e = window.event;
		
		// Pick up what the key was pressed
		key = e.keyCode ? e.keyCode : e.which;
		
		if (key == 27){
			killAll();
		}
	}		
	
	$q_overlay.click(function(){
		killAll();
	});
	
	this.killAll = function(){		
		$q_overlay.remove();
		$q_popupContainer.remove();				
		//doc.onkeypress = null;
	}
}

$(document).ready(function(){
	$('#thumbs a').click(function(){			
		var myHref = $(this).attr('href');		
		var myBox = popupBox(myHref);
		
		return false;									 
	});	
});


