Canvas Games: Part II - HTML5 Canvas - page 804

player . x += player . dx * player . speed ;
player . currentTile ++ ; iif ( player . currentTile == playerTiles . length ){
player . currentTile = 0 ;
}
renderPlayField ();
iif ( player . x == player . destinationX && player . y == player . destinationY ){
switchGameState ( GAME_STATE_EVALUATE_PLAYER_MOVE );
}
First,the player object's x and y locationsareincreasedbythe player.speed * player.dx
(or dy ). The tile size is 32 , so we must use a speed value that is evenly divided into 32 . The
values 1 , 2 , 4 , 8 , 16 , and 32 are all valid.
This function also runs though the playerTiles array on each game loop iteration. This
renders the tank tracks moving, simulating a smooth ride from one tile to the next.
Next, let's take a closer look at how we render playField .