Flappy Ball

Create a game where flappy is the ball and the bats are the paddles. Part of the game has been created for you. You need to finish the game. We will be updating the Loop() function.

1. Draw the player's bat

    
          //draw top bat image (top)
          ctx.drawImage(imgBat,playerX,0);

2. Move the top bat with the mouse

    
          //move the player's bat with the move
          playerX = mouseX;

3. Draw the computers's bat

    
         //draw computer's bat image (bottom)
          ctx.drawImage(imgBat,computerX,500);

4. Move the computer's bat. The computer will be chasing the ball, but be slow. We need it to move it's X in the direction of the ball.

    
         //move the computer toward the ball
         if(x < computerX + 100){
            computerX = computerX - 2;
         }else{
            computerX = computerX + 2;
         }

5. Update the score if the ball hit the bottom wall

    
         //bounce off buttom wall
         if(y > 550)
         {
           yVol = yVol *-1;
           score = score +1;
         }

6. Add Sound when the the ball hits the left and right wall. Add "playBounce();"

           //bounce off left wall
           if(x < 0)
           {
             xVol = xVol *-1;
             playBounce();
           }

7. Add Sound when the the ball hits the buttom wall. Add "playApplause();"
8. Add Sound when the the ball hits the top wall. Add "playLose();"
9. Add Sound when the the ball hits the bats. Add "playHitSound();"