Lets see the finished source code first and then i will explain the logic of each section in the code
- Lines 1 - 16 global variables , the scope of those will be accessible to all functions and objects.
- Lines 19 - 35 the game class's ,
SpriteBackGround: contains all the games players snake and food.
SpriteSnakeCell: the snake is build from these objetcs.
SpriteSnakeFood: the red square which the snake need to eat.
- Lines 37 - 217 is the main layer that hold all the games element , all of them .
- Lines 39 the Layer constructor , it will initialize only once when the game start
so all the initials setup of the game for example creating the snake (line 69) and the food (line 70) and the main game sprite (line 44) will happen here.
- Lines 72 - 95 capture the keyboard events from the user.
lines 78 - 86 when collision detected and the space key is pressed , restart the game .
lines 87 - 90 when keyboard left / right /top /down keys pressed detected.
- Line 98 this is one of the most important functions in Cocos2d-x or any game in general.
AKA : The Game Main Loop scheduler which fire the "Main Game loop function"
in our case it is : GameLoop function (line 162).
- Lines 102 - 131 CreateSnake function creates the snake from SpriteSnakeCell objects .
lines 106 -102 checks to see if there is already snake array defined and visible in the game before removing it , this function creates new snake ,only 1 snake allowed in the game.
lines 119 - 130 the snake creation loop.
- Lines 132 -156 CreateFood function , create 1 food square each time called on random location on the game layer . only 1 food object allowed
- Lines 162 - 216 GameLoop function , in my view the most important function in the game logic it is function that invoked each N second in our case every 0.2 millisecond from the schedule function Line 98 . this is not always accurate it depends on the game structure and CPU.
lines 167 - 183 detect which direction is pressed by the user so the program could direct it in the right direction
- Lines 185 - 191 call the CollisionDetector if collision detected do as follow :
1 . set the global variable bCollisionDetected to true.
2. set GameOverLabel to be visible so there is indication the game is over.
3. pause all cocos2d-x engine work as result the game stop,
- Lines 193 - 217 if the snake "head" cell that is the element in place 0 in the SnakeArray array
remember we are working only with the snake head see lines 164 - 165.
if the location of the head going to as the food location the program need to remove the food object and increase the snake size lines 196 - 206 .
if not just continue the snake move lines 210 - 213.
- lines 219 -236 CollisionDetector function checks if the snake head collide the game spriteBackGround boundaries .
checks also if the snake head doesn't collide it self lines 228 - 234 .
- Lines 238 -242 generate function simple random number generator. used to place the food object.
- Lines 244 - 248 setLabelString function convert int value type to string type
- Lines 250 - 255 create the game Scene , this is the root node of all our game stage nodes.
Snake Game Using Cocos2d-x HTML5 - PART 4
Play the final SnakeJS game:
The SnakeJS source code: