jQuery(document).ready(function () 
{
	/**
	 * Make sure that the content element anchors (<a id="c:uid" />) are removed (Should have been done with typoscript, actually)
	 */
	$(".media a[id^='c']").remove();
	
	
	/**
	 * Scrollable 
	 */
	srollableApi = [];
	
	var scrollableCount = $(".innerWrap > .mediawrapper").size();
	
	var scrollSize = 3;
	
	for(var i = 0; i < scrollableCount; i++){
		
		srollableApi[i] = jQuery(".media").eq(i).scrollable({
			size: scrollSize,
			speed: 800,
			prev: '.prevItem',
			next: '.nextItem',
			disabledClass: 'disabledScrollable',
			api: true
		});
		
		itemCount = srollableApi[i].getSize();
		
		if(itemCount <= scrollSize){//NextItem scroller is displayed if itemCount == scrollSize. The following line solves the bug
			jQuery(".browse"+i+".nextItem").addClass('disabledScrollable');
		}else{
			jQuery(".browse"+i+".nextItem").removeClass('disabledScrollable');
		}
		
		//Display how many media is there for each section
		jQuery("#count"+i).text(itemCount);
		
		//if there is no media for a section the whole section gets hidden
		if(itemCount == 0){
			jQuery("#mediawrapper"+i).hide();
		}
		
		//Dynamic height of each teaser descriptions
		var mediaItemCount = $('#mediawrapper'+i+' .media .items .mediaItem').size();
		var previousHeight = 0;
		for(var k = 0; k < mediaItemCount; k++){
			height = $('#mediawrapper'+i+' .media .items .mediaItem').eq(k).outerHeight();
			if(height > previousHeight){
				if(height > 142){
					//Limit to five lines descriptions then overflow hidden works
					height = 142;
					$('#mediawrapper'+i+' .media .items .mediaItem').eq(k).find('span').css('height', '26px');
				}
				$('#mediawrapper'+i+' .media').css('height', (height+26)+'px');
				previousHeight = height;
			}
		
		}
	}
	//Remove the "border-bottom" of the last mediawrapper
	jQuery(".mediawrapper:visible:last").css("border-bottom", "none");
	
});