Time for action – saving the time alongside the score
Carry out the following steps:
- First, open the
index.html
file from our CSS3 card matching game. - Replace the HTML markup with the last score, with the following HTML (it shows both scores and the date time in the game over popup):
<p> <small>Last Score: <span class='last-score'>0</span><br> Saved on: <span class='saved-time'></span> </small> </p>
- The HTML markup is now ready. We will move on to the game logic. Open the
html5games.matchgame.js
file in a text editor. - We will modify the
gameover
function. Add the following highlighted code to thegameover
function. It gets the current date and time when the game ends and packs a formatted date and time with elapsed time together in the local storage: ...
Get HTML5 Game Development by Example : Beginner's Guide - Second Edition now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.