The problem is that this
isn't what you think it is in your click handler, which means that this.context
is undefined
and undefined
doesn't have a drawImage()
method. Try using the .bind()
method:
this.canvas.addEventListener("mousedown", this.onClick.bind(this), false);
...to force this
to the value you need. Or you can do something like this:
function GAMEAREA(canvasElement, bgElement)
{
var self = this;
...
this.onClick = function(e)
{
self.context.drawImage(self.pawnImg, 0, 0);
};
...
}
The value of this
within a function depends on how that function is called. More information about how this
is set is available at MDN.