(function($){
	jQuery.containers = {
		last: null,
		map: {
			"c1": [null,null,null,"c2","c5","c4",null,null],
			"c2": [null,null,null,"c3","c6","c5","c4","c1"],
			"c3": [null,null,null,null,null,"c6","c5","c2"],
			"c4": [null,"c1","c2","c5",null,null,null,null],
			"c5": ["c1","c2","c3","c6",null,null,null,"c4"],
			"c6": ["c2","c3",null,null,null,null,null,"c5"]
		},
		refresh: function(o) {

			var self = this;
			
			//Prepare right size for content containers
			var wsize = [1280,1024];
			var wsizeReal = [$(window).width(),$(window).height()];
			
			//Resize elements with constant ratio
			jQuery(o.items).each(function() {
				jQuery(this).css("width", wsize[0]-300);
				jQuery(this).css("height", (wsize[0]-300)*0.5625);	
			});
			
			//Resize wrapper for proper floating
			jQuery(this).css("width", (wsize[0]-300)*5 + parseInt(jQuery(o.items).css("margin-top"))*10);
			
			//Properly center the dir buttons
			jQuery("#g-t").css("left", wsizeReal[0]/2-10);
			jQuery("#g-b").css("left", wsizeReal[0]/2-10);
			jQuery("#g-l").css("top", wsizeReal[1]/2-10);
			jQuery("#g-r").css("top", wsizeReal[1]/2-10);
			
			//Goto last container
			var el = jQuery(jQuery.containers.last || o.startsWith)[0];
			var co = jQuery(el).offset({ border: false, scroll: false });
			co.left = co.left - parseInt(jQuery(self).css("left"));
			co.top = co.top - parseInt(jQuery(self).css("top"));
			
			var offsetX = ((jQuery(window).width() - el.offsetWidth) / 2);
			var offsetY = ((jQuery(window).height() - el.offsetHeight) / 2);
			
			jQuery("#wrapper").css({ left : -co.left+offsetX, top: -co.top+offsetY });
						
		},
		init: function(o) {
	
			var self = this;
			
			//Prepare right size for content containers
			var wsize = [1280,1024];
			var wsizeReal = [$(window).width(),$(window).height()];
			
			//Resize elements with constant ratio
			jQuery(o.items).each(function() {
				jQuery(this).css("width", wsize[0]-300);
				jQuery(this).css("height", (wsize[0]-300)*0.5625);	
			});
			
			//Resize wrapper for proper floating
			jQuery(this).css("width", (wsize[0]-300)*5 + parseInt(jQuery(o.items).css("margin-top"))*10);
			
			//Properly center the dir buttons
			jQuery("#g-t").css("left", wsizeReal[0]/2-10);
			jQuery("#g-b").css("left", wsizeReal[0]/2-10);
			jQuery("#g-l").css("top", wsizeReal[1]/2-10);
			jQuery("#g-r").css("top", wsizeReal[1]/2-10);
			
			//Make goto pointers clickables
			jQuery("#g-tl").bind("click", function() { jQuery.containers.goto(self,jQuery("#"+jQuery.containers.map[jQuery.containers.last.id][0])); });
			jQuery("#g-t").bind("click", function() { jQuery.containers.goto(self,jQuery("#"+jQuery.containers.map[jQuery.containers.last.id][1])); });
			jQuery("#g-tr").bind("click", function() { jQuery.containers.goto(self,jQuery("#"+jQuery.containers.map[jQuery.containers.last.id][2])); });
			jQuery("#g-r").bind("click", function() { jQuery.containers.goto(self,jQuery("#"+jQuery.containers.map[jQuery.containers.last.id][3])); });
			jQuery("#g-br").bind("click", function() { jQuery.containers.goto(self,jQuery("#"+jQuery.containers.map[jQuery.containers.last.id][4])); });
			jQuery("#g-b").bind("click", function() { jQuery.containers.goto(self,jQuery("#"+jQuery.containers.map[jQuery.containers.last.id][5])); });
			jQuery("#g-bl").bind("click", function() { jQuery.containers.goto(self,jQuery("#"+jQuery.containers.map[jQuery.containers.last.id][6])); });
			jQuery("#g-l").bind("click", function() { jQuery.containers.goto(self,jQuery("#"+jQuery.containers.map[jQuery.containers.last.id][7])); });
			
			//Make goto pointer hovers
			function ht(el,l,t,i) {
				var co = jQuery(el).offset({ border: false });
				jQuery("<div id='p-helper' style='position: absolute; z-index: 10; color: #fff;'>"+jQuery("#"+jQuery.containers.map[jQuery.containers.last.id][i]).attr("ctitle")+"</div>").css({ left: co.left+l, top: co.top+t }).appendTo("body");					
			}
			
			jQuery("#g-tl").hover(function() { ht(this,20,20,0);	}, function() { jQuery("#p-helper").remove(); });
			jQuery("#g-t").hover(function() { ht(this,0,30,1);	}, function() { jQuery("#p-helper").remove(); });
			jQuery("#g-tr").hover(function() { ht(this,-20,20,2);	}, function() { jQuery("#p-helper").remove(); });
			jQuery("#g-r").hover(function() { ht(this,-50,15,3);	}, function() { jQuery("#p-helper").remove(); });
			jQuery("#g-br").hover(function() { ht(this,-50,-10,4);	}, function() { jQuery("#p-helper").remove(); });
			jQuery("#g-b").hover(function() { ht(this,0,-30,5);	}, function() { jQuery("#p-helper").remove(); });
			jQuery("#g-bl").hover(function() { ht(this,20,-10,6);	}, function() { jQuery("#p-helper").remove(); });
			jQuery("#g-l").hover(function() { ht(this,40,15,7);	}, function() { jQuery("#p-helper").remove(); });
			
			//Bind resize listener
			jQuery(window).bind("resize", function(e) {
				jQuery.containers.refresh.apply(self, [o]);
			});
			
			//Goto main page
			if(o.startWith) jQuery.containers.goto(self,jQuery(o.startWith));
			
		},
		goto: function(wrapper,el,force) {
			
			if(!el || !el.length || jQuery(el)[0] == jQuery.containers.last) return;
			
			if(jQuery.containers.last) jQuery(jQuery.containers.last).animate({ opacity: 0.3 },500);
		
			var el = jQuery(el)[0];
			var co = jQuery(el).offset({ border: false, scroll: false });
			co.left = co.left - parseInt(jQuery(wrapper).css("left"));
			co.top = co.top - parseInt(jQuery(wrapper).css("top"));
			
			var offsetX = ((jQuery(window).width() - el.offsetWidth) / 2);
			var offsetY = ((jQuery(window).height() - el.offsetHeight) / 2);
			
			jQuery("#wrapper").animate({ left : -co.left+offsetX, top: -co.top+offsetY }, 1000);
			jQuery(el).animate({ opacity: 1 },500);
			jQuery.containers.last = el;
			
			//Hide arrows that have nowhere to go
			if(!jQuery.containers.map[el.id][0]) jQuery("#g-tl").fadeOut(); else if(!jQuery("#g-tl").is(":visible")) jQuery("#g-tl").fadeIn();
			if(!jQuery.containers.map[el.id][1]) jQuery("#g-t").fadeOut(); else if(!jQuery("#g-t").is(":visible")) jQuery("#g-t").fadeIn();
			if(!jQuery.containers.map[el.id][2]) jQuery("#g-tr").fadeOut(); else if(!jQuery("#g-tr").is(":visible")) jQuery("#g-tr").fadeIn();
			if(!jQuery.containers.map[el.id][3]) jQuery("#g-r").fadeOut(); else if(!jQuery("#g-r").is(":visible")) jQuery("#g-r").fadeIn();
			if(!jQuery.containers.map[el.id][4]) jQuery("#g-br").fadeOut(); else if(!jQuery("#g-br").is(":visible")) jQuery("#g-br").fadeIn();
			if(!jQuery.containers.map[el.id][5]) jQuery("#g-b").fadeOut(); else if(!jQuery("#g-b").is(":visible")) jQuery("#g-b").fadeIn();
			if(!jQuery.containers.map[el.id][6]) jQuery("#g-bl").fadeOut(); else if(!jQuery("#g-bl").is(":visible")) jQuery("#g-bl").fadeIn();
			if(!jQuery.containers.map[el.id][7]) jQuery("#g-l").fadeOut(); else if(!jQuery("#g-l").is(":visible")) jQuery("#g-l").fadeIn();
			
		}
		
	}
	
	jQuery.fn.comic = jQuery.containers.init;	
	
})(jQuery)


jQuery(document).ready(function() {
	
	//Initialize fisheye menue
	jQuery('#dock').Fisheye({
		maxWidth: 50,
		items: 'a',
		itemsText: 'span',
		container: '.dock-container',
		itemWidth: 40,
		proximity: 80,
		alignment : 'left',
		valign: 'bottom',
		halign : 'center'
	});
	
	jQuery("#wrapper").comic({
		items: "div.comic_content",
		startWith: "#c1"
	});
	
	//goto-link
	var sTmpUrl = document.URL;
	var iSearch = sTmpUrl.search(/gewinnspiel/);
	if(iSearch != -1) {
		jQuery.containers.goto(jQuery('#wrapper')[0],'#c3');
	}
	
	
});
