Rock, Paper, Scissors - The Essential Guide to HTML5 - page 278

Code Explanation

[-1,0,1],

The set of increments when the computer
throws paper

[1,-1,0]];

The set of increments when the computer
throws scissors

function Throw(sx,sy, smargin,swidth,
sheight,rectcolor,picture) {

Header for constructor function to be used for
the 3 game symbols. Parameters include x
and y coordinates, margin, inner width and
height, color for the rectangle, and the picture
file

Assign the sx attribute

this.sx = sx;

this.sy = sy; … sy attribute

this.swidth = swidth; … swidth attribute

this.bwidth = swidth + 2*smargin;

Calculate and assign the outer width. This is
the inner width plus 2 times the margin.

this.bheight = sheight + 2*smargin; Calculate and assign the outer height. This is

the inner height plus 2 times the margin.

this.sheight = sheight;

Assign sheight attribute

this.fillstyle = rectcolor; Assign fillstyle attribute

this.draw = drawThrow; Assign the draw method to be drawThrow

Create a new Image object

this.img = new Image();

this.img.src = picture; Set its src to be the picture file

this.smargin = smargin; Assign the smargin attribute. It is still needed

for drawing.

}

Close function

function drawThrow() { Header for function to draw the symbols

ctx.strokeStyle = "rgb(0,0,0)";

Set the style for the rectangle outline to
black.