/// <reference path="~/Scripts/jquery-1.3.2-vsdoc.js" />

jQuery.fn.images = function(options) {

    return this.each(function() {
        settings = jQuery.extend({
            height: 400,
            width: 475,
            imageHeight: 400,
            imageWidth: 400,
            thumbHeight: 50,
            thumbWidth: 50,
            thumbPageSize: 6
        }, options);

        var plugin = this;

        var currentImageIndex = 0;
        var currentThumbPageIndex = 0;

        var viewer = $(plugin).find("ul.viewer");
        var thumbViewer = $(plugin).find("ul.thumbViewer");

        var imageCount = $(viewer).find("li").length;
        if (imageCount == 0) {
            return; //if there are no images then quit
        }

        //Set the dimensions of the plugin
        $(plugin).height(settings.height);
        $(plugin).width(settings.width);

        //hide all the images while setting them up
        $(viewer).find("li").hide();
        $(thumbViewer).find("li").hide();

        //Get the images
        var images = $(viewer).find("img");
        $(images).width(settings.imageWidth);
        $(images).height(settings.imageHeight);

        //get the images out of the viewer for the thumbs
        var thumbs = $(images).clone();
        $(thumbs).width(settings.thumbWidth);
        $(thumbs).height(settings.thumbHeight);
        var thumbPageCount = Math.ceil(imageCount / settings.thumbPageSize);

        //get the viewable thumbs
        $(thumbs).each(function() {
            var li = $("<li></li>");
            li.append(this);
            $(thumbViewer).append(li);

            $(this).mouseover(function() {
                currentImageIndex = $(thumbs).index(this);
                changeImage();
            });
        });

        showPagedThumbs();

        //configure the viewer navigation
        $("#ActiveImages div.viewerBack").click(function() {
            if (currentImageIndex > 0) {
                currentImageIndex--;
            }
            changeImage();
            calculateCurrentThumbPageIndexes();
            showPagedThumbs();
        });

        $("#ActiveImages div.viewerNext").click(function() {
            if (currentImageIndex < imageCount - 1) {
                currentImageIndex++;
            }
            changeImage();
            calculateCurrentThumbPageIndexes();
            showPagedThumbs();
        });

        //configure the thumbViewer navigation
        $("#ActiveImages div.thumbViewerBack").click(function() {
            if (currentThumbPageIndex > 0) {
                currentThumbPageIndex--;
            }
            showPagedThumbs()
            calculateCurrentImageIndexes();
            changeImage();
        });

        $("#ActiveImages div.thumbViewerNext").click(function() {
            
            if (currentThumbPageIndex < thumbPageCount - 1) {
                currentThumbPageIndex++;
            }
            showPagedThumbs()
            calculateCurrentImageIndexes();
            changeImage();
        });


        //pluging private functions
        function changeImage() {
            $(viewer).find("li").hide();
            $(viewer).find("li:eq(" + currentImageIndex + ")").show();

            $(plugin).find(".viewerBack").show();
            $(plugin).find(".viewerNext").show();
            if (currentImageIndex == 0) {
                $(plugin).find(".viewerBack").hide();
            }
            if (currentImageIndex == imageCount - 1) {
                $(plugin).find(".viewerNext").hide();
            }
        }

        function calculateCurrentImageIndexes() {
            currentImageIndex = (currentThumbPageIndex * settings.thumbPageSize);
        }

        function calculateCurrentThumbPageIndexes() {
            currentThumbPageIndex = Math.floor(currentImageIndex / settings.thumbPageSize);
        }

        function showPagedThumbs() {
            var indexFrom = currentThumbPageIndex * settings.thumbPageSize;
            var indexTo = ((currentThumbPageIndex + 1) * settings.thumbPageSize - 1);
            $(thumbViewer).find("li").show()
                          .filter(":lt(" + indexFrom + ")").hide().end()
                          .filter(":gt(" + indexTo + ")").hide().end();

            $(plugin).find(".thumbViewerBack").show();
            $(plugin).find(".thumbViewerNext").show();
            if (currentThumbPageIndex == 0) {
                $(plugin).find(".thumbViewerBack").hide();
            }
            if (currentThumbPageIndex == thumbPageCount - 1) {
                $(plugin).find(".thumbViewerNext").hide();
            }

        }

        //show the first image
        changeImage();

        //show the viewer and the thumbs
        $(viewer).show();
        $(thumbViewer).show();
    });
};