RTCMultiConnection-v3.0 (Beta)
Fetch latest code:
sudo npm install rtcmulticonnection-v3
# or MOST preferred one
mkdir RTCMultiConnection-v3.0 && cd RTCMultiConnection-v3.0
wget http://dl.webrtc-experiment.com/rtcmulticonnection-v3.tar.gz
tar -zxvf rtcmulticonnection-v3.tar.gz
ls -a
To TEST:
npm start
# or
node server.js
# if fails,
lsof -n -i4TCP:9001 | grep LISTEN
kill process-ID
Now open: https://localhost:9001/
<script src="/RTCMultiConnection.js"></script>
<!-- or minified file -->
<script src="/RTCMultiConnection.min.js"></script>If you're sharing files, you also need to link:
<script src="/dev/FileBufferReader.js"></script>You can link multiple files from "dev" directory.
Either via config.json file:
{
"socketURL": "/",
"socketMessageEvent": "RTCMultiConnection-Message"
}or override in your HTML code:
connection.socketURL = 'http://yourdomain.com:8080/';
// if your server is already having "message" event
// then you can use something else, unique.
connection.socketMessageEvent = 'unique-message';// node.js code
require('./Signaling-Server.js')(httpServerHandlerOrPort);Use streamEvents instead of connection.streams:
var stream = connection.streamEvents['streamid'];
# you can even use "getStreamById"
var stream = connection.attachStreams.getStreamById('streamid');
# to get remote stream by id
var allRemoteStreams = connection.getRemoteStreams('remote-user-id');
var stream = allRemoteStreams.getStreamByid('streamid');Wanna check isScreen or isVideo or isAudio?
connection.onstream = function(event) {
if(event.stream.isScreen) {
// screen stream
}
if(event.stream.isVideo) {
// audio+video or video-only stream
}
if(event.stream.isAudio) {
// audio-only stream
}
};Wanna mute/unmute?
var stream = connection.streamEvents['streamid'].stream;
stream.mute('audio'); // audio or video or bothWanna detect current browser?
if(connection.DetectRTC.browser.isChrome) {
// it is Chrome
}
// you can even set backward compatibility hack
connection.UA = connection.DetectRTC.browser;
if(connection.UA.isChrome) { }Wanna detect if user is having microphone or webcam?
connection.DetectRTC.detectMediaAvailability(function(media){
if(media.hasWebcam) { }
if(media.hasMicrophone) { }
if(media.hasSpeakers) { }
});Wanna detect if user is online or offline?
connection.onUserStatusChanged = function(event) {
alert(event.userid + ' is ' + event.status);
};Wanna watch for each participation request?
var alreadyAllowed = {};
connection.onNewParticipant = function(participantId, userPreferences) {
if(alreadyAllowed[participantId]) {
connection.addParticipationRequest(participantId, userPreferences);
return;
}
var message = participantId + ' is trying to join your room. Confirm to accept his request.';
if( window.confirm(messsage ) ) {
connection.addParticipationRequest(participantId, userPreferences);
}
};Wanna get reference to socket object?
var socket = connection.getSocket();
// note: server.js allows you listen for custom-events over socket.io
socket.emit('custom-event', { data: true });
socket.on('custom-event', function(data) {
// hello
});This method allows you change video resolutions or audio sources without making a new getUserMedia request i.e. it modifies your existing MediaStream:
var width = 1280;
var height = 720;
var supports = navigator.mediaDevices.getSupportedConstraints();
var constraints = {};
if (supports.width && supports.height) {
constraints = {
width: width,
height: height
};
}
connection.applyConstraints({
video: constraints
});applyConstraints access mediaConstraints object, defined here:
This method allows you replace your front-camera video with back-camera video or replace video with screen or replace older low-quality video with new high quality video.
// here is its simpler usage
connection.replaceTrack({
screen: true,
oneway: true
});You can even pass MediaStreamTrack object:
var videoTrack = yourVideoStream.getVideoTracks()[0];
connection.replaceTrack(videoTrack);You can even pass MediaStream object:
connection.replaceTrack(yourVideoStream);You can even force to replace tracks only with a single user:
var remoteUserId = 'single-remote-userid';
var videoTrack = yourVideoStream.getVideoTracks()[0];
connection.replaceTrack(videoTrack, remoteUserId);This even allows you show online/offline statuses of the user:
connection.onUserStatusChanged = function(status) {
document.getElementById(event.userid).src = status === 'online' ? 'online.gif' : 'offline.gif';
};This method allows you get the socket object used for signaling (handshake/presence-detection/etc.):
var socket = connection.getSocket();
socket.emit('custom-event', 'hi there');
socket.on('custom-event', function(message) {
alert(message);
});If socket isn't connected yet, then above method will auto-connect it. It is using connectSocket to connect socket. See below section.
It is same like old RTCMultiConnection connect method:
connectSocket method simply initializes socket.io server so that you can send custom-messages before creating/joining rooms:
connection.connectSocket(function(socket) {
socket.on('custom-message', function(message) {
alert(message);
// custom message
if(message.joinMyRoom) {
connection.join(message.roomid);
}
});
socket.emit('custom-message', 'hi there');
connection.open('room-id');
});This object allows you capture audio/video stream yourself. RTCMultiConnection will NEVER know about your stream until you add it yourself, manually:
var options = {
localMediaConstraints: {
audio: true,
video: true
},
onGettingLocalMedia: function(stream) {},
onLocalMediaError: function(error) {}
};
connection.getUserMediaHandler(options);Its defined here:
If you are willing to use Firebase instead of Socket.io there, open GruntFile.js and replace SocketConnection.js with FirebaseConnection.js.
Then use grunt to recompile RTCMultiConnection.js.
Otherwise if you don't want to modify RTCMultiConnection:
<script src="/dev/globals.js"></script>
<script src="/dev/FirebaseConnection.js"></script>
<script>
var connection = new RTCMultiConnection();
connection.firebase = 'your-firebase-account';
// below line replaces FirebaseConnection
connection.setCustomSocketHandler(FirebaseConnection);
</script>Follow above all "firebase" steps and use PubNubConnection.js instead.
Please don't forget to use your own PubNub keys.
RTCMultiConnection is released under MIT licence . Copyright (c) Muaz Khan.