The powerups in the game are represented by the Powerup class. This class is very simple, defining a value for the powerup and variables similar to those used by the Player class to follow a sine wave [code]. The Player class uses the sine wave to jump and fall, whereas the Powerup simply uses them to bounce up and down. [code]
The Powerup also detects any collisions with the Player. There is a new function called collisionArea in the VisualGameObject [code] and AnimatedGameObject [code] classes that returns a Rectangle [code] class which defines the area on the screen that these objects takes up. In addition the Rectangle class contains a function called intersects [code] that can test if two rectangles are overlapping. The Powerup class uses the Rectangle returned by the Player and the one returned by it's own base AnimatedGameObject class to determine if the Player is colliding with the Powerup. If so the new gloabl variable g_score [code] is increased by the value of the Powerup. [code]
The score itself is presented to the player through the HTML page rather than the Canvas element. This is because the canvas (or more specifically the CanvasRenderingContext2D) fillText and drawText functions are currently not well supported. In order to make the application compatible across the browsers that support the canvas element it was easier to simply add a DIV element to the HTML page [code], and have the ApplicationManager class update this value when the score is changed through a new function call updateScore. [code]
Check out the demo here, download the source code here, and browse the source code documentation here.