Meteor Video Chat

This extension allows you to implement user-to-user video calling in React, Angular and Blaze. This package now uses RTCFly

Example with React

Click here for the React example source code.

Example with Blaze

Click here for the Blaze example source code.

A note on previous versions

Meteor Video Chat used to use Meteor.VideoCallServices, however we have moved to a more modular system, opting for ES6 imports like so:

import { VideoCallServices } from 'meteor/elmarti:video-chat'; Old style code will be supported for the forseeable future, but we suggest moving over to the new format.

Usage with asteroid

The Meteor Video Chat client can be used by first running npm install meteor-video-chat, and then using the following mixin import

import { AsteroidVideoChatMixin } from 'meteor-video-chat';

After including this as an Asteroid mixin, as per the Asteroid page, you can access it like so:

    Asteroid.VideoCallServices;

init

Here you can set the RTCConfiguration. If you are testing outside of a LAN, you'll need to procure some STUN & TURN servers.

VideoCallServices.init({'iceServers': [{
    'urls': 'stun:stun.example.org'
  }]
});

Calling a user

To call a user, use the following method.

VideoCallServices.call(ICallParams);

These are the parameters that can be used:

interface ICallParams {
    id:string; //ID of the callee
    localElement: IHTMLMediaElement; //local HTMLElement
    remoteElement: IHTMLMediaElement; //remote HTMLElement
    video:boolean; //Do you want to show video?
    audio:boolean; //Do you want to show audio?
}

Deciding who can connect to whom

The follow method can be overridden on the server side to implement some kind of filtering. Returning false will cancel the call, and true will allow it to go ahead.

VideoCallServices.checkConnect = function(caller, target){
return *can caller and target call each other"
};

Answering a call

The first step is to handle the onReceiveCall callback and then to accept the call. The answerCall method accepts the ICallParams interfaces, just like the "call" method above

 VideoCallServices.onReceiveCall = (userId) => {
        VideoCallServices.answerCall(ICallParams);
 };

Muting local or remote videos

VideoCallServices.toggleLocalAudio();
VideoCallServices.toggleRemoteAudio();

Application state

The following values are stored in a reactive var

localMuted:boolean, 
remoteMuted:boolean, 
ringing:boolean,
inProgress:boolean

Getting the state

VideoCallServices.getState("localMuted");

Accessing the video (HTMLMediaElement) elements

const localVideo = VideoCallServices.getLocalVideo();
const remoteVideo = VideoCallServices.getRemoteVideo();

Ending call

Simply call

VideoCallServices.endCall();

Other events

The following method is invoked when the callee accepts the call.

VideoCallServices.onTargetAccept = () => {
}

The following method is invoked when either user ends the call

VideoCallServices.onTerminateCall = () => {
}

The following method invoked when the RTCPeerConnection instance has been created, making it possible to consitently mutate it or add a data channel

VideoCallServices.onPeerConnectionCreated = () => {
}

The following method is invoked on the caller browser when the callee rejects the call

VideoCallServices.onCallRejected = () => {
    
}

The following method is invoked on both the client and server whenever an error is caught. User is only passed on the server

VideoCallServices.setOnError(callback);

The onError section can also be used for handling errors thrown when obtaining the user media (Webcam/audio). See here for more info, or checkout the example.

This project is sponsored by the following: