function calculateCaptionHeight(captionText,width) {
	var captionHeight = 0;
	width = width.toInt();
	var captionTextLength = captionText.length;
	if (captionTextLength < (width/5)) {
		captionTextLength = (width/5);
	}
	captionHeight = 10 * (5.3*captionTextLength/width) + 30;
	captionHeight = Math.round(captionHeight);
	return captionHeight;
}

function addCaption() {
	var hasLightbox = false;
	
	$$('img.captioned').each(function(el) {						
    var captionText =  el.getProperty('title');
	if(el.getParent().getProperty('rel') == 'lightbox') {
		hasLightbox = true;
		el.getParent().setProperty('class','caption');
	} else {
		hasLightbox = false;
	}
	if ( captionText!=null ) {
		if(el.getParent().getProperty('class') == 'figureright' 
			|| el.getParent().getProperty('class') == 'figureleft'
			|| el.getParent().getProperty('class') == 'figurecenter') {
			return false;
		} else {
			var width = el.get('width').toInt() + 10 + 'px';

			if(el.getProperty('class') == 'captioned left') {
				var figure = new Element('span', {
				'class' : 'figureleft'
			  });
			} else if(el.getProperty('class') == 'captioned right') {
				var figure = new Element('span', {
					'class' : 'figureright'
				});
			}  else if(el.getProperty('class') == 'captioned center') {
				var figure = new Element('span', {
					'class' : 'figurecenter'
				});
			}

			var surroundingP = new Element('p', {
				'class' : 'surroundingP'
				});
			var caption = new Element('p', {
				'html' : captionText,
				'class' : 'caption'
				});
				
			var captionWidth = el.get('width').toInt() - 30 +'px';
			
			if (el.getProperty('class') == 'captioned center') {
				var centerDiv = new Element('div', {
					'class' : 'centerDiv'
					});	
				var captionHeight = calculateCaptionHeight(captionText,captionWidth);	
				var height = el.get('height').toInt() + captionHeight + 10 + 'px';
				centerDiv.setStyle('height', height);
				
				if (hasLightbox) {	
					centerDiv.wraps(el.getParent());
				} 
				var pHeight = el.get('height').toInt() + captionHeight + 'px';
				figure.setStyle('height', pHeight);					
			}
			
			figure.setStyle('width', width);
			surroundingP.setStyle('width', width);
			caption.setStyle('width', captionWidth);	
			
			surroundingP.wraps(el);
			figure.wraps(surroundingP);
			
			caption.inject(surroundingP,'after');
			
			if (el.getProperty('class') == 'captioned center') {
				if (!hasLightbox) {
					centerDiv.wraps(figure);
				}
			}
			
			if(hasLightbox) {
				var captionImage = new Element('p', {
					'class' : 'captionImage'
					});
				el.setProperty('title',unescape('F%FCr eine gr%F6%DFere Darstellung bitte auf das Bild klicken!'));
				captionImage.setProperty('title',unescape('F%FCr eine gr%F6%DFere Darstellung bitte auf das Bild klicken!'));
				captionImage.inject(caption,'after');
			}
		}
		  		  		  
    } 
  });
}

function styleTabs() {
	var currURL = location.href;
	currURL = decodeURI(currURL);
	var pattern = /ContentContainer_\d+/;
	var currResult = currURL.match(pattern);
	var elResult;
		
	$$('a.wbHorizontal').each(function(el) {	
		var elURL = el.getProperty('href');
		elResult = elURL.match(currResult);
		//TODO: handle cases with more than one result
		if(elResult != null) {
			el.set('class', 'wbHorizontalActive');
		}
	 });
	
}

window.addEvent('domready', function(){
  addCaption();
  styleTabs();
});