Send to Kindle

Friday, May 7, 2010

Stop the Canvas Walker with Comet

‹prev | My Chain | next›

I continue working on my <canvas> / fab.js "game" tonight. After some more refactoring and DRYing up of the code, I am ready to tackle a nagging bug.

The bug is best illustrated in video:

video

The view-only mode works fine as long as I don't change direction mid-walk. In that case, my character on the view-only screen goes a bit haywire. After a bit of noodling, I think that the cause of this problem is that new walk-to-coordinate does not cancel the previous walk-to-coordinate. Both combine to speed the character off-screen.

The reason this does not happen on the interactive screen is that the event notification method explicitly cancels the previous walk:
Player.prototype.notify = function(evt) {
switch(evt.type) {
case "click":
if (this.walker) clearTimeout(this.walker);
this.walk_to(evt.offsetX, evt.offsetY);
this.notify_server({id:this.id,x:evt.offsetX, y:evt.offsetY});
break;
}
};
If I am correct, then I ought to be able to resolve this by moving the cancel-the-previous-walker code into a separate method that can be called by the comet code driving the view-only walker:
Player.prototype.notify = function(evt) {
switch(evt.type) {
case "click":
this.stop();
this.walk_to(evt.offsetX, evt.offsetY);
this.notify_server({id:this.id,x:evt.offsetX, y:evt.offsetY});
break;
}
};

Player.prototype.stop = function () {
if (this.walker) clearTimeout(this.walker);
};
The javascript code that I push via comet then needs to call this new stop() method:
function broadcast(obj) {
listeners.forEach(
function(listener) {
var body = '<script type="text/javascript">' + "\nconsole.debug('" + obj.body + "')\n</script>\n";
listener({body: body});

body = '<script type="text/javascript">' + "\nloc = " + obj.body + ";\nwindow.parent.me.stop();\nwindow.parent.me.walk_to(loc.x, loc.y);\n</script>\n";
listener({body: body});
}
);
}
With that, I restart my fab.js server and try again:

video

Ah, much better. Up tomorrow: combining the two <canvas> boards so that I can move around my room and see others as they move around as well.

Day #96

No comments:

Post a Comment