(function($) {
    
     var default_offset_x = 40;
     // if ( $.browser.msie ) {
     // 	 default_offset_x -= 60;
     // }
     var default_padding   = 20;

    // accepts a string (size) in the format "##x##" and
    // returns size.split("x")
    function parse_size(size) {
	var split = size.split("x");
	return split;
    }

     // positions 'element' as a tooltip so that it fits inside ('bounding element' intersect DOM Window)
     function get_position_array(x, y, element, bounding_element) {
	 var width             = element.width();
	 var height            = element.height();
	 var window_top        = $(window).scrollTop();
	 var offset_x          = default_offset_x;
	 var offset_y          = -1*(height*.75);

	 // Don't let the screenshot go to high
	 if ( y + offset_y - default_padding < window_top ) {
	     offset_y = window_top + default_padding - y;
	 }
	 
	 // Switch sides if the screenshot overruns to the right
	 if ( x + offset_x + default_padding + width > bounding_element.offset().left + bounding_element.width() ) {
	     offset_x = - ( default_offset_x + width );
	 }

	 return [ x + offset_x, y + offset_y ];
     }
    
     // reposition #screenshot_detail to the upper left of the cursor
     function mouse_move_handler(e) {
	 var x = e.pageX;
	 var y = e.pageY;
	 if ( x === undefined || y === undefined ) return; 
	 var screenshot_detail = $('#screenshot_detail');
	 var offsets  = get_position_array( x, y, screenshot_detail, $("body"));
	 var offset_x = offsets[0];
	 var offset_y = offsets[1];
	 var css = {
	     'top'  :  offset_y,
	     'left' :  offset_x
	 };
	 screenshot_detail.css(css);
     }
     
     function get_screenshot_detail_tag() {
	 var screenshot_detail = $('#screenshot_detail');
	 if ( screenshot_detail.size() == 0 ) {
	     screenshot_detail = $("<div>");
	     screenshot_detail.attr("id", "screenshot_detail");
	     screenshot_detail.prependTo("body");
	 }
	 return screenshot_detail;
     }
    
    $(document).ready(
	function() {
	    
	    // Pre-Load all the screenshots
	    $(".screenshot_thumb").each(
		function( i ) {
		    var image = $(this).attr("fullsize_url");
		    $.preloadImages( image );
		}
	    );
	    
	    $(".screenshot_thumb").bind(
		'mouseenter',
		function(e) {
		    var fullsize_url = $(this).attr("fullsize_url"); // get the url for the full size image
		    var fullsize_size = $(this).attr("fullsize_size"); // get the size of the full size image
		    var screenshot_detail = get_screenshot_detail_tag();
		    var size = parse_size(fullsize_size);
		    screenshot_detail.makeAbsolute(true); // position the element as absolute and move it to the body
		    var css = {
			'background-color' : 'transparent',
			'height'           : String(size[1]) + "px",
			'width'            : String(size[0]) + "px",
			'display'          : "block",
			'z-index'          : "7001",
			'top'              : '-9999px'
		    };
		    screenshot_detail.css(css);
		    screenshot_detail.html( "<img src = " + fullsize_url + " size = " + fullsize_size + " />" ); // set the innerHtml
		    $(this).mousemove(mouse_move_handler); // add a mosemove event
		    $(this).mousemove();
		    $(this).mouseout(
			function() { // remove the mousemove event on mouseout
			    $('#screenshot_detail').css('display', 'none');
			    $('#screenshot_detail').unbind('mousemove', mouse_move_handler);
			}
		    );
		}
	    );
	}
    );
})(jQuery);