title: Javascript HTML5 Canvas Mario Bros NES clone, collisions and jumping broken
body: <p>I am hoping someone might be able to look at this javascript code I have been working on for a simple old-school Mario clone.
  I have pieced together what I know about canvas from several tutorials and I am not able to get the collisions with blocks or the jumping working correctly.</p>
  
  <p>the jumping seems to set Mario on an infinite loop of bouncing over and over, which looks funny but is not very conducive of playing a game!</p>
  
  <pre><code>       function Player() {
       this.srcX = 0;
       this.srcY = 0;
       this.drawX = gameWidth /2;
       this.drawY = 0;
       this.scaleWidth = 38;
       this.scaleHeight = 50;
       this.width = 48;
       this.height = 60;
       this.speed = 10;
       this.maxJump = 50;
       this.velY = 0;
       this.velX = 0;
       this.isJumpKey = false;
       this.isRightKey = false;
       this.isCrouchKey = false;
       this.isLeftKey = false;
       this.jumping = false;
       this.grounded = false;
      }
  
  
      Player.prototype.draw = function(){
        clearPlayer();
        this.checkKeys();
        ctxPlayer.drawImage(
          player,
          this.srcX,
          this.srcY,
          this.width,
          this.height,
          this.drawX,
          this.drawY,
          this.scaleWidth,
          this.scaleHeight);
      };
  Player.prototype.checkKeys = function () {
  
  
   if(this.isJumpKey){
  
      if (!this.jumping &amp;&amp; this.grounded ) {
          this.jumping = true;
          this.grounded = false;
          this.velY = -this.speed * 2;
      }
  
   }
  
   if(this.isRightKey){
  
     if (this.velX &lt; this.speed) {
              this.velX++;
          }
  
   }
    if(this.isLeftKey){
    if (this.velX &lt; this.speed) {
              this.velX--;
          }
   }
   if(this.isCrouchKey){
        player1.grounded = true;
        player1.jumping = false;
  }
  
  
  };
  </code></pre>
  
  <p>Here is a codepen with where I am at right now: <a href="http://codepen.io/AlexBezuska/pen/ysJcI" rel="nofollow">http://codepen.io/AlexBezuska/pen/ysJcI</a></p>
  
  <p>I really appreciate any help, I will continue to search and play around with this in the meantime, but any pointers you can give, even suggestions for formatting, prototype creation etc are really appreciated (I am quite new to both canvas and prototypes)</p>