/**
 * Create navigation for the news articles
 */
jQuery.fn.overflowNavigation = function()
{
	var options = {
		itemClass: 'performance',
		placeholderClass: 'performance-placeholder',
		containerClass: 'box-gallery-container',
		overflowHeight: 185,
		nextControl: jQuery('.box-gallery-control-next'),
		prevControl: jQuery('.box-gallery-control-previous')
	}

	var placeHolder = false;
	var currentHeight = 0;
	var currentWidth = 0;
	var currentSlide = 0;
	var totalSlides = 0;

	/**
	 * Create a new placeholder
	 * @param HTMLElement el The element to append the placeholder to
	 * @param int overflowHeight The height of the placeholder
	 * @return HTMLElement The new placeholder
	 */
	function createPlaceholder (el, overflowHeight)
	{
		placeHolder = jQuery('<div class="'+options.placeholderClass+'"><\/div>').height(overflowHeight);
		el.parent().append(placeHolder);
		return placeHolder;
	}

	/**
	 * Slide to a particular placeholder
	 * @param int slide
	 */
	function slideTo (slide)
	{
		if (slide < 0) {slide = totalSlides-1;}
		else if (slide >= totalSlides) {slide = 0;}
		currentSlide = slide;
		var offset = jQuery('.'+options.itemClass+':first').width() * slide;
		jQuery('.'+options.containerClass).animate({left:-(offset > 0 ? offset+102 : offset)});
	}

	jQuery(this).each(function(n, el){
		el = jQuery(el);

		var elHeight = el.height();

		// Put all articles to a placeholder
		if (currentHeight + elHeight > options.overflowHeight || !placeHolder) {
			placeHolder = createPlaceholder(el, options.overflowHeight);
			currentWidth += placeHolder.width() + 102;
			currentHeight = 0;
			totalSlides++;
			placeHolder.parent().width( currentWidth );
		}

		placeHolder.append(el);
		currentHeight += elHeight;
	});

	// Attach the events to the navigation controls
	options.nextControl.click(function(){slideTo(currentSlide+1);});
	options.prevControl.click(function(){slideTo(currentSlide-1);});
}


/**
 * Split text into parts for inline navigation
 * See page: About Eddy Merckx > Biography
 */
jQuery.fn.textNavigation = function ()
{
	var options = {
		wrapperClass: 'text-wrapper',
		containerClass: 'text-container',
		splitTags: 'h1, h2, h3, h4, h5, h6, p',
		maxContentRatio: 75,
		allowedHeight: 290
	}
	var currentSlide = 0;

	/**
	 * Slide to a particular slide
	 * @param HTMLElement el
	 * @param int slide
	 * @return
	 */
	function slideTo (el, slide)
	{
		// Show/hide the navigation controls
		if (slide == 0) {
			jQuery('.text-navigation a.prev').fadeTo('slow', 0, function(){jQuery(this).hide();});
			jQuery('.text-navigation a.next').fadeTo('slow', 1);
		}
		else if (currentSlide==0 && slide>0) {
			jQuery('.text-navigation a.prev').fadeTo('slow', 1);
			if (slide == options.totalSlides-1) {
				jQuery('.text-navigation a.next').fadeTo('slow', 0, function(){jQuery(this).hide();});
			}
		}
		else if (slide == options.totalSlides-1) {
			jQuery('.text-navigation a.next').fadeTo('slow', 0, function(){jQuery(this).hide();});
		}
		else if (slide<options.totalSlides && currentSlide==options.totalSlides-1) {
			jQuery('.text-navigation a.next').fadeTo('slow', 1);
		}
		else if (slide<0 || slide>=options.totalSlides) {
			return;
		}

		// Slide to the given slide
		currentSlide = slide;
		jQuery('.paging', el).html((currentSlide+1) + ' / ' + options.totalSlides);
		var offset = (jQuery('.'+options.wrapperClass+':first', el).width()+50) * slide;
		jQuery('.'+options.containerClass, el).animate({left:-offset});
	}

	jQuery(this).each(function(n, el){
		el = jQuery(el);

		var currentHeight = 0;
		var currentWidth = 0;

		// Split the text into multiple slides
		jQuery(options.splitTags, el).each(function(m, tag){
			tag = jQuery(tag);

			if (currentHeight + tag.height() <= options.allowedHeight) {
				// Create a new slide
				if (currentHeight==0) {
					jQuery('.'+options.containerClass, el.prepend('<div class="'+options.containerClass+'"><\/div>')).prepend('<div class="'+options.wrapperClass+'"><\/div>');
					currentWidth += jQuery('.'+options.wrapperClass+':last').width() + 50;
				}
				jQuery('.'+options.wrapperClass+':last', el).append(tag);
				currentHeight += tag.height();
			}
			else {
				// Append this text to the curren slide
				var contentRatio = (100 / options.allowedHeight) * currentHeight;
				// If the content ratio is smaller than 75%, split this tag
				// into two pieces.
				if (contentRatio <= options.maxContentRatio) {
					var clone = tag.remove().clone().html('');
					var measurementClone = clone.clone();
					var tempCurrentHeight = currentHeight;
					jQuery('.'+options.wrapperClass+':last', el).append(measurementClone);

					// Try to split text into natural sentences
					var sentences = (tag.html()).split('<br>');
					for (var o=0, l=sentences.length; o<l; o++) {
						var realSentences = sentences[o].split('. ');
						for (var p=0, l2=realSentences.length; p<l2; p++) {
							measurementClone.html( clone.html() + (p>0 && clone.html() ? '. ' : '') + realSentences[p]);
							if (tempCurrentHeight + measurementClone.height() <= options.allowedHeight) {
								clone.html( measurementClone.html() );
								currentHeight = tempCurrentHeight + measurementClone.height();
							}
							else {
								measurementClone.replaceWith(clone.html( clone.html() + (p>0 ? '. ' : '')));
								clone = clone.clone().html('');
								measurementClone = clone.clone();
								jQuery('.'+options.wrapperClass+':last').after('<div class="'+options.wrapperClass+'"><\/div>');
								currentWidth += jQuery('.'+options.wrapperClass+':last').width() + 50;
								jQuery('.'+options.wrapperClass+':last').append(measurementClone);
								currentHeight = tempCurrentHeight = 0;
							}
						}

						clone.html( clone.html() + '<br>' )
					}
				}
				else {
					jQuery('.'+options.wrapperClass+':last').after('<div class="'+options.wrapperClass+'"><\/div>');
					currentWidth += jQuery('.'+options.wrapperClass+':last').width() + 50;
					jQuery('.'+options.wrapperClass+':last').append(tag);
					currentHeight = tag.height();
				}
			}
		});

		jQuery('.'+options.containerClass, el).width( currentWidth );
		
		options.totalSlides = jQuery('.'+options.wrapperClass, el).length;
		if (options.totalSlides > 1) {
			// Create the navigation controls
			el.append(jQuery('<a href="javascript:;" class="next"><!-- IE --><\/a>').click(function(){slideTo(el, currentSlide+1)}));
			el.append(jQuery('<span class="paging">1 / ' + options.totalSlides + '<\/span>'));
			el.append(jQuery('<a href="javascript:;" class="prev"><!-- IE --><\/a>').hide().click(function(){slideTo(el, currentSlide-1)}));
		}

	});
}

/**
 * Picture navigation
 * See page: About Eddy Merckx > Photos
 */
jQuery.fn.pictureNavigation = function (myOptions)
{
	var options = {
		flashObj: {getObject:function(){return this;},play:function(u,t){}},
		wrapperSize: 12,
		currentSlide: 0,
		totalSlides: 0,
		wrapper: 'picture-wrapper',
		container: 'picture-container'
	}
	options = jQuery.extend(options, myOptions);

	/**
	 * Slide to a particular image
	 * @param HTMLElement el
	 * @param int slide
	 * @return
	 */
	function slideTo (el, slide)
	{
		// Show/hide the navigation controls depending on the current slide
		if (slide == 0) {
			jQuery('.picture-navigation a.prev').fadeTo('slow', 0, function(){jQuery(this).hide();});
			jQuery('.picture-navigation a.next').fadeTo('slow', 1);
		}
		else if (options.currentSlide==0 && slide>0) {
			jQuery('.picture-navigation a.prev').fadeTo('slow', 1);
			if (slide == options.totalSlides-1) {
				jQuery('.picture-navigation a.next').fadeTo('slow', 0, function(){jQuery(this).hide();});
			}
		}
		else if (slide == options.totalSlides-1) {
			jQuery('.picture-navigation a.next').fadeTo('slow', 0, function(){jQuery(this).hide();});
		}
		else if (slide<options.totalSlides && options.currentSlide==options.totalSlides-1) {
			jQuery('.picture-navigation a.next').fadeTo('slow', 1);
		}
		else if (slide<0 || slide>=options.totalSlides) {
			return;
		}

		options.currentSlide = slide;
		jQuery('.paging', el).html((options.currentSlide+1) + ' / ' + options.totalSlides);
		var offset = (jQuery('.'+options.wrapper + ':first', el).width()) * slide;
		jQuery('.'+options.container, el).animate({left:-offset});
	}

	jQuery(this).each(function(n, el) {
		el = jQuery(el);
		jQuery('a', el).each(function(m, a) {
			a = jQuery(a);
			a.click(function(){
				options.flashObj.getObject().play(jQuery(this).attr('href'), jQuery(this).attr('rel'));
				return false;
			});

			if (m%options.wrapperSize==0) {
				a.before('<div class="'+options.wrapper+'"><\/div>');
			}

			jQuery('.'+options.wrapper + ':last').append(a);
		});

		options.totalSlides = jQuery('.'+options.wrapper, el).length;
		jQuery('.'+options.container, el).width( options.totalSlides * jQuery('.'+options.wrapper + ':first').width() );

		if (options.totalSlides > 1) {
			// Show the navigation controls
			el.append(jQuery('<a href="javascript:;" class="next"><!-- IE --><\/a>').click(function(){slideTo(el, options.currentSlide+1)}));
			el.append(jQuery('<span class="paging">1 / ' + options.totalSlides + '<\/span>'));
			el.append(jQuery('<a href="javascript:;" class="prev"><!-- IE --><\/a>').hide().click(function(){slideTo(el, options.currentSlide-1)}));
		}
	});
}


/**
 * Video navigation
 * See page: About Eddy Merckx > Videos
 */
jQuery.fn.videoNavigation = function (myOptions)
{
	var options = {
		flashObj: {getObject:function(){return this;},play:function(u,t){}},
		currentSlide: 0,
		totalSlides: 0,
		wrapper: 'video-wrapper',
		container: 'video-container',
		overflowHeight: 330
	}
	options = jQuery.extend(options, myOptions);

	var currentHeight = 0;

	/**
	 * Slide to a particular slide
	 * @param HTMLElement el
	 * @param int slide
	 * @return
	 */
	function slideTo (el, slide)
	{
		// Show/hide the navigation controls depending on the current slide
		if (slide == 0) {
			jQuery('.video-navigation a.prev').fadeTo('slow', 0, function(){jQuery(this).hide();});
			jQuery('.video-navigation a.next').fadeTo('slow', 1);
		}
		else if (options.currentSlide==0 && slide>0) {
			jQuery('.video-navigation a.prev').fadeTo('slow', 1);
			if (slide == options.totalSlides-1) {
				jQuery('.video-navigation a.next').fadeTo('slow', 0, function(){jQuery(this).hide();});
			}
		}
		else if (slide == options.totalSlides-1) {
			jQuery('.video-navigation a.next').fadeTo('slow', 0, function(){jQuery(this).hide();});
		}
		else if (slide<options.totalSlides && options.currentSlide==options.totalSlides-1) {
			jQuery('.video-navigation a.next').fadeTo('slow', 1);
		}
		else if (slide<0 || slide>=options.totalSlides) {
			return;
		}

		options.currentSlide = slide;
		jQuery('.paging', el).html((options.currentSlide+1) + ' / ' + options.totalSlides);
		var offset = (jQuery('.'+options.wrapper + ':first', el).width()) * slide;
		jQuery('.'+options.container, el).animate({left:-offset});
	}

	jQuery(this).each(function(n, el) {
		el = jQuery(el);
		jQuery('.video', el).each(function(m, video) {
			video = jQuery(video);

			if (m==0) {
				video.before('<div class="'+options.wrapper+'"><\/div>');
			}

			if (jQuery('.'+options.wrapper+':last').height() + video.height() > options.overflowHeight) {
				jQuery('.'+options.wrapper+':last').after('<div class="'+options.wrapper+'"><\/div>');
			}

			jQuery('.'+options.wrapper+':last').append(video);
		});

		options.totalSlides = jQuery('.'+options.wrapper, el).length;
		jQuery('.'+options.container, el).width( options.totalSlides * jQuery('.'+options.wrapper + ':first').width() );

		if (options.totalSlides > 1) {
			// Show the navigation controls
			el.append(jQuery('<a href="javascript:;" class="next"><!-- IE --><\/a>').click(function(){slideTo(el, options.currentSlide+1)}));
			el.append(jQuery('<span class="paging">1 / ' + options.totalSlides + '<\/span>'));
			el.append(jQuery('<a href="javascript:;" class="prev"><!-- IE --><\/a>').click(function(){slideTo(el, options.currentSlide-1)}));
		}
	});

	jQuery('.video .video-still').click(function(){
		jQuery('.video-still.active').removeClass('active');
		jQuery(this).addClass('active');
		options.flashObj.getObject().play(jQuery(this).attr('href'), jQuery(this).attr('rel'));
		return false;
	});

	jQuery('.video-still:first').addClass('active');
}

function myFlashObject ()
{
	this.getObject = function()
	{
		return this;
	}

	this.play = function (url, type)
	{
		if (type=='youTubeVideo')
		{
			var results = url.match("[\\?&]v=([^&#]*)");
			url = (results===null ) ? url : results[1];
		}
		
		var str = 'Play: ' + url + ', type: ' + type;
		/*
                if (jQuery.browser.mozilla){
			console.log(str);
                        $('#photo').show(url, type);
		}
		else {
			alert(str);
		}*/
                var flashO = new FlashObject('photo');
                flashO.obj().show(url, type);
	}
}
/**
* Returns a Flash object
* Usage:
*    var myFlashObj = new FlashObject('flashId');
*    myFlashObj.obj().myFlashFunction(value1, 'value2', {id:'test', style:'bold'});
*
* @param string objectId
* @return Object
*/
function FlashObject (objectId){
  this.objectId = objectId;

  this.obj = function(){
      return window.document[this.objectId] || window[this.objectId];
  }
}

jQuery(document).ready(function(){
	jQuery('.performance').overflowNavigation();
	jQuery('.text-navigation').textNavigation();
	jQuery('.picture-navigation').pictureNavigation({flashObj: new myFlashObject()});
	jQuery('.video-navigation').videoNavigation({flashObj: new myFlashObject()});
});