-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
107 lines (101 loc) · 3.63 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
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
<!--<!DOCTYPE html>-->
<!--<html lang="en">-->
<!--<head>-->
<!-- <meta charset="utf-8">-->
<!-- <title>Millennium Falcon</title>-->
<!-- <link rel="stylesheet" href="./css/style.css">-->
<!--<!– <script src="https://cdn.observableusercontent.com/npm/dat.gui@0.7.9/build/dat.gui.js"></script>–>-->
<!--<!–<!– <script type="text/javascript" src="dat.gui.min.js"></script>–>–>-->
<!-- <script async src="https://unpkg.com/es-module-shims@1.6.3/dist/es-module-shims.js"></script>-->
<!-- <script type="importmap">-->
<!-- {-->
<!-- "imports": {-->
<!-- "three": "https://unpkg.com/three@v0.163.0/build/three.module.js",-->
<!-- "three/addons/": "https://unpkg.com/three@v0.163.0/examples/jsm/"-->
<!-- }-->
<!-- }-->
<!-- </script>-->
<!-- <style>-->
<!-- body {-->
<!-- display: flex;-->
<!-- flex-direction: row;-->
<!-- }-->
<!-- #scene {-->
<!-- width: 1024px; /* Set the desired width */-->
<!-- height: 768px; /* Set the desired height */-->
<!-- position: relative;-->
<!-- }-->
<!-- #controls {-->
<!-- display: flex;-->
<!-- flex-direction: column;-->
<!-- transform: scale(0.9);-->
<!-- }-->
<!-- </style>-->
<!--</head>-->
<!--<body>-->
<!--<!– <div id="controls">–>-->
<!--<!– <p>Enable Godzilla movement:</p>–>-->
<!--<!– <button id="godzilla-move-button">Go</button>–>-->
<!--<!– <p>Enable Gobject 2 movement</p>–>-->
<!--<!– <button id="obj2-move-button">Go</button>–>-->
<!--<!– <p>Enable object 3 movement:</p>–>-->
<!--<!– <button id="obj3-move-button">Go</button>–>-->
<!--<!– <p>Enable light source movement:</p>–>-->
<!--<!– <button id="light-move-button">Go</button>–>-->
<!--<!– <p>Light brightness:</p>–>-->
<!--<!– <input type="range" id="light-brightness-range" min="0" max="20000" value="20000" />–>-->
<!--<!– </div>–>-->
<!-- <div id="scene"></div>-->
<!-- <script type="module" src="./js/main.js"></script>-->
<!--<div id="gui_container"></div>-->
<!--</body>-->
<!--</html>-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Millennium Falcon</title>
<link rel="stylesheet" href="./css/style.css">
<script async src="https://unpkg.com/es-module-shims@1.6.3/dist/es-module-shims.js"></script>
<script type="importmap">
{
"imports": {
"three": "https://unpkg.com/three@v0.163.0/build/three.module.js",
"three/addons/": "https://unpkg.com/three@v0.163.0/examples/jsm/"
}
}
</script>
<style>
body {
display: flex;
flex-direction: row;
}
#scene {
width: 1024px; /* Set the desired width */
height: 768px; /* Set the desired height */
position: relative;
}
#controls {
display: flex;
flex-direction: column;
transform: scale(0.9);
}
</style>
</head>
<body>
<div id="controls">
<p>Enable Godzilla movement:</p>
<button id="godzilla-move-button">Go</button>
<p>Enable Gobject 2 movement</p>
<button id="obj2-move-button">Go</button>
<p>Enable object 3 movement:</p>
<button id="obj3-move-button">Go</button>
<p>Enable light source movement:</p>
<button id="light-move-button">Go</button>
<p>Light brightness:</p>
<input type="range" id="light-brightness-range" min="0" max="20000" value="20000" />
</div>
<div id="scene"></div>
<script type="module" src="./js/main.js"></script>
</body>
</html>