﻿
(function($) {
    $.fn.gallery = function(o) {
        o = $.extend({
            btnPrev: null,
            btnNext: null,
            btnPlay: null,
            btnPause: null,
            auto: false,
            speed: 5000,
            animSpeed: 250,
            animEasing: null,
            visible: 3,
            mainImage: null,
            textArea: null,
            maxHeight: 480,
            maxWidth: 620
        }, o || {});

        var currentIndex = 0;
        var slideShowInterval = 0;
        var isPlaying = false;
        var mainDiv = null;
        var ul = null;
        var count = 0;
        var displayIndex = 0;
        var thumbStripUl = null;
        var running = false;
        var liSize;

        return this.each(function() {
            mainDiv = $(this);

            ul = $("ul", mainDiv);

            var running = false, li = $("li", ul), itemLength = li.size(), v = o.visible;
            var curr = currentIndex;
            var div = $(ul.parent().get(0));

            count = itemLength;

            div.css("visiblity", "visible");

            li.css({ overflow: "hidden" });
            ul.css({ margin: "0", padding: "0", position: "relative", "list-style-type": "none", "z-index": "1" });
            div.css({ overflow: "hidden", position: "relative", "z-index": "2", left: "0px" });

            liSize = width(li);
            var ulSize = liSize * itemLength;
            var divSize = liSize * v;

            li.css({ width: li.width(), height: li.height() });
            ul.css("width", ulSize + "px").css("left", -(curr * liSize));

            div.css("width", divSize + "px");

            if (o.btnPrev) {
                $(o.btnPrev, mainDiv).css("cursor", "pointer");
                $(o.btnPrev, mainDiv).click(function() {
                    if (!running) {
                        slideshowStop();
                        return showImg(o, -1);
                    }
                });
            }

            if (o.btnNext) {
                $(o.btnNext, mainDiv).css("cursor", "pointer");
                $(o.btnNext, mainDiv).click(function() {
                    if (!running) {
                        slideshowStop();
                        return showImg(o, 1);
                    }
                });
            }

            if (itemLength > 1) {
                $("img", li).css("cursor", "pointer");

                $("img", li).click(function() {
                    slideshowStop();

                    var rel = $(this).attr("rel");
                    var index = parseInt(rel);

                    if (currentIndex != index)
                        showImgAtIndex(parseInt(rel));
                });

                if (o.mainImage) {
                    $(o.mainImage, mainDiv).each(function() {
                        if (!$(this).is("img")) {
                            $(this).click(function() {
                                slideshowStop();
                            });
                        }
                    });
                }
            }
            showImg(o, 0);

            if (itemLength > 1) {
                if (o.auto)
                    slideshowStart();

                if (o.btnPlay) {
                    $(o.btnPlay, mainDiv).css("cursor", "pointer");
                    $(o.btnPlay, mainDiv).click(function() {
                        slideShowNext();
                        slideshowStart();
                    });
                }
                if (o.btnPause) {
                    $(o.btnPause, mainDiv).css("cursor", "pointer");
                    $(o.btnPause, mainDiv).click(function() {
                        slideshowStop();
                    });
                }
            } else {
                if (o.btnNext)
                    $(o.btnNext, mainDiv).hide();
                if (o.btnPrev)
                    $(o.btnPrev, mainDiv).hide();

                if (o.btnPlay)
                    $(o.btnPlay, mainDiv).hide();
                if (o.btnPause)
                    $(o.btnPause, mainDiv).hide();
            }
        });

        function slideshowStart() {
            displayPause();
            if (!isPlaying) {
                var f = slideShowNext;
                displayPause();
                slideShowInterval = setInterval(function() {
                    f();
                }, 5000);
                isPlaying = true;
            }
        }

        function slideshowStop() {
            displayPlay();
            isPlaying = false;
            if (slideShowInterval) {
                clearInterval(slideShowInterval);
            }
        }

        function slideShowNext() {
            showImg(o, 1);
        }

        function displayPause() {
            if (o.btnPause)
                $(o.btnPause, mainDiv).show();
            if (o.btnPlay)
                $(o.btnPlay, mainDiv).hide();
        }

        function displayPlay() {
            if (o.btnPause)
                $(o.btnPause, mainDiv).hide();
            if (o.btnPlay)
                $(o.btnPlay, mainDiv).show();
        }

        function showImg(o, increment) {
            var index = currentIndex + increment;
            var count = $("li", ul).size();

            if (index >= count)
                index = 0;
            else if (index < 0)
                index = count - 1;

            showImgAtIndex(index);
        }

        function showImgAtIndex(index) {
            var count = $("li", ul).size();

            if (o.mainImage) {
                var count = $(o.mainImage, mainDiv).size();

                $(o.mainImage, mainDiv).each(function() {
                    if ($.browser.msie) {
                        $(this).hide();
                    }
                    else {
                        if ($(this).is("img")) {
                            $(this).hide();
                        }
                        else {
                            $(this).css("visibility", "hidden");
                            $(this).height(0);
                        }
                    }
                });

                var img = $(o.mainImage + ":nth-child(" + (index + 1) + ")", mainDiv);

                if (img) {
                    try {
                        if (img.is("img")) {
                            if (img.get(0).complete) {
                                centerImg(img, o.maxWidth, o.maxHeight);
                                displayImg(img);
                            }
                            else
                                img.load(function() {
                                    centerImg(img, o.maxWidth, o.maxHeight);
                                    displayImg(img);
                                });
                        }
                        else {
                            displayImg(img);
                        }
                    } catch (Error) {
                        centerImg(img, o.maxWidth, o.maxHeight);
                        displayImg(img);
                    }
                }
            }

            centerThumbStrip(index);

            $("img", ul).fadeTo(0, .33);
            $("img[rel='" + index + "']", ul).fadeTo(0, 1);

            if (o.textArea)
                $(o.textArea, mainDiv).text('Showing ' + (index + 1) + ' of ' + count);

            currentIndex = index;
        }

        function displayImg(img) {
            if ($.browser.msie && $.browser.version < 7) {
                img.show();
            } else {
                if (img.is("img"))
                    img.fadeIn(800);
                else {
                    if ($.browser.msie) {
                        img.show();
                    }
                    else {
                        $(this).height(280);
                        img.css("visibility", "visible");
                    }
                }
            }
        }

        function centerThumbStrip(index) {
            if (!running) {
                var half = o.visible / 2;
                if (index > half) {
                    running = true;
                    var left = (liSize * index) - liSize;
                    ul.animate({ left: 0 - left }, o.animSpeed, o.animEasing, function() {
                        running = false;
                    });
                } else {
                    running = true;
                    ul.animate({ left: 0 }, o.animSpeed, o.animEasing, function() {
                        running = false;
                    });
                }
            }
        }
    };

    function centerImg(img, maxWidth, maxHeight) {
        if (img.height() == 0 || img.width() == 0) {
            return;
        }

        if (img.height() > maxHeight) {
            img.css("height", maxHeight + "px");
            img.css("margin-top", "10px");
        }
        else if (img.height() < maxHeight) {
            var margin = (maxHeight - img.height()) / 2.0;
            img.css("margin-top", margin + "px");
            img.css("padding", "0px");
        }

        if (img.width() > maxWidth) {
            img.css("width", maxWidth + "px");
            img.css("margin-left", "3px");
        }

        if (img.width() < maxWidth) {
            var margin = (maxWidth - img.width()) / 2.0;
            img.css("margin-left", margin + "px");
        }
    }
    function css(el, prop) {
        return parseInt($.css(el[0], prop)) || 0;
    }
    function width(el) {
        return el[0].offsetWidth + css(el, 'marginLeft') + css(el, 'marginRight');
    }
    function height(el) {
        return el[0].offsetHeight + css(el, 'marginTop') + css(el, 'marginBottom');
    }
})(jQuery);