forked from swift502/Sketchbook
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
48 lines (39 loc) · 2 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
<!DOCTYPE html>
<html>
<head>
<title>Sketchbook - Characters</title>
<link href="https://fonts.googleapis.com/css?family=Cutive+Mono" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Averia+Sans+Libre:300,400,700" rel="stylesheet">
</head>
<body>
<div id="loader">
Loading...
</div>
<div id="ui-container">
<div class="github-corner"><a href="https://github.com/swift502/Sketchbook" target="_blank" title="Fork me on GitHub"><svg viewbox="0 0 100 100" fill="currentColor"><title>Fork me on GitHub</title><path d="M0 0v100h100V0H0zm60 70.2h.2c1 2.7.3 4.7 0 5.2 1.4 1.4 2 3 2 5.2 0 7.4-4.4 9-8.7 9.5.7.7 1.3 2 1.3 3.7V99c0 .5 1.4 1 1.4 1H44s1.2-.5 1.2-1v-3.8c-3.5 1.4-5.2-.8-5.2-.8-1.5-2-3-2-3-2-2-.5-.2-1-.2-1 2-.7 3.5.8 3.5.8 2 1.7 4 1 5 .3.2-1.2.7-2 1.2-2.4-4.3-.4-8.8-2-8.8-9.4 0-2 .7-4 2-5.2-.2-.5-1-2.5.2-5 0 0 1.5-.6 5.2 1.8 1.5-.4 3.2-.6 4.8-.6 1.6 0 3.3.2 4.8.7 2.8-2 4.4-2 5-2z"></path></svg></a></div><style> .github-corner{position:absolute;left:0;top:0;width:120px;height:120px;overflow:hidden;}.github-corner a{position:absolute;right:0;top:0;left:0;bottom:0;transform:translate(-50%, -50%) rotate(-45deg);color:#000000;}</style>
<div class="info-box">
<div id="controls-menu" class="info-card">
</div>
</div>
<div id="debug-menu" class="info-card">
<div class="info-title">Debug:</div>
<div class="info-row"><div id="state-debug"></div></div>
<div class="info-row"><div id="car-debug"></div></div>
</div>
</div>
<script src="/build/sketchbook.min.js"></script>
<script>
const SB = Sketchbook;
// Initialize sketchbook
let world = new SB.World();
// Setup camera
world.cameraOperator.theta = 90;
world.cameraOperator.phi = 10;
// World
world.loadingManager.loadGLTF('build/assets/world.glb', function(gltf)
{
world.loadScene(gltf);
});
</script>
</body>
</html>