The Memory (aka Concentration) Game - The Essential Guide to HTML5 - page 160

} Close for loop

}

Close function

function Polycard(sx,sy,rad,n) { Function header for

Polycard

this.sx = sx; Set up the x

coordinate

this.sy = sy;

… the y

this.rad = rad;

…the polygon radius

this.draw = drawpoly; …how to draw

this.n = n;

…number of sides

this.angle = (2*Math.PI)/n Compute and store

the angle

} Close the function

function drawpoly() {

Function header

ctx.fillStyle= frontbgcolor; Set the front

background

ctx.fillRect(this.sx-2*this.rad,this.sy-
2*this.rad,4*this.rad,4*this.rad);

The corner of the
rectangle is up and to
the left of the center
of the polygon

ctx.beginPath(); Start the path

ctx.fillStyle=polycolor;

Change to color for
polygon

var i;

Index variable

var rad = this.rad; Extract the radius

ctx.moveTo(this.sx+rad*Math.cos(-
.5*this.angle),this.sy+rad*Math.sin(-.5*this.angle));

Move up to the first
point