var UIOptimisations = {

	init: function() {
		this.hideOldBrowserInIframe();
		this.injectTopNavShaddow();
		this.injectMouseHover();
		this.initializeDropdowns();
		this.initializeCopyrightInfo();
	},

	initializeCopyrightInfo: function() {
		$copy = $('#mp_q1_bild_copyright_info');
		if ($copy.length) {
			$target = $('#copyrightContainer');
			if ($target.length) {
				$target.html($copy.html());
				$target.css('display', 'block');
				$copy.html('');
			}
		}
	},

	hideOldBrowserInIframe: function() {
		if (window.parent.frames.length > 0)
		{
			jQuery('.noscriptHint').hide();
		}
	},

	injectTopNavShaddow: function() {
		jQuery('#header ul.mainNavigation li.level1').each(function(index, element) {
			jQuery(element).find('div.navL2').wrap('<div class="shaddowLeft"></div>');
			jQuery(element).append('<dfn class="topShaddow">&nbsp;</dfn>');
			jQuery(element).find('.shaddowLeft').append('<dfn class="topRightShaddow">&nbsp;</dfn>');

			if (jQuery(element).hasClass('childCount0'))
			{
				jQuery(element).find('a').wrapAll('<div class="childCount0bottomShaddow"></div>');
				jQuery(element).append('<dfn class="bottomRightShaddow">&nbsp;</dfn>');
			}

		});
	},

	injectMouseHover: function() {
		jQuery('img.msHover').hover(
			function() {
				var src = jQuery(this).attr('src');
				src = src.replace(/\.(gif|png|jpg)/gi, '-ms.$1');
				jQuery(this).attr('src', src);
			},
			function() {
				var src = jQuery(this).attr('src');
				src = src.replace(/-ms/gi, '');
				jQuery(this).attr('src', src);
			}
		);
	},

	/**
	 * auf den Unterseiten (Q2 nicht vorhanden) müssen die Dropdowns für den Header
	 * manell erezugt werden.
	 **/
	initializeDropdowns: function()
	{
		var q2 = jQuery('.ce_q2');
		if ( (q2.length == 0) || (typeof q2 == 'undefined') )
		{
			DropdownInjector.init();
		}
	}
}



var SearchHintInjection = {

	targetElement:	'#header .searchForm .query',
	searchHintText:	'Suchbegriff',

	init: function() {
		jQuery(this.targetElement).focus(function() {
			jQuery(this).removeClass('inactive');
			SearchHintInjection.removeText();
		});
		jQuery(this.targetElement).blur(function() {
			jQuery(this).addClass('inactive');
			SearchHintInjection.setText();
		});
		this.setText();
		jQuery(this.targetElement).addClass('inactive');
	},

	setText:function() {
		if (typeof jQuery(this.targetElement).attr('value') != 'undefined')
		{
			var value = jQuery.trim(jQuery(this.targetElement).attr('value'));
			if (value == '') {
				jQuery(this.targetElement).attr('value', this.searchHintText);
			}
		}
	},

	removeText:function() {
		if (typeof jQuery(this.targetElement).attr('value') != 'undefined')
		{
			var value = jQuery.trim(jQuery(this.targetElement).attr('value'));
			if (value == this.searchHintText) {
				jQuery(this.targetElement).attr('value', '');
			}
		}
	}
}



var tabNavigation = {

	create:function(container)
	{
		var navpoints = {};

		var sectionCount = 0;
		jQuery(container + ' .section').each(function(index, element) {
			var headline = jQuery(element).find('h4').hide().text();
			navpoints[index] = headline;
			jQuery(element).addClass('section'+index);

			jQuery(element).find('.item').each(function (index, element) {
				jQuery(element).addClass("item" + index);
			});

			sectionCount++;
		});

		var sNavHTML = '<div class="tabNavHeader"><ul class="tabNavigation">';

		var nElementCounter = 0;
		for (key in navpoints)
		{
			var sClass = 'c'+nElementCounter;

			if (nElementCounter == 0)
			{
				sNavHTML += '<li class="'+sClass+' first">';
			}
			else if (nElementCounter == (sectionCount-1) )
			{
				sNavHTML += '<li class="'+sClass+' last">';
			}
			else
			{
				sNavHTML += '<li class="'+sClass+'">';
			}
			sNavHTML += '<a href="javascript:tabNavigation.show(\''+container+'\', '+key+');">'+navpoints[key]+'</a></li>';

			if (nElementCounter < (sectionCount-1) )
			{
				sNavHTML += '<li class="navSpacer"><dfn class="spacer">&nbsp;</dfn></li>';
			}
			nElementCounter++;
		}
		sNavHTML += '</ul></div>';

		return sNavHTML;
	},

	show: function(container, tab)
	{
		jQuery(container + ' .tabNavigation li').removeClass('active');
		jQuery(container + ' .tabNavigation li.c'+tab).addClass('active');
		jQuery(container + ' .section').hide();
		jQuery(container + ' .section'+tab).show();

		if (typeof jQuery().jScrollPane != 'undefined')
		{
			jQuery('.ce_q3 .scrollContainer, .ce_q2 .section1 .scrollContainer').jScrollPane({
				showArrows: true
			});
		}

	}

}



var DropdownInjector = {

	init: function() {
		jQuery('.dropdown').each(function(index, element) {
			jQuery(element).attr('id', 'jsDropdown'+index);
			jQuery(element).addClass('dropdown_dynamic').removeClass('dropdown_static');
			jQuery(element).find('dt a, ul').hover(
				function() {
					// jQuery(".dropdown dd ul").hide();
					jQuery('#jsDropdown'+index).addClass('dropdown_open');
					jQuery('#jsDropdown'+index+' dd ul').show();
				},
				function() {
					jQuery('#jsDropdown'+index).removeClass('dropdown_open');
					jQuery('#jsDropdown'+index+' dd ul').hide();
				}
			);
		});

		jQuery(document).bind('click', function(e) {
			var clicked = jQuery(e.target);
			if (! clicked.parents().hasClass("dropdown"))
				jQuery(".dropdown dd ul").hide();
		});
	}
}



var q1Controller = {

	initialOpenSection	: 0,			// der Tab der beim laden geöffnet ist
	activeSection		: 0,			// aktuell durch animation angezeigte Seite
	nStageCount			: 0,
	timer				: null,

	init: function() {

		this.nStageCount = jQuery('.ce_q1 .stage').length;

		if (this.nStageCount < 2) return;

		jQuery('.ce_q1').addClass('ce_q1_jsNavigation').append('<div class="stageNavigation"><ul class="NavList"></ul></div>');

		jQuery('.ce_q1 .stage').each(function(index, element) {
			var navItem = jQuery(element).find('a.navItem');
			jQuery(navItem).clone().appendTo('.ce_q1 .stageNavigation .NavList').wrap('<li></li>');
			jQuery(navItem).hide();
			jQuery(element).attr('id', 'mainStage'+index);
		});

		// Click-Event zuweisen
		jQuery('.ce_q1 .stageNavigation li').each(function(index, element) {
			jQuery(element).attr('id', 'mainStageNavPoint'+index);
			jQuery(element).find('a').bind('click.showStage', function(){
				q1Controller.showStage(index);
				return false;
			});
		});

		this.showStage(this.initialOpenSection);

		// timer starten
		if (typeof jQuery.timer != 'undefined')
		{
			this.timer = jQuery.timer(function() {
				q1Controller.showNextStage();
			});
			this.timer.set({ time : 5000, autostart : true });
			jQuery('.ce_q1').hover(
				function(){
					q1Controller.timer.pause();
				},
				function(){
					q1Controller.timer.play();
				}
			)
		}
	},

	showStage: function(index, fadeout) {
		if (typeof fadeout == 'undefined')
		{
			fadeout = false;
		}
		if (fadeout)
		{
			var hideStage = jQuery('.ce_q1 #mainStage'+this.activeSection);
			var showStage = jQuery('.ce_q1 #mainStage'+index);
			hideStage.css('zIndex', 3);
			showStage.css('zIndex', 4);
			hideStage.fadeOut(750);
			showStage.fadeIn(750);
			jQuery('.ce_q1 .stageNavigation li').removeClass('active');
			jQuery('#mainStageNavPoint'+index).addClass('active');
		} else{
			jQuery('.ce_q1 .stage').hide();
			jQuery('.ce_q1 #mainStage'+index).show();
			jQuery('.ce_q1 .stageNavigation li').removeClass('active');
			jQuery('#mainStageNavPoint'+index).addClass('active');
		}

		this.activeSection = index;
	},

	showNextStage:function()
	{
		var newSection = this.activeSection + 1;
		if (newSection > this.nStageCount-1)
		{
			newSection = 0;
		}

		this.showStage(newSection, true);
	}
}



var q2Controller = {

	initialOpenSection : 0,			// der Tab der beim laden geöffnet ist

	init: function() {
		// GUI erzeugen und modifizieren
		jQuery('.ce_q2 .section .dropdown').wrapAll('<div class="scrollContainer"></div>');
		jQuery('.ce_q2 .section .linkList').wrapAll('<div class="scrollContainer"></div>');

  		jQuery('.ce_q2').addClass('ce_q2_tabnav').prepend(
			tabNavigation.create('.ce_q2')
		);
		tabNavigation.show('.ce_q2', this.initialOpenSection);
		jQuery('.ce_q2 .dropdown').addClass('dropdown_dynamic');
		DropdownInjector.init();

		jQuery('#main .ce_q2 .tabNavigation li').hover(
			function() {
				jQuery(this).addClass('hover');
			},
			function() {
				jQuery(this).removeClass('hover');
			}
		);
	}
}



var q3Controller = {

	initialOpenSection : 0,			// der Tab der beim laden geöffnet ist

	init: function() {
		// GUI erzeugen und modifizieren
		jQuery('.ce_q3 .section').not('.media').wrapInner('<div class="scrollContainer"></div>');
		jQuery('#main .ce_q3 .media .videoList').wrapInner('<div class="scrollContainer"></div>');

		jQuery('.ce_q3').addClass('ce_q3_tabnav').prepend(
			tabNavigation.create('.ce_q3')
		);
		tabNavigation.show('.ce_q3', this.initialOpenSection);

		jQuery('#main .ce_q3 .tabNavigation li').hover(
			function() {
				jQuery(this).addClass('hover');
			},
			function() {
				jQuery(this).removeClass('hover');
			}
		);

	}
}


var q4Controller = {

	initialOpenItem 	: 0,			// der Tab der beim laden geöffnet ist
	elementCounter		: 0,			// anzahl der gefundenen Tabs
	currentVisibleItem	: 0,			// Nummer des aktuell angezeigten Tabs
	autoNextItemTimeout	: 4000,			// Zeit nach der automatisch zum nächsten Item umgeschaltet wird
	fadeSpeed			: 500,

	timer				: null,

	init: function() {

		jQuery('.ce_q4').wrapInner('<div class="itemContainer"></div>');

		jQuery('.ce_q4 .itemContainer').find('.item').each(function(index, element) {
			jQuery(element).addClass("item" + index);
			if (index == q4Controller.initialOpenItem) {
				jQuery(element).show();
				q4Controller.currentVisibleItem = index;
			} else {
				jQuery(element).hide();
			}
			q4Controller.elementCounter = (index+1);
		});

		this.randomizeItems();

		this.createMetaNavigation();

		if (typeof jQuery().cycle != 'undefined')
		{
			jQuery('.ce_q4 .itemContainer').cycle({
				fx			:	'fade',
				random		:	0,
				speed		:	this.fadeSpeed,
				fastOnEvent	:	0,
				prev		:	'.prevItem',
				next		:	'.nextItem',
				after		:	function(curr, next, opts) { q4Controller.cycleOnAfterCallback(curr, next, opts) },
				timeout		:	this.autoNextItemTimeout
			});
			jQuery('.ce_q4').hover(
				function() {
					$('.ce_q4 .itemContainer').cycle('pause');
				},
				function() {
					$('.ce_q4 .itemContainer').cycle('resume');
				}
			);
		}


	},

	randomizeItems: function() {
		var items = [];
		jQuery('.ce_q4 .itemContainer .item').each(function(index, element){
			items[items.length] = jQuery(element).detach();
		});

		var randomizedItems = items.sort(q4Controller.randomSort);

		for (var i=0; i<randomizedItems.length; i++) {
			jQuery('.ce_q4 .itemContainer').append(randomizedItems[i]);
		}
	},

	randomSort:function randomSort(a,b) {
    	// Get a random number between 0 and 10
    	var temp = parseInt( Math.random()*10 );
	    // Get 1 or 0, whether temp is odd or even
	    var isOddOrEven = temp%2;
	    // Get +1 or -1, whether temp greater or smaller than 5
	    var isPosOrNeg = temp>5 ? 1 : -1;
	    // Return -1, 0, or +1
	    return( isOddOrEven*isPosOrNeg );
	},

	cycleOnAfterCallback: function(curr, next, opts) {
		var index				= opts.currSlide;
		this.currentVisibleItem = index;
		jQuery('.ce_q4 .metaNav .elements').html((index+1) + '/' + opts.slideCount);
	},

	createMetaNavigation: function() {
		var nav = '<div class="metaNav"><span class="elements">'+(this.currentVisibleItem+1)+'/'+ this.elementCounter +'</span><a href="" class="prevItem">&nbsp;</a><a href="" class="nextItem">&nbsp;</a></div>';
		jQuery('.ce_q4').addClass('ce_q4_metanav').prepend(nav);
	}
}

var youtubeInjector = {

//	ytAPILink		: 'https://gdata.youtube.com/feeds/api/videos/#ID#?v=2&alt=jsonc&callback=youtubeInjector.generateItemHTML',
//	ytAPILinkIframe	: 'https://gdata.youtube.com/feeds/api/videos/#ID#?v=2&alt=jsonc&callback=youtubeInjector.generateIframeHTML',

	ytAPILink		: '/x/getJSON.php?ytID=#ID#&callback=youtubeInjector.generateItemHTML',
	ytAPILinkIframe	: '/x/getJSON.php?ytID=#ID#&callback=youtubeInjector.generateIframeHTML',

//	itemTemplate	: '<div class="item"><a href="javascript:void(0);" onclick="youtubeInjector.getIframePlayer(\'#ytID#\'); return false; "><div class="thumbnail"><img src="#thumbImage#" width="96" /><p class="time">#time#</p></div><div class="info"><h5>#headline#</h5><p>#viewCount# Aufrufe - #timeAgo#</p></div></a></div>',
	itemTemplate	: '<div class="item"><a href="javascript:void(0);" onclick="youtubeInjector.getIframePlayer(\'#ytID#\'); return false; "><div class="thumbnail"><img src="#thumbImage#" width="96" /><p class="time">#time#</p></div><div class="info"><h5>#headline#</h5></div></a></div>',
	sYTPlayerTpl	: '<h3><a href="#playerLink#" target="_blank" title="#headline#">#headlineShort#</a></h3><iframe width="291" height="195" src="http://www.youtube.com/embed/#id#?rel=0&modestbranding=1&theme=dark&enablejsapi=1" frameborder="0"></iframe>',

	targetContainer	:		'#main .ce_q3 .media .right .videoList',
	targetContainerIframe:	'#main .ce_q3 .media .left .videoBox',

	timeTable		: {
		'seconds':	['vor %s Sekunde',	'vor %s Sekunden'],
		'minutes':	['vor %s Minute',	'vor %s Minuten'],
		'hours':	['vor %s Stunde',	'vor %s Stunden'],
		'days':		['vor %s Tag',		'vor %s Tagen'],
		'weeks':	['vor %s Woche',	'vor %s Wochen'],
		'months':	['vor %s Monat',	'vor %s Monaten'],
		'years':	['vor %s Jahr',		'vor %s Jahren']
	},

	requestedIDs	: {},	// jQuery UI-Tabs clont Inhalte. Deshalb kann es vorkommen das requests mehrfach erzeugt werden.

	getThumbnailedItem: function(ytID) {
		if (typeof this.requestedIDs[ytID] == 'undefined')
		{
			this.requestedIDs[ytID] = 1;
			jQuery(this.targetContainer+' #ytc-item-'+ytID).addClass('empty');
			var sUrl = this.ytAPILink.replace(/#ID#/gi, ytID);

			jQuery.ajax({
				'url'			: sUrl,
				'async'			: true,
				'dataType' : 'script',
				error	: function(jqXHR, textStatus, errorThrown)
				{
					if (typeof console != 'undefined') {
						console.info('ajax error: ' + errorThrown);
					} else {
						alert('ajax error: ' + errorThrown);
					}
				}
			});
		}
		return false;
	},

	generateItemHTML: function(data) {
		var id		 = data['data']['id'];
		var duration = this.transformSeconds(data['data']['duration']);
		var thumbSrc = data['data']['thumbnail']['sqDefault'];
		var headline = data['data']['title'];
		var viewCount= data['data']['viewCount'];
		var timeAgo  = this.transformTime(data['data']['uploaded']);

		if (duration.indexOf('00:') == 0)
		{
			duration = duration.substr(3, duration.length);
		}

		var template = this.itemTemplate;

		template = template.replace(/#ytID#/i,			id);
		template = template.replace(/#thumbImage#/i,	thumbSrc);
		template = template.replace(/#time#/i,			duration);
		template = template.replace(/#headline#/i,		headline);
		template = template.replace(/#viewCount#/i,		viewCount);
		template = template.replace(/#timeAgo#/i,		timeAgo);

		var targetElement = this.targetContainer+' #ytc-item-'+id;
		jQuery(targetElement).html(template);
		jQuery(targetElement).removeClass('empty').css('cursor', 'pointer');

		// neu initialisieren
		jQuery('.ce_q3 .section .videoList .scrollContainer').jScrollPane({
			showArrows: true
		});
	},

	getIframePlayer: function(ytID)	{
		var targetElement = jQuery(this.targetContainerIframe+' #ytc-video-'+ytID);
		if (targetElement.length == 0)
		{
			targetElement = jQuery(this.targetContainerIframe);
		}
		jQuery(targetElement).addClass('empty');

		var sUrl = this.ytAPILinkIframe.replace(/#ID#/gi, ytID);
		jQuery.ajax({
			'url'	: sUrl,
			'async'	: true,
			'dataType' : 'script',
			error	: function(jqXHR, textStatus, errorThrown)
			{
				if (typeof console != 'undefined') {
					console.info('ajax error: ' + errorThrown);
				} else {
					alert('ajax error: ' + errorThrown);
				}
			}
		});
	},

	generateIframeHTML: function(data, ignoreYTID) {

		if (typeof ignoreYTID == 'undefined') ignoreYTID = false;

		var id			= data['data']['id'];
		var playerLink	= data['data']['player']['default'];
		var headline	= data['data']['title'];

		if (headline.length > 40) {
			headlineShort = headline.substr(0, 40) + '...';
		}
		else
		{
			headlineShort = headline;
		}

		var template	= this.sYTPlayerTpl;
		template = template.replace(/#headline#/gi,			headline);
		template = template.replace(/#headlineShort#/gi,	headlineShort);
		template = template.replace(/#id#/i,				id);
		template = template.replace(/#playerLink#/i,		playerLink);

		var targetElement = jQuery(this.targetContainerIframe+' #ytc-video-'+id);
		if (targetElement.length == 0)
		{
			targetElement = jQuery(this.targetContainerIframe);
		}

		jQuery(targetElement).html(template);
		//jQuery(targetElement).css('display', 'none');
		jQuery(targetElement).removeClass('empty');
		/*jQuery('iframe', targetElement).ready(function (){
			setTimeout("youtubeInjector.displayIframe();", 1200);
		})*/
	},
	
	displayIframe: function(element) {
		jQuery('.videoBox').css('display', 'block');
	},
	
	transformSeconds: function(secs) {
		var t = new Date(1970,0,1);
		t.setSeconds(secs);
		var s = t.toTimeString().substr(0,8);
		if(secs > 86399) s = Math.floor((t - Date.parse("1/1/70")) / 3600000) + s.substr(2);
		return s;
	},

	transformTime: function(tstamp) {
		var tsNow			= new Date().getTime()
		tsNow = Math.floor(tsNow / 1000);

		var tsUploaded		= this.getDateFromTimestamp(tstamp);
		tsUploaded = Math.floor(tsUploaded / 1000);

		var timeElapsed		= tsNow - tsUploaded;

		if (timeElapsed < 60)
		{
			return this.getLocalizedCaption('seconds', timeElapsed);
		}

		intMinutes = Math.floor(timeElapsed / 60 );
		if (intMinutes < 60)
		{
			return this.getLocalizedCaption('minutes', intMinutes);
		}

		intHours = Math.floor(timeElapsed / 3600 );
		if (intHours < 24)
		{
			return this.getLocalizedCaption('hours', intHours);
		}

		intDays = Math.floor(timeElapsed / 86400 );
		if (intDays < 7)
		{
			return this.getLocalizedCaption('days', intDays);
		}

		intWeeks = Math.floor(timeElapsed / 604800 );
		if (intWeeks < 4)
		{
			return this.getLocalizedCaption('weeks', intWeeks);
		}

		intMonth = Math.floor(timeElapsed / 2419200 );
		if (intMonth < 12)
		{
			return this.getLocalizedCaption('months', intMonth);
		}

		intYear = Math.floor(timeElapsed / 29030400 );
		return this.getLocalizedCaption('years', intYear);
	},

	getLocalizedCaption: function(strFormat, intTimeFraction)
	{
		if (intTimeFraction == 1)
		{
			return this.timeTable[strFormat][0].replace(/%s/gi, intTimeFraction);
		}
		else
		{
			return this.timeTable[strFormat][1].replace(/%s/gi, intTimeFraction);
		}
	},

	getDateFromTimestamp: function(tstamp)
	{
		var day		= tstamp.substr(8,2);
		var month	= tstamp.substr(5,2);
		// Der Monat ist 0-basiert in JS
		month = month-1;
		if (month < 0) month = 0;
		var year	= tstamp.substr(0,4);

		var hours	= tstamp.substr(11,2);
		var minutes	= tstamp.substr(14,2);
		var seconds	= tstamp.substr(17,2);

		return new Date(year, month, day, hours, minutes, seconds, 0);
	}

}


function initPage() {
	UIOptimisations.init();
	SearchHintInjection.init();
}