/*
 * Image 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.imagePreview = function(){	
	/* CONFIG */
		
		xOffset = 10;
		yOffset = 30;
		
		// these 2 variable determine popup's distance from the cursor
		// you might want to adjust to get the right result
		
	/* END CONFIG */
	j("a.preview").hover(function(e){

		j("#preview").remove();
		
		var windowHeight = j(window).height();
		var windowWidth = j(window).width();
		
		this.t = this.title;
		this.title = "";	
		var c = (this.t != "") ? "<br/>" + this.t : "";
		j("body").append("<p id='preview'><img src='"+ this.href +"' alt='Image preview' />"+ c +"</p>");
		
		var imageHeight = 427;
		var imageWidth = 640;
		
		// image should not be beyond the page
		var top = e.pageY - xOffset;
		var left = e.pageX + yOffset;
		var windowWidth = j(window).width();
		var windowHeight = j(window).height();

		if (top + yOffset + yOffset + imageHeight > windowHeight) {
			top = windowHeight - imageHeight - yOffset - 20;
		}

		if (left + xOffset + xOffset + imageWidth > windowWidth) {
			left = e.pageX - imageWidth - xOffset - 20;
		}
		
		j("#preview")
			.css("top", top + "px")
			.css("left", left + "px")
			.css("position", "absolute");
    },
	function() {
		this.title = this.t;
		j("#preview").remove();
    });
    
    j("a.preview").mousemove(function(e) {

	var imageHeight = 427;
	var imageWidth = 640;

        // image should not be beyond the page
        var top = e.pageY - xOffset;
        var left = e.pageX + yOffset;
        var windowWidth = j(window).width();
        var windowHeight = j(window).height();

        if (top + yOffset + yOffset + imageHeight > windowHeight) {
                top = windowHeight - imageHeight - yOffset - 20;
        }

        if (left + xOffset + xOffset + imageWidth > windowWidth) {
                left = e.pageX - imageWidth - xOffset - 20;
        }

	j("#preview").css("top", top + "px").css("left", left + "px").css("position", "absolute");
    });

};

// starting the script on page load
var j = jQuery.noConflict();
j(document).ready(function(){
	imagePreview();
});
