2020-04-21 08:57:28 +00:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html>
|
|
|
|
|
<head lang="en">
|
|
|
|
|
<meta charset="UTF-8">
|
|
|
|
|
<title></title>
|
|
|
|
|
<script src="libs/jquery-2.1.1.min.js"></script>
|
|
|
|
|
<script src="libs/strophe/strophe.js"></script>
|
|
|
|
|
<script src="libs/strophe/strophe.disco.min.js?v=1"></script>
|
2020-04-23 15:41:51 +00:00
|
|
|
<link rel="stylesheet" href="libs/bootstrap.min.css">
|
2020-04-21 12:57:54 +00:00
|
|
|
<script src="libs/lib-jitsi-meet.min.js"></script>
|
2020-04-27 12:57:01 +00:00
|
|
|
<script src="script.js" ></script>
|
2020-04-23 15:40:39 +00:00
|
|
|
<style type="text/css">
|
|
|
|
|
body {
|
2020-12-26 21:37:44 +00:00
|
|
|
padding: 6px;
|
2020-04-27 14:38:31 +00:00
|
|
|
background-color: black;
|
|
|
|
|
color: #eeeeee;
|
2020-04-23 15:40:39 +00:00
|
|
|
}
|
2020-04-27 14:38:31 +00:00
|
|
|
input, button, select {
|
|
|
|
|
background-color: #111111;
|
|
|
|
|
color: #eeeeee;
|
|
|
|
|
border: 1px solid grey;
|
2020-04-27 12:57:01 +00:00
|
|
|
}
|
2020-04-27 15:34:48 +00:00
|
|
|
video {
|
|
|
|
|
display: block;
|
2020-12-26 21:01:13 +00:00
|
|
|
margin: 3px;
|
2020-04-27 15:34:48 +00:00
|
|
|
border: 1px dotted grey;
|
|
|
|
|
}
|
2020-12-26 21:01:13 +00:00
|
|
|
.video-row {
|
|
|
|
|
width: 100%;
|
|
|
|
|
}
|
2020-04-28 13:42:06 +00:00
|
|
|
.volume-slider {
|
|
|
|
|
text-align: center;
|
|
|
|
|
}
|
2020-04-27 12:57:01 +00:00
|
|
|
.container-fluid {
|
|
|
|
|
padding: 0;
|
2020-04-23 15:40:39 +00:00
|
|
|
}
|
|
|
|
|
.col-md-4 {
|
|
|
|
|
padding: 0 !important;
|
|
|
|
|
margin: 0 !important;
|
|
|
|
|
}
|
|
|
|
|
.row {
|
|
|
|
|
padding: 0 !important;
|
|
|
|
|
margin: 0 !important;
|
|
|
|
|
}
|
|
|
|
|
.video {
|
|
|
|
|
text-align: center;
|
2020-12-26 21:22:43 +00:00
|
|
|
overflow: hidden;
|
2020-04-23 15:40:39 +00:00
|
|
|
}
|
2020-04-28 22:49:45 +00:00
|
|
|
.volume {
|
|
|
|
|
display: inline-block;
|
|
|
|
|
margin-right: 10px;
|
|
|
|
|
width: 50px;
|
|
|
|
|
}
|
|
|
|
|
.name {
|
|
|
|
|
display: inline-block;
|
2020-04-29 14:48:07 +00:00
|
|
|
height: 24px;
|
2020-04-28 22:49:45 +00:00
|
|
|
overflow: hidden;
|
|
|
|
|
}
|
2020-04-23 15:40:39 +00:00
|
|
|
</style>
|
2020-04-21 08:57:28 +00:00
|
|
|
</head>
|
|
|
|
|
<body>
|
2020-04-27 14:38:31 +00:00
|
|
|
<div id="room-selector">
|
2020-04-28 16:23:49 +00:00
|
|
|
<form onsubmit="connect(event)">
|
|
|
|
|
<input type="text" id="room-name" placeholder="Room name"/><br />
|
2020-12-26 20:03:14 +00:00
|
|
|
<input type="text" id="room-password" placeholder="Room Password" /><br />
|
|
|
|
|
<input type="checkbox" id="use-local-video" /> Use local Video<br />
|
|
|
|
|
<input type="text" id="cols" value="3" /> Column count<br />
|
|
|
|
|
<input type="text" id="rows" value="3" /> Row count<br />
|
2020-04-28 16:23:49 +00:00
|
|
|
<button disabled id="room-name-button">Connect</button>
|
|
|
|
|
</form>
|
2020-04-27 12:57:01 +00:00
|
|
|
</div>
|
|
|
|
|
<div style="display: none" id="room">
|
2020-12-26 20:03:14 +00:00
|
|
|
<div class="container-fluid" id="video-container">
|
2020-04-23 15:40:39 +00:00
|
|
|
</div>
|
2020-12-26 20:19:59 +00:00
|
|
|
<button onclick="toggleMute()">Toggle all mute</button>
|
|
|
|
|
Currently: <span id="muted-status">Unmuted</span>
|
2020-04-27 12:57:01 +00:00
|
|
|
</div>
|
2020-04-23 15:40:39 +00:00
|
|
|
|
|
|
|
|
|
2020-04-21 08:57:28 +00:00
|
|
|
<div id="audioOutputSelectWrapper" style="display: none;">
|
|
|
|
|
Change audio output device
|
|
|
|
|
<select id="audioOutputSelect" onchange="changeAudioOutput(this)"></select>
|
|
|
|
|
</div>
|
2020-12-26 16:21:36 +00:00
|
|
|
<video autoplay='autoplay' id="localVideo"></video>
|
2020-04-21 08:57:28 +00:00
|
|
|
</body>
|
|
|
|
|
</html>
|
