HTML and CSS Reference
In-Depth Information
Table 5
-
3
.
Functions in the Photo Version of the Memory Game
Function
Invoked By/Called By
Calls
init
makedeck
shuffle
Invoked in response to the
onLoad
in the body tag
choose
Invoked in response to the
addEventListener
in
init
flipback
Invoked in response to the
setTimeout
call in
choose
drawback
Invoked as the
draw
method for a
card in
makedeck
and
flipback
shuffle
Called in
init
Called in
init
makedeck
Card
Called by
makedeck
The code for the photos version of the memory game is similar to that for the polygon version. Most of the
logic is the same. But because this example demonstrates the writing of text on the canvas, the HTML
document doesnt have a
form
element. The code follows in Table 5-4, with comments on the lines that
are different. I also indicate where you would put in the names of the image files for your photographs.
Before looking at this second version of the memory game, think about which parts are likely to be the
same and which may be different.
Table 5
-
4
.
Complete Code for the Photo Version of the Memory Game
<html>
<head>
<title>Memory game using pictures</title>
Complete title
element
<script type="text/javascript">
var ctx;
var firstpick = true;
