You need to do it like this to make the method call properly:
LoCEngine.prototype.runGame = function() {
// Initiate our game loop
ctx.clearRect(0, 0, 800, 600);
this.drawScene(this.curScene);
if(this.gameRunning) {
window.setTimeout(function() {
Engine.runGame()
}, 1000 / this.framerate);
}
}
When you pass Engine.runGame
to setTimeout()
, it just passes the method reference itself and the object part of is lost. Thus, when it's called by the internals of setTimeout()
, it no longer has the proper object reference in this
and it generates the error you see when the code tries to call another method based on this
. The work-around is to call it yourself with an anonymous function as I've shown.
It's also possible to use .bind()
which essentially does the same thing for you internally. But, .bind()
isn't supported in older browsers so I tend to just use the anonymous function.