title: JS wait/pause in generated functions
body: <h1>What I am doing</h1>
  
  <p>I am in the middle of building a turtle graphics app using Blockly. The user can build a code from blocks, then the Blockly engine generates JS code, which draws to a canvas.</p>
  
  <h1>What my problem is</h1>
  
  <p>The Blockly engine generates the JS code, but returns it as a string, which I have to <code>eval()</code> to draw to the canvas. </p>
  
  <p>I can change the code of the blocks to generate different output, but it's important to keep it as simple as possible, because the users can read the actual code behind the block input. So I would like not to mess it up.</p>
  
  <h1>What I would like to do</h1>
  
  <p>I have full control over the atomic operations (<code>go</code>, <code>turn</code>, etc.), so I would like to insert a small piece of code to the beginning of the functions, which delays the execution of the rest of the bodies of the functions. Something like:</p>
  
  <pre><code>function go(dir, dist) {
    // wait here a little
  
    // do the drawing
  }
  </code></pre>
  
  <p>I think it should be something synchronous, which keeps the delay in the flow of the execution. I've tried to use <code>setTimeout</code> (async, fail), a <code>promise</code> (fail), timestamp checks in a loop (fail).</p>
  
  <p>Is it even possible in JS?</p>