/*
 * imgPreview jQuery plugin
 * Copyright (c) 2009 James Padolsey
 * j@qd9.co.uk | http://james.padolsey.com
 * Dual licensed under MIT and GPL.
 * Updated: 09/02/09
 * @author James Padolsey
 * @version 0.22
 */


var mouseX;
var mouseY;
var container;


(function($){

    $.expr[':'].linkingToImage = function(elem, index, match){
        // This will return true if the specified attribute contains a valid link to an image:
        return !! ($(elem).attr(match[3]) && $(elem).attr(match[3]).match(/\.(gif|jpe?g|png|bmp)$/i));
    };

    $.fn.imgPreview = function(userDefinedSettings){

        var s = $.extend({

            /* DEFAULTS */

            // CSS to be applied to image:
            imgCSS: {},
            // Distance between cursor and preview:
            distanceFromCursor: {top:25, left:10},
            // Boolean, whether or not to preload images:
            preloadImages: true,
            // Callback: run when link is hovered: container is shown:
            onShow: function(){},
            // Callback: container is hidden:
            onHide: function(){},
            // Callback: Run when image within container has loaded:
            onLoad: function(){},
            // ID to give to container (for CSS styling):
            containerID: 'imgPreviewContainer',
            // Class to be given to container while image is loading:
            containerLoadingClass: 'loading',
            // Prefix (if using thumbnails), e.g. 'thumb_'
            thumbPrefix: '',
            // Where to retrieve the image from:
            srcAttr: 'href'

        }, userDefinedSettings),

		$container = $('<div/>').attr('id', s.containerID)
			.append(
				$('<table/>')
				.attr('cellpadding', '0')
				.attr('cellspacing', '0')
				.append
				(
					$('<tr/>')
					.append(
						$('<td/>').attr('class', 'tl').html('&nbsp;')
					)
					.append(
						$('<td/>').attr('class', 'tm').html('&nbsp;')
					)
					.append(
						$('<td/>').attr('class', 'tr').html('&nbsp;')
					)
				)
				.append
				(
					$('<tr/>')
					.append(
						$('<td/>').attr('class', 'ml').html('&nbsp;')
					)
					.append(
						$('<td/>').attr('class', 'mm').append('<img/>')
					)
					.append(
						$('<td/>').attr('class', 'mr').html('&nbsp;')
					)
				)
				.append
				(
					$('<tr/>')
					.append(
						$('<td/>').attr('class', 'bl').html('&nbsp;')
					)
					.append(
						$('<td/>').attr('class', 'bm').html('&nbsp;')
					)
					.append(
						$('<td/>').attr('class', 'br').html('&nbsp;')
					)
				)
			)
			.hide()
			.css('position','absolute')
			.appendTo('body'),



        $img = $('img', $container).css(s.imgCSS),

        // Get all valid elements (linking to images / ATTR with image link):
        $collection = this.filter(':linkingToImage(' + s.srcAttr + ')');

        // Re-usable means to add prefix (from setting):
        function addPrefix(src) {
            return src.replace(/(\/?)([^\/]+)$/,'$1' + s.thumbPrefix + '$2');
        }

        if (s.preloadImages) {
            (function(i){
                var tempIMG = new Image(),
                    callee = arguments.callee;
                tempIMG.src = addPrefix($($collection[i]).attr(s.srcAttr));
                tempIMG.onload = function(){
                    $collection[i + 1] && callee(i + 1);
                };
            })(0);
        }

        $collection
            .mousemove(function(e){

				mouseX = e.pageX;
				mouseY = e.pageY;
				container = $container;

				previewPosition(container, mouseX, mouseY);

                /*$container.css({
                    top: mouseY + s.distanceFromCursor.top + 'px',
                    left: mouseX - Math.round($('#' + s.containerID).width() / 2) + 'px'
                });*/


            })
            .hover(
				function(){

					if($(this).attr('src') != '/images/loader80stopped.gif') {

						var link = this;

						if(filePrefix == 1) {
							var imgSrc = Prefix + $(link).attr('PreviewSrc') + '&Dimensions=320x240';
						} else {
							var imgSrc = addPrefix($(link).attr(s.srcAttr))  + '&mode=l';
						}

						$container
							.addClass(s.containerLoadingClass)
							.show();
						$img
							.load(function(){
								$container.removeClass(s.containerLoadingClass);
								$img.show();
								s.onLoad.call($img[0], link);
							})
							.attr( 'src' , imgSrc );
						s.onShow.call($container[0], link);

					}

				},
				function(){

					$container.hide();
					$img.unbind('load').attr('src','').hide();
					s.onHide.call($container[0], this);

				}
			);

        // Return full selection, not $collection!
        return this;

    };

})(jQuery);

function previewPosition(cont, mx, my)
{
	cont.css({
		top: my + 25 + 'px',
		left: mx - Math.round(cont.width() / 2) + 'px'
	});
}