if ( !sliders ) var sliders = {}; // sliders package

/**
 * This function represents a single slider box. 
 * @param container An HTML element that will contain the slider box. 
 * 		  Generally needs to be a DIV, but not mandatory.
 * @param serverFunc A pointer to a function that is responsible for server communication.
 * 		  See getRecentSearches for an example.
 */
sliders.SliderBox = function( container )
{
	this.container = container;
	this.itemContainer = null;
	this.entries = new Array();
	this.serverFunc = null;
	this.serverCallback = null;
	this.currentPage = 0;
	this.preFetchSize = 2; // one page extra.
	this.maxInMemory = 25;
	this.nextFunc;
	this.btnLeft;
	this.btnRight;
	this.useAdditionalText = false;
	this.additionalText;
	this.maxPages = 100;
	
	// Initializes the slider box by getting the first 3 pages from the server, and displaying the first one.
	this.init = function()
	{
		var children = this.container.getElementsByTagName("div");
		for ( var i = 0; i < children.length; i++ )
		{
			if( children[i].className.match( /^items/ ) )
			{
				children = children[i].getElementsByTagName("ul");
				this.itemContainer = children[0];
			}
		}
		children = this.container.getElementsByTagName("li");
		for ( var i = 0; i < children.length; i++ )
		{
			if( children[i].className.match( /^btnLeft$/ ) )
			{
				this.btnLeft = children[i];
			}
			else if ( children[i].className.match( /^btnRight$/ ) )
			{
				this.btnRight = children[i];
			}
		}
		if ( this.useAdditionalText )
		{
			children = this.container.getElementsByTagName("span");
			for ( var i = 0; i < children.length; i++ )
			{
				if ( children[i].className.match(/^additionalText/) )
				{
					this.additionalText = children[i];
					children[i].className = children[i].className.replace( /\s*hide/, "" );
				}
				else if ( children[i].className.match(/^search/) )
				{
					children[i].className = children[i].className.replace( /\s*hide/, "" );
				}
			}
		}
		
		this.nextFunc = this.initFirstPage;
		this.serverFunc( 0, this.preFetchSize );
	}
	
	this.invokeSearch = function()
	{
		searchBoxData.length = 0; 	// clears the array
		document.getElementById("searchInput").value = this.entries[this.currentPage].key;
		doSearch();
	}
	
	this.preloadImages = function()
	{
		alert('override this method to preload images.');
	}
	
	this.initFirstPage = function()
	{
		this.itemContainer.innerHTML = this.renderPageCubes();
		if ( this.useAdditionalText )
		{
			this.additionalText.innerHTML = this.entries[this.currentPage].key;
		}
	}
	
	this.renderPageCubes = function()
	{
		alert('override this method to render the cubes.');
	}
	
	this.nextPage = function()
	{
		if ( this.currentPage + 1 < this.maxPages )
		{
			this.btnLeft.childNodes[0].className = this.btnLeft.childNodes[0].className.replace(/grayed/,"enabled"); 
			this.currentPage++;
			if ( this.useAdditionalText )
			{
				this.additionalText.innerHTML = this.entries[this.currentPage].key;
			}
			if ( this.currentPage + 1 == this.maxPages )
			{
				this.btnRight.childNodes[0].className = this.btnRight.childNodes[0].className.replace(/enabled/,"grayed");
			}
			this.itemContainer.innerHTML += this.renderPageCubes();
			var tween = new Tween( this.itemContainer.style, 'left', Tween.regularEaseInOut, 0, -416, 1, 'px' );
			tween.itemContainer = this.itemContainer;
			tween.onMotionFinished = function(){
				// Find the 5th <li>
				var liIndex = 0;
				for ( var i = 0; i < 4; i++ )
				{
					liIndex = this.itemContainer.innerHTML.toLowerCase().indexOf("<li", liIndex + 1);
				}
				// Cut from it to the end and leave only that part.
				this.itemContainer.innerHTML = this.itemContainer.innerHTML.substring( liIndex, this.itemContainer.innerHTML.length );
				
				// Move the <ul> back to place.
				this.itemContainer.style.left = 0;
			}
			tween.start();
			
			// Check whether we need to bring more pages, and if so get them.
			if ( this.preFetchSize > this.entries.length - this.currentPage )
			{
				var indexToGet = this.entries.length;
				this.nextFunc = function(){};
				this.serverFunc( indexToGet, indexToGet + this.preFetchSize );
			}
		}
	}
	
	this.prevPage = function()
	{
		if ( this.currentPage > 0 )
		{
			this.btnRight.childNodes[0].className = this.btnRight.childNodes[0].className.replace(/grayed/,"enabled"); 
			this.currentPage--;
			if ( this.currentPage == 0 )
			{
				this.btnLeft.childNodes[0].className = this.btnLeft.childNodes[0].className.replace(/enabled/,"grayed");
			}
			if ( this.useAdditionalText )
			{
				this.additionalText.innerHTML = this.entries[this.currentPage].key;
			}
			this.itemContainer.innerHTML = this.renderPageCubes() + this.itemContainer.innerHTML;
			this.itemContainer.style.left = "-416px";
			var tween = new Tween( this.itemContainer.style, 'left', Tween.regularEaseInOut, -416, 0, 1, 'px' );
			tween.itemContainer = this.itemContainer;
			tween.onMotionFinished = function(){
				// Find the 5th <li>
				var liIndex = 0;
				for ( var i = 0; i < 4; i++ )
				{
					liIndex = this.itemContainer.innerHTML.toLowerCase().indexOf("<li", liIndex + 1);
				}
				// Cut from it to the end and leave only that part.
				this.itemContainer.innerHTML = this.itemContainer.innerHTML.substring( 0, liIndex );
			}
			tween.start();
		}
	}	
}

/**
 * The RecentSearchesSlider shows a slider with the last searches in the system (set by the admins).
 * @super sliders.SliderBox
 */
sliders.RecentSearchesSlider = function( container )
{
	var that = new sliders.SliderBox( container );
	that.preFetchSize = 5;
	that.useAdditionalText = true;
	that.serverFunc = function( start, end )
	{
		ajaxRecentSearches.getRecentSearches( start, end, this.serverCallback );
	};
	
	that.serverCallback = function( response )
	{
		that.entries = that.entries.concat( response );
		that.preloadImages();
		that.nextFunc();
	};
	
	that.renderPageCubes = function()
	{
		var result = "";
		for ( var i = 0; i < 4; i++ )
		{
			var element = this.entries[this.currentPage].value[i];
			result += "<li onclick=\"document.location.href='/movies/" + element.unqiueName + "'\"><div style=\"background:url('" + 
					(element.availableImage ?  collageImagePath + 
					(element.contentType=="FeatureFilm"?"movie/":element.contentType=="TvSeries"?"tv/":"short-film/") +  
					element.unqiueName + "/" + element.unqiueName + "-4.jpeg" : 
					 collageImagePath + "no-image/content-no-image/no-image-4.jpeg") + 
					"') center bottom no-repeat;\"></div><label title=\"" + 
					element.displayTitle + "\">" +  
					(element.displayTitle.length <= 17 ? element.displayTitle : element.displayTitle.substring(0,15) + "...") + "</label></li>";
		}
		return result;
	};
	
	that.preloadImages = function()
	{
		for ( var i = 0; i < this.entries.length; i++ )
		{
			for ( var j = 0; j < 4; j++ )
			{
				var element = this.entries[i].value[j];
				if ( element.pic == null || element.pic == "undefined" )
				{
					element.pic = new Image();
					if ( element.availableImage )
					{
						element.pic.src = collageImagePath + 
							(element.contentType=="FeatureFilm"?"movie/":element.contentType=="TvSeries"?"tv/":"short-film/") + 
							element.unqiueName + "/" + element.unqiueName + "-4.jpeg";
					}
				}
			}
		}
	}
	
	return that;
}

/**
 * The SpotlightOnSlider shows a slider with the categories that are on emphasized.
 * @super sliders.SliderBox
 */
sliders.SpotlightOnSlider = function( container )
{
	var that = new sliders.SliderBox( container );
	that.preFetchSize = 2;
	that.maxPages = 2;
	that.serverFunc = function( start, end )
	{
		ajaxSpotlightOn.getSpotlightOn( this.serverCallback );
	};
	
	that.serverCallback = function( response )
	{
		that.entries = that.entries.concat( response );
		that.preloadImages();
		that.nextFunc();
	};
	
	that.renderPageCubes = function()
	{
		var result = "";
		for ( var i = 0; i < 4; i++ )
		{
			var element = this.entries[(this.currentPage * 4) + i].value;
			var key = this.entries[(this.currentPage * 4) + i].key.name;
			var contentType = this.entries[(this.currentPage * 4) + i].value.contentType;
			result += "<li onclick=\"cleanearchBox();addToSearchBox('" + key + "', '" + this.entries[(this.currentPage * 4) + i].key.displayGroup + 
					"', " + this.entries[(this.currentPage * 4) + i].key.id + 
					", 'G');searchFromSliderBox(this);\"><div style=\"background:url('" + 
					(element.availableImage ?  collageImagePath + 
					(contentType=="FeatureFilm"?"movie/":contentType=="TvSeries"?"tv/":"short-film/") + 
					element.unqiueName + "/" + element.unqiueName + "-4.jpeg" : 
					 collageImagePath + "no-image/content-no-image/no-image-4.jpeg") + "') center bottom no-repeat;\"></div><label title=\"" + key + "\">" + 
					(key.length <= 16 ? key : key.substring(0,14) + "...")+ "</label></li>";
		}
		return result;
	};
	
	that.preloadImages = function()
	{
		for ( var i = 0; i < this.entries.length; i++ )
		{
			if ( this.entries[i].pic == null || this.entries[i].pic == "undefined" )
			{
				this.entries[i].pic = new Image();
				if ( this.entries[i].value.availableImage )
				{
					this.entries[i].pic.src = collageImagePath + 
						(this.entries[i].value.contentType=="FeatureFilm"?"movie/":this.entries[i].value.contentType=="TvSeries"?"tv/":"short-film/") + 
						this.entries[i].value.unqiueName + "/" + 
						this.entries[i].value.unqiueName + "-4.jpeg";
				}
			}
		}
	}
	
	return that;
}

sliders.MoreTastesSlider = function( container )
{
	var that = new sliders.SliderBox( container );
	that.preFetchSize = 4;
	that.maxPages = 4;
	
	that.serverFunc = function( start, end )
	{
		TasteTest.getTastesWithPushedBack( this.workingTasteId, this.serverCallback );
	};
	
	that.serverCallback = function( response )
	{
		that.entries = that.entries.concat( response );
		that.maxPages = that.entries.length / 3;
		if ( that.entries.length % 3 > 0 )
		{
			that.maxPages++;
		}
		that.preloadImages();
		that.nextFunc();
	};
	
	that.renderPageCubes = function()
	{
		var result = "";
		for ( var i = 0; i < 3; i++ )
		{
			result += "<li onclick=\"tastetestfuncs.navigateToTaste('" + this.entries[(this.currentPage * 3) + i].key.code + "')\">" +
					"<div class=\"sliderPic " + this.entries[(this.currentPage * 3) + i].key.code + "-class" + 
					(this.entries[(this.currentPage * 3) + i].value >= 0 || this.entries[(this.currentPage * 3) + i].value == -1 ? "-green" : "") + 
					"\"><div class=\"text" +
					(this.entries[(this.currentPage * 3) + i].value >= 0 || this.entries[(this.currentPage * 3) + i].value == -1 ? " highlighted" : "") + "\">The " +
					this.entries[(this.currentPage * 3) + i].key.name + "</div></div>" +
					"</li>"
		}
		return result;
	}
	
	that.preloadImages = function()
	{
		for ( var i = 0; i < this.entries.length; i++ )
		{
			if ( this.entries[i].key.pic == null || this.entries[i].key.pic == "undefined" )
			{
				this.entries[i].key.pic = new Image();
				this.entries[i].key.pic.src = categoryImages + this.entries[i].key.code + "/" + this.entries[i].key.code + ".jpeg";
			}
		}
	}
	
	that.nextPage = function()
	{
		if ( that.currentPage + 1 < that.maxPages )
		{
			that.btnLeft.childNodes[0].className = that.btnLeft.childNodes[0].className.replace(/grayed/,"enabled"); 
			that.currentPage++;
			if ( that.useAdditionalText )
			{
				that.additionalText.innerHTML = that.entries[that.currentPage].key;
			}
			if ( that.currentPage + 1 == that.maxPages )
			{
				that.btnRight.childNodes[0].className = that.btnRight.childNodes[0].className.replace(/enabled/,"grayed");
			}
			that.itemContainer.innerHTML += that.renderPageCubes();
			var tween = new Tween( that.itemContainer.style, 'left', Tween.regularEaseInOut, 0, -606, 1, 'px' );
			tween.itemContainer = that.itemContainer;
			tween.onMotionFinished = function(){
				// Find the 4th <li>
				var liIndex = 0;
				for ( var i = 0; i < 3; i++ )
				{
					liIndex = that.itemContainer.innerHTML.toLowerCase().indexOf("<li", liIndex + 1);
				}
				// Cut from it to the end and leave only that part.
				that.itemContainer.innerHTML = that.itemContainer.innerHTML.substring( liIndex, that.itemContainer.innerHTML.length );
				
				// Move the <ul> back to place.
				that.itemContainer.style.left = 0;
			}
			tween.start();
		}
	}
	
	that.prevPage = function()
	{
		if ( that.currentPage > 0 )
		{
			that.btnRight.childNodes[0].className = that.btnRight.childNodes[0].className.replace(/grayed/,"enabled"); 
			that.currentPage--;
			if ( that.currentPage == 0 )
			{
				that.btnLeft.childNodes[0].className = that.btnLeft.childNodes[0].className.replace(/enabled/,"grayed");
			}
			if ( that.useAdditionalText )
			{
				that.additionalText.innerHTML = that.entries[that.currentPage].key;
			}
			that.itemContainer.innerHTML = that.renderPageCubes() + that.itemContainer.innerHTML;
			that.itemContainer.style.left = "-416px";
			var tween = new Tween( that.itemContainer.style, 'left', Tween.regularEaseInOut, -606, 0, 1, 'px' );
			tween.itemContainer = that.itemContainer;
			tween.onMotionFinished = function(){
				// Find the 4th <li>
				var liIndex = 0;
				for ( var i = 0; i < 3; i++ )
				{
					liIndex = that.itemContainer.innerHTML.toLowerCase().indexOf("<li", liIndex + 1);
				}
				// Cut from it to the end and leave only that part.
				that.itemContainer.innerHTML = that.itemContainer.innerHTML.substring( 0, liIndex );
			}
			tween.start();
		}
	}
	return that;	
}

function searchFromSliderBox(obj) {
	var divObj = obj.parentNode.parentNode;
	var id = divObj.id.substring('sliderBoxItems_'.length);
	var cbLoadingAnimation;
	if (id == 'Spotlight_On') {
		var cbLoadingAnimation = function() {
			var loadingdiv = document.getElementById('loadingResults_FeaturedSearches_' + id);
			loadingdiv.style.display = 'block'; 
			var animation = document.getElementById('bg_animation_Spotlight_On');
			animation.style.display = 'block';	
			animation.style.backgroundImage = 'url(/images/loadingResults_white_areas/ajax-loader-big_snake.gif)';
		}
		doSearch(cbLoadingAnimation);
	} else {
		doSearch();
	}
}
