Webrtc-peercall NPM

webrtcStream

Functional custom element

Example

Description

custom element to make a call with another peer using custom signaling-server with the functionality in the section methods Using this custom element you can create a room for a call between two peers.

It's important to run the signaling-server 1- Download or clone it in your project from the server directory in this repository server. 2- Run through the command : node index.html.

Project setup

npm install

Usage

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Vite + Vue</title>
    <script type="module" crossorigin src="./dist/assets/index.562563e6.js"></script>
  </head>
  <body>
    <webrtc-call></webrtc-call>
  </body>
</html>

Props

name	type
socketurl	String
roomnamelabel	String
usernamelabel	String
videoheight	String, Number
videowidth	String, Number
doselfie	Boolean
dochat	Boolean

Methods

name	description
startStreaming	start video streaming
createRoom	To create a room for the call
joinRoom	To join a created room
leave	To leave the call
sendMsg	To send a message entered in the textarea
doMute	A toggel button to mute the sound
unMute	A toggel button to mute the sound
hideCam	A toggel button to hide the video cam
showCam	A toggel button to show the video cam

inline Demo

<custom-element-demo>
  <template>
    <script type="module" crossorigin src="./dist/assets/index.562563e6.js"></script>
    <link rel="import" href="./index.html"> 
    <webrtc-call></webrtc-call>
  </template>
</custom-element-demo>