navi = 
{
	bindEventHandler: function()
		{
			$('a#toggleByThema').click(function()
				{
					navi.displayByThema();
				});
			
			$('a#toggleByYear').click(function()
				{
					navi.displayByYear();
				});
		},
	
	displayByThema: function()
		{
			$('div#byThema').css('display', 'block');
			$('div#byYear').css('display', 'none');
			$('a#toggleByYear').css('display', 'block');
			$('a#toggleByThema').css('display', 'none');
		},
	
	displayByYear: function()
		{
			$('div#byThema').css('display', 'none');
			$('div#byYear').css('display', 'block');
			$('a#toggleByYear').css('display', 'none');
			$('a#toggleByThema').css('display', 'block');
		}
}


$(function()
	{
		navi.bindEventHandler();
	});




/* navigation and start-up
-------------------------------------------------------------------*/
$(function()
	{
		// all left
		$('div#navi div.a a').click(function()
			{
				var that = this;
				
				// make all active inactive again 
				$('div#navi div.a img.active').each(function()
					{
						var imageSrc = $(this).attr('src')
						if ($(that).find('img').attr('src') != imageSrc) // prevent toggle off with second click
							{
								var activeImageSrc = imageSrc.replace('-active', '-inactive');
								$(this).attr('src', activeImageSrc).removeClass('active').addClass('inactive');
							}
					});
					
					
				// make it active
				if ($(this).find('img').hasClass('inactive'))
					{
						var imageSrc = $(this).find('img').attr('src')
						var activeImageSrc = imageSrc.replace('over', 'active');
						$(this).find('img').attr('src', activeImageSrc).removeClass('inactive').addClass('active');
						console.log('click');
					}
			})
			
		.hover(
			function()
				{
					var imageSrc = $(this).find('img').attr('src')
					var activeImageSrc = imageSrc.replace('inactive', 'over');
					$(this).find('img').attr('src', activeImageSrc);
				},
			function()
				{
					var imageSrc = $(this).find('img').attr('src')
					var activeImageSrc = imageSrc.replace('over', 'inactive');
					$(this).find('img').attr('src', activeImageSrc);
				});
				
		// two toggle-links right
		$('a.toggle')
		.hover(
			function()
				{
					var imageSrc = $(this).find('img').attr('src')
					var activeImageSrc = imageSrc.replace('inactive', 'over');
					$(this).find('img').attr('src', activeImageSrc);
				},
			function()
				{
					var imageSrc = $(this).find('img').attr('src')
					var activeImageSrc = imageSrc.replace('over', 'inactive');
					$(this).find('img').attr('src', activeImageSrc);
				});
				
	});