$(document).ready(function(){
	// shift contents of #blogsubs into a new div to float above the rest and expand outside of the contstraints of #blogsubs
	$('body').append('<div id="blogsubs2">'+$('#blogsubs').html()+'</div>');
	var blogsubs_offset=$('#blogsubs').offset();
	$('#blogsubs2').css({
		position:'absolute'
		,top:blogsubs_offset.top
		,left:blogsubs_offset.left
		,width:$('#blogsubs').css('width')
	});
	$('#blogsubs').html(' ');
	$('.openpic').bloggerPics();
});

jQuery.fn.extend({
	bloggerPics: function(options) {
		// make the pics clickable
		var form=this;
		this.each(function(i) {
			var src=$(this).attr('src');
			divid='openpic_'+i;
			$(this).attr('title','Click to view full-size.').click(function(e){
				$('#'+divid).remove(); // in case it exists
				var div='<div class="openpicbig" id="'+divid+'" ><img src="'+src+'" alt="." /></div>';
				$('body').append(div);
				alignDiv(divid,e.pageX,e.pageY);
				$('#'+divid).click(function(){
					$(this).animate({opacity:0},500);
					setTimeout("$('#"+divid+"').remove();",500)
				});
			});
		});
	}
});

function alignDiv(divid,mouseX,mouseY)
{
	var size=new Array();
	var width=$('#'+divid).width();
	var height=$('#'+divid).height();
	$('#'+divid).hide();
	var pageWidth=$(document).width();
	var pageHeight=$(document).height();
	$('#'+divid).show();
	
	// get optimum position
	var left=mouseX-(width/2);
	if (left<10) left=10;
	if (left+width > pageWidth-10) {left=pageWidth-width-10;}

	var top=mouseY-(height/2);
	if (top<10) top=10;
	if (top+height > pageHeight-10) {top=pageHeight-height-10;}

	$('#'+divid).css({margin:0,left:left+'px',top:top+'px'});

}