/* ******************************************************* */
/* this SCRIPT has been included at typo3-template PAGE.20 */
/* ******************************************************* */

/*
 *
 *
 */
$(document).ready(setupJSP);

/* scrollable navigation buttons */
var btDown;
var btUp;

var currentRow = 0;
var scrollByValue = 0; 

var _ROWS 						= 3;
var _COLUMNS 					= 11;
var _MAX_THUMBS_IN_CONTAINER;



function setupJSP(){
	var thumbItems = $('.jcarousel-control li');
	if(thumbItems.length > 0)
		scrollByValue = parseInt($(thumbItems[0]).css('height')) * 2;
	
	
	var pane = $('.jcarousel-control');
	pane.jScrollPane(
		{
			showArrows: false,
			animateScroll: true
		}
	);
	var api = pane.data('jsp');

	$('.arrowDown').bind(
		'click',
		function()
		{
			currentRow++;
			// Note, there is also scrollToX and scrollToY methods if you only
			// want to scroll in one dimension
			api.scrollBy(0, scrollByValue);
			console.log('scroll down: ' + scrollByValue); 
			return true;
		}
	);

	$('.arrowUp').bind(
		'click',
		function()
		{
			currentRow--;
			
			// Note, there is also scrollByX and scrollByY methods if you only
			// want to scroll in one dimension
			api.scrollTo(0,-scrollByValue);
			console.log('scroll up: ' + scrollByValue);
			return true;
		}
	);	
};


function setupScrollablePortfolioThumbs(){
	_MAX_THUMBS_IN_CONTAINER 	= _ROWS * _COLUMNS;
	
	
	/* parent-container contains ul-li items with thumbs */
	thumbItems = $('.jcarousel-control li');
	
	
	btDown 	= $('.arrowDown');
	btDown.click(function(){
		if(thumbItemns.length <= _MAX_THUMBS_IN_CONTAINER)
			return;
		/* */
		for(var i = currentRow * _COLUMNS  ; i < (currentRow + 1) * _COLUMNS; i++){
			var t = thumbs[i];
			$(t).css('visibility', '');		
		}	
	});
	
	
	
	btUp 	= $('.arrowUp');
	btUp.click(function(){
		if(thumbItemns.length <= _MAX_THUMBS_IN_CONTAINER)
			return;
		
	});
	
	
	/* */
	portfolioThumbs();
};


function portfolioThumbs(){
	/* thr maximum amount of thumbs a container can hold without using scrollbars */
	
	var _MAX_THUMBS_IN_CONTAINER 	= _ROWS * _COLUMNS;
		
	/* parent-container contains ul-li items with thumbs */
	console.log('LENGTH of thumbs: ' + thumbItems.length); 
	
	/* iterate through list of thumbs and
	 * hide all items that do not fit into capacity.
	 */
	if(thumbItems.length > _MAX_THUMBS_IN_CONTAINER){
		/* 1st hide items */
		for(var i = _MAX_THUMBS_IN_CONTAINER; i < thumbItems.length; i++){
			var t = thumbItems[i];
			//$(t).css('visibility', 'hidden');		
		}	
		
		/* 2nd enable scroll-buttons */
	}
};