-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
69 lines (64 loc) · 2.27 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
<html>
<head>
<title>Asteroids 2P</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<link href="application.css" rel="stylesheet"/>
<link href='http://fonts.googleapis.com/css?family=Press+Start+2P' rel='stylesheet' type='text/css'>
</head>
<body>
<canvas id="game-canvas"></canvas>
<script src="lib/movingObject.js"></script>
<script src="lib/utils.js"></script>
<script src="lib/asteroid.js"></script>
<script src="lib/game.js"></script>
<script src="lib/gameView.js"></script>
<script src="lib/ship.js"></script>
<script src="lib/keymaster.js"></script>
<script src="lib/bullet.js"></script>
<script src="lib/stardust.js"></script>
<section class="start-screen">
<h1>Asteroids 2P</h1>
<h3>P1 Controls:</h3>
<ul class="controls">
<li>W = forward</li>
<li>A = turn left</li>
<li>D = turn right</li>
<li>space = fire</li>
</ul>
<h3>P2 Controls:</h3>
<ul class="controls">
<li>up = forward</li>
<li>left = turn left</li>
<li>right = turn right</li>
<li>enter = fire</li>
</ul>
<button class="start">Play</button>
</section>
<section class="game-over-screen hidden">
<h1 class="score1"></h1>
<h1 class="score2"></h1>
<button class="restart">Play Again</button>
</section>
<script>
var canvasEl = document.getElementsByTagName("canvas")[0];
var game = new Asteroids.Game();
$("#game-canvas").attr("width", Asteroids.DIM_X);
$("#game-canvas").attr("height", Asteroids.DIM_Y);
var ctx = canvasEl.getContext("2d");
$('.start').on('click', function (event) {
event.preventDefault();
$(".start-screen").addClass("hidden");
Asteroids.currentGameView = new Asteroids.GameView(game, ctx);
Asteroids.currentGameView.start();
});
$('.restart').on('click', function (event) {
event.preventDefault();
delete Asteroids.currentGameView;
$(".game-over-screen").addClass("hidden");
game = new Asteroids.Game();
Asteroids.currentGameView = new Asteroids.GameView(game, ctx);
Asteroids.currentGameView.start();
});
</script>
</body>
</html>