How to do two-party video call?

You can do live video call by having two instances of VideoIO application, one capturing live camera view and microphone audio as local stream to the media server, and other playing the video and audio of the remote stream from the media server. Please see How to work with media server? on details of installing and configuring a media server. For illustrations in this section we assume that you have a media server running on 192.1.2.3 and that has an application called myapp which allows you to do live media stream. Thus, your media server application should be reachable at "rtmp://192.1.2.3/myapp". In real deployment you will use the real host name or IP address of your media server.

The src property of the VideoIO application can be set to enable the local (publish) or remote (play) mode. If two users, Alice and Bob are in a call, Alice can publish to stream named "alice" and play stream named "bob", and vice-versa for Bob. Thus the remaining challenge is to convey the desired stream name from one user to another in a call. In practice, people use variety of methods ranging from CGI web service, JavaScript or Jabber service to exchange such information. Whatever mechanism you decide will become the call initiation service of your system. In our tutorial we will assume that these information is exchanged out-of-band by the individuals, e.g., over instant messenging or email.

streamAliceBob
publish/localalicebob
play/remotebobalice

The user interface will typically have two VideoIO instances - one for local video and other for remote video. The caller, Alice, picks a stream name, alice, and sets the src URL of local instance to "rtmp://192.1.2.3/myapp?publish=alice". Do not explicitly set live=true because it is implicitly set when publishing. As part of the call initiation process, Alice sends the local src URL to callee, Bob. If Bob wants to accept the video call, he replaces publish with play and sets the src URL of remote instance on his side to "rtmp://192.1.2.3/myapp?play=alice". Bob also picks a stream name, bob, sets the src URL of local instance on his side to "rtmp://192.1.2.3/myapp?publish=bob", and responds to Alice with this local src URL. When Alice receives Bob's local src URL, she replaced publish with play and sets the remote src URL on her side. Now both sides are publishing to their local stream and playing from the remote ends stream in the two-party call. Terminating the call is as simple as setting local and remote src URLs to null or "".

Information: Typically a media server allows any number of play instances for a stream name, but only one publish instance within a URL scope. Hence, the stream name must be chosen carefully to avoid conflict with other users for the call or conference or with existing recorded files. For example, if you have already published earlier with publish=file1&record=true then the server has file1.flv, so using the play=file1 will play from this recorded file instead of live user stream.

The following user interface embeds two VideoIO instances. The left one is for local video and right one for remote video. To try the demonstration, open this page in two browser instances. You can try on two different machines or the same machine. On first keep your default publish stream name as "alice" and play as "bob". On second swap the stream name so that publis is "bob" and play is "alice". Then click on the two set buttons on both the browser instances to start your call between the two. If you are running media server on a different host than 192.1.2.3, change the URL's IP address in all text input boxes.

?publish=
?play=

The source code for these are similar to earlier examples. You can also right-click and select "View Page Source" or equivalent menu option to see the source code.

Summary

In summary, you can use the src property with URL parameter containing publish for your stream and play for remote stream. The recording and playing properties control the current state of whether your video is transmitted or whether remote video is played.

This tutorial is just the begining of how to do two-party video call. The VideoIO API is so simple that just setting the src property allows you to accomplish several use cases. There are several other properties that affect behavior of a call, e.g., you can control the camera quality or sound mute. Additionally, you can build other advanced user interface controls in JavaScript similar to how VideoIO's control panel shows in Flash.

The video displayed in local and remote video are different. The publish mode displays the live camera view. In VideoIO the live camera view is always flipped horizontally to appear as if you are looking in a mirror, whereas the actual media stream sent to the server for recording or re-distribution appears as if the camera is looking at you. We feel that this gives the most natural behavior for live video chat or message recording.