Set Up Safe Zones

(Step 5/9) Set up safe zones and an end zone.

1. Go into our game.js file and use an addLocations function above our addCharacters function.

code/client/src/game.js

g.addLocations('safeZone');


2. In the game.js file in the create function we’‘ll put a getLocations function above our getCharacters functions.


code/client/src/game.js

g.getLocations('safeZone');


3. In room.js file in our onInit function and use a setupLocations function above our setupCharacters functions


code/server/rooms/room.js

g.setupLocations('safeZone');


4. In room.js, Use 3 createLocations functions right under the setupLocations function that we just wrote, to create three different locations on the map.


code/server/rooms/room.js

g.createALocation('safeZone', g.nextLocationId('safeZone'),  { x:  -47, y:  1940, width:  670, height:  100  },  '6cdc00', player =>  {
	player.safe =  true;
});
g.createALocation('safeZone', g.nextLocationId('safeZone'),  { x:  -47, y:  1000, width:  670, height:  100  },  '6cdc00', player =>  {
	player.safe =  true;
});
g.createALocation('safeZone', g.nextLocationId('safeZone'),  { x:  -47, y:  0, width:  670, height:  100  },  '6cdc00', player =>  {
g.getAllCharacters('players', player =>  { player.x =  270, player.y =  1990, player.spriteName =  'players'  });
});


5. Go into our onUpdate function in the room.js file and add a getAllCharacters function and a handleLocations function.

code/server/rooms/room.js

g.getAllCharacters('players', player =>  { player.safe =  false  })
g.handleLocations('safeZone',  'players');

Now when we make it to the end our players are sent back to the first, later we’ll set up level’s so that we progress every time we make it to the end.


Download your zip, and upload it to blobbert.io, and you should be able to use the safe zones!


Add Enemy Movement
Set up Name Tags

Need Help?

Proofread your code, check with your team and classmates, and if you’re still stuck!

Click Here for Help