We're going to have a bunch of obstacles, so we start by declaring an
array which will hold them all.
var obstacles = []; // things the hero can't move through
Next we define a function that lets us
add a single obstacle. Each obstacle is a 64x64 image that looks like, well, an obstacle.
function add_obstacle(x, y) {
var n = new MySprite("http://www.s2js.com/img/etc/obstacle.png") ;
n.x = x;
n.y = y;
obstacles.push(n);
}
And then we hand-code a few obstacles in some
choice locations. We could add a bunch of random obstacles, but for the sake of demonstration I want these to go in exact locations.
add_obstacle(150, 150) ;
add_obstacle(175, 200) ;
add_obstacle(-30, 100) ;
add_obstacle(50, -30) ;
Finally, in the Do_a_Frame function, we include some code to ask each obstacle to render itself:
for (var i=0; i < obstacles.length; i++) obstacles[i].Do_Frame_Things();
It's cool to note that if we wanted animated obstacles, all we'd need to do is create the image accordingly and set an animation_rate inside add_obstacle. Complex things become much easier if you structure things well.