The Essential Guide to HTML5

(Greg DeLong) #1

THE MEMORY (AKA CONCENTRATION) GAME


ctx.fillRect(deck[secondcard].sx,deck[secondcard].sy,deck[secon
dcard].swidth,deck[secondcard].sheight);


Draw over the card

ctx.fillRect(deck[firstcard].sx,deck[firstcard].sy,deck[firstca
rd].swidth,deck[firstcard].sheight);


Draw over the card

deck[secondcard].sx = -1; Set this so the card
won't be checked


deck[firstcard].sx = -1; Set this so tso card
won't be checked


} Close if theres no
match


} Close the function


function init(){ Function header init


ctx = document.getElementById('canvas').getContext('2d'); Set ctx to do all the
drawing


canvas1 = document.getElementById('canvas'); Set canvas1 for event
handling


canvas1.addEventListener('click',choose,false); Set up event handling


makedeck(); Create the deck


document.f.count.value = "0"; Initialize visible count


document.f.elapsed.value = ""; Clear any old value


starttime = new Date(); First step to setting
starting time


starttime = Number(starttime.getTime()); Reuse the variable to
set the milliseconds
from benchmark


shuffle(); Shuffle the card info
values

Free download pdf