jQuery(document).ready(function () {

    var thumbsToMove = 10;
    var widthImage = 923;
    var sizeUL = jQuery("ul.IG_thumbnails li").size();
    var totWidth = (85 * sizeUL);
    var scrollWidth = jQuery("#IG_ThumbsHolder").width();

    jQuery("ul.IG_thumbnails").css("width", totWidth + "px");
    jQuery("#IG_Image").width(jQuery("#IG_Image img").size() * widthImage + "px")

    jQuery("#IG_NavLeft").hide();

    if (sizeUL <= thumbsToMove) {
        jQuery("#IG_NavRight").hide();
        jQuery("ul.IG_thumbnails").css("marginLeft", (scrollWidth - (sizeUL * 85)) / 2 + "px");
    }

    jQuery("a.IG_SliderLeftBtn").hide();
    slideToImage(1, jQuery("ul.IG_thumbnails li").first().children("a"));

    jQuery("#IG_NavRight").click(function () {
        if ($(".IG_thumbnails:animated").length == 0) {
            scrollRight();
        }
        jQuery(this).blur();
        return false;

    });

    jQuery("#IG_NavLeft").click(function () {
        if ($(".IG_thumbnails:animated").length == 0) {
            scrollLeft();
        }
        jQuery(this).blur();
        return false;

    });

    function scrollLeft() {
        var marginBefore = jQuery(".IG_thumbnails").css("marginLeft").replace("px", "");
        var marginAfter = marginBefore * 1 + (85 * thumbsToMove);
        scroll(marginAfter);
    }

    function scrollRight() {
        var marginBefore = jQuery(".IG_thumbnails").css("marginLeft").replace("px", "");
        var marginAfter = marginBefore * 1 - (85 * thumbsToMove);
        scroll(marginAfter);
    }

    function scroll(margin) {
        if (margin >= 0)
            margin = 0;
        else if (margin * (-1) > Math.floor(sizeUL / thumbsToMove) * scrollWidth)
            margin = -1 * (Math.floor(sizeUL / thumbsToMove) * scrollWidth);

        jQuery(".IG_thumbnails").animate({
            marginLeft: margin + "px"
        }, 1500, function () {

            var left = jQuery(".IG_thumbnails").css("marginLeft").replace("px", "");
            if (left >= 0) {
                jQuery("#IG_NavLeft").fadeOut();
            }
            if (left < 0) {
                jQuery("#IG_NavLeft").fadeIn();
            }

            var toTheLeft = ((-1) * left / 85);
            if (sizeUL - toTheLeft <= thumbsToMove) {
                jQuery("#IG_NavRight").fadeOut();
            }
            if (sizeUL - toTheLeft > thumbsToMove) {
                jQuery("#IG_NavRight").fadeIn();
            }

        });
    }



    jQuery("a.IG_SliderLeftBtn").click(function () {
        if (jQuery("#IG_Image:animated").length == 0) {
            var currentImage = jQuery("ul.IG_thumbnails li.selected a").attr("id").replace("thumb", "");
            if ((currentImage % 10) == 1)
                scrollLeft();
            var prevFrame = jQuery("ul.IG_thumbnails li.selected").prev().children("a");
            if (currentImage * 1 - 1 > 0)
                slideToImage(currentImage * 1 - 1, prevFrame);
        }

        jQuery(this).blur();
        return false;

    });

    jQuery("a.IG_SliderRightBtn").click(function () {
        if (jQuery("#IG_Image:animated").length == 0) {

            var currentImage = jQuery("ul.IG_thumbnails li.selected a").attr("id").replace("thumb", "");
            if ((currentImage % 10) == 0)
                scrollRight();
            var nextFrame = jQuery("ul.IG_thumbnails li.selected").next().children("a");
            if (currentImage * 1 + 1 <= sizeUL)
                slideToImage(currentImage * 1 + 1, nextFrame);
        }
        jQuery(this).blur();
        return false;

    });

    function slideToImage(imgId, frame) {
        jQuery("ul.IG_thumbnails li").removeClass("selected");
        frame.parent().addClass("selected");

        jQuery("#IG_Image").animate({ marginLeft: (imgId - 1) * (-1 * widthImage) + "px" }, "slow", function () {
            if (imgId > 1) {
                jQuery("a.IG_SliderLeftBtn").fadeIn();
            } else {
                jQuery("a.IG_SliderLeftBtn").fadeOut();
            }

            if (imgId > sizeUL - 1) {
                jQuery("a.IG_SliderRightBtn").fadeOut();
            }
            else {
                jQuery("a.IG_SliderRightBtn").fadeIn();
            }

        });
    }


    jQuery("ul.IG_thumbnails li a").click(function () {
        if (jQuery("#IG_Image:animated").length == 0) {
            var currentImage = jQuery(this).attr("id").replace("thumb", "");
            slideToImage(currentImage, jQuery(this));
        }

        jQuery(this).blur();
        return false;

    });
})