/** Ready Function
*  This is the main function for the jQuery script. 
*/
$(document).ready(function() {
    // Horizontal Scroller
    $("#mycarousel").each(function() {
        var numItems = $("li", this).size();
        var itemWidth = $("li:first", this).width() + 5;  // slight hack, the 5 is the right margin I know is there
        $(this).width(numItems * itemWidth);

        var $list = $(this);
        var $prev = $("div.carousel-prev").css({ display: "block" });
        var $next = $("div.carousel-next").css({ display: "block" });
        var $clip = $("div.carousel-clip");

        if ($(this).width() < $clip.width())
            $next.addClass("carousel-next-disabled");
        else {
            $next.click(function() {
                var pos = $list.position();
                var scroll = itemWidth * 3 * -1;
                var scrollStop = ((numItems * itemWidth) - $clip.width()) * -1;

                if ((pos.left > scrollStop) && (pos.left + scroll > scrollStop))
                    $list.animate({ left: "+=" + scroll + "px" }, "normal");
                else if (pos.left + scroll <= scrollStop) {
                    $list.animate({ left: scrollStop + "px" }, "normal");
                    $next.addClass("carousel-next-disabled");
                    $prev.removeClass("carousel-prev-disabled");
                }

                $prev.removeClass("carousel-prev-disabled");
            }).Disposable();

            $prev.click(function() {
                var pos = $list.position();
                var scroll = itemWidth * 3;
                var scrollStop = 0;

                if ((pos.left < scrollStop) && (pos.left + scroll < scrollStop))
                    $list.animate({ left: "+=" + scroll + "px" }, "normal");
                else if (pos.left + scroll >= scrollStop) {
                    $list.animate({ left: scrollStop + "px" }, "normal");
                    $prev.addClass("carousel-prev-disabled");
                    $next.removeClass("carousel-next-disabled");
                }

                $next.removeClass("carousel-next-disabled");
            }).Disposable();
        }
    });

    //Image Scroller for Product Block
    $("#mycarouselImg").each(function () {
        var numItems = $("li", this).size();
        var itemWidth = $("li:first", this).width() + 5;  // slight hack, the 5 is the right margin I know is there
        $(this).width(numItems * itemWidth);

        var $list = $(this);
        var $prev = $("div.carousel-prev-img").css({ display: "block" });
        var $next = $("div.carousel-next-img").css({ display: "block" });
        var $clip = $("div.carousel-clip-img");

        if ($(this).width() < $clip.width())
            $next.addClass("carousel-next-disabled-img"); //div.innerPopUp div.wrapper 
        else {
            $next.click(function () {
                var pos = $list.position();
                var scroll = itemWidth * 3 * -1;
                var scrollStop = ((numItems * itemWidth) - $clip.width()) * -1;

                if ((pos.left > scrollStop) && (pos.left + scroll > scrollStop))
                    $list.animate({ left: "+=" + scroll + "px" }, "normal");
                else if (pos.left + scroll <= scrollStop) {
                    $list.animate({ left: scrollStop + "px" }, "normal");
                    $next.addClass("carousel-next-disabled-img");
                    $prev.removeClass("carousel-prev-disabled-img");
                }

                $prev.removeClass("carousel-prev-disabled-img");
            }).Disposable();

            $prev.click(function () {
                var pos = $list.position();
                var scroll = itemWidth * 3;
                var scrollStop = 0;

                if ((pos.left < scrollStop) && (pos.left + scroll < scrollStop))
                    $list.animate({ left: "+=" + scroll + "px" }, "normal");
                else if (pos.left + scroll >= scrollStop) {
                    $list.animate({ left: scrollStop + "px" }, "normal");
                    $prev.addClass("carousel-prev-disabled-img");
                    $next.removeClass("carousel-next-disabled-img");
                }

                $next.removeClass("carousel-next-disabled-img");
            }).Disposable();
        }
    });


    //PopUp Image Scroller for Product Block when the View Larger option is selected. 
    $("#mycarouselPopUp").each(function () {
        var numItems = $("li", this).size();
		var itemWidth = $("li:first", this).width() + 100;  // slight hack, the 5 is the right margin I know is there
		
	//Not needed:	 
	$(this).width(numItems * itemWidth);

        var $list = $(this);
        var $prev = $("div.carousel-prev-popup").css({ display: "block" });
        var $next = $("div.carousel-next-popup").css({ display: "block" });
        var $clip = $("div.carousel-clip-popup");

        if ($(this).width() < $clip.width())
            $next.addClass("carousel-next-disabled-popup"); //div.innerPopUp div.wrapper 
        else {
            $next.click(function () {
                var pos = $list.position();
                var scroll = itemWidth * 3 * -1;
                var scrollStop = ((numItems * itemWidth) - $clip.width()) * -1;

                if ((pos.left > scrollStop) && (pos.left + scroll > scrollStop))
                    $list.animate({ left: "+=" + scroll + "px" }, "normal");
                else if (pos.left + scroll <= scrollStop) {
                    $list.animate({ left: scrollStop + "px" }, "normal");
                    $next.addClass("carousel-next-disabled-popup");
                    $prev.removeClass("carousel-prev-disabled-popup");
                }

                $prev.removeClass("carousel-prev-disabled-popup");
            }).Disposable();

            $prev.click(function () {
                var pos = $list.position();
                var scroll = itemWidth * 3;
                var scrollStop = 0;

                if ((pos.left < scrollStop) && (pos.left + scroll < scrollStop))
                    $list.animate({ left: "+=" + scroll + "px" }, "normal");
                else if (pos.left + scroll >= scrollStop) {
                    $list.animate({ left: scrollStop + "px" }, "normal");
                    $prev.addClass("carousel-prev-disabled-popup");
                    $next.removeClass("carousel-next-disabled-popup");
                }

                $next.removeClass("carousel-next-disabled-popup");
            }).Disposable();
        }
    });



});

(function($) {
    $.fn.Disposable = function(cln) {
        return this.each(function() {
            var el = this;
            if (!el.dispose) {
                el.dispose = cleanup;
                $(window).bind("unload", cleanup);
            }
            function cleanup() {
                if (!el) return;
                $(el).unbind();
                $(window).unbind("unload", cleanup);
                el.dispose = null;
                el = null;
            };
        });
    };
})(jQuery);