mirror of
https://api.glitch.com/git/yaswvc
synced 2026-01-12 03:18:10 +00:00
84 lines
2.8 KiB
HTML
84 lines
2.8 KiB
HTML
<!-- This is a static file -->
|
|
<!-- served from your routes in server.js -->
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="description" content="Yet Another Simple WebRTC Video Chat">
|
|
|
|
<title>YASWVC</title>
|
|
|
|
<link id="favicon" rel="icon" href="https://glitch.com/edit/favicon-app.ico" type="image/x-icon">
|
|
<!-- import the webpage's stylesheet -->
|
|
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
|
|
<link rel="stylesheet" href="/style.css">
|
|
|
|
<!-- import libraries -->
|
|
<script src="/lib/peerjs.js"></script>
|
|
|
|
<!-- import the webpage's client-side javascript file -->
|
|
<script src="/main.js" type="module"></script>
|
|
|
|
</head>
|
|
<body>
|
|
<!-- Image and text -->
|
|
<nav class="navbar navbar-light bg-light">
|
|
<a class="navbar-brand" href="#">
|
|
<img src="/docs/4.5/assets/brand/bootstrap-solid.svg" width="30" height="30" class="d-inline-block align-top" alt="" loading="lazy">
|
|
Yet Another Simple WebRTC Video Chat
|
|
</a>
|
|
</nav>
|
|
<div class="container pt-3">
|
|
<div class="row">
|
|
<div class="col-6">
|
|
<div class="card">
|
|
<video id="localVideo" class="card-img-top" autoplay></video>
|
|
<h5 class="card-title">Me</h5>
|
|
<div class="card-body">
|
|
<p class="card-text"></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-6">
|
|
<div class="card">
|
|
<video id="remoteVideo" class="card-img-top" autoplay></video>
|
|
<h5 class="card-title">Remote</h5>
|
|
<div class="card-body">
|
|
<p class="card-text"></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<input type="text" id="connect-to-peer" />
|
|
<button onclick="connectToPeer()">
|
|
Connect
|
|
</button>
|
|
<button onclick="disconnectFromPeer()">
|
|
Disconnect
|
|
</button>
|
|
<hr>
|
|
<p>Get available audio, video sources and audio output devices from <code>mediaDevices.enumerateDevices()</code>
|
|
then set the source for <code>getUserMedia()</code> using a <code>deviceId</code> constraint.</p>
|
|
|
|
<div class="select">
|
|
<label for="audioSource">Audio input source: </label><select id="audioSource"></select>
|
|
</div>
|
|
|
|
<div class="select">
|
|
<label for="audioOutput">Audio output destination: </label><select id="audioOutput"></select>
|
|
</div>
|
|
|
|
<div class="select">
|
|
<label for="videoSource">Video source: </label><select id="videoSource"></select>
|
|
</div>
|
|
<hr>
|
|
<div class="messages">
|
|
|
|
</div>
|
|
|
|
<footer>Made with <a href="https://glitch.com">Glitch</a>!</footer>
|
|
</body>
|
|
</html>
|