(function($) {

    //$(SearchTextField).searchParts(SearchResultContainer, OnClickRow);
    //
    //SearchTextField:
    //An input text box that will be watched and used in parts searching
    //
    //SearchResultContainer:
    //The HTML container to contain the search results
    //
    //OnClickRow:
    //The function to perform when a row is clicked on in the search results
    //Will pass an object literal to the function: {PartID, PartName, Cost}
    var methods = {
        init: function(options) {

            return this.each(function() {

                var settings = {
                    Title: null,
                    ImgSrc: null,
                    OnAnimationComplete: null,
                    OnClose: null,
                    Padding: 16
                }
                if (options) {
                    $.extend(settings, options);
                }



                var $this = $(this);
                var data = $this.data('data');


                if (!data) {

                    $(this).data('data', { test: null });
                    $(this).data('settings', settings);

                }

                //$this.bind('click', function() {

                    var settings = $(this).data('settings');
                    var padding = settings.Padding;



                    var img = $(this);
                    var width = img.width();
                    var height = img.height();
                    var src = img.attr('src');

                    if (settings.ImgSrc != null)
                        src = settings.ImgSrc;

                    var title = '';
                    if (settings.Title != null)
                        title = settings.Title;

                    $('body').append('<div class="divEnlargeImageBG" style=\"position:absolute;top:0px;left:0px;overflow:hidden;background-color:#000000;filter:alpha(opacity=50);opacity:0.50;display:none;\"></div>' +
                                     '<div class="divEnlargeImageClip" style=\"position:absolute;top:0px;left:0px;overflow:hidden;\">' +
                                        '<div class="divEnlargeImagePopup" style=\"display:inline-block;position:absolute;top:0px;left:0px;\">' +
                                            '<div style="padding:4px;background-color:#FFFFFF;border:#666666 1px solid;">' +
                                                '<div style="overflow:auto;padding:4px;"><div style="float:left;padding-right:10px;">' + title + '</div><a href="#" class="close" style="border:#000000 1px solid;width:20px;height:20px;display:inline-block;text-align:center;float:right;color:#666666;background-color:#CCCCCC">X</a></div>' +
                                                '<div style="padding:4px;text-align:center;"><img src="' + src + '" width="' + width + '" height="' + height + '" /></div>' +
                                            '</div>' +
                                        '</div>' +
                                     '</div>');

                    //                    $('body').append('<div class="divEnlargeImageClip" style=\"position:absolute;top:0px;left:0px;background-color:red;\">test</div>');

                    $('.divEnlargeImagePopup .close').click(function() {
                        $('.divEnlargeImageClip').remove();
                        $('.divEnlargeImageBG').remove();
                    });

                    $('.divEnlargeImageBG').fadeIn('slow');

                    $('.divEnlargeImageBG').css('width', $(window).width());
                    $('.divEnlargeImageBG').css('height', $(window).height());

                    $('.divEnlargeImageClip').css('width', $(window).width());
                    $('.divEnlargeImageClip').css('height', $(window).height());

                    //Place the divPopup at the coordinates that will position where the popup's image precisely overlaps the original image
                    $('.divEnlargeImagePopup').css('top', img.offset().top - $('.divEnlargeImagePopup img').offset().top);
                    $('.divEnlargeImagePopup').css('left', img.offset().left - $('.divEnlargeImagePopup img').offset().left);


                    //var enlargedImageOffsetLeft = $('.divEnlargeImagePopup img').offset().left;
                    //var enlargedImageOffsetTop = $('.divEnlargeImagePopup img').offset().top;

                    //var imageOffsetLeft = img.offset().left;
                    //var imageOffsetTop = img.offset().top;

                    var dims = $(this).enlargeImage('GetFinalDimensions');

                    //alert(dims.popupTop);
                    /*
                    var divWidth = $('.divEnlargeImagePopup').width();
                    var divHeight = $('.divEnlargeImagePopup').height();

                    var divPaddedWidth = divWidth - width;
                    var divPaddedHeight = divHeight - height;

                    //alert(divWidth);
                    //alert(width);
                    //alert(divPaddedWidth);
                    var documentWidth = $('.divEnlargeImageClip').width() - divPaddedWidth;
                    var documentHeight = $('.divEnlargeImageClip').height() - divPaddedHeight;

                    var desiredImageWidth = documentWidth;
                    var desiredImageHeight = documentHeight;

                    var originalRatio = width / height;

                    //alert(originalRatio);
                    if (desiredImageWidth / originalRatio < documentHeight)
                    desiredImageHeight = documentWidth / originalRatio;
                    else
                    desiredImageWidth = documentHeight * originalRatio;



                    var xOffsetToCenter = ($(document).width() - (desiredImageWidth + divPaddedWidth)) / 2;
                    //xOffsetToCenter = 0;

                    desiredImageWidth = desiredImageWidth - (padding * 2);
                    desiredImageHeight = desiredImageHeight - (padding * 2);


                    var desiredPopupX = 0 + padding + xOffsetToCenter;
                    var desiredPopupY = 0 + padding;
                    */
                    $('.divEnlargeImagePopup img').animate({
                        width: dims.imageWidth,
                        height: dims.imageHeight
                    }, 1000, function() { $this.enlargeImage('EnableResizeEvent'); }
                    );
                    $('.divEnlargeImagePopup').animate({
                        top: dims.popupTop,
                        left: dims.popupLeft
                    }, 1000, function() { }
                    );


               // });


            });


        },
        GetFinalDimensions: function() {


            var settings = $(this).data('settings');
            var padding = settings.Padding;



            var img = $(this);
            var width = $('.divEnlargeImagePopup img').width();
            var height = $('.divEnlargeImagePopup img').height();



            var divCurrentPopupWidth = $('.divEnlargeImagePopup').width();
            var divCurrentPopupHeight = $('.divEnlargeImagePopup').height();


            var divPaddedWidth = divCurrentPopupWidth - width;
            var divPaddedHeight = divCurrentPopupHeight - height;


            //alert(divWidth);
            //alert(width);
            //alert(divPaddedWidth);
            var documentWidth = $('.divEnlargeImageClip').width() - divPaddedWidth;
            var documentHeight = $('.divEnlargeImageClip').height() - divPaddedHeight;


            var desiredImageWidth = documentWidth;
            var desiredImageHeight = documentHeight;


            var originalRatio = width / height;

            //alert(originalRatio);
            if (desiredImageWidth / originalRatio < documentHeight)
                desiredImageHeight = documentWidth / originalRatio;
            else
                desiredImageWidth = documentHeight * originalRatio;



            var xOffsetToCenter = ($(window).width() - (desiredImageWidth + divPaddedWidth)) / 2;
            var yOffsetToCenter = ($(window).height() - (desiredImageHeight + divPaddedHeight)) / 2;
            //xOffsetToCenter = 0;

            desiredImageWidth = desiredImageWidth - (padding * 2);
            desiredImageHeight = desiredImageHeight - (padding * 2);



            var desiredPopupX = 0 + padding + xOffsetToCenter;
            var desiredPopupY = 0 + padding + yOffsetToCenter;


            return { popupLeft: desiredPopupX, popupTop: desiredPopupY, imageWidth: desiredImageWidth, imageHeight: desiredImageHeight };
        },
        EnableResizeEvent: function() {

            var $this = $(this);

            $(window).bind('resize', function() {

                if ($('.divEnlargeImageClip').length == 0)
                    return;

                $('.divEnlargeImageBG').css('width', $(window).width());
                $('.divEnlargeImageBG').css('height', $(window).height());

                $('.divEnlargeImageClip').css('width', $(window).width());
                $('.divEnlargeImageClip').css('height', $(window).height());

                var x = ($('.divEnlargeImageClip').width() - $('.divEnlargeImagePopup').width()) / 2;
                var y = ($('.divEnlargeImageClip').height() - $('.divEnlargeImagePopup').height()) / 2;

                $('.divEnlargeImagePopup').css('left', x);
                $('.divEnlargeImagePopup').css('top', y);
                //var dims = $this.enlargeImage('GetFinalDimensions');
                //$('.divEnlargeImagePopup').css('top', dims.popupTop);
                //$('.divEnlargeImagePopup').css('left', dims.popupLeft);
                //$('.divEnlargeImagePopup img').css('width', dims.imageWidth);
                //$('.divEnlargeImagePopup img').css('height', dims.imageHeight);

            });
        }

    }

    $.fn.enlargeImage = function(method) {

        if (methods[method]) {
            return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
        }
        else if (typeof method === 'object' || !method) {
            return methods.init.apply(this, arguments);
        }
        else {
            $.error('Method ' + method + ' does not exist');
        }

    };



})(jQuery);