var $j = jQuery.noConflict();

var initCategories = function(elem) {
	var $ = jQuery;
	
	var desc = $('#Content').html();
	var img = $('#Categories li.current img');
	var imgsrc = img.length > 0 ? img.attr('src') : '';
	var picto = $('<img src="" />');
	if(imgsrc == ''){
		picto.css('display', 'none');
	} else {
		picto.attr('src', imgsrc);
	}
	$('#Categories').after($('<div id="Pictogram"/>').append(picto));
	var title = $('#Title').html();
	$('#Title').hide();
	var timeout = -1;
	$('li', elem).each(function(i,e){
		$(e).hover(
			function() {
				if(timeout != -1)
					clearTimeout(timeout);
					
				var img = $(this).find('img').attr('src');
				timeout = setTimeout(function(){
					picto.attr('src', img);
					picto.css('display', 'block');
				}, 200);
				//$('#Content').html($(this).find('.Description').html());
				
				
				//$('#Title').html($(this).find('a').attr('title'));
			},
			
			function() {
				//$('#Content').html(desc);
				if(timeout != -1)
					clearTimeout(timeout);
					
				if(imgsrc == ''){
					timeout = setTimeout(function(){
						picto.css('display', 'none');
					}, 200);
				} else {
					timeout = setTimeout(function(){
						picto.attr('src', imgsrc);
					}, 200);
					
				}
				//$('#Title').html(title);
			}
		);
	});
};

var initLists = function() {
	var $ = jQuery;
	
	var desc = $('#Content').html();
	var title = $('#Title').html();
	var timeout = -1;
	$('#Lists li').each(function(i,e){
		$(e).hover(
			function() {
				if(timeout != -1)
					clearTimeout(timeout);
					
				var t = $(this).find('a').attr('title');
				timeout = setTimeout(function(){
					$('#Content').html('');
					$('#Title').html(t);
				}, 200);
				
			},
			
			function() {
				if(timeout != -1)
					clearTimeout(timeout);
					
				timeout = setTimeout(function(){
					$('#Content').html(desc);
					$('#Title').html(title);
				}, 200);
				
			}
		);
	});
};

var initAreas = function() {
	var $ = jQuery;
	var desc = $('#Content').html();
	var title = $('#Title').html();
	var base = 0;
	if($('#AreaMap .current').length > 0)
		base = parseInt($('#AreaMap .current').attr('id').substr(5));
	
	var olay = $('<div id="map-overlay"/>');
	olay.css('background-position', '0px ' + (base * -225) + 'px');
	$('#MapImage').prepend(olay);
	$('#MapImage').css('background', 'url("nichtneu/images/kreise_base.png") no-repeat top left');
	$('#MapImage img').attr('src', 'nichtneu/images/kreise_empty.png');
	
	var timeout = -1;
	$('#AreaMap area').each(function(i,e){
		$(e).hover(
			function() {
				if(timeout != -1)
					clearTimeout(timeout);
					
				var id = $(this).attr('id');
				timeout = setTimeout(function(){
					$('#Content').html($('#desc-' + id).html());
					$('#Title').html($('#title-' + id).html());
					var pos = parseInt( $(this).attr('id').substr(5) );
					olay.css('background-position', '0px ' + (pos * -225) + 'px');
				}, 200);
				
			},
			
			function() {
				if(timeout != -1)
					clearTimeout(timeout);
					
				timeout = setTimeout(function(){
					$('#Content').html(desc);
					$('#Title').html(title);
					olay.css('background-position', '0px ' + (base * -225) + 'px');
				}, 200);
				
			}
		);
	});
};

$j(window).load(function(e){
	$j('.typography').defuscate();
});