Games

ALSET Games based on React Game Kit

Gem collector game

Game status: using OLD API

1. Two character on one screen
2. Gems scattered all over the map
3. Score incrementing when character collect gem by approaching it
4. Challenge is to pickup more gems possible

One window one player game

Game status: done, using NEW API

1. One drones on each of two screens
2. Trash scattered all over the map
3. Score incrementing when drone collect trash by approaching it
4. Challenge is to pickup more trash possible

Squad game

Game status: done, using NEW API

1. Two drones on each of two screens
2. Trash scattered all over the map
3. Score incrementing when drone collect trash by approaching it
4. Challenge is to pickup more trash possible using teamwork

Passenger pickup game

Game status: done, using NEW API

1. Two cars for each screen
2. Passengers scattered all over the map
3. When car approaches the passenger, destianation is appearing
4. Score incrementing when passenger is delivered to destination
5. Challenge is to find path, since road is only field on the map where it is allowed to move

Plant savior

Game status: using OLD API

1. Two drones for each screen
2. Plants scattered all over the map
3. Over time random plants getting dry or infected with pest
4. There are pest factory and lake with water on the map
5. In order to get pest drone need to approach factory or lake to get water
6. When loaded drone need to approach dried plant to save it, the same with pested, but need to be loaded with pests
7. If plant is not saved over some time it dies
8. The score is started equal to amount of plants, each dead plant is decrementing score
9. Challenge is to save most plants possible

Pizza delivery game

Game status: not yet done

1. Two pizza delivery drones for each of two windows
2. Each drone gets the multiple adresses at once, those adresses will be shown at the map at his color(for ex. drone-green-adresses green)
3. There are three pizzaries around the map, dron can drag only one pizza at the time, so he need to get pizza from one of the closest pizzaries
4. Score will be given for each pizza delivered
5. The challenge is to find an optimal route to bring pizza to all adresses

Protect the borders

Game status: not yet done

1. Three drones are under control: sea drone, air drone, onground drone
2. Each drone has 10 shots and there is the base where they can recharge
3. There gonna be three types of enemies: sea, air, onground trying to smug in some drugs
4. All enemies gonna be trying to lurke into a city, since there drones will lost them
5. Being shot by missle enemies explode and score increases
6. If enimy succeed with lurking into city, score decreases
7. Challenge is to control all drones, recharge when enemies is less, get in position to shoot enemy drone

Protect the skies

Game status: not yet done

1. Two drones are under control
2. There is a base in the center
3. The borders are the dots(hubs) around the base, each dot is at some distance from another
4. The hub is activated by contacting with drone by sending electromagneting wave which can throw away someone close to cross borders
5. The closer penetrator gets to the center of this hub the farer away it will be thrown
6. The hub need some time to be recharged before it can be activated again
7. The game is started with some amount of scores matching the amount of potential penetrators circling around the base outside the border
8. For each penetrator that made it to the base score is decreasing
9. The challenge is to observe the situation and react, letting penetrator closer to hub to push it farther away, but, only if there is no another one closing to border

Repair the kiosks

Game status: not yet done

1. There are two drones, one is for repairing kiosks, another is for convincing people to get to other kiosk
2. There are some amount of kiosks randomly distributed over a map
3. The koisk is taking some time to prepare the food so the line may grow with people waiting
4. The line is not evenly distributed over all kiosks, so drone may come to some line with amount of people he is going to encourage to move to another kiosk
5. Over the time some kiosks are randomly getting broken
6. Fixing drone need to approach broken kiosk to fix it
7. Fixing kiosk take some time, so drone need to be around the kiosk until it fully fixed
8. The score increasing when item sold to clients, the more items are sold, the more score is collected
9. Challenge is to distribute clients evenly and repair kiosks in time, choosing those first, where the line is longer

Explanation of how to work with API 2.0 when writing your function

Each function is running each iteration of game, receiving world object that contain following information:

{
	player:{x:10, y:15}, 
	collectives||passengers:[], 
	direction: "left"||{left:true}, 
	index:0, 
	config: config, 
	gameId: 0, 
	controlInfo: {keyPressed:["up", "down"], current:[0,1]},
	players:[
				{position:{x:10, y:15}, direction:"left"},
				{position:{x:100, y:105}, direction:"down"}
			]
}

From this object we can get following information:

1. player - containing information about bot's position, for some games, like in passengerPickup game, it can contain some additional information, like 'path', to determine is path already calculated for this car or it nned to be calculated(you, of course can calculate path each iteration, but it will consume addittional resources) and 'passenger' to find if car is already loaded with passenger or is empty and need to get some
2. collectives - is an array containing goal objects(passengers, gems, trash, etc.), each object containing information about position and some additional information if needed (like health and state parameter for plants). Depending on game collectives can be called differently, for example in passengerPickup game it can be called passengers
3. direction - is information about direction bot is moving now, there are two formats: {left:true}, "left"
4. index - is number of character can be 0 or 1 for 1st and 2nd character accordingly
5. config - is game's config.json you can find it in game's root folder ./simulation folder, it will help you to find width, height of collectives and player etc.
6. gameId identifies which game is bot controlled for, left screen has 0 gameId, right - 1.
7. control info is used if you want to control bot with keys it contain of 1st array "keyPressed" that has two elements: first is for left screen controlled bot, second is for right screen, and second array that also, consists of two elements, each element can be 0 or 1, depending on which bot out of two is controllde now, since there can be two bots on each screen. This parameter is changing when user clicks switch button. Left, right, up, down and switch keys names can be found and changed in config.json file for each game
8. control info is used if you want to control bot with keys it contain of 1st array "keyPressed" that has two elements: first is for left screen controlled bot, second is for right screen, and second array that also, consists of two elements, each element can be 0 or 1, depending on which bot out of two is controllde now, since there can be two bots on each screen. This parameter is changing when user clicks switch button. Left, right, up, down and switch keys names can be found and changed in config.json file for each game
9. players object holding information about all character of current game, including controllable player and its opponent

Examples:

Simplest example of how to make first bot moving always left and second one down:

		function(world){
			if(world.index==0)
				return "left";
			else if(world.index==1)
				return "down";
		}
	

Explanation of how to change graphic if needed

What sprite should look like

Sprite shape should be following:
from top to bottom (vertically) there is a state (left, right, up,down moving, running, idle, etc.)
From left to right (horizontally) should be frames for those states
For example:
Example with just 1 frame (horizontal line) for each state:

Steps to insert new sprite into game

1. Save sprite to ./src/assets/sprites folder in the root of chosen game
2. In ./view/Components/Characters/ copy any of files present there and rename it to name like, for example
   import img from '../../../assets/sprites/gnome1.png';
   would be changed to:
   import img from '../../../assets/sprites/your_custom_name.png';
   this file should be already present in assets folder
3. In getAnimationState() switch case should be changed to yours, here are direction present and which direction which state is correspondant to(remember - state is horisontal line of frames, for ex. if up movement is 3rd horisontal line, then
   case 'up': this.animState = 2;)
4. In render you can see Sprite componenet, most important parameters are:
   tileWidth, tileHeight, those indicating original size of each frame, in scale parameter you can see this.props.scale, it's used there to adapt size of sprite depending on scale of the game window in the browser.
   Last important parameter is steps, elements in array are coresponding to the states(horizontal lines) in the sprite. For example, in gnome sprite that was given as an example, 1st horizontal line consists of 8 elements, as well as 2nd, 3rd and 4th, 5th and 6th lines or states consists from 1 frame, so steps parameter would look like [7, 7, 7, 7, 0, 0], since counting starts from 0.
5. In './src/view/character.js' you need to import your sprite here and add new case for your custom sprite
6. In './src/view/App.js' just need to replace type of any Character component to the one you've added to cases

What tile should look like

Tile is any square image that can be repeated all over map, for example:

To change tile image you just need to save it into ./src/assets/tiles and in ./src/view/tile.js change import img from '../assets/tiles/your_custom_image.png'

Same steps can be applied to collective creating, save collective image to ./src/assets/collective and replace import in collectives.js

Some folder and file naming can differ depending on game, for example, collective folder and file in plantSavior game calling plant.js