/**
	* Slider Limited
	* Structure
	* <any_element class='hidden sliderLimited up|left'></any_element>
	* <any_element>
	*		<whatever_any_children_elements>
	*			<whatever_any_children_elements_etc>
	*				<block_element_no styledWidth:"overflow: hidden; height:XXpx|width:XXpx; class="sliderRestriction">
	*					<ul styled:"display: block; height:100%;" class="sliderContainer">
	*						<li>
	*						</li>
	*						<li>
	*						</li>
	*					</ul>
	*				</block_element_no styledWidth:"overflow: hidden; height:XXpx|width:XXpx; class="sliderRestriction">
	* 		</whatever_any_children_elements_etc>
	* 	</whatever_any_children_elements>
	* </any_element>
	* <any_element class='sliderLimited down|right'></any_element>
	*/

var $click = false;
$(document).ready(function()
{
	//start with calculating the visility of the scroll right/down button
	//recalculate the witdh of the sliderContainer
	$(".sliderLimited").each(function ()
	{
		if( $(this).attr('class').indexOf('down') != -1 || $(this).attr('class').indexOf('right') != -1 )
		{
			var direction = getDirection($(this));
			var numberOfelements = getNumberOfElements($(this), direction);
			var sizeOfElement = getSizeOfElement($(this), direction);
			var sizeOfContainer = getSizeOfContainer($(this), direction);
			switch (direction)
			{
				case 'down':
					//visibility
					if ( ( numberOfelements * sizeOfElement["height"] ) <= sizeOfContainer["height"] )
					{
						$(this).hide();
					}
					//container
					var totalSize = numberOfelements * sizeOfElement["height"];
					$(this).prev().find('.sliderContainer').height(totalSize);
				break;
				case 'right':
						//visibility
					if ( ( numberOfelements * sizeOfElement["width"] ) <= sizeOfContainer["width"] )
					{
						$(this).hide();
					}
					//container
					var totalSize = numberOfelements * sizeOfElement["width"];
					$(this).prev().find('.sliderContainer').width(totalSize);
				break;
			}
		}
	});


	//add handlers on the buttons
/*Used in:
public/media/recommendations/horizontal/regular.xml
public/media/recommendations/horizontal/cart.xml
public/media/recommendations/vertical/regular.xml
*/
	$(".sliderLimited").live('click', function ()
	{
		var direction = getDirection($(this));
		if( direction )
		{
			$click = true;
		}

		var numberOfelements = getNumberOfElements($(this), direction);
		var sizeOfElement = getSizeOfElement($(this), direction);
		var sizeOfContainer = getSizeOfContainer($(this), direction);
		var numberOfVisibleElements = getNumberOfVisibleElements(sizeOfContainer, sizeOfElement, direction);
		var currentMargin = getCurrentReferenceMargin($(this) , direction, sizeOfElement);
		var endOfElementsHor = -((numberOfelements * sizeOfElement["width"]) - (numberOfVisibleElements*sizeOfElement["width"]));
		var endOfElementsVert = -((numberOfelements * sizeOfElement["height"]) - (numberOfVisibleElements*sizeOfElement["height"]));


		/*	console.log('number of Elements = ' + numberOfelements);
			console.log('size of Element Width = ' + sizeOfElement["width"]);
			console.log('size of Element Height = ' + sizeOfElement["height"]);
			console.log('size of contianer Width = ' + sizeOfContainer["width"]);
			console.log('size of contianer Height = ' + sizeOfContainer["height"]);
			console.log('number of visible elements = ' + numberOfVisibleElements);
			console.log('current margin = ' + currentMargin);
			console.log('end Of line = ' + endOfElementsVert);*/



		switch (direction)
		{
			case "up":
				$(this).next().next().show();
				if ( currentMargin >= "0" )
				{
					$(this).hide();
				}
				$(this).next().find(".sliderContainer").stop(true).animate({"margin-top": "+="+sizeOfElement["height"]+"px"}, "slow", function(){$click = false;});
			break;
			case "down":
				$(this).prev().prev().show();
				if ( currentMargin <=  endOfElementsVert)
				{
					$(this).hide();
				}
				$(this).prev().find(".sliderContainer").stop(true).animate({"margin-top": "-="+sizeOfElement["height"]+"px"}, "slow", function(){$click = false;});
			break;
			case "left":
				$(this).next().next().show();

				//hack for the recommendation banners on the homepage, they got a margin-left of -10px that should be ignored
				currentMargin = (currentMargin == -10) ? 0 : currentMargin;
				//end hack
				if ( currentMargin >= 0)
				{
					$(this).hide();
				}
				$(this).next().find(".sliderContainer").stop(true).animate({"margin-left": "+="+sizeOfElement["width"]+"px"}, "slow", function(){$click = false;});
			break;
			case "right":
				$(this).prev().prev().show();
				if ( currentMargin <=  endOfElementsHor)
				{
					$(this).hide();
				}
				$(this).prev().find(".sliderContainer").stop(true).animate({"margin-left": "-="+sizeOfElement["width"]+"px"}, "slow", function(){$click = false;});
			break;
		}
	});
});
/*Used in:
*.js
./public/scripts/sliderLimited.js
*/
function getDirection( theElement )
{
	if (theElement.attr('class').indexOf('up') != -1 && $click == false)
	{
		return "up";
	}
	if (theElement.attr('class').indexOf('down') != -1 && $click == false)
	{
		return "down";
	}
	if (theElement.attr('class').indexOf('left') != -1 && $click == false)
	{
		return "left";
	}
	if (theElement.attr('class').indexOf('right') != -1 && $click == false)
	{
		return "right";
	}
	return false;
}
/*Used in:
*.js
./public/scripts/sliderLimited.js
*/
function getNumberOfElements( theElement, theDirection )
{

	switch (theDirection)
	{
		case "up":
		case "left":
			return theElement.next().find(".sliderContainer").children().size();
		break;
		case "down":
		case "right":
			return theElement.prev().find(".sliderContainer").children().size();
		break;
	}
}
/*Used in:
*.js
./public/scripts/sliderLimited.js
*/
function getSizeOfElement( theElement, theDirection )
{
	var anLi = new Array();
	switch (theDirection)
	{
		case "up":
		case "left":
			var anLi = theElement.next().find(".sliderContainer").children();
		break;
		case "down":
		case "right":
			var anLi = theElement.prev().find(".sliderContainer").children();
		break;
	}
	anLi = anLi[0];
	var size = new Array();
	size["height"] = $(anLi).outerHeight(true);
	size["width"] = $(anLi).outerWidth(true);
	return size;
}
/*Used in:
*.js
./public/scripts/sliderLimited.js
*/
function getSizeOfContainer( theElement, theDirection )
{
	switch (theDirection)
	{
		case "up":
		case "left":
			if ( theElement.next().find(".sliderRestriction").length > 0 )
			{
				var theContainer = theElement.next().find(".sliderRestriction");
			}
			else
			{
				var theContainer = theElement.parent().find(".sliderRestriction");
			}
		break;
		case "down":
		case "right":
			if ( theElement.prev().find(".sliderRestriction").length > 0 )
			{
				var theContainer = theElement.prev().find(".sliderRestriction");
			}
			else
			{
				var theContainer = theElement.parent().find(".sliderRestriction");
			}
		break;
	}
	var size = new Array();
	size["height"] = $(theContainer).outerHeight();
	size["width"] = $(theContainer).outerWidth();
	return size;
}
/*Used in:
*.js
./public/scripts/sliderLimited.js
*/
function getNumberOfVisibleElements( sizeOfContainer, sizeOfElement, theDirection )
{
	switch (theDirection)
	{
		case "up":
		case "down":
			return Math.round(sizeOfContainer['height'] / sizeOfElement['height']);
		break;
		case "left":
		case "right":
			return Math.round(sizeOfContainer['width'] / sizeOfElement['width']);
		break;
	}
}
/*Used in:
*.js
./public/scripts/sliderLimited.js
*/
function getCurrentReferenceMargin( theElement, theDirection, sizeOfElement )
{
//	var margin = 0;
	switch (theDirection)
	{
		case "up":
				var margin = theElement.next().find(".sliderContainer").css("margin-top");
				margin = parseInt(margin.replace("px", ""));
				margin = margin + sizeOfElement["height"];
		break;
		case "down":
				var margin = theElement.prev().find(".sliderContainer").css("margin-top");
				margin = parseInt(margin.replace("px", ""));
				margin = margin - sizeOfElement["height"];
		break;
		case "left":
				margin = theElement.next().find(".sliderContainer").css("margin-left");
			margin = parseInt(margin.replace("px", ""));
			margin = margin + sizeOfElement["width"];
		break;
		case "right":
				var margin = theElement.prev().find(".sliderContainer").css("margin-left");
			margin = parseInt(margin.replace("px", ""));
			margin = margin - sizeOfElement["width"];
		break;
	}
	return margin;
}