Documentation
Welcome to EaseRTC
EaseRTC is an Opensource Library for WebRTC.
With EaseRTC you can use our easy APIs to shorten your long code. Our easy Documentation can make you understand how all things work.
How To Install
You will need to install Git Bash
Then, let's clone the GitHub repository
git clone https://github.com/CodingReef/EaseRTC.git
Or you can just add the following code snippet in the head tag of your html file
<script src="https://codingreef.github.io/EaseRTC/EaseRTC.js" ></script>
NOTE: If you clone the git repository you will have a pre-built example that you can run.
Supported APIs
First, let's make an instance of the library's class to use the APIs inside it.
var easeRTC = new EaseRTC(configuration);
Here, replace configuration with your ICE-Servers. More on ICE-Servers HERE
then you can use the following supported APIs
easeRTC.createOffer(video, audio);
easeRTC.createAnswer(offerSDP, video, audio);
easeRTC.connectToAnswer(answerSDP);
easeRTC.getTracks();
easeRTC.changeTrack();
easeRTC.getMedia(video, audio);
easeRTC.createOffer(video, audio);
The createOffer API accepts 2 values, video and audio - these parameters describe the media types requested. Either or both must be specified. This is used in the offerer's side
This API returns the user's media stream and the offer SDP.
Here are some examples
easeRTC.createOffer(true, true).then(data=>{
//data is in the json format.
//you have to write your server code to pass the following offer to the answerer
console.log(data.offer);
//this holds this user's video and audio
console.log(data.stream);
document.getElementById('local').srcObject = data.stream;
});
easeRTC.createOffer({width: 1280, height: 720}, true).then(data=>{
console.log(data.offer);
console.log(data.stream);
document.getElementById('local').srcObject = data.stream;
});
easeRTC.createOffer({
width: { min: 1024, ideal: 1280, max: 1920 },
height: { min: 576, ideal: 720, max: 1080 }}, true).then(data=>{
console.log(data.offer);
console.log(data.stream);
document.getElementById('local').srcObject = data.stream;
});
easeRTC.createOffer({ facingMode: "user" }, true).then(data=>{
console.log(data.offer);
console.log(data.stream);
document.getElementById('local').srcObject = data.stream;
});
easeRTC.createAnswer(offerSDP, video, audio);
The createAnswer API accepts 3 values - offerSDP this is the configuration given by the createOffer API, video and audio (same as createOffer). This API used in the answerer's side
This API returns the users media stream and the answer SDP.
Here is an example
easeRTC.createAnswer(/*pass the var which holds the offerSDP*/,true, true).then(data=>{
//data is in the json format.
//you have to write your server code to pass the following offer to the answerer
console.log(data.offer);
//this holds this user's video and audio
console.log(data.stream);
document.getElementById('local').srcObject = data.stream;
});
The same kind of media configurations from createOffer API can be used for this API too.
easeRTC.connectToAnswer(answerSDP);
The connectToSDP API accepts 1 value - the answer SDP created by the answerer. This API used in the offer-er's side
This API returns an status, weather the connection is successful or not
Here is an example
easeRTC.createAnswer(/*pass the var which holds the offerSDP*/).then(status=>{
console.log(status)
});
easeRTC.getTracks();
Okay, so now both the users are sharing their video and audio but they don't display them. To do so we use the getTracks API. This API gets the other user's audio and video.
This API returns an media stream object
Here's an example
easeRTC.getTrack().then(stream=>{
console.log(stream);
document.getElementById('remote').srcObject=stream;
});
easeRTC.changeTrack();
What if the user wants to turn off the video or audio. For this, we use the change Tracks API.
NOTE: THIS JUST CHANGES THE TRACKS, BUT TO TAKE EFFECT YOU HAVE TO REINITIATE THE FULL OFFERING AND ANSWERING PART
This API returns a media stream object
Here's an example
easeRTC.changeTrack(true, false).then(stream=>{
console.log(stream);
document.getElementById('local').srcObject=stream;
});
You can change the true and false value with different configurations as you wish.
easeRTC.getMedia(video, audio);
This is not required for creating the video call but can be used somewhere else if required.
Here's an example
easeRTC.getMedia(true, false).then(stream=>{
console.log(stream);
//you can use this as you wish
});
You can change the true and false value with different configurations as you wish.
What next?
Now that you know what to do, you can develop your own WebRTC Calling App/Website. If you come across any issue or problems you can start a new issue on GitHub, we will respond to you with the solution. And don't forget to check out our example files (run index.html).
Want to contribute?
As this is an open-source project you can add your advancement to this and contribute it, we'll see if it works and publish it. Make sure to add your name in the Contributors List.md file before you contribute it. thanks!!!
For any quires contact us using:
Email: support@codingreef.com
Thank you for using EaseRTC
CodingReef Developers and Condtributors