title: animating a player bullet when hitting the space bar inside html5 canvas
body: <p>what i am trying to do basically is drawing and animating a bullet when the player hit the space bar .my problem  the bullet is animating correctly but when you hold the space bar an infinite line of bullets is drawn  this is a jsfiddle that can explain what i mean : <a href="http://jsfiddle.net/seekpunk/B2nUs/26/" rel="nofollow">http://jsfiddle.net/seekpunk/B2nUs/26/</a></p>
  
  <p>the code : </p>
  
  <pre><code>   var Missiles = {
              collection: [],
  
              draw: function () {
                  for (i = 0; i &lt; this.collection.length; i++) {
                      this.collection[i].draw();
                      // Missiles.collection.length = 0;
                  }
              },
              update: function () {
                  if (Missiles.collection.length &gt; 0) {
                      for (i = 0; i &lt; Missiles.collection.length; i++) {
  
                          Missiles.collection[i].update();
                          // Missiles.collection.length = 0;
                      }
                  }
  
              }
  
          };
          var playerMissile = function (M) {
              Mx = this.x;
              My = this.y;
              MR = this.radius;
              Msp = 3;
              MDir = this.rot;
              M.draw = function () {
                  ctx.fillStyle = "Green";
                  ctx.beginPath();
                  ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, true);
                  ctx.closePath();
                  ctx.fill();
                  //this.h*2 specify that the image is in the row 2 of the tiled image
              };
              M.update = function () {
  
                  switch (this.rot) {
                      case 0: this.y -= 3; break;
                      case 90: this.x += 3; break;
                      case -90: this.x -= 3; break;
                      case 180: this.y += 3; break;
                  }
  
  
              };
              return M;
          };
  </code></pre>
  
  <p>how can i make one bullet to be draw on each space bar hit even if the user hold down the space bar so i prevent this line of continuous bullets </p>