HTML and CSS Reference
In-Depth Information
Finally the speed parameter is used to indicate how fast the texture should move along
the x axis. This movement is also determined by the deltaX and deltaY variables within
the ScrollingBackground object. Both of which are passed to the Draw and Update
functions of the application and used to determine how far the texture has moved along the
x axis. By knowing how far the texture has moved, we then know when to wrap the texture
around the canvas using the UpdateBackground function. This function wraps the texture
so that it is drawn on the right-hand side of the canvas, giving the illusion of a continually
looping background.
With the ScrollingBackground object implemented, we then loaded each of the
background layers into the application. This is done in much the same way as we have done
in previous recipes. We declare a new image object and pass it the path of a texture for it
to load into the application. A reference of this texture is then passed to a new instance of
ScrollingBackground .
As well as passing a texture, we also pass a 2D position, depth position, width, height, and
a speed with which the texture should move. This creates a new background layer, which is
drawn to the canvas and placed behind the level. This process is repeated a number of times
and as a result creates a series of background layers, each of which differ in speed and help
to produce a parallax effect.
Implementing physics (Must know)
In this recipe, we will look at implementing a jumping behavior for the player. In order to
implement this feature, we will need to adjust that section of the game framework, which
is responsible for detecting and updating user input. By doing this, we can determine when
the player has pressed either the Space bar key, the W key, or the up arrow key in order to
make the player jump.
How to do it...
In order to implement jumping behavior, we will need to implement additional
behaviors within the Player object. Open this object and declare the following
variables at the top of the object:
this.maxJump = 64;
this.jumpTime = 1;
this.jumpVelocity = ((Math.PI / 2) / this.jumpTime);
this.position = 0;
this.terminalVelocity = 1.5;
this.isOnGround = true;
These variables are responsible for the characteristics of the jump behaviors and
they also determine the maximum height the player can jump, the time taken, the
speed and trajectory of the jump, deceleration, and whether or not the player is on
the ground before jump they can jump.
Search WWH ::

Custom Search