Skip to content

Commit a9eaf2c

Browse files
baschtbascht
committed
Corrected the number of crates & cleaned up a bit
1 parent ff7d351 commit a9eaf2c

File tree

1 file changed

+175
-3
lines changed

1 file changed

+175
-3
lines changed

‎bascht0.html

Lines changed: 175 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
<!doctype html>
22
<html lang="en">
33
<head>
4-
<meta charset="UTF-8" />
5-
<title>Phaser - Making your first game, part 9</title>
4+
<meta charset="UTF-8" />
5+
<title>Phaser - Opening some Crates</title>
66
<script type="text/javascript" src="js/phaser.min.js"></script>
77
<style type="text/css">
88
body {
@@ -11,8 +11,180 @@
1111
</style>
1212
</head>
1313
<body>
14+
<script type="text/javascript" >
15+
var game = new Phaser.Game(800, 600, Phaser.AUTO, '', { preload: preload, create: create, update: update });
1416

17+
function preload() {
1518

16-
<script type="text/javascript" src="bascht0.js"></script>
19+
game.load.image('sky', 'assets/sky.png');
20+
game.load.image('ground', 'assets/platform.png');
21+
game.load.image('key', 'assets/key.png');
22+
game.load.spritesheet('crate', 'assets/crate.png', 32, 32);
23+
game.load.spritesheet('dude', 'assets/dude.png', 32, 48);
24+
}
25+
26+
var player;
27+
var platforms;
28+
var cursors;
29+
30+
var keys;
31+
var crates;
32+
var colours = [
33+
"b65611",
34+
"60ac39",
35+
"1fad83",
36+
"b854d4",
37+
"d43552"
38+
];
39+
40+
function create() {
41+
42+
// We're going to be using physics, so enable the Arcade Physics system
43+
game.physics.startSystem(Phaser.Physics.ARCADE);
44+
45+
// A simple background for our game
46+
game.add.sprite(0, 0, 'sky');
47+
48+
// The platforms group contains the ground and the 2 ledges we can jump on
49+
platforms = game.add.group();
50+
51+
// We will enable physics for any object that is created in this group
52+
platforms.enableBody = true;
53+
54+
// Here we create the ground.
55+
var ground = platforms.create(0, game.world.height - 64, 'ground');
56+
57+
// Scale it to fit the width of the game (the original sprite is 400x32 in size)
58+
ground.scale.setTo(2, 2);
59+
60+
// This stops it from falling away when you jump on it
61+
ground.body.immovable = true;
62+
63+
// Now let's create two ledges
64+
var ledge = platforms.create(400, 400, 'ground');
65+
ledge.body.immovable = true;
66+
67+
ledge = platforms.create(-150, 250, 'ground');
68+
ledge.body.immovable = true;
69+
70+
// The player and its settings
71+
player = game.add.sprite(32, game.world.height - 150, 'dude');
72+
player.inventory = [];
73+
74+
// We need to enable physics on the player
75+
game.physics.arcade.enable(player);
76+
77+
// Player physics properties. Give the little guy a slight bounce.
78+
player.body.bounce.y = 0.1;
79+
player.body.gravity.y = 400;
80+
player.body.collideWorldBounds = true;
81+
82+
// Our two animations, walking left and right.
83+
player.animations.add('left', [0, 1, 2, 3], 10, true);
84+
player.animations.add('right', [5, 6, 7, 8], 10, true);
85+
86+
crates = game.add.group();
87+
crates.enableBody = true;
88+
89+
keys = game.add.group();
90+
keys.enableBody = true;
91+
92+
// Here we'll create 12 of them evenly spaced apart
93+
for (var i = 0; i < colours.length; i++)
94+
{
95+
var key = keys.create(i * 180, 0, 'key');
96+
key.body.gravity.y = 800;
97+
key.body.bounce.y = 0.4 + Math.random() * 0.1;
98+
key.tint = "0x" + colours[i];
99+
key.id = i;
100+
101+
var crate = crates.create((Math.random() * 700 + 100), (Math.random() * 400), 'crate');
102+
crate.body.gravity.y = 500;
103+
crate.body.immovable = false;
104+
crate.animations.add('open', [0, 1, 2, 3], 8, true);
105+
crate.isClosed = true;
106+
crate.rotation = Math.random();
107+
crate.key = key;
108+
crate.tint = "0x" + colours[i];
109+
crate.id = i;
110+
}
111+
112+
// Our controls.
113+
cursors = game.input.keyboard.createCursorKeys();
114+
}
115+
116+
function update() {
117+
118+
// Collide the player and the keys with the platforms
119+
game.physics.arcade.collide(player, platforms);
120+
game.physics.arcade.collide(keys, platforms);
121+
game.physics.arcade.collide(crates, platforms);
122+
123+
// Crates are stackable because I'm lazy
124+
game.physics.arcade.collide(crates, crates);
125+
game.physics.arcade.overlap(player, keys, collectKey, null, this);
126+
game.physics.arcade.overlap(player, crates, openCrate, null, this);
127+
128+
// Reset the players velocity (movement)
129+
player.body.velocity.x = 0;
130+
131+
if (cursors.left.isDown)
132+
{
133+
// Move to the left
134+
player.body.velocity.x = -250;
135+
player.animations.play('left');
136+
}
137+
else if (cursors.right.isDown)
138+
{
139+
// Move to the right
140+
player.body.velocity.x = 250;
141+
player.animations.play('right');
142+
}
143+
else
144+
{
145+
// Stand still
146+
player.animations.stop();
147+
player.frame = 4;
148+
}
149+
150+
// Allow the player to jump if they are touching the ground.
151+
if (cursors.up.isDown && player.body.touching.down)
152+
{
153+
player.body.velocity.y = -350;
154+
}
155+
156+
// Check if a crate is opened. (or at least animated. yuck!)
157+
crates.children.map(function(crate) {
158+
if (crate.animations.currentFrame.index > 3) {
159+
crate.kill();
160+
}
161+
})
162+
}
163+
164+
function openCrate (player, crate) {
165+
if((crate.isClosed) &&
166+
(player.inventory.indexOf(crate.key.id) != -1)
167+
) {
168+
crate.body.velocity.y = -350;
169+
crate.animations.play('open');
170+
crate.lifespan = 300;
171+
crate.isClosed = false;
172+
}
173+
else {
174+
// How about a nice animation?
175+
}
176+
}
177+
178+
function collectKey (player, key) {
179+
player.inventory.push(key.id);
180+
key.kill();
181+
game.add.text(
182+
(30 * player.inventory.length) - 20,
183+
16,
184+
'⚿',
185+
{ fontSize: '32px', fill: colours[key.id] }
186+
);
187+
}
188+
</script>
17189
</body>
18190
</html>

0 commit comments

Comments
 (0)