Skip to content

Commit 99ca0e9

Browse files
cpAtorcpAtor
committed
moved js to separate file
1 parent d2b3487 commit 99ca0e9

File tree

3 files changed

+177
-173
lines changed

3 files changed

+177
-173
lines changed

‎.gitignore

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
.vscode/iisexpress.json

‎index.html

+6-173
Original file line numberDiff line numberDiff line change
@@ -9,184 +9,17 @@
99
body {
1010
margin: 0;
1111
}
12+
canvas{
13+
display: block;
14+
margin: auto;
15+
}
1216
</style>
1317
</head>
1418

1519
<body>
16-
17-
<script type="text/javascript">
18-
var config = {
19-
type: Phaser.AUTO,
20-
width: 800,
21-
height: 600,
22-
physics: {
23-
default: 'arcade',
24-
arcade: {
25-
gravity: {
26-
y: 300
27-
},
28-
debug: false
29-
}
30-
},
31-
scene: {
32-
preload: preload,
33-
create: create,
34-
update: update
35-
}
36-
};
37-
38-
var player;
39-
var stars;
40-
var bombs;
41-
var platforms;
42-
var cursors;
43-
var score = 0;
44-
var gameOver = false;
45-
var scoreText;
46-
47-
var game = new Phaser.Game(config);
48-
49-
function preload() {
50-
this.load.image('sky', 'assets/sky.png');
51-
this.load.image('ground', 'assets/platform.png');
52-
this.load.image('star', 'assets/star.png');
53-
this.load.image('bomb', 'assets/bomb.png');
54-
this.load.spritesheet('dude', 'assets/dude.png', {
55-
frameWidth: 32,
56-
frameHeight: 48
57-
});
58-
}
59-
60-
function create() {
61-
this.add.image(400, 300, 'sky');
62-
platforms = this.physics.add.staticGroup();
63-
platforms.create(400, 568, 'ground').setScale(2).refreshBody();
64-
platforms.create(600, 400, 'ground');
65-
platforms.create(50, 250, 'ground');
66-
platforms.create(750, 220, 'ground');
67-
platforms.create
68-
player = this.physics.add.sprite(100, 450, 'dude');
69-
player.setBounce(0.2);
70-
player.setCollideWorldBounds(true);
71-
this.anims.create({
72-
key: 'left',
73-
frames: this.anims.generateFrameNumbers('dude', {
74-
start: 0,
75-
end: 3
76-
}),
77-
frameRate: 10,
78-
repeat: -1
79-
});
80-
81-
this.anims.create({
82-
key: 'turn',
83-
frames: [{
84-
key: 'dude',
85-
frame: 4
86-
}],
87-
frameRate: 20
88-
});
89-
90-
this.anims.create({
91-
key: 'right',
92-
frames: this.anims.generateFrameNumbers('dude', {
93-
start: 5,
94-
end: 8
95-
}),
96-
frameRate: 10,
97-
repeat: -1
98-
});
99-
100-
cursors = this.input.keyboard.createCursorKeys();
101-
stars = this.physics.add.group({
102-
key: 'star',
103-
repeat: 11,
104-
setXY: {
105-
x: 12,
106-
y: 0,
107-
stepX: 70
108-
}
109-
});
110-
111-
stars.children.iterate(function (child) {
112-
child.setBounceY(Phaser.Math.FloatBetween(0.4, 0.8));
113-
});
114-
115-
bombs = this.physics.add.group();
116-
117-
scoreText = this.add.text(16, 16, 'score: 0', {
118-
fontSize: '32px',
119-
fill: '#000'
120-
});
121-
122-
this.physics.add.collider(player, platforms);
123-
this.physics.add.collider(stars, platforms);
124-
this.physics.add.collider(bombs, platforms);
125-
126-
this.physics.add.overlap(player, stars, collectStar, null, this);
127-
128-
this.physics.add.collider(player, bombs, hitBomb, null, this);
129-
}
130-
131-
function update() {
132-
if (gameOver) {
133-
return;
134-
}
135-
136-
if (cursors.left.isDown) {
137-
player.setVelocityX(-160);
138-
139-
player.anims.play('left', true);
140-
} else if (cursors.right.isDown) {
141-
player.setVelocityX(160);
142-
143-
player.anims.play('right', true);
144-
} else {
145-
player.setVelocityX(0);
146-
147-
player.anims.play('turn');
148-
}
149-
150-
if (cursors.up.isDown && player.body.touching.down) {
151-
player.setVelocityY(-330);
152-
}
153-
}
154-
155-
function collectStar(player, star) {
156-
star.disableBody(true, true);
157-
158-
score += 10;
159-
scoreText.setText('Score: ' + score);
160-
161-
if (stars.countActive(true) === 0) {
162-
stars.children.iterate(function (child) {
163-
164-
child.enableBody(true, child.x, 0, true, true);
165-
166-
});
167-
168-
var x = (player.x < 400) ? Phaser.Math.Between(400, 800) : Phaser.Math.Between(0, 400);
169-
170-
var bomb = bombs.create(x, 16, 'bomb');
171-
bomb.setBounce(1);
172-
bomb.setCollideWorldBounds(true);
173-
bomb.setVelocity(Phaser.Math.Between(-200, 200), 20);
174-
bomb.allowGravity = false;
175-
176-
}
177-
}
178-
179-
function hitBomb(player, bomb) {
180-
this.physics.pause();
181-
182-
player.setTint(0xff0000);
183-
184-
player.anims.play('turn');
185-
186-
gameOver = true;
187-
}
20+
<script type="text/javascript" src="main.js">
21+
18822
</script>
189-
19023
</body>
19124

19225
</html>

‎main.js

+170
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,170 @@
1+
var config = {
2+
type: Phaser.AUTO,
3+
width: 800,
4+
height: 600,
5+
physics: {
6+
default: 'arcade',
7+
arcade: {
8+
gravity: {
9+
y: 300
10+
},
11+
debug: false
12+
}
13+
},
14+
scene: {
15+
preload: preload,
16+
create: create,
17+
update: update
18+
}
19+
};
20+
21+
var player;
22+
var stars;
23+
var bombs;
24+
var platforms;
25+
var cursors;
26+
var score = 0;
27+
var gameOver = false;
28+
var scoreText;
29+
30+
var game = new Phaser.Game(config);
31+
32+
function preload() {
33+
this.load.image('sky', 'assets/sky.png');
34+
this.load.image('ground', 'assets/platform.png');
35+
this.load.image('star', 'assets/star.png');
36+
this.load.image('bomb', 'assets/bomb.png');
37+
this.load.spritesheet('dude', 'assets/dude.png', {
38+
frameWidth: 32,
39+
frameHeight: 48
40+
});
41+
}
42+
43+
function create() {
44+
this.add.image(400, 300, 'sky');
45+
platforms = this.physics.add.staticGroup();
46+
platforms.create(400, 568, 'ground').setScale(2).refreshBody();
47+
platforms.create(600, 400, 'ground');
48+
platforms.create(50, 250, 'ground');
49+
platforms.create(750, 220, 'ground');
50+
platforms.create
51+
player = this.physics.add.sprite(100, 450, 'dude');
52+
player.setBounce(0.2);
53+
player.setCollideWorldBounds(true);
54+
this.anims.create({
55+
key: 'left',
56+
frames: this.anims.generateFrameNumbers('dude', {
57+
start: 0,
58+
end: 3
59+
}),
60+
frameRate: 10,
61+
repeat: -1
62+
});
63+
64+
this.anims.create({
65+
key: 'turn',
66+
frames: [{
67+
key: 'dude',
68+
frame: 4
69+
}],
70+
frameRate: 20
71+
});
72+
73+
this.anims.create({
74+
key: 'right',
75+
frames: this.anims.generateFrameNumbers('dude', {
76+
start: 5,
77+
end: 8
78+
}),
79+
frameRate: 10,
80+
repeat: -1
81+
});
82+
83+
cursors = this.input.keyboard.createCursorKeys();
84+
stars = this.physics.add.group({
85+
key: 'star',
86+
repeat: 11,
87+
setXY: {
88+
x: 12,
89+
y: 0,
90+
stepX: 70
91+
}
92+
});
93+
94+
stars.children.iterate(function (child) {
95+
child.setBounceY(Phaser.Math.FloatBetween(0.4, 0.8));
96+
});
97+
98+
bombs = this.physics.add.group();
99+
100+
scoreText = this.add.text(16, 16, 'score: 0', {
101+
fontSize: '32px',
102+
fill: '#000'
103+
});
104+
105+
this.physics.add.collider(player, platforms);
106+
this.physics.add.collider(stars, platforms);
107+
this.physics.add.collider(bombs, platforms);
108+
109+
this.physics.add.overlap(player, stars, collectStar, null, this);
110+
111+
this.physics.add.collider(player, bombs, hitBomb, null, this);
112+
}
113+
114+
function update() {
115+
if (gameOver) {
116+
return;
117+
}
118+
119+
if (cursors.left.isDown) {
120+
player.setVelocityX(-160);
121+
122+
player.anims.play('left', true);
123+
} else if (cursors.right.isDown) {
124+
player.setVelocityX(160);
125+
126+
player.anims.play('right', true);
127+
} else {
128+
player.setVelocityX(0);
129+
130+
player.anims.play('turn');
131+
}
132+
133+
if (cursors.up.isDown && player.body.touching.down) {
134+
player.setVelocityY(-330);
135+
}
136+
}
137+
138+
function collectStar(player, star) {
139+
star.disableBody(true, true);
140+
141+
score += 10;
142+
scoreText.setText('Score: ' + score);
143+
144+
if (stars.countActive(true) === 0) {
145+
stars.children.iterate(function (child) {
146+
147+
child.enableBody(true, child.x, 0, true, true);
148+
149+
});
150+
151+
var x = (player.x < 400) ? Phaser.Math.Between(400, 800) : Phaser.Math.Between(0, 400);
152+
153+
var bomb = bombs.create(x, 16, 'bomb');
154+
bomb.setBounce(1);
155+
bomb.setCollideWorldBounds(true);
156+
bomb.setVelocity(Phaser.Math.Between(-200, 200), 20);
157+
bomb.allowGravity = false;
158+
159+
}
160+
}
161+
162+
function hitBomb(player, bomb) {
163+
this.physics.pause();
164+
165+
player.setTint(0xff0000);
166+
167+
player.anims.play('turn');
168+
169+
gameOver = true;
170+
}

0 commit comments

Comments
 (0)