title: Raphael, constantly rotating path
body: <p>I have a path in Raphael, and I want it to constantly rotating by some point</p>
  
  <p>I have writen this :</p>
  
  <pre><code>window.onload = function(){
  
  var paper = Raphael(10, 150, 320, 200);
  var path = paper.path('M50 40 L50 90');
  var circle = paper.circle(50, 40, 10);
  circle.attr('fill', 'green');
  
  drawWheel(path, circle);
  }
  
  function drawWheel(path, circle){
  
  path.animate({rotation: '360 50 90'}, 10000);
  circle.animate({rotation: '360 50 90'}, 10000)
  timeout = setTimeout("drawWheel(path, circle);", 10000);
  
  }
  </code></pre>
  
  <p>So when the page is load I am creating raphael path and circle and than I am passing it to method drawWheel, which is animating those objects</p>
  
  <p>Than I want to call it again after 10 seconds, so that the user would see constantly rotating object,</p>
  
  <p>first all is going good till the calling setTimeout</p>
  
  <p>than I am getting an error in firebug "path is not defined"</p>
  
  <p>Am I calling the setTimeout wrong or what ? </p>
  
  <hr>
  
  <p>I have modified the script and I made path global variable so now the script (the simplest version) looks like this :</p>
  
  <pre><code>window.onload = function(){
  
      var paper = Raphael(10, 150, 320, 200);
      path = paper.path('M50 40 L50 90');
      drawWheel(path, circle);
  }
  
  function drawWheel(path){
  
      path.animate({rotation: '360 50 90'}, 10000);
      timeout = setTimeout("drawWheel(path);", 10000);
  }
  </code></pre>
  
  <p>So now there is now error in firebug at all, but the path is rotating 360 degrees and stops.</p>
  
  <p>Even the setTimeout is calling, but after one animation nothing more is happening</p>
  
  <p>Any ideas pleas ?</p>