/*
 * jQuery SmoothDivScroll 1.0
 *
 * Copyright (c) 2010 Thomas Kahn
 * Licensed under the GPL license.
 *
 * http://www.maaki.com/thomas/SmoothDivScroll/
 *
 * Depends:
 * jquery.ui.widget.js
 *
 */
(function($) {

    $.widget("thomaskahn.smoothDivScroll", {
        // Default options
        options: {
            scrollingHotSpotLeft: "div.scrollingHotSpotLeft",
            scrollingHotSpotRight: "div.scrollingHotSpotRight",
            scrollableArea : "div.scrollableArea",
            scrollWrapper: "div.scrollWrapper",
            hiddenOnStart: true,
            ajaxContentURL: "",
            countOnlyClass: "",
            scrollStep: 5,
            scrollInterval: 5,
            mouseDownSpeedBooster: 3,
            autoScroll: "",
            autoScrollDirection: "right",
            autoScrollStep: 5,
            autoScrollInterval: 10,
            visibleHotSpots: "",
            hotSpotsVisibleTime: 5,
            startAtElementId: ""
        },
        _create: function() {
		
            // Set variables
            var self = this, o = this.options, el = this.element;
			
            el.data("scrollWrapper", el.find(o.scrollWrapper));
            el.data("scrollingHotSpotRight", el.find(o.scrollingHotSpotRight));
            el.data("scrollingHotSpotLeft", el.find(o.scrollingHotSpotLeft));
            el.data("scrollableArea", el.find(o.scrollableArea));
            el.data("speedBooster", 1);
            el.data("motherElementOffset", el.offset().left);
            el.data("scrollXPos", 0);
            el.data("hotSpotWidth", el.find(o.scrollingHotSpotLeft).width());
            el.data("scrollableAreaWidth", 3000);
            el.data("startingPosition", 0);
            el.data("rightScrollInterval", null);
            el.data("leftScrollInterval", null);
            el.data("autoScrollInterval", null);
            el.data("hideHotSpotBackgroundsInterval", null);
            el.data("previousScrollLeft", 0);
            el.data("pingPongDirection", "right");
            el.data("getNextElementWidth", true);
            el.data("swapAt", null);
            el.data("startAtElementHasNotPassed", true);
            el.data("swappedElement", null);
            el.data("originalElements", el.data("scrollableArea").children(o.countOnlyClass));
            el.data("visible",true);

            self.recalculateScrollableArea();

            // Set the starting position of the scrollable area.
            // If no startAtElementId is set, the starting position
            // will be the default value (zero)
            el.data("scrollWrapper").scrollLeft(el.data("startingPosition"));

            // If the user wants to have visible hotspots, here is where it's taken care of
            if(o.autoScroll !== "always") {
                switch(o.visibleHotSpots)
                {
                    case "always":
                        self.showHotSpotBackgrounds();
                        break;
                    case "onstart":
                        self.showHotSpotBackgrounds();
                        el.data("hideHotSpotBackgroundsInterval", setTimeout(function(){
                            self.hideHotSpotBackgrounds("slow");
                        },(o.hotSpotsVisibleTime * 1000)));
                        break;
                    default:
                        break;
                }
            }
            /*****************************************
			 SET UP EVENTS FOR SCROLLING RIGHT
			*****************************************/
            // Check the mouse X position and calculate the relative X position inside the right hotspot
            el.data("scrollingHotSpotRight").bind("mousemove", function(e){
                var x = e.pageX - (this.offsetLeft + el.data("motherElementOffset"));
                el.data("scrollXPos", Math.round((x/el.data("hotSpotWidth")) * o.scrollStep));
                if(el.data("scrollXPos") === Infinity) {
                    el.data("scrollXPos", 0);
                }
            });

            // mouseover right hotspot - scrolling
            el.data("scrollingHotSpotRight").bind("mouseover", function(){
				
                // Clear autoscrolling, if it should only run on start
                if((o.autoScroll === "onstart" && el.data("autoScrollInterval") !== null))
                {
                    clearInterval(el.data("autoScrollInterval"));
                    el.data("autoScrollInterval", null);
                    self._trigger("autoScrollIntervalStopped");
                }

                // Start the scrolling interval
                el.data("rightScrollInterval", setInterval(function(){
				
                    if(el.data("scrollXPos") > 0)
                    {
                        el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft() + (el.data("scrollXPos") * el.data("speedBooster")));
						
                        self._showHideHotSpots();
                    }
	
                }, o.scrollInterval));
				
                // Callback
                self._trigger("mouseOverRightHotSpot");
				
            });
			
            // mouseout right hotspot
            el.data("scrollingHotSpotRight").bind("mouseout", function(){
                clearInterval(el.data("rightScrollInterval"));
                el.data("scrollXPos", 0);
            });
			
            // mousedown right hotspot (add scrolling speed booster)
            el.data("scrollingHotSpotRight").bind("mousedown", function(){
                el.data("speedBooster", o.mouseDownSpeedBooster);
            });
			
            // mouseup anywhere (stop boosting the scrolling speed)
            $("body").bind("mouseup", function(){
                el.data("speedBooster", 1);
            });
		
            /*****************************************
			 SET UP EVENTS FOR SCROLLING LEFT
			*****************************************/
            // Check the mouse X position and calculate the relative X position inside the left hotspot
            el.data("scrollingHotSpotLeft").bind("mousemove", function(e){
                var x = el.data("scrollingHotSpotLeft").innerWidth() - (e.pageX - el.data("motherElementOffset"));
                el.data("scrollXPos", Math.round((x/el.data("hotSpotWidth")) * o.scrollStep));
                if(el.data("scrollXPos") === Infinity) {
                    el.data("scrollXPos", 0);
                }
				
            });

            // mouseover left hotspot
            el.data("scrollingHotSpotLeft").bind("mouseover", function(){
				
                // Clear autoscrolling, if it should only run on start

                if((o.autoScroll === "onstart" && el.data("autoScrollInterval") !== null))
                {
                    clearInterval(el.data("autoScrollInterval"));
                    el.data("autoScrollInterval", null);
                    self._trigger("autoScrollIntervalStopped");
                }
				
                el.data("leftScrollInterval", setInterval(function(){
                    if(el.data("scrollXPos") > 0) {
                        el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft() - (el.data("scrollXPos")*el.data("speedBooster")));
						
                        self._showHideHotSpots();
                    }
					
                }, o.scrollInterval));
				
                // Callback
                self._trigger("mouseOverLeftHotSpot");
            });
			
            // mouseout left hotspot
            el.data("scrollingHotSpotLeft").bind("mouseout", function(){
                clearInterval(el.data("leftScrollInterval"));
                el.data("scrollXPos", 0);
            });

            // mousedown left hotspot (add scrolling speed booster)
            el.data("scrollingHotSpotLeft").bind("mousedown", function(){
                el.data("speedBooster", o.mouseDownSpeedBooster);
            });
			
            /*****************************************
			 SET UP EVENT FOR RESIZING THE BROWSER WINDOW
			*****************************************/
            $(window).bind("resize", function(){
                // If the scrollable area is not hidden on start, show/hide the hotspots
                if(!(o.hiddenOnStart)) {
                    self._showHideHotSpots();
                }
				
                self._trigger("windowResized");
            });
			
            /*****************************************
			 AUTOSCROLLING
			*****************************************/
            // If the user has set the option autoScroll, the scollable area will
            // start scrolling automatically
            if(o.autoScroll !== "" && !(o.hiddenOnStart)) {
                self.startAutoScroll();
            }
			
            // Should it be hidden on start?
            if(o.hiddenOnStart) {
                self.hide();
            }
	
        },
        /**********************************************************
		 Hotspot functions
		**********************************************************/
        showHotSpotBackgrounds: function(fadeSpeed)
        {
            // Alter the CSS (SmoothDivScroll.css) if you want to customize
            // the look'n'feel of the visible hotspots
            var self = this, el = this.element;
			
            // Fade in the hotspot backgrounds
            if(fadeSpeed !== undefined)
            {
                // Before the fade-in starts, we need to make sure the opacity
                // is zero
                el.data("scrollingHotSpotLeft").css("opacity","0.0");
                el.data("scrollingHotSpotRight").css("opacity","0.0");
				
                el.data("scrollingHotSpotLeft").addClass("scrollingHotSpotLeftVisible");
                el.data("scrollingHotSpotRight").addClass("scrollingHotSpotRightVisible");
				
                // Fade in the left hotspot
                el.data("scrollingHotSpotLeft").fadeTo(fadeSpeed, 0.35);

                // Fade in the right hotspot
                el.data("scrollingHotSpotRight").fadeTo(fadeSpeed, 0.35);
            }
            // Don't fade, just show them
            else
            {
                // The left hotspot
                el.data("scrollingHotSpotLeft").addClass("scrollingHotSpotLeftVisible");
                el.data("scrollingHotSpotLeft").removeAttr("style");
				
                // The right hotspot
                el.data("scrollingHotSpotRight").addClass("scrollingHotSpotRightVisible");
                el.data("scrollingHotSpotRight").removeAttr("style");
            }
            self._showHideHotSpots();
        },
        hideHotSpotBackgrounds: function(fadeSpeed)
        {
            var el = this.element;
			
            // Fade out the hotspot backgrounds
            if(fadeSpeed !== undefined)
            {
                // Fade out the left hotspot
                el.data("scrollingHotSpotLeft").fadeTo(fadeSpeed, 0.0, function(){
                    el.data("scrollingHotSpotLeft").removeClass("scrollingHotSpotLeftVisible");
                });

                // Fade out the right hotspot
                el.data("scrollingHotSpotRight").fadeTo(fadeSpeed, 0.0,function(){
                    el.data("scrollingHotSpotRight").removeClass("scrollingHotSpotRightVisible");
                });
            }
            // Don't fade, just hide them
            else
            {
                el.data("scrollingHotSpotLeft").removeClass("scrollingHotSpotLeftVisible");
                el.data("scrollingHotSpotLeft").removeAttr("style");
				
                el.data("scrollingHotSpotRight").removeClass("scrollingHotSpotRightVisible");
                el.data("scrollingHotSpotRight").removeAttr("style");
            }
			
        },
        // Function for showing and hiding hotspots depending on the
        // offset of the scrolling
        _showHideHotSpots: function()
        {
            var self = this, el = this.element, o = this.options;
			
            // If autoscrolling is set to always, there should be no hotspots
            if(o.autoScroll !== "always")
            {
                // If the scrollable area is shorter than the scroll wrapper, both hotspots
                // should be hidden
                if(el.data("scrollableAreaWidth") <= (el.data("scrollWrapper").innerWidth()))
                {
                    el.data("scrollingHotSpotLeft").hide();
                    el.data("scrollingHotSpotRight").hide();
                }
                // When you can't scroll further left the left scroll hotspot should be hidden
                // and the right hotspot visible.
                else if (el.data("scrollWrapper").scrollLeft() === 0)
                {
                    el.data("scrollingHotSpotLeft").hide();
                    el.data("scrollingHotSpotRight").show();
                    // Callback
                    self._trigger("scrollLeftLimitReached");
                    // Clear interval
                    clearInterval(el.data("leftScrollInterval"));
                    el.data("leftScrollInterval", null);
                }
                // When you can't scroll further right
                // the right scroll hotspot should be hidden
                // and the left hotspot visible
                else if (el.data("scrollableAreaWidth") <= (el.data("scrollWrapper").innerWidth() + el.data("scrollWrapper").scrollLeft()))
                {
                    el.data("scrollingHotSpotLeft").show();
                    el.data("scrollingHotSpotRight").hide();
                    // Callback
                    self._trigger("scrollRightLimitReached");
                    // Clear interval
                    clearInterval(el.data("rightScrollInterval"));
                    el.data("rightScrollInterval", null);
                }
                // If you are somewhere in the middle of your
                // scrolling, both hotspots should be visible
                else
                {
                    el.data("scrollingHotSpotLeft").show();
                    el.data("scrollingHotSpotRight").show();
                }
            }
            else
            {
                el.data("scrollingHotSpotLeft").hide();
                el.data("scrollingHotSpotRight").hide();
            }
        },
        /**********************************************************
		 Moving to a certain element
		**********************************************************/
        moveToElement: function(moveTo, elementNumber) {
            var self = this, el = this.element, o = this.options, tempScrollableAreaWidth = 0, foundStartAtElement = false;
			
            switch(moveTo)
            {
                case "first":
                    el.data("scrollXPos", 0);
                    self._trigger("movedToFirstElement");
                    break;
                case "start":
                    // Check to see where the start-at element is at the moment.
                    // This can vary if endlessloop is used for autoscroll since it
                    // swaps elements around.
					
                    el.data("scrollableArea").children(o.countOnlyClass).each(function() {
						
                        if( (o.startAtElementId.length !== 0) && (($(this).attr("id")) === o.startAtElementId) )
                        {
                            el.data("startingPosition", tempScrollableAreaWidth);
                            foundStartAtElement = true;
                        }
                        tempScrollableAreaWidth = tempScrollableAreaWidth + $(this).outerWidth(true);
                    });
					
                    el.data("scrollXPos", el.data("startingPosition"));
                    self._trigger("movedToStartElement");
                    break;
                case "last":
                    el.data("scrollXPos", el.data("scrollableAreaWidth"));
                    self._trigger("movedToLastElement");
                    break;
                case "number":
                    if(!(isNaN(elementNumber))) {
                        // Get the total width of all preceding elements
                        el.data("scrollableArea").children(o.countOnlyClass).each(function(index) {
                            if(index === (elementNumber-1))
                            {
                                el.data("scrollXPos", tempScrollableAreaWidth);
                            }
                            tempScrollableAreaWidth = tempScrollableAreaWidth + $(this).outerWidth(true);
                        });
                    }
                    self._trigger("movedToElementNumber", null, {
                        "elementNumber": elementNumber
                    });
                    break;
                default:
                    break;
            }
			
            el.data("scrollWrapper").scrollLeft(el.data("scrollXPos"));
            self._showHideHotSpots();
        },
        /**********************************************************
		 Adding or replacing content
		**********************************************************/
        addContent: function(ajaxContentURL, addWhere)
        {
            var self = this, el = this.element;

            $.get(ajaxContentURL, function(data){
                // Add the loaded content first or last in the scrollable area
                if(addWhere === "first") {
                    el.data("scrollableArea").children(":first").before(data);
                }
                else {
                    el.data("scrollableArea").children(":last").after(data);
                }
				
                // Recalculate the total width of the elements inside the scrollable area
                self.recalculateScrollableArea();
				
                // Determine which hotspots to show
                self._showHideHotSpots();
            });
        },
        replaceContent: function(ajaxContentURL)
        {
            var self = this, el = this.element;
			
            el.data("scrollableArea").load(ajaxContentURL, function(){
                // Recalculate the total width of the elements inside the scrollable area
                self.recalculateScrollableArea();
                self.moveToElement("first");
                self._showHideHotSpots();
                el.data("startingPosition", 0);
            });
        },
        /**********************************************************
		 Recalculate the scrollable area
		**********************************************************/
        recalculateScrollableArea: function() {
			
            var tempScrollableAreaWidth = 0, foundStartAtElement = false, o = this.options, el = this.element;

            // Add up the total width of all the items inside the scrollable area
            el.data("scrollableArea").children(o.countOnlyClass).each(function() {
                // Check to see if the current element in the loop is the one where the scrolling should start
                if( (o.startAtElementId.length !== 0) && (($(this).attr("id")) === o.startAtElementId) )
                {
                    el.data("startingPosition", tempScrollableAreaWidth);
                    foundStartAtElement = true;
                }
                tempScrollableAreaWidth = tempScrollableAreaWidth + $(this).outerWidth(true);
            });

            // If the element with the ID specified by startAtElementId
            // is not found, reset it
            if (!(foundStartAtElement)) {
                el.data("startAtElementId", "");
            }
		
            // Set the width of the scrollable area
            el.data("scrollableAreaWidth", tempScrollableAreaWidth);
            el.data("scrollableArea").width(el.data("scrollableAreaWidth"));
        },
        /**********************************************************
		 Stopping, starting and doing the autoscrolling
		**********************************************************/
        stopAutoScroll: function() {
            var self = this, el = this.element;
			
            clearInterval(el.data("autoScrollInterval"));
            el.data("autoScrollInterval", null);
			
            // Check to see which hotspots should be active
            // in the position where the scroller has stopped
            self._showHideHotSpots();
					
            self._trigger("autoScrollStopped");
			
        },
        startAutoScroll: function() {
            var self = this, el = this.element, o = this.options;
			
            self._showHideHotSpots();
			
            // Stop any running interval
            clearInterval(el.data("autoScrollInterval"));
            el.data("autoScrollInterval", null);
			
            // Callback
            self._trigger("autoScrollStarted");
			
            // Start interval
            el.data("autoScrollInterval", setInterval(function(){
				
                // If the scroller is not visible or
                // if the scrollable area is shorter than the scroll wrapper
                // any running autoscroll interval should stop.
                if(!(el.data("visible")) || (el.data("scrollableAreaWidth") <= (el.data("scrollWrapper").innerWidth())))
                {
                    // Stop any running interval
                    clearInterval(el.data("autoScrollInterval"));
                    el.data("autoScrollInterval", null);
                }
				
                // Store the old scrollLeft value to see if the scrolling has reached the end
                el.data("previousScrollLeft", el.data("scrollWrapper").scrollLeft());
				
                switch(o.autoScrollDirection)
                {
                    case "right":
                        el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft() + o.autoScrollStep);
                        if(el.data("previousScrollLeft") === el.data("scrollWrapper").scrollLeft())
                        {
                            self._trigger("autoScrollRightLimitReached");
                            clearInterval(el.data("autoScrollInterval"));
                            el.data("autoScrollInterval", null);
                            self._trigger("autoScrollIntervalStopped");
                        }
                        break;

                    case "left":
                        el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft() - o.autoScrollStep);
                        if(el.data("previousScrollLeft") === el.data("scrollWrapper").scrollLeft())
                        {
                            self._trigger("autoScrollLeftLimitReached");
                            clearInterval(el.data("autoScrollInterval"));
                            el.data("autoScrollInterval", null);
                            self._trigger("autoScrollIntervalStopped");
                        }
                        break;
					
                    case "backandforth":
					
					
                        if(el.data("pingPongDirection") === "right") {
                            el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft() + (o.autoScrollStep));
                        }
                        else {
                            el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft() - (o.autoScrollStep));
                        }
					
                        // If the scrollLeft hasnt't changed it means that the scrolling has reached
                        // the end and the direction should be switched
                        if(el.data("previousScrollLeft") === el.data("scrollWrapper").scrollLeft())
                        {
                            if(el.data("pingPongDirection") === "right")
                            {
                                el.data("pingPongDirection", "left");
                                self._trigger("autoScrollRightLimitReached");
                            }
                            else
                            {
                                el.data("pingPongDirection", "right");
                                self._trigger("autoScrollLeftLimitReached");
                            }
                        }
                        break;

                    case "endlessloopright":
                        // Get the width of the first element. When it has scrolled out of view,
                        // the element swapping should be executed. A true/false variable is used
                        // as a flag variable so the swapAt value doesn't have to be recalculated
                        // in each loop.

                        if(el.data("getNextElementWidth"))
                        {
                            if((o.startAtElementId !== "") && (el.data("startAtElementHasNotPassed"))) {
                                el.data("swapAt", $("#" + o.startAtElementId).outerWidth(true));
                                el.data("startAtElementHasNotPassed", false);
                            }
                            else {
                                el.data("swapAt", el.data("scrollableArea").children(":first").outerWidth(true));
                            }
						
                            el.data("getNextElementWidth", false);
                        }
		
                        // Do the autoscrolling
                        el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft() + o.autoScrollStep);

                        // Check to see if the swap should be done
                        if(el.data("swapAt") <= el.data("scrollWrapper").scrollLeft())
                        {
                            el.data("swappedElement", el.data("scrollableArea").children(":first").detach());
                            el.data("scrollableArea").append(el.data("swappedElement"));
                            el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft() - el.data("swappedElement").outerWidth(true));
                            el.data("getNextElementWidth", true);
                        }
                        break;
                    case "endlessloopleft":
                        // Get the width of the first element. When it has scrolled out of view,
                        // the element swapping should be executed. A true/false variable is used
                        // as a flag variable so the swapAt value doesn't have to be recalculated
                        // in each loop.

                        if(el.data("getNextElementWidth"))
                        {
                            if((o.startAtElementId !== "") && (el.data("startAtElementHasNotPassed"))) {
                                el.data("swapAt", $("#" + o.startAtElementId).outerWidth(true));
                                el.data("startAtElementHasNotPassed", false);
                            }
                            else {
                                el.data("swapAt", el.data("scrollableArea").children(":first").outerWidth(true));
                            }
		
                            el.data("getNextElementWidth", false);
                        }
		
                        // Do the autoscrolling
                        el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft() - o.autoScrollStep);
					
                        // Check to see if the swap should be done
                        if(el.data("scrollWrapper").scrollLeft() === 0)
                        {
                            el.data("swappedElement", el.data("scrollableArea").children(":last").detach());
                            el.data("scrollableArea").prepend(el.data("swappedElement"));
                            el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft() + el.data("swappedElement").outerWidth(true));
                            el.data("getNextElementWidth", true);
                        }
                        break;
                    default:
                        break;
					
                }
            }, o.autoScrollInterval));
		
        },
        restoreOriginalElements: function() {
            var self = this, el = this.element;
			
            // Restore the original content of the scrollable area
            el.data("scrollableArea").html(el.data("originalElements"));
            self.recalculateScrollableArea();
            self.moveToElement("first");
        },
        show: function(){
            var el = this.element;
            el.data("visible", true);
            el.show();
        },
        hide: function(){
            var el = this.element;
            el.data("visible", false);
            el.hide();
        },
        destroy: function() {
            var el = this.element;
			
            // Clear all running intervals
            clearInterval(el.data("autoScrollInterval"));
            clearInterval(el.data("rightScrollInterval"));
            clearInterval(el.data("leftScrollInterval"));
            clearInterval(el.data("hideHotSpotBackgroundsInterval"));
			
            // Remove all element specific events
            el.data("scrollingHotSpotRight").unbind("mouseover");
            el.data("scrollingHotSpotRight").unbind("mouseout");
            el.data("scrollingHotSpotRight").unbind("mousedown");
			
            el.data("scrollingHotSpotLeft").unbind("mouseover");
            el.data("scrollingHotSpotLeft").unbind("mouseout");
            el.data("scrollingHotSpotLeft").unbind("mousedown");

            // Restore the original content of the scrollable area
            el.data("scrollableArea").html(el.data("originalElements"));
            // Remove the width of the scrollable area
            el.data("scrollableArea").removeAttr("style");
            el.data("scrollingHotSpotRight").removeAttr("style");
            el.data("scrollingHotSpotLeft").removeAttr("style");

            el.data("scrollWrapper").scrollLeft(0);
            el.data("scrollingHotSpotLeft").removeClass("scrollingHotSpotLeftVisible");
            el.data("scrollingHotSpotRight").removeClass("scrollingHotSpotRightVisible");
            el.data("scrollingHotSpotRight").hide();
            el.data("scrollingHotSpotLeft").hide();
			
            // Call the base destroy function
            $.Widget.prototype.destroy.apply(this, arguments);
			
        }
    });
})(jQuery);