-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
78 lines (65 loc) · 3.53 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
<!doctype html>
<html lang="en">
<head>
<title>Audio channels</title>
<meta name="description" content="Social audio app">
<meta name="author" content="QVDev">
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="apple-touch-icon" sizes="180x180" href="./fav/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="./fav/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="./fav/favicon-16x16.png">
<link rel="manifest" href="./fav/site.webmanifest">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="theme-color" content="#ffffff">
<link href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel="stylesheet">
<script src="./config.js"></script>
<script src="./clicks.js"></script>
<script src="https://cdn.jsdelivr.net/npm/gun/gun.js"></script>
</head>
<body style="background-color: beige;">
<div class="container mx-auto h-screen p-20 items-center">
<div class="flex">
<div class="m-auto">
<P class="text-6xl text-center font-bold text-black">Listen now</P>
</div>
</div>
<div id="room-grid" class="grid grid-cols-1 md:grid-cols-3 gap-6 p-6 my-6">
<!-- Create room card -->
<div id="room_card_{0}" class="p-6 max-w-sm mx-auto bg-white rounded-xl shadow-md flex space-x-4 relative w-full">
<div class="w-full">
<div class="text-xl font-medium text-black w-full my-2">Start a room</div>
<div class="mb-3 pt-0">
<input id="create_title" type="text" placeholder="Room name" required class="px-3 py-3 placeholder-gray-400 text-gray-700 relative bg-white bg-white rounded text-sm shadow outline-none focus:outline-none focus:shadow-outline w-full" />
</div>
<div class="mb-3 pt-0">
<input id="create_description" type="text" placeholder="Description" required class="px-3 py-3 placeholder-gray-400 text-gray-700 relative bg-white bg-white rounded text-sm shadow outline-none focus:outline-none focus:shadow-outline w-full" />
</div>
<p class="text-gray-500">
<button class="bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded-full w-full" onclick="createRoom()">Start</button>
</p>
</div>
</div>
<!-- Create room card -->
<!-- Rooms be filled automatically by room.js when there are rooms available -->
</div>
<!-- Audio visualizer from local audio -->
<canvas id="visualizer" class="visualizer visualizer absolute top-20 right-4 pointer-events-none"></canvas>
<!-- Audio visualizer from local audio -->
</div>
<script src="./room.js"></script>
<!-- <script src="./visualizer.js"></script> -->
<script src="dist/speex.min.js"></script>
<!-- Dependencies -->
<script src="public/js/lib/xaudio.js"></script>
<script src="public/js/lib/pcmdata.min.js"></script>
<!-- Other Libraries/Polyfills -->
<script src="public/js/lib/usertiming.js"></script>
<script src="public/js/lib/bitstring.js"></script>
<!-- For input/microphone handling and codec API usage -->
<script src="public/js/microphone.js"></script>
<script src="public/js/application.js"></script>
<!-- DamSocket -->
<script src="public/js/websocket.js"></script>
</body>
</html>