$(document).ready(function() {
	$("p.meter[title]").tooltip( { position: "top center", offset: [-8, 0] } );
	$(".achievements li[title]").tooltip( { position: "top center", offset: [-8, -300], delay: 0 } );
	$(".items li[title]").tooltip( { position: "top center", offset: [-8, -300], delay: 0 } );

	$(".icon img").each(function()
	{
		$(this).mousemove(function(e)
		{
			var baseExp = 4; 	// 2 ^ 4 == 16
			
			// element proportions
			var w = this.offsetWidth;
			var h = this.offsetHeight;
			var hw = w/2;
			var hh = h/2;
			
			var offsets = $(this).offset(); // element position relative to page
			var pos = // mouse position relative to element
			{
				x : e.pageX - offsets.left,
				y : e.pageY - offsets.top
			};
			
			// mouse position offset from center of element
			var cx = pos.x - hw;
			var cy = pos.y - hh;
			
			// percentage from center to edge
			var px = Math.abs(cx/hw);
			var py = Math.abs(cy/hh);

			// new top/left positions
			var nx = Math.round(Math.pow(2, px * baseExp)) * (cx < 0 ? -1 : 1);
			var ny = Math.round(Math.pow(2, py * baseExp)) * (cy < 0 ? -1 : 1);
			
			$(this).css('left',	nx + 'px');
			$(this).css('top',	ny + 'px');
		});
		
		$(this).hover(function(e) // over
		{
		},
		function(e) // out
		{
			var pos = 
			{
				x: parseInt($(this).css('left')),
				y: parseInt($(this).css('top'))
			};

			$(this).animate
			({
				top 	: pos.y * -1,
				left 	: pos.x * -1
			}, 50, 'swing').animate
			({
				top 	: pos.y * .75,
				left 	: pos.x * .75
			}, 75, 'swing').animate
			({
				top 	: pos.y * -.5,
				left 	: pos.x * -.5
			}, 50, 'swing').animate
			({
				top 	: pos.y * .25,
				left 	: pos.x * .25
			}, 100, 'swing').animate
			({
				top 	: 0,
				left 	: 0
			}, 100, 'swing');
		});
	});
});