/*
 * Url preview script 
 * powered by jQuery (http://www.jquery.com)
 * 
 * written by Alen Grakalic (http://cssglobe.com)
 * 
 * for more info visit http://cssglobe.com/post/1695/easiest-tooltip-and-image-preview-using-jquery
 *
 */
 
this.screenshotPreview = function(){	

	// These 2 variable determine popup's distance from the cursor
	var xOffset = 30, yOffset = 10;


	// If IE6, add iframe shim, to prevent objects poking through image
	var html= ( navigator.appVersion.indexOf("MSIE 6.0") > 0 )
		? "<p id='screenshot' style='overflow:hidden'><iframe style='position:absolute;z-index:-1;top:0px;left:0px;width:120%;height:700px;filter:alpha(opacity=00)'></iframe><img src='"
		: "<p id='screenshot'><img src='";

	// used in hover/mouseover to position image/Tooltip. Greg Salisbury, July 2010
	function positionTT(e){
		var	x= e.pageX + xOffset, y= e.pageY + yOffset,
				sT= $(window).scrollTop(), sL= $(window).scrollLeft(),			// Scrollbar positional offsets
				wH= $(window).height()+sT, wW= $(window).width()+sL,		// Adjust for above
				h= $("#screenshot").outerHeight(), w= $("#screenshot").outerWidth(),
				dy= wH-(y+h), dx= wW-(x+w),
				lx=0,ty=0;

		if(dx<0){									// EITHER, FLIP as not enough room on right
			lx= e.pageX - xOffset - w;
			if( (lx>=0) || (dx<lx) )			// If left OK, or not enough room on left, pick largest width to left/right
				x= lx;
		}
//		if(dx<0) x+=dx;						// OR, Adjust x position to fit

//		if(dy<0){									// EITHER, FLIP as not enough room below
//			ty= e.pageY - yOffset - h;
//			if( (ty>=0) || (dy<ty) )			// If above OK, or not enough room above, pick largest height above/below
//				y= ty;
//		}
		if(dy<0) y+=dy;						// OR, Adjust y position to fit

		$("#screenshot").css("top",y+"px").css("left",x+"px");
	}

	$("a.screenshot").hover(	function(e){
			this.t = this.title;
			this.title = "";	
			var c = (this.t != "") ? "<br/>" + this.t : "";
			$("body").append(html+ this.rel +"' alt='url preview' />"+ c +"</p>");

			var q= this.rel.indexOf("?")
			if(q >= 0){
				// Extract URL parameters eg... rel="cssg_screenshot.jpg?h=100&w=250"
				var pStr= this.rel.substr(q+1)
				var pArr= pStr.split("&")
				var param= {}, tArr= []
				$(pArr).each( function(i){
					tArr= pArr[i].split("=")
					param[tArr[0]]= tArr[1]
				})
				// Set image height and width
//				$("#screenshot img").height( param["h"] )
//				$("#screenshot img").width( param["w"] )
				$("#screenshot img").get(0).height= param["h"]
				$("#screenshot img").get(0).width= param["w"]
			}

			positionTT(e);
			$("#screenshot").fadeIn("fast");						
		},
		function(){
			this.title = this.t;	
			$("#screenshot").remove();
    }).mousemove( positionTT );

};


// start the script on page load
$(document).ready(function(){
	screenshotPreview();
});