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

	$.widget("sancheaz.smoothGallery", {
		// Default options
		options: {
			scrollingHotSpotLeft: "div.scrollingHotSpotLeft", 
			scrollingHotSpotRight: "div.scrollingHotSpotRight", 
			scrollableArea : "div.scrollableArea",
			scrollWrapper: "div.scrollWrapper", 
			hiddenOnStart: false, 
			ajaxContentURL: "",
			countOnlyClass: "",
			scrollStep: 15,
			scrollInterval: 10,
			mouseDownSpeedBooster: 3, 
			autoScroll: "", 
			autoScrollDirection: "right", 
			autoScrollStep: 3,
			autoScrollInterval: 50,
			visibleHotSpots: "",
			hotSpotsVisibleTime: 5, 
			startAtElementId: "",

			bigImageWrapper: 'div#big-image',
			path2images: 'gi/autumn-10/',
		showBigImageInterval: 10000,
		bigImageWrapper: "div#bigImage",
		fadeDuration: 500


		},
		_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", 0);
			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);
			el.data("initialAjaxContentLoaded", false);
			el.data("enabled", true);

   			var _inTimer = false;
			var _curImgIndex = 0;
			var _imgCount = el.find('img').length;
			var _galleryImagesSrc = new Array();
			var _galleryImagesModel = new Array();
			var _galleryImagesSize = new Array();
			var _galleryImagesRise = new Array();

			// Создадим массив ссылок на картинки
        	el.find('img').each( function(index) {
				var strs = $(this).attr('src').split('/');
				var fname = strs[strs.length-1];
				_galleryImagesSrc[index] = o.path2images +fname;
				_galleryImagesSize[index] = $(this).attr('size');
				_galleryImagesRise[index] = $(this).attr('rise');
				_galleryImagesModel[index] = $(this).attr('model');
			});

			el.showBigImageTimer = setInterval(tickBigImage, o.showBigImageInterval);
			showBigImageByIndex(_curImgIndex++);

			function tickBigImage() {
				if (_inTimer) return;
				_inTimer = true;
				if (_curImgIndex < _imgCount-1 ) _curImgIndex ++;
				else _curImgIndex = 0;
				showBigImageByIndex(_curImgIndex);
				_inTimer = false;
			}

			function showBigImageByIndex(indexNo) {

				if ( _galleryImagesSrc[indexNo] == null ) return;

				var strs = _galleryImagesSrc[indexNo].split('/');
				var fname = strs[strs.length-1];
				var prevImage = $(o.bigImageWrapper).find('img');
				var image = $('<img />').attr('src', o.path2images+fname);

				image.css({
		            position: 'absolute',
		            top: 0,
			    	left: 0,
		            opacity: 0.0
		          })


				.one("load",function(){

					$(o.bigImageWrapper).append(image);

					image.animate({opacity: 1.0}, {
			            queue: false,
			            duration: o.fadeDuration,
			            easing: 'linear',
						complete: function() {
							// остановим анимацию, которая должна остановиться, но почему-то колбасит
							$(this).stop();
							$(o.bigImageWrapper).remove(prevImage);
						}
					});

				})
				.each(function(){
					if (this.complete) 
						$(this).trigger("load");
				});



//				$('#model-info').css( {opacity: 0.0} );

				var st = '<div id="model-info-inner">';
				st = st + '<p>';
				st = st + '<span class="model-no-text">модель: </span>';
				st = st + '<span class="model-no">' + _galleryImagesModel[indexNo] + '</span><br />';
				st = st + '<span class="size-text">размер: </span>';
				st = st + '<span class="size-no">' + _galleryImagesSize[indexNo] + '</span><br />';
				st = st + '<span class="rise-text">рост: </span>';
				st = st + '<span class="rise-no">' + _galleryImagesRise[indexNo] + '</span>';

				st = st + '</p>';
				st = st + '</div>';

				$('#model-info').html(st);
//				$('#model-info').animate({opacity: 1.0}, {
//			            queue: false,
//			            duration: options.fadeDuration,
//			            easing: 'linear'
//				});
			}

			function showBigImage(image_src) {

				var strs = image_src.split('/');
				var fname = strs[strs.length-1];

				var i;

				for (i=0;i<_imgCount;i++) {
					var parts = _galleryImagesSrc[i].split('/');
					var imageFileName = parts[parts.length-1];
					if ( fname == imageFileName ) {
						showBigImageByIndex(i);
						break;
					}
				}
			}




			// 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

			// sancheaz
			//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 (o.autoScroll === "always") {
						self.rightendless();
					}
					else {
						if(el.data("scrollXPos") > 0 && el.data("enabled"))
						{
							el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft() + (el.data("scrollXPos") * el.data("speedBooster")));
						
							self._showHideHotSpots();
						}
					}
	
				}, o.scrollInterval));
				
				// Callback
				self._trigger("mouseOverRightHotSpot");
				
			});
			

			// sancheaz

			el.find('img').click(function() {
				showBigImage( $(this).attr('src') );
			});


			el.data("scrollWrapper").bind("stopautoscroll", function() {
				self.stopAutoScroll();
				clearInterval(el.showBigImageTimer);
			});

			el.data("scrollWrapper").bind("startautoscroll", function() {
				self.startAutoScroll();
				el.showBigImageTimer = setInterval(tickBigImage, o.showBigImageInterval);
			});

			el.data("scrollWrapper").bind("mouseover", function() {
				el.data("scrollWrapper").trigger("stopautoscroll");
			});

			el.data("scrollWrapper").bind("mouseout", function() {
				el.data("scrollWrapper").trigger("startautoscroll");
			});

			el.data("scrollingHotSpotRight").bind("mouseover", function() {
				el.data("scrollWrapper").trigger("stopautoscroll");
			});

			el.data("scrollingHotSpotRight").bind("mouseout", function() { 
				el.data("scrollWrapper").trigger("startautoscroll");
			});
			
			el.data("scrollingHotSpotLeft").bind("mouseover", function() {
				el.data("scrollWrapper").trigger("stopautoscroll");
			});

			el.data("scrollingHotSpotLeft").bind("mouseout", function() { 
				el.data("scrollWrapper").trigger("startautoscroll");
			});


			// end of sancheaz


			// 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 (o.autoScroll === "always") {
						self.leftendless();
					}
					else {
						if(el.data("scrollXPos") > 0 && el.data("enabled")) {
							el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft() - (el.data("scrollXPos")*el.data("speedBooster")));

							console.debug(el.data("scrollWrapper").scrollLeft());
							
							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");
			});
			
			/*****************************************
			 FETCHING AJAX CONTENT ON INITIALIZATION
			*****************************************/
			// If there's an ajaxContentURL in the options, 
			// fetch the content
			if(o.ajaxContentURL.length > 0)
			{
				self.replaceContent(o.ajaxContentURL);
			}
			else
			{
				self.recalculateScrollableArea();
			}
			
			// Should it be hidden on start?
			if(o.hiddenOnStart) { 
				self.hide();
			}
			
			/*****************************************
			 AUTOSCROLLING
			*****************************************/
			// If the user has set the option autoScroll, the scollable area will
			// start scrolling automatically. If the content is fetched using AJAX
			// the autoscroll is not started here but in recalculateScrollableArea.
			// Otherwise recalculateScrollableArea won't have the time to calculate
			// the width of the scrollable area before the autoscrolling starts.
			if((o.autoScroll.length > 0) && !(o.hiddenOnStart) && (o.ajaxContentURL.length <= 0)) {
				self.startAutoScroll();
			}

		},


		    // <!-- SANCHEAZ
			leftendless: function() {
				// 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.

				var self = this, el = this.element, o = this.options;

				if(el.data("getNextElementWidth"))
				{
					if((o.startAtElementId.length > 0) && (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 *el.data("speedBooster"))   );
						
				// 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);
				}
			},

			rightendless: function() {
				var self = this, el = this.element, o = this.options;

				if(el.data("getNextElementWidth"))
				{
					if((o.startAtElementId.length > 0) && (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 *el.data("speedBooster"))   );

				// 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);
				}

			},

			showBigImageByIndexc: function(image_no) {
			},


			showBigImageBySrc: function(image_src) {
			},
			// --> SANCHEAZ



		/**********************************************************
		 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 (o.visibleHotSpots == "always") {
				el.data("scrollingHotSpotLeft").show();
				el.data("scrollingHotSpotRight").show();
			}
			else
			{
			// 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, self = this;

			// 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"));
			
			// If the content of the scrollable area is fetched using AJAX
			// during initialization, it needs to be done here. After it has
			// been loaded a flag variable is set to indicate that the content
			// has been loaded already and shouldn
			if(!(el.data("initialAjaxContentLoaded")))
			{
				if((o.autoScroll.length > 0) && !(o.hiddenOnStart) && (o.ajaxContentURL.length > 0)) {
					self.startAutoScroll();
					el.data("initialAjaxContentLoaded", true);
				}
			}
			
		},
		/**********************************************************
		 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);
				}
				else
				{
					// 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.length > 0) && (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.length > 0) && (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();
		},
		enable: function(){
			var el = this.element;
			
			// Set enabled to true
			el.data("enabled", true);
		},
		disable: 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"));
			
			// Set enabled to false
			el.data("enabled", false);
		},
		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);