$(document).ready(function(){
	// Element to be rotated
	var element = $('#rotating_list a');
	var offset = 0; 
	var stepping = 0.03;
	// Jquery pointer - point to an element with 'rotating_list' id
	var list = $('#rotating_list');
	var $list = $(list)
	var mouseActivate = false;
	var stopAnimationDelay=0;
	var wheelBox;
	var wheelZpoint=30;
	var stopBuffer = 100;
	// Trigger an event when the mouse moves in side thr $list element
	
	$list.mousemove(function(e){
		mouseActivate=true;
		var topOfList = $list.eq(0).offset().top  // Get the top coordinate of the first element.
		var listHeight = $list.height()  // Get the height of the list
		stepping = (e.pageY- topOfList) /  listHeight * 0.2 - 0.1;
		wheelBoxTotal = $list.width() / 100;
		wheelBox = e.pageX - $list.offset().left;
		wheelZpoint = Math.ceil(wheelBox / wheelBoxTotal);
		//$('#console_wheel').html('<p>'+(wheelZpoint)+'</p>');
	});
	$list.mouseout(function(){
		mouseActivate=false;	
	});

	for (var i = element.length - 1; i >= 0; i--)
	{
		element[i].elemAngle = i * Math.PI * 2 / element.length;
		/*var col1 = getColor(Math.floor(Math.random()*15));
		var col2 = getColor(Math.floor(Math.random()*15));
		var col3 = getColor(Math.floor(Math.random()*15));
		$(element[i]).css("color","#"+col1+col2+col3);*/
	}
	
	
	setInterval(render, 30);
	
	var devider=1;
	function render(){
		for (var i = element.length - 1; i >= 0; i--){
			var angle = element[i].elemAngle + offset;
			x = 100 + Math.sin(angle) * ((-50) + wheelZpoint);
			y = 45 + Math.cos(angle) * 40;
			size = Math.round(15 - Math.sin(angle) * 5);
			
			var elementCenter = ($(element[i]).width() / 2);
	
			var leftValue = (($list.width()/2) * x / 100 - elementCenter) + "px"
			
			$(element[i]).css("fontSize", size + "pt");
			$(element[i]).css("opacity",(size/30));
			$(element[i]).css("color","#5784a5");
			$(element[i]).css("zIndex" ,size);
			$(element[i]).css("left" ,leftValue);
			$(element[i]).css("top", y + "%");
			op = size /30;
			
		}
		
		if(mouseActivate){
			offset += stepping;
			$('#console_wheel').html('<p>'+(stepping)+'</p>')
			stopBuffer=200;
			devider=1;
		} else {
			if(stopBuffer >0) {
				offset += stepping/devider;
				devider+=0.1;
				stopBuffer--;
			}
		}
		
	}
	function getColor(color) {
			switch(color) {
				case 0:
					return "0";
					break;
				case 1:
					return "1";
					break;
				case 2:
					return "2";
					break;
				case 3:
					return "3";
					break;
				case 4:
					return "4";
					break;
				case 5:
					return "5";
					break;
				case 6:
					return "6";
					break;
				case 7:
					return "7";
					break;
				case 8:
					return "8";
					break;
				case 9:
					return "a";
					break;
				case 10:
					return "b";
					break;
				case 11:
					return "c";
					break;
				case 12:
					return "d";
					break;
				case 13:
					return "e";
					break;
				case 14:
					return "f";
					break;
				default:
					return "0";
					break;	
			}
		}
	
});