javascript实现桌球小游戏的一点问题,求大神啊

我想实现的是那个球杆能再球的周围随着鼠标的移动绕着白球旋转. 
但是运行出来就不对了.麻烦高人指导指导
index.htm文件
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="js/gameDraw.js"></script>
<script>
function run(){
 var gd=new gameDraw("myCanvas");
 $("canvas#myCanvas").mousemove(function(e){gd.mouseXY(e)});
 setInterval(gd.upDateCanvas(),1000/12);
};
onload=run;
</script> 
</head>
<body >
<canvas id="myCanvas" width="600" height="400">Your Broswer don't support html5!!!<canvas>
</body>
</html>
 
 
 
gameDraw.js文件
var canvasX,canvasY;
var ballX,ballY;
var rectLTopX,rectLTopY;
var myCanvas,ctx;
var mouseX,mouseY;
var imgCue,imgWhiteBall;
var degree;
 
 
function gameDraw(canvas){
myCanvas=document.getElementById(canvas);
ctx =myCanvas.getContext("2d");
//初始化白球的坐标
ballX=myCanvas.width/2;
ballY=myCanvas.height/2;
ctx.save();
};
 
 
gameDraw.prototype={ 
upDateCanvas : function(){
 this.drawBall();
 this.drawCue();
},
 
 
drawBall : function(){
 ctx.restore();
 imgWhiteBall=new Image();
 imgWhiteBall.src="image/ball.png";
 ctx.drawImage(imgWhiteBall,ballX,ballY);
},
drawCue : function(){
 ctx.restore();
 imgCue=new Image();
 imgCue.src="image/cue.png";
 ctx.translate(ballX,ballY);
 ctx.drawImage(imgCue,40,imgCue.height/2);
 degree=Math.atan2(ballY-mouseY,mouseX-ballX);//相对坐标
 if( (mouseX-ballX)>0 ){
  ctx.rotate(degree);
 }
 else if( (mouseX-ballX)<0 ){
  ctx.rotate(Math.PI+degree);
 }
 else if( (mouseX-ballX)=0 && (ballY-mouseY)>=0 ){
  ctx.rotate(Math.PI/2); 
 }
 else if( (mouseX-ballX)>=0 && (ballY-mouseY)<0 ){
  ctx.rotate(-Math.PI/2);
 }
},
 
 
mouseXY : function(e){
  mouseX=e.pageX;
  mouseY=e.pageY;
},
};