-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
91 lines (63 loc) · 2.8 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
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>VU-VRM</title>
<link rel="stylesheet" href="./style.css">
</head>
<body>
<!-- three.min.js r110 -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/build/three.min.js"></script>
<!-- GLTFLoader.js -->
<script src="https://cdn.jsdelivr.net/gh/mrdoob/three.js@r110/examples/js/loaders/GLTFLoader.js"></script>
<!-- OrbitControls.js -->
<script src="https://cdn.jsdelivr.net/gh/mrdoob/three.js@r110/examples/js/controls/OrbitControls.js"></script>
<!-- pixiv three-vrm.js -->
<script src="https://unpkg.com/@pixiv/[email protected]/lib/three-vrm.js"></script>
<script src="./script.js"></script>
<div class="backplate" id="backplate" >
<h1>VU-VRM</h1>
<h3>A simple mic-driven VRM client</h3>
<h4>Mic access required / Designed for use in OBS</h4>
<h4>Built for hands-free webcam-free inclusivity</h4>
</div>
<div id="credits" class="credits" onclick="hideinfo()">
<p>v1.0 by itsTallulahhh</p>
<p>an Automattic Empathy</p>
<p>Microphone permission required</p>
<p>Click to dismiss</p>
</div>
<div id="infobar" class="infobar" >
<p><small>Launch OBS with these arguments to use this as a Browser Source:</small></p>
<p><span class="highlight">--use-fake-ui-for-media-stream --allow-file-access-from-files</span></p>
</div>
<div class="interface" id="interface" onclick="interface()">
<div class="closebtn" id="closebtn" onclick="hideinterface()">❌</div>
<div class="sliders" id="sliders">
<p>
<span class="controlboxlabel">Input Volume VU</span>
<input type="range" min="0" max="100" value="10" class="slider" id="inputlevel">
<br>
<span class="controlboxlabel">Mouth Threshold</span>
<input type="range" min="0" max="50" value="10" class="slider" id="mouththreshold">
<br>
<span class="controlboxlabel">Body Threshold</span>
<input type="range" min="0" max="50" value="10" class="slider" id="bodythreshold">
<br>
<span class="controlboxlabel">Mouth Gain Boost</span>
<input type="range" min="0" max="25" value="10" class="slider" id="mouthboost">
<br>
<span class="controlboxlabel">Body Gain Boost</span>
<input type="range" min="0" max="25" value="10" class="slider" id="bodymotion">
<br>
<span class="controlboxlabel">Serious / Smiling</span>
<input type="range" min="0" max="100" value="80" class="slider" id="expression">
</p>
</div>
<div class="fileinput" id="fileinput">
<p>
<input id="file" class="file" type="file" accept=".vrm,.VRM" onchange="dofile()"></p>
</div>
</div>
</body>
</html>