HTML5 Game Development by Example(Second Edition)

Time for action – indicating a game over event in the console

Carry out the following steps:

1. Open the audiogame.js JavaScript file.
2. Add the following code in the jQuery ready function:

   $(audiogame.melody).bind('ended', onMelodyEnded);

3. Add the following event handler function at the end of the file:

     // show game over scene on melody ended.
     function onMelodyEnded() {
       console.log('song ended');
       alert ('success percent: ' + audiogame.totalSuccessCount / audiogame.totalDotsCount * 100 + '%');
     }
   })(jQuery);

4. It is time to save all files and play the game in a web browser. When the game is over, we should see a pop-up alert with the successful rate.

What just happened?

We just listened to the ended event of the audio element and handled it with a handler function. ...