RTCMultiConnection: A JavaScript repository from sanjaynarayan

/ Wiki Pages / Documentation / FAQ / Demos / Changes Log

WebRTC Library

Quick-Demos for newbies:

http://jsfiddle.net/zar6fg60/ (simplest)
http://jsfiddle.net/c46de0L8/ (simple)

    <td>
        <a href="http://www.rtcmulticonnection.org/docs/getting-started/" target="_blank">
            <img src="http://www.rtcmulticonnection.org/img/getting-started.png" style="display:block; width:99px; height99px;" alt="Getting-Started">
            Getting Started
        </a>
    </td>
    
    <td>
        <a href="http://www.rtcmulticonnection.org/docs/" target="_blank">
            <img src="http://www.rtcmulticonnection.org/img/documentation.png" style="display:block; width:99px; height99px;" alt="Documentation">
            Documentation
        </a>
    </td>
    
    <td>
        <a href="http://www.rtcmulticonnection.org/changes-log/" target="_blank">
            <img src="http://www.rtcmulticonnection.org/img/whats-new.png" style="display:block; width:99px; height99px;" alt="Changes Log">
            Changes Log
        </a>
    </td>
    
    <td>
        <a href="http://www.rtcmulticonnection.org/FAQ/" target="_blank">
            <img src="http://www.rtcmulticonnection.org/img/FAQ.png" style="display:block; width:99px; height99px;" alt="FAQ">
            FAQ
        </a>
    </td>
</tr>

Demos

RTCMultiConnection is a WebRTC JavaScript wrapper library runs top over RTCPeerConnection API to provide multi-session establishment scenarios. It also provides dozens of features as hybrid-less mesh networking model, a reliable presence detection and syncing system; complex renegotiation scenarios; and much more. It provides everything you've in your mind! Just understand the API and you'll enjoy using it! It is simple and its syntax is similar as WebSockets JavaScript API and RTCPeerConnection API.

It is MIT Licenced, which means that you can use it in any commercial/non-commercial product, free of cost.

Upgrade? Please check list of breaking changes

bower install rtcmulticonnection

# or NPM!
npm install rtcmulticonnection

To use it:

<script src="./node_modules/rtcmulticonnection/RTCMultiConnection.js"></script>

There are some other NPM packages regarding RTCMultiConnection:

https://www.npmjs.org/search?q=RTCMultiConnection

1. Link The Library

// latest file
https://cdn.webrtc-experiment.com/RTCMultiConnection-v2.2.3.js

// or a little bit more stable version: (v2.*.*)
https://cdn.webrtc-experiment.com/RTCMultiConnection.js

2. Common Code

var MODERATOR_CHANNEL_ID = 'ABCDEF'; // channel-id
var MODERATOR_SESSION_ID = 'XYZ';    // room-id
var MODERATOR_ID         = 'JKL';    // user-id
var MODERATOR_SESSION    = {         // media-type
    audio: true,
    video: true
};
var MODERATOR_EXTRA      = {};       // empty extra-data

3. Code for Room Moderator (i.e. Initiator)

var moderator     = new RTCMultiConnection(MODERATOR_CHANNEL_ID);
moderator.session = MODERATOR_SESSION;
moderator.userid  = MODERATOR_ID;
moderator.extra   = MODERATOR_EXTRA;
moderator.open({
    dontTransmit: true,
    sessionid   : MODERATOR_SESSION_ID
});

4. Code for Room Participants

var participants = new RTCMultiConnection(MODERATOR_CHANNEL_ID);
participants.join({
    sessionid: MODERATOR_SESSION_ID,
    userid   : MODERATOR_ID,
    extra    : MODERATOR_EXTRA,
    session  : MODERATOR_SESSION
});

5. (optional) Handle how to get streams

// same code can be used for participants
// (it is optional) 
moderator.onstreamid = function(event) {
    // got a clue of incoming remote stream
    // didn't get remote stream yet
    
    var incoming_stream_id = event.streamid;
    
    YOUR_PREVIEW_IMAGE.show();
    
    // or
    YOUR_PREVIEW_VIDEO.show();
};

// same code can be used for participants
// it is useful
moderator.onstream = function(event) {
    // got local or remote stream
    // if(event.type == 'local')  {}
    // if(event.type == 'remote') {}
    
    document.body.appendChild(event.mediaElement);
    
    // or YOUR_VIDEO.src = event.blobURL;
    // or YOUR_VIDEO.src = URL.createObjectURL(event.stream);
};

// same code can be used for participants
// it is useful but optional
moderator.onstreamended = function(event) {
    event.mediaElement.parentNode.removeChild(event.mediaElement);
};

Simplest Demo

<hr /><button id="openRoom">Open Room</button>
      <button id="joinRoom">Join Room</button><hr />
<script src="https://cdn.webrtc-experiment.com/RTCMultiConnection.js"> </script>
<script>
document.getElementById('openRoom').onclick = function() {
    (new RTCMultiConnection).open();
};
document.getElementById('joinRoom').onclick = function() {
    (new RTCMultiConnection).connect();
};
</script>

Demos using RTCMultiConnection

Experiment Name	Demo	Source Code
AppRTC like RTCMultiConnection demo!	Demo	Source
MultiRTC! RTCMultiConnection all-in-one demo!	Demo	Source
Collaborative Canvas Designer	Demo	Source
Conversation.js - Skype like library	Demo	Source
All-in-One test	Demo	Source
Multi-Broadcasters and Many Viewers	Demo	Source
Select Broadcaster at runtime	Demo	Source
OneWay Screen & Two-Way Audio	Demo	Source
Stream Mp3 Live	Demo	Source
Socket.io auto Open/Join rooms	Demo	Source
Screen Sharing & Cropping	Demo	Source
Share Part of Screen without cropping it	Demo	Source
getMediaDevices/enumerateDevices	Demo	Source
Renegotiation & Mute/UnMute/Stop	Demo	Source
Video-Conferencing	Demo	Source
Video Broadcasting	Demo	Source
Audio Conferencing	Demo	Source
Multi-streams attachment	Demo	Source
Admin/Guest audio/video calling	Demo	Source
Session Re-initiation Test	Demo	Source
Preview Screenshot of the room	Demo	Source
RecordRTC & RTCMultiConnection	Demo	Source
Explains how to customize ice servers; and resolutions	Demo	Source
Mute/Unmute and onmute/onunmute	Demo	Source
One-page demo: Explains how to skip external signalling gateways	Demo	Source
Password Protect Rooms: Explains how to authenticate users	Demo	Source
Session Management: Explains difference between "leave" and "close" methods	Demo	Source
Multi-Sessions Management	Demo	Source
Customizing Bandwidth	Demo	Source
Users ejection and presence detection	Demo	Source
Multi-Session Establishment	Demo	Source
Group File Sharing + Text Chat	Demo	Source
Audio Conferencing + File Sharing + Text Chat	Demo	Source
Join with/without camera	Demo	Source
Screen Sharing	Demo	Source
One-to-One file sharing	Demo	Source
Manual session establishment + extra data transmission	Demo	Source
Manual session establishment + extra data transmission + video conferencing	Demo	Source
takeSnapshot i.e. Take Snapshot of Local/Remote streams	Demo	Source
Audio/Video/Screen sharing and recording	Demo	Source
Broadcast Multiple-Cameras	Demo	Source
Remote Stream Forwarding	Demo	Source
WebRTC Scalable Broadcast	Socketio/Nodejs	Source

Credits & Contributors

CONTRIBUTING.md

License

RTCMultiConnection is released under MIT licence . Copyright (c) Muaz Khan.

sanjaynarayan/RTCMultiConnection