Wednesday 20 August 2008

Bio(rrow)me

Continuing on the Spore prototypes theme, I'd love to have a Javascript version of Biome available for use on the PCG Wiki. It'd be great being able to demonstrate things like fire propagation live on the wiki, using 2d cellular automata to visually show various algorithms. Looking at Biome, it is flexible enough to handle a variety of automata using notation from chemical stoichiometry in a 196 kb executable.


An example of this notation from the ForestFire.txt example supplied with the executable:

;Fire

WIDTH = 150
HEIGHT = 150
PAUSE = 0

%%

INIT = {0,0,64}
FIRE1 = {96,32,0}
FIRE2 = {128,48,0}
FIRE3 = {192,64,0}
FIRE4 = {255,96,0}

YOUNG= {0,128,0}
OLD= {0,100,0}
ASH= {48,48,48}

%%

DISCRETE FOREST

%%

;Fire spreads
FOREST:OLD + 1FIRE2+ -> FIRE1*0.1
FOREST:OLD + 1FIRE3+ -> FIRE2*0.1
FOREST:OLD + 1FIRE4+ -> FIRE3*0.1

FOREST:YOUNG + 1FIRE2+ -> FIRE1*0.01
FOREST:YOUNG + 1FIRE3+ -> FIRE2*0.01
FOREST:YOUNG + 1FIRE4+ -> FIRE3*0.01

;Fire rages
FOREST:FIRE1 -> FIRE2*0.1
FOREST:FIRE2 -> FIRE3*0.1
FOREST:FIRE3 -> FIRE4*0.1

;Fire dies
FOREST:FIRE4 -> ASH*0.1

;Initial random forest
FOREST:INIT -> OLD*0.1
FOREST:INIT -> YOUNG*0.1
FOREST:INIT -> ASH*0.1

;Age
FOREST:YOUNG -> OLD *0.01


;Renew
FOREST:ASH -> YOUNG * 0.001

;spark forest fire
FOREST:OLD + 5OLD+ -> FIRE1 *0.00001
(I would get a screenshot, but none of the Spore prototypes run on the laptop I'm currently using. Given that this is my gaming laptop, I'm a little worried for the final release).

I'm working on a Javascript based cellular automaton tool at the moment, which doesn't quite have the flexibility of this framework. It is inspired by the Five Cellular Automata algorithms, although in the very early days of the implementation. You can have a play with the script here. At the moment it just generates a random 30x30 grid, each location of which has 50% chance of containing a cell, then plays the Game of Life.

You'll see the animation stutter frequently: I presume for garbage collection. I'm not sure the cleanest approach for animation in JavaScript. The recommended approach is to use setTimeout or setInterval which creates a callback into the JavaScript code. But this seems to requires that I make the referenced object global as I don't seem to be able to pass it through the callback. Suggestions are welcome.

2 comments:

kikito said...

Hi!

First post in your blog ^^

The easyest way of using timeouts + object parameters in javascript without making them global is making the whole thing object oriented. For example, let's say you want to call myObject.showMessage (wich uses the object member 'myObject.message')

// the only global object
var myObject = {
message: 'I like burritos',
showMessage: function() {
alert(this.message);
},
showDelayedMessage: function() {
this.timeoutId = setTimeout(
this.showMessage, 5000);
}
};

However calling myObject.showDelayed message will not work because of an ugly context problem ("this" is considered to be the "window" object instead of "myobject"). A fix is using this other function instead:

var myObject = {
message: 'I like burritos',
showMessage: function() {
alert(this.message);
},
showDelayedMessage: function() {
var self = this;
this.timeoutId = setTimeout(
function () {
self.showMessage();
},
5000);
}
};

I hope this helps.

Andrew Doull said...

Thanks - makes sense.