title: JavaScript Canvas -- Is it possible to draw depending upon Math.random?
body: <p>I am creating a very basic sprite for a game (it is drawn in Canvas/Context/LineTo). I want its expression to change randomly based on two different draw methods. This is my attempt at this:</p>
  
  <pre><code>            drawFace = function () {
                  if (Math.random() &lt; 0.05) {
                      Player.drawhappyface(context);
                  }
                  else if (Math.random() &lt; 0.1) {
                      Player.drawsadface(context);
                  }
              }
  
              drawFace();
  </code></pre>
  
  <p>I can confirm that the drawhappyface and drawsadface draw methods work independent of this function (respectively drawing a smile and a frown). But using this function and its logic, they're simply never drawn (the player entirely lacks a face). So, have I written this wrong? I'm inspired by the following simulation which has constantly animating expressions also using Math.random: <a href="http://www.blobsallad.se/" rel="nofollow noreferrer">http://www.blobsallad.se/</a></p>
  
  <p>If I instead write the function like this, then absolutely nothing is drawn on the canvas (all other sprites, etc. also not drawn): </p>
  
  <pre><code>        drawFace = function (context) {
              if (Math.random() &lt; 0.05) {
                  Player.drawhappyface(context);
              }
              else if (Math.random() &lt; 0.1) {
                  Player.drawsadface(context);
              }
          }
  
          drawFace();
  </code></pre>