-
Notifications
You must be signed in to change notification settings - Fork 0
/
map.html
68 lines (68 loc) · 2.15 KB
/
map.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
<!-- Graphics Example Code.
index.html - The web page document containing the canvas (drawing surface). It launches your JavaScript files.
-->
<!DOCTYPE html>
<html lang="En">
<head>
<meta charset="UTF-8" />
<link href="assets/fav.ico" rel="icon" />
<link rel="stylesheet" href="./css/style.css" />
<link rel="stylesheet" href="./css/modal.css" />
<title>Tiny Graphics</title>
</head>
<body style="background: White">
<div id="myModal" class="modal">
<!-- Modal content -->
<div class="modal-content">
<h1 class="victory">Victory</h1>
<div class="statistics">
<div class="final-score">Score:</div>
<div class="time">Time Left:</div>
</div>
<div class="button-container">
<a href="/index.html">MENU</a>
<button onClick="window.location.reload();">
PLAY AGAIN
</button>
</div>
</div>
</div>
<div class="modal-defeat">
<div class="modal-content">
<h1 class="victory defeat">You Lose</h1>
<div class="button-container defeat">
<a href="/index.html">MENU</a>
<button onClick="window.location.reload();">
PLAY AGAIN
</button>
</div>
</div>
</div>
<!-- Begin typing your web page here. -->
<!-- The following code embeds a WebGL canvas panel, loads certain scene(s), and displays panel(s) of their controls.-->
<div class="canvas-widget" id="main-canvas">
<div class="scoreboard">
<span class="score">Score: 0</span>
<span class="laps">Laps: 1/3</span>
<span class="time-left">Time: </span>
</div>
</div>
<script type="module">
// ********************* THE ENTRY POINT OF YOUR WHOLE PROGRAM STARTS HERE *********************
// Indicate which element on the page you want the Canvas_Widget to replace with a 3D WebGL area:
const element_to_replace =
document.querySelector('#main-canvas');
import {
Main_Scene,
Additional_Scenes,
Canvas_Widget,
} from './maps/main-scene.js';
// Import the file that defines a scene.
const scenes = [Main_Scene, ...Additional_Scenes].map(
(scene) => new scene()
);
// This line creates your scene.
new Canvas_Widget(element_to_replace, scenes);
</script>
</body>
</html>