//load jquery api
var $j = jQuery.noConflict();

$j(document).ready(function(){
	var pages = nfchistoryslider_pages;
	var items = $j('.tx-nfchistoryslider-pi1').find('div.history span a');
	var scrollleft = $j('.tx-nfchistoryslider-pi1').find('.leftscroll:first');
	var scrollright = $j('.tx-nfchistoryslider-pi1').find('.rightscroll:first');
	var busy = false;
	var pos = 0;
	var loc = window.location;
	var cache = [];
	var viewPortWidth = $j('div.history').width();
	//function to get the with of all elements > than first visible
	var getObjectsLeftDimensions = function(init){
		var width = 0;
		$j(items).each(function(index,el){
			if(index > pos || init){
				width += $j(el).width();
			}
		});
	return width;
	}
	//initial with for first scrolling...
	var objectsLeftWidth = getObjectsLeftDimensions(true);
	
	$j(scrollright).click(function(){
		if(!busy){
			//if the with of the elements left is bigger than viewport , allow scrolling...
			if(objectsLeftWidth > viewPortWidth){
				busy = true;
				var offset = $j(items[pos]).width();
				offset = offset * -1;
				var currentOffset = $j('div.history').css('margin-left');
				var scrollTo = parseInt(offset)+parseInt(currentOffset);
				$j('div.history').animate({marginLeft: scrollTo },{ queue:false, duration:500,
					complete:function(){ 
						busy = false; 
						objectsLeftWidth = getObjectsLeftDimensions();
						pos++;
					} 
				});
			}
		}
	});
	
	$j(scrollleft).click(function(){
		if(!busy){
			if(pos > 0){
				busy = true;
				var offset = $j(items[pos-1]).width();
				var currentOffset = $j('div.history').css('margin-left');
				var scrollTo = parseInt(offset)+parseInt(currentOffset);
				$j('div.history').animate({marginLeft: scrollTo },{ queue:false, duration:500,complete:function(){ busy = false; pos--} });
			}
		}
	});	
	
	// function to load remote html page and insert items..
	var loadPage = function(uid){
		if(cache[uid]) {
			var content = cache[uid]; 
			$j('.tx-nfchistoryslider-pi1').find('.requestresult:first').empty().append(content).hide().fadeIn('slow');
			return true;
		}
		var url =loc.protocol+'//'+loc.host+'/index.php?id='+uid;
		$j('.tx-nfchistoryslider-pi1').find('.requestresult:first').empty().append('<div class="waitforajax"><img src="typo3conf/ext/nfchistoryslider/res/images/wait2.gif" title="Bitte warten ..." alt="Bitte warten ..." /><br /><p>Bitte warten ...</p></div>');
		$j.get(url,null,function(data){
			var content = $j(data).find('#content-inner:first > *');				
			var twoColumn = $j(data).find('div.two-column'); 
			if(twoColumn.size() > 0) content = $j(twoColumn).find('.two-column-left > *');
			cache[uid] = content; // store request in cache
			$j('.tx-nfchistoryslider-pi1').find('.requestresult:first').empty().append(content).hide().fadeIn('slow');				
		});
	}
	
	//initial load frist page
	items.removeClass('active');
	loadPage(pages[0]);
	$j(items[0]).attr('class','active');
	
	//stop normal clickbehaviour
	items.each(function(index,item){
		$j(this).click(function(ev){
			items.removeClass('active');
			ev.preventDefault();
			$j(this).attr('class','active');			
			var uid = pages[index];
			loadPage(uid);
		});
	});
});