/// <summary>jQuery extension to apply scroll functionality to elements</summary>
/// <param name="scrollValue" type="int">The distance in pixels that each scroll should be. Only applied if state 'slide' is applied. Default is 960</param>
/// <param name="displayNavigationPrevNext" type="bool">An indication of weather next and previous arrows should be present in the navigation. Default is true</param>
/// <param name="state" type="String">The name of the transition to be applied. Can assume 'slide' or 'fade'. Default is 'slide'</param>
/// <param name="animationTime" type="int">The time in milliseconds that each animation must take. Default is 1000</param>
/// <param name="autoAnimationInterval" type="int">The time in milliseconds between automatic slide change. If not set the slides will not change automatically</param>
(function (jQuery) {
    jQuery.fn.scrollWrap = function (scrollValue, displayNavigationPrevNext, state, animationTime, autoAnimationInterval) {
        return this.each(function () {
            var self = jQuery(this);
            var slideState = 'slide';
            var fadeState = 'fade';
            var inactiveClass, activeClass, autoAnimationTimeout;
            if (!scrollValue)
                scrollValue = 960;
            if (!activeClass)
                activeClass = "active";
            if (!inactiveClass)
                inactiveClass = "inactive";
            if (displayNavigationPrevNext == undefined || displayNavigationPrevNext == null)
                displayNavigationPrevNext = true;
            if (!state && state != slideState && state != fadeState)
                state = slideState;
            if (!animationTime && animationTime < 1)
                animationTime = 1000;

            var drawScrollNavigation = function () {
                var scrollMenuSlideItemsNum = 5;
                var scrollPanel = self.find(".scroll-panel")
                var scrollPageSize = scrollPanel.attr("data-page-size");
                if (scrollPageSize != null)
                    scrollMenuSlideItemsNum = scrollPageSize;
                if (scrollPanel.find(".item").length > scrollMenuSlideItemsNum) {
                    self.find(".scroll-navigation-container").remove();
                    //jQuery('<div class="scroll-navigation-container"></div>').insertAfter(scrollPanel);
                    jQuery('<div class="scroll-navigation-container"></div>').appendTo(self);
                    self.find(" div.scroll-navigation-container").append('<ul class="scroll-navigation clear"></ul>');
                    var scrollMenu = self.find(".scroll-navigation");
                    var numSlides = Math.ceil(scrollPanel.find(".item").length / scrollMenuSlideItemsNum);
                    var scrollMenuIndex = Math.floor(Math.random() * numSlides);
                    jQuery(scrollPanel.find(".item")[scrollMenuIndex]).fadeIn(animationTime, function () { });
                    for (i = 0; i < numSlides; i++) {
                        if (i == scrollMenuIndex) {
                            scrollMenu.append('<li class="' + activeClass + ' index">1</li>');
                        } else {
                            scrollMenu.append('<li class="index">' + (i + 1) + '</li>');
                        }
                    }
                    if (displayNavigationPrevNext == true) {
                        scrollMenu.addClass('with-next-prev');
                        scrollMenu.prepend('<li class="previous">&lt;</li>');
                        scrollMenu.append('<li class="next">&gt;</li>');
                    }
                    var scrollNext = self.find(".scroll-navigation li.next");
                    var scrollPrev = self.find(".scroll-navigation li.previous");
                    var menu = scrollMenu.find("li.index");

                    var scrolling = false;
                    if (state == fadeState)
                        scrollPanel.addClass("fade-panel");
                    else
                        scrollPanel.addClass("slide-panel");

                    var setInactive = function () {
                        if (scrollMenuIndex + 1 == numSlides)
                            scrollNext.addClass(inactiveClass);
                        else
                            scrollNext.removeClass(inactiveClass);
                        if (scrollMenuIndex == 0)
                            scrollPrev.addClass(inactiveClass);
                        else
                            scrollPrev.removeClass(inactiveClass);
                    }
                    //Scrolls to 
                    var scrollTo = function (newIndex) {
                        if (scrolling == false) {
                            if (newIndex >= 0 && newIndex < numSlides) {
                                if (newIndex == scrollMenuIndex)
                                    return false;
                                // Animation depending on state
                                if (state == fadeState) {
                                    jQuery(scrollPanel.find(".item")[scrollMenuIndex]).fadeOut(animationTime);
                                    jQuery(scrollPanel.find(".item")[newIndex]).fadeIn(animationTime, function () {
                                        jQuery(menu[scrollMenuIndex]).removeClass(activeClass);
                                        scrollMenuIndex = newIndex;
                                        jQuery(menu[scrollMenuIndex]).addClass(activeClass);
                                        setInactive();
                                        scrolling = false;
                                    });
                                } else {
                                    scrollPanel.animate({ left: (scrollValue * -newIndex) }, animationTime, function () {
                                        jQuery(menu[scrollMenuIndex]).removeClass(activeClass);
                                        scrollMenuIndex = newIndex;
                                        jQuery(menu[scrollMenuIndex]).addClass(activeClass);
                                        setInactive();
                                        scrolling = false;
                                    });
                                }
                            }
                        }
                    }
                    scrollNext.click(function () {
                        if (scrollMenuIndex + 1 < numSlides && scrolling == false) {
                            clearInterval(autoAnimationTimeout);
                            scrollTo(scrollMenuIndex + 1);
                        }
                    });
                    scrollPrev.click(function () {
                        if (scrollMenuIndex - 1 >= 0 && scrolling == false) {
                            clearInterval(autoAnimationTimeout);
                            scrollTo(scrollMenuIndex - 1);
                        }
                    });
                    menu.click(function () {
                        var newIndex = self.find(".scroll-navigation li.index").index(jQuery(this));
                        if (newIndex == scrollMenuIndex)
                            return false;
                        scrollTo(newIndex);
                    });
                    setInactive();
                    // Set auto shift interval function if auto animation Interval passed in
                    if (parseInt(autoAnimationInterval, 10) > 0) {
                        autoAnimationTimeout = setInterval(function () {
                            if (scrollMenuIndex + 1 < numSlides && scrolling == false) {
                                scrollTo(scrollMenuIndex + 1);
                            } else if (scrollMenuIndex + 1 == numSlides && scrolling == false) {
                                scrollTo(0);
                            }
                        }, autoAnimationInterval);
                    }
                }
            }
            drawScrollNavigation();
        });
    };
})(jQuery);

/// <summary>Applies a squeeze class to all elements that are not aligned right / position equals the page-size attribute</summary>
(function (jQuery) {
    jQuery.fn.listSqueeze = function () {
        return this.each(function () {
            var self = jQuery(this);
            var scrollPanel = self.find(".scroll-panel");
            scrollPanel.each(function () {
                var pageSize = jQuery(this).attr("data-page-size");
                if (pageSize) {
                    jQuery(this).find("ul > li").each(function (index) {
                        if ((index % pageSize) != (pageSize - 1))
                            jQuery(this).addClass('squeeze');
                    });
                }

            });
        });
    };
})(jQuery);