This repository has been archived by the owner on Mar 14, 2022. It is now read-only.
generated from putukrisna6/threejs-template
-
Notifications
You must be signed in to change notification settings - Fork 2
/
index.html
88 lines (83 loc) · 2.73 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
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
<!DOCTYPE html>
<html lang="en">
<head>
<title>RC Time Trial - a 3d racing game</title>
<meta charset="utf-8" />
<meta
name="viewport"
content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"
/>
<meta
name="description"
content="Time trial using Three.js and Cannon.js"
/>
<meta property="og:type" content="product" />
<meta property="og:title" content="RC Time Trial - a 3d racing game" />
<meta
property="og:description"
content="Time trial using Three.js and Cannon.js"
/>
<meta property="og:image:alt" content="RC Time Trial - a 3d racing game" />
<link
href="https://fonts.googleapis.com/css?family=IBM+Plex+Sans|Kavivanar"
rel="stylesheet"
/>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div id="welcome">
<div class="content">
<h2>Welcome to RC Car Game Time Trial</h2>
<br />
<p>Use WSAD to move the car</p>
<p>Press R to reload the game</p>
<p>Try to collect all 20 coins before the time runs out!</p>
</div>
</div>
<div id="gameover">
<div class="content">
<h2>Oh no, time ran out :(</h2>
<br />
<p>Unfortunately you didn't collected all of the coins.</p>
</div>
</div>
<div id="finished">
<div class="content">
<h2>Congratulations, you win!</h2>
<br />
<p>You have collected all of the coins.</p>
</div>
</div>
<button id="reset-btn"><i class="fas fa-car"></i></button>
<div class="score">
<img class="score__image" src="./assets/images/coin.png" alt="Coin" />
<h2 class="score__current" id="score">0</h2>
<b>/</b>
<h2 class="score__max" id="max-score">0</h2>
</div>
<h1 id="time"></h1>
<script src="./libs/three.min.js"></script>
<script src="./libs/inflate.min.js"></script>
<script src="./libs/FBXLoader.js"></script>
<script src="./libs/OrbitControls.js"></script>
<script src="./libs/Detector.js"></script>
<script src="./libs/cannon.min.js"></script>
<script src="./libs/CannonDebugRenderer.js"></script>
<script src="./utils/preloader.js"></script>
<script src="./utils/sfx.js"></script>
<script src="game.js"></script>
<script src="./utils/timer.js"></script>
<script
defer
src="https://use.fontawesome.com/releases/v5.0.13/js/all.js"
integrity="sha384-xymdQtn1n3lH2wcu0qhcdaOpQwyoarkgLVxC/wZ5q7h9gHtxICrpcaSUfygqZGOe"
crossorigin="anonymous"
></script>
<script>
document.addEventListener('DOMContentLoaded', function () {
const game = new Game();
window.game = game; //For debugging only
});
</script>
</body>
</html>