jgerstbe/yaswvc
1
0
Fork 0
mirror of https://api.glitch.com/git/yaswvc synced 2026-01-11 23:18:11 +00:00
Code Issues Releases Wiki Activity

🌴🚶 Checkpoint

Browse source 
./README.md:5975361/1332
./package.json:5975361/375
./views/index.html:5975361/154
./public/main.js:5975361/152
This commit is contained in:
Glitch (peerjs-video) 2020-09-07 20:21:49 +00:00
parent 4a61a39c24
commit 7cbe9a1ba3
4 changed files with 11 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

33
README.md
View file

@ -1,30 +1,3 @@
# hello-express
A server that serves a webpage, its resources, and some data
## Your Project
On the front-end,
- Edit `views/index.html` to change the content of the webpage
- `public/client.js` is the javacript that runs when you load the webpage
- `public/style.css` is the styles for `views/index.html`
- Drag in `assets`, like images or music, to add them to your project
On the back-end,
- your app starts at `server.js`
- add frameworks and packages in `package.json`
- safely store app secrets in `.env` (nobody can see this but you and people you invite)
Click `Show` in the header to see your app live. Updates to your code will instantly deploy.
## Made by [Glitch](https://glitch.com/)
**Glitch** is the friendly community where you'll build the app of your dreams. Glitch lets you instantly create, remix, edit, and host an app, bot or site, and you can invite collaborators or helpers to simultaneously edit code with you.
Find out more [about Glitch](https://glitch.com/about).
( ᵔ ᴥ ᵔ )
# YASWVC - Yet Another Simple WebRTC Video Chat
- simple webrtc videochat using peerjs
- based on [https://glitch.com/~peerjs-video](https://glitch.com/~peerjs-video)

10
package.json
View file

@ -1,10 +1,7 @@
{
"//1": "describes your app and its dependencies",
"//2": "https://docs.npmjs.com/files/package.json",
"//3": "updating this file will download and update your packages",
"name": "hello-express",
"name": "yaswvc",
"version": "0.0.1",
"description": "A simple Node app built on Express, instantly up and running.",
"description": "Yet Another Simple WebRTC Video Chat",
"main": "server.js",
"scripts": {
"start": "node server.js"
@ -16,9 +13,6 @@
"engines": {
"node": "12.x"
},
"repository": {
"url": "https://glitch.com/edit/#!/hello-express"
},
"license": "MIT",
"keywords": [
"node",

5
public/main.js
View file

@ -13,8 +13,8 @@ let logMessage = (message) => {
messagesEl.appendChild(newMessage);
};
let renderVideo = (stream) => {
videoEl.srcObject = stream;
let renderVideo = (stream, selector = '.remote-video') => {
document.querySelector(selector).srcObject = stream;
};
// Register with the peer server
@ -45,6 +45,7 @@ peer.on('call', (call) => {
navigator.mediaDevices.getUserMedia({video: true, audio: true})
.then((stream) => {
call.answer(stream); // Answer the call with an A/V stream.
renderVideo(stream, '#localVideo')
call.on('stream', renderVideo);
})
.catch((err) => {

5
views/index.html
View file

@ -6,9 +6,9 @@
<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="A cool thing made with Glitch">
<meta name="description" content="Yet Another Simple WebRTC Video Chat">
<title>Welcome to Glitch!</title>
<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 -->
@ -21,6 +21,7 @@
<script src="/main.js" type="module"></script>
</head>
<body>
<video id="localVideo" autoplay></video>
<video class="remote-video" autoplay></video>
<input type="text" id="connect-to-peer" />
<button onclick="connectToPeer()">