SpawnHero 2: Documentation

SpawnHero 2

The only file that needs to be edited is the game.js file. The game.js file is initially blank. All you need to do is start adding code!

Game Rules

At minimum, the game requires hero_1, hero_2, and at least 1 gem in order for the game to be winnable.

The Win Condition

The game ends when all gems are picked up. The player to gather the most gems within the time limit given wins the game. If gems are not all picked up before time runs out, the player with the most hems wins.

Other Rules

• If a player touches an enemy they will be sent back to their start position.
• If a player touches freeze, they will be frozen for the time indicated in the settings.
• If a player touches slow, they will be slowed down for the time indicated in the settings.
• If a player touches speed, they will speed up for the time indicated in the settings.

Game Settings

Game Duration (seconds)

Settings.time_limit = 10;

Hero 1

Settings.hero_1.skin = "assets/images/06.png";
Settings.hero_1.speed = 300;

Enemy Defaults

This sets a default speed and appearance for enemies. These settings can be overriden for each enemy placed on the map.

Settings.enemy.default_speed = 100;
Settings.enemy.default_skin = "assets/images/07.png";

Wall Default Skin

This sets a default appearance for wall tiles.

Settings.wall.default_skin = "assets/images/17.png";

Gem Defaults

This sets a default points value and appearance for gems. These settings can be overriden for each gem placed on the map.

Settings.gem.default_points = 5;
Settings.gem.default_skin = "assets/images/27.png";

Powerup & Hazard Defaults

This sets a default durations and skins for the "freeze", "speed" and "slow" items.

Settings.freeze.default_skin = "assets/images/20.png";
Settings.freeze.default_duration = 3;
Settings.speed.default_skin = "assets/images/19.png";
Settings.speed.default_duration = 2;
Settings.slow.default_skin = "assets/images/21.png";
Settings.slow.default_duration = 2;

Game Assets

For any of the objects above that have a "skin" setting, you can define what graphic you want to use from sprites available in the assets/images directory. Here are all the sprites that are available for you to use:

If you want to use your own original sprites, you will need to host them online (on your own server) and insert the full url to the sprites. All sprites are made @2x (80 x 80) and displayed at half-size (40 x 40).

Placing Objects

Each tile in the grid is 40 x 40. To determine the x and y position of an object, multiply the tile x and y numbers from the paper prototype by 40.

Hero 1

Create a hero_1 object and place it at x,y position.

Spawn.hero_1(0, 0);

Hero 2

Create a hero_2 object and place it at x,y position.

Spawn.hero_2(40, 40);

Wall

• The first 2 arguments x and y spawn a wall at ( x,y ) position. These first 2 arguments are required.

  Spawn.wall(120, 120);
  

• The third argument is skin (optional). If it is not set, the default skin will be used.

  Spawn.wall(120, 120, "assets/images/17.png");
  

Enemy

• The first 2 arguments x and y spawn an enemy at ( x,y ) position. The third argument is a direction in quote marks. It is either "up", "down", "left", or "right". The enemy will start walking in the direction defined and will continue walking until it bumps into an object (then it will walk in the opposite direction). These first 3 arguments are all required.

  Spawn.enemy(120, 120, "down");
  

• The fourth argument is enemy speed (optional). If it is not set, the default speed will be used.

  Spawn.enemy(120, 120, "down", 600);
  

• The fifth argument is skin (optional). If it is not set, the default will be used.

  Spawn.enemy(120, 120, "down", 600, "assets/images/22.png");
  

Gem

• The first 2 arguments x and y spawn a gem at ( x,y ) position. These first 2 arguments are required.

  Spawn.gem(120, 120);
  

• The third argument is a point value for the gem (optional). If a value is not set, the default value will be used

  Spawn.gem(120, 120, 10);
  

• The fourth argument is skin (optional). If it is not set, the default skin will be used.

  Spawn.gem(120, 120, 10, "assets/images/28.png");
  

Speed

• A "speed" powerup makes the player move faster. The player will speed up for the duration defined by the Settings default, or by the third argument in the function call.
• The first 2 arguments x and y spawn a speed item at ( x,y ) position. These first 2 arguments are required.

  Spawn.speed(120, 120);
  

• The third argument is a duration for the powerup. If a value is not set, the default value will be used.

  Spawn.speed(120, 120, 100);
  

• The fourth argument is skin (optional). If it is not set, the default skin will be used.

  Spawn.speed(120, 120, 10, "assets/images/34.png");
  

Slow

• A "slow" hazard makes the player move slowly. The player will slow down for the duration defined by the Settings default, or by the third argument in the function call.
• The first 2 arguments x and y spawn a slow item at ( x,y ) position. These first 2 arguments are required.

  Spawn.slow(120, 120);
  

• The third argument is a duration for the hazard. If a value is not set, the default value will be used.

  Spawn.slow(120, 120, 100);
  

• The fourth argument is skin (optional). If it is not set, the default skin will be used.

  Spawn.slow(120, 120, 10, "assets/images/35.png");
  

Freeze

• A "freeze" hazard makes the player stop completely. The player will be frozen for the duration defined by the Settings default, or by the third argument in the function call.
• The first 2 arguments x and y spawn a freeze item at ( x,y ) position. These first 2 arguments are required.

  Spawn.freeze(120, 120);
  

• The third argument is a duration for the hazard. If a value is not set, the default value will be used.

  Spawn.freeze(120, 120, 100);
  

• The fourth argument is skin (optional). If it is not set, the default skin will be used.

  Spawn.freeze(120, 120, 10, "assets/images/33.png");
  

Programming Resources

Programming Workflow Setup Project Starter Files