$(document).ready(function(){
	
	$('#projector').animate({backgroundPosition: '(-500000px top)'}, 20000000, 'linear');
	
	b1_top = $("#b1").position().top;
	b1_left = $("#b1").position().left;
	
	b2_top = $("#b2").position().top;
	b2_left = $("#b2").position().left;
	
	b3_top = $("#b3").position().top;
	b3_left = $("#b3").position().left;
	
	b4_top = $("#b4").position().top;
	b4_left = $("#b4").position().left;
	
	b5_top = $("#b5").position().top;
	b5_left = $("#b5").position().left;
	
	$(window).resize(function() {
		if($("body").hasClass("small")) {
			b1_top = 45;
			b1_left = -80;
			
			b2_top = 100;
			b2_left = 200;
			
			b3_top = -25;
			b3_left = 345;
			
			b4_top = 80;
			b4_left = 480;
			
			b5_top = 35;
			b5_left = 730;
		} else {
			b1_top = 25;
			b1_left = -115;
			
			b2_top = 100;
			b2_left = 200;
			
			b3_top = -45;
			b3_left = 345;
			
			b4_top = 80;
			b4_left = 520;
			
			b5_top = 15;
			b5_left = 805;
		}
		
		$("#b1").css("top", b1_top);
		$("#b1").css("left", b1_left);
		$("#b2").css("top", b2_top);
		$("#b2").css("left", b2_left);
		$("#b3").css("top", b3_top);
		$("#b3").css("left", b3_left);
		$("#b4").css("top", b4_top);
		$("#b4").css("left", b4_left);
		$("#b5").css("top", b5_top);
		$("#b5").css("left", b5_left);
	});
			
	function animate() {
		$("#b1").animate({
		    top: b1_top-2,
		    left: b1_left+10
		 }, 400, function() {
			$("#b1").animate({
			   top: b1_top,
			   left: b1_left
			}, 400);
		 });
		 
		 $("#b2").animate({
		     top: b2_top+2,
		     left: b2_left-10
		  }, 400, function() {
		 	$("#b2").animate({
		 	   top: b2_top,
		 	   left: b2_left
		 	}, 400);
		  });
		  
		  $("#b3").animate({
		      top: b3_top-2,
		      left: b3_left+10
		   }, 400, function() {
		  	$("#b3").animate({
		  	   top: b3_top,
		  	   left: b3_left
		  	}, 400);
		   });
		   
		   $("#b4").animate({
		       top: b4_top-2,
		       left: b4_left+10
		    }, 400, function() {
		   	$("#b4").animate({
		   	   top: b4_top,
		   	   left: b4_left
		   	}, 400);
		    });
		    
		    $("#b5").animate({
		        top: b5_top+2,
		        left: b5_left-10
		     }, 400, function() {
		    	$("#b5").animate({
		    	   top: b5_top,
		    	   left: b5_left
		    	}, 400);
		     });
	}

	var timerId;
	
	$("#projector").hover(
	    function() {
	    	animate();
	        timerId = setInterval(function() {
	        	animate();
	        }, 800);
	    },
	    function() { clearInterval(timerId); }
	);
	
});
