<!
DOCTYP
E html>
<meta charset="utf-8">
<script
src="[Link]
cript>
<body>
<div id="game" style="overflow: hidden;"></div>
<script>
/*
A GAME MECHANIC EXPLORER DEMO
[Link]
*/
var GameState = function(game) {
};
// Load images and sounds
[Link] = function() {
[Link]('ship', '[Link]', 32, 32);
[Link]('ground', '[Link]');
[Link]('explosion', '[Link]', 128, 128);
};
// Setup the example
[Link] = function() {
// Set stage background color
[Link] = 0x333333;
// Define motion constants
this.ROTATION_SPEED = 180; // degrees/second
[Link] = 200; // pixels/second/second
this.MAX_SPEED = 250; // pixels/second
[Link] = 0; // pixels/second
[Link] = 50; // pixels/second/second
// Add the ship to the stage
[Link] = [Link](0, 0, 'ship');
[Link](0.5, 0.5);
[Link] = -90; // Point the ship up
// Enable physics on the ship
[Link]([Link], [Link]);
// Set maximum velocity
[Link](this.MAX_SPEED, this.MAX_SPEED); //
x, y
// Add drag to the ship that slows it down when it is not
accelerating
[Link]([Link], [Link]); // x, y
// Choose a random starting angle and velocity for the ship
[Link]();
// Turn on gravity
[Link].y = [Link];
// Make ship bounce a little
[Link](0.25, 0.25);
// Create some ground for the ship to land on
[Link] = [Link]();
for(var x = 0; x < [Link]; x += 32) {
// Add the ground blocks, enable physics on each, make them
immovable
var groundBlock = [Link](x, [Link] - 32,
'ground');
[Link](groundBlock, [Link]);
[Link] = true;
[Link] = false;
[Link](groundBlock);
}
// Create a group for explosions
[Link] = [Link]();
// Capture certain keys to prevent their default actions in the
browser.
// This is only necessary because this is an HTML5 game. Games on
other
// platforms may not need code like this.
[Link]([
[Link],
[Link],
[Link],
[Link]
]);
// Show FPS
[Link] = true;
[Link] = [Link](
20, 20, '', { font: '16px Arial', fill: '#ffffff' }
);
};
// Try to get a used explosion from the explosionGroup.
// If an explosion isn't available, create a new one and add it to the
group.
// Setup new explosions so that they animate and kill themselves when
the
// animation is complete.
[Link] = function(x, y) {
// Get the first dead explosion from the explosionGroup
var explosion = [Link]();
// If there aren't any available, create a new one
if (explosion === null) {
explosion = [Link](0, 0, 'explosion');
[Link](0.5, 0.5);
// Add an animation for the explosion that kills the sprite when
the
// animation is complete
var animation = [Link]('boom', [0,1,2,3], 60,
false);
[Link] = true;
// Add the explosion sprite to the group
[Link](explosion);
}
// Revive the explosion (set it's alive property to true)
// You can also define a onRevived event handler in your explosion
objects
// to do stuff when they are revived.
[Link]();
// Move the explosion to the given coordinates
explosion.x = x;
explosion.y = y;
// Set rotation of the explosion at random for a little variety
[Link] = [Link](0, 360);
// Play the animation
[Link]('boom');
// Return the explosion itself in case we want to do anything else
with it
return explosion;
};
[Link] = function() {
// Move the ship back to the top of the stage
[Link].x = 32;
[Link].y = 32;
[Link](0, 0);
// Select a random starting angle and velocity
[Link] = [Link](-180, 180);
[Link]([Link](100,
200), 0);
};
// The update() method is called every frame
[Link] = function() {
if ([Link] !== 0) {
[Link]([Link] + ' FPS');
}
// Collide the ship with the ground
[Link]([Link], [Link]);
// Keep the ship on the screen
if ([Link].x > [Link]) [Link].x = 0;
if ([Link].x < 0) [Link].x = [Link];
if ([Link]([Link])) {
// If the LEFT key is down, rotate left
[Link] = -this.ROTATION_SPEED;
} else if ([Link]([Link])) {
// If the RIGHT key is down, rotate right
[Link] = this.ROTATION_SPEED;
} else {
// Stop rotating
[Link] = 0;
}
// Set a variable that is true when the ship is touching the ground
var onTheGround = [Link];
if (onTheGround) {
if ([Link]([Link].y) > 20 ||
[Link]([Link].x) > 30) {
// The ship hit the ground too hard.
// Blow it up and start the game over.
[Link]([Link].x, [Link].y);
[Link]();
} else {
// We've landed!
// Stop rotating and moving and aim the ship up.
[Link] = 0;
[Link](0, 0);
[Link] = -90;
}
if ([Link]([Link])) {
// If the UP key is down, thrust
// Calculate acceleration vector based on [Link] and
[Link]
[Link].x = [Link]([Link]) *
[Link];
[Link].y = [Link]([Link]) *
[Link];
// Show the frame from the spritesheet with the engine on
[Link] = 1;
} else {
// Otherwise, stop thrusting
[Link](0, 0);
// Show the frame from the spritesheet with the engine off
[Link] = 0;
}
};
var game = new [Link](960, 500, [Link], 'game');
[Link]('game', GameState, true);
[Link]();
</script>