function ft_imgBox()
{
	this.show = ft_imgBox_show;
	this.hide = ft_imgBox_hide;
}

function ft_imgBox_show(src, txt)
{
	var max_width = $(window).width() * 0.9;
	var max_height = $(window).height() * 0.85;
	$(document.body).prepend('<div id="ft-imgBox-bg" style="background:#000; position:fixed; top:0; left:0; width:100%; height:100%; opacity:0.5; filter:alpha(opacity=50); z-index:1000000; cursor:pointer;"></div> <div id="ft-imgBox" align="center" style="position:fixed; top:0; left:0; width:100%; height:100%; text-align:center; z-index:10000000;  cursor:pointer;"><div align="center"><div id="ft-imgBox-box" style="background:#333; width:150px; height:50px; margin:50px; padding:5px; z-index=10000000000; max-width:' + (max_width) + 'px; max-height:' + (max_height) + 'px;"><div id="ft-imgbox-loading" style="color:#0CF; font-size:20px; font-weight:bold; padding:10px;">Loading ...</div><img id="ft-imgBox-img" alt="Loading..." style="width:100%; height:100%;" /></div></div></div>'); 
	
	var img = $('#ft-imgBox-img');
	
	$('#ft-imgBox').click(function(){
		ft_imgBox_hide();				   
	});
	
	img.click(function(){
		ft_imgBox_hide();				   
	});
	
	img.load(function(){
		var img = $(this);
		var org = getOriginalWidthOfImg(src);
		
		if(org.height > max_height) org.width = max_height / org.height * org.width;
		if(org.width > max_width) org.height = max_width / org.width * org.height;
		
		$('#ft-imgbox-loading').remove();

		$('#ft-imgBox-box').animate({width: org.width}, 'slow', function(){
			$(this).animate({height: org.height}, 'slow', function(){
				img.show();

				if(txt){
					img.parent().append('<div id="ft-imgBox-txt" style="background:#000; opacity:0.5; filter:alpha(opacity=50); padding-top:10px; float:right; width:100%; font-size:16px; color:#FFF; height:50px; position:relative; top:-60px; z-index:10000000;"></div>');
					$('#ft-imgBox-txt').html(txt);
				}
			});															 
		});				   
	});
	
	img.hide();
	img.attr('src', src);
}

function ft_imgBox_hide()
{
	$('#ft-imgBox-bg').remove();
	$('#ft-imgBox').remove();
}

function getOriginalWidthOfImg(img)
{
	var t = new Image();
	t.src = img;
	return {width:t.width, height:t.height};
}

