// create closure
(function($) {
    // plugin definition
    $.fn.enlarge = function(options) {    
        //default option
        var defaults = {
            enlargement: 2.0,
            textHeight: 50
        };
        // Extend our default options with those provided.
        var opts = $.extend(defaults, options);
        
        // Our plugin implementation code goes here.
        return this.each(function(i) {
            //get some values           
            imgPaddingTop    = parseInt($(this).css('padding-top'), 10);
            imgPaddingBottom = parseInt($(this).css('padding-bottom'), 10);
            imgPaddingLeft   = parseInt($(this).css('padding-left'), 10);
            imgPaddingRight  = parseInt($(this).css('padding-right'), 10);
            imgPadding = imgPaddingTop + 'px ' + imgPaddingRight + 'px ' + imgPaddingBottom + 'px ' + imgPaddingLeft + 'px';
            imgMarginTop     = parseInt($(this).css('margin-top'), 10);
            imgMarginBottom  = parseInt($(this).css('margin-bottom'), 10);
            imgMarginLeft    = parseInt($(this).css('margin-left'), 10);
            imgMarginRight   = parseInt($(this).css('margin-right'), 10);
            imgMargin = imgMarginRight + 'px ' + imgPaddingRight + 'px ' + imgMarginBottom + 'px ' + imgMarginLeft + 'px';
            imgFloat = $(this).css('float');
            imgHeight = $(this).height();//parseInt($(this).css('height'), 10);
            imgWidth = $(this).width();//parseInt($(this).css('width'), 10);
            imgBorderWidth = 1;//parseInt($(this).css('border-width'), 10);
        
            //wrap element in div         
            $(this).wrap('<div></div>');            
            $parent = $(this).parent();

            $parent.css({                
                'margin': imgMargin,
                'float': imgFloat,
                'position': 'relative',
                'width': (imgWidth + imgPaddingLeft + imgPaddingRight + imgBorderWidth * 2) + 'px',
                'height': (imgHeight + imgPaddingTop + imgPaddingBottom + imgBorderWidth * 2) + 'px',
                'display': 'inline',
                'background-color': '#fff'
            });
            $(this).css({
               'position': 'absolute',
               'padding': imgPadding,
               'top': '0px',
               'left': '0px',
               'z-index': 10,
               'margin': '0px',
               'background-color': '#fff', 
               'height': 'auto'
            });
            
            $(this).load(function() {
                $(this).removeAttr("width"); 
                $(this).removeAttr("height");
                
                $(this).parent().css('height', $(this).height()); 
            });  
            
            $(this).mouseenter(function() {
                imgHeight = $(this).height();//parseInt($(this).css('height'), 10);
                
                enlargedWidth = parseInt(opts.enlargement * imgWidth, 10);
                enlargedHeight = parseInt(opts.enlargement * imgHeight, 10);
                positionTop = -parseInt((enlargedHeight - imgHeight) / 2, 10);       
                positionLeft = -parseInt((enlargedWidth - imgWidth) / 2, 10);
                textTop = enlargedHeight + positionTop + imgPaddingTop + imgBorderWidth;
                textLeft = positionLeft + imgPaddingLeft + imgBorderWidth;
                
                $(this).css('z-index', 50);
                
                $(this).animate({ 
                    'width': enlargedWidth + 'px',
                    'top': positionTop + 'px',
                    'left': positionLeft + 'px'
                    }, 200, '', function() {
                        $(this).after('<div></div>');
                        $(this).siblings('div').css({
                            'position': 'absolute',
                            'top': textTop + 'px',
                            'left': textLeft + 'px',
                            'width': enlargedWidth + 'px',
                            'height': '0px',
                            'z-index': 100
                            }).html($(this).attr('title')).animate({
                                'height': opts.textHeight
                            }, 200);
                            $(this).animate({
                                'paddingBottom': (opts.textHeight + imgPaddingBottom) + 'px'
                            }, 200, '', function() {
                                
                            });
                        });
            });
            $(this).mouseleave(function() {
                $(this).stop();
                $(this).css({
                    'width': imgWidth + 'px',
                    'top': '0px',
                    'left': '0px',
                    'padding': imgPadding, 
                    'z-index': 10
                });
                $(this).siblings('div').remove();
            });
            
        });
    };
// end of closure
})(jQuery);
