WebtRTC WebCam walk through

WebRTC/WebCam explained:

If you are using 1.5+ you will notice a new feature that appears when you hover over your name:

Enable WebCam 

(Works in firefox/chrome)

If you click this option a popup will appear on the top of the browser asking permission to use your webcam. Click allow and a videobox will appear showing you on your webcam. your name status will change to show a webcam to you and others in that chat room.

When another user hovers over your name they will see :

View WebCam 

(Multiple users can view your webcam)

If they click this button a pm is sent to you saying their viewing you and they will be able to view you on webcam.

Alternatively if they open a PM box to you a play button should appear if they click play the same as above will happen. If they had been in PM previous to you opening webcam the play button will not show. If this user clicks the far right hand (white) X. This will destroy the PM box. Upon them clicking pm again the play button will now appear. Sounds like a lot of work to me since they could just hover your name and click view cam :)

Enable WebRTCE

(Works only in Chrome Canary + )

WebRTC is really amazing new technology. I will be trying focus some more time into this and attempting to expand the amount of users that can interact with one another as well as extending to firefox.

At the moment 1.5 - Only 2 people can interact.

So if you enable this option the same as before you are asked for permission to the ip running the websocket chat server for permission.

If you enable it, you will see yourself in a small video box. Your name should have a different icon a video+phone.

If another user in the same room (on another pc) hovers over your name they will see:

WebRTCE

(Only 1 person can )

The same rules as above for the play button in the PM box. The play button has built in intelligence to figure out which mode you are running (Webcam/webrtc) and to attempt to call relevant method.

If they click this, it will also ask them permissions for their audio/video. Once accepted after a few seconds you will appear in a large HD video box for them, whilst they appear small in their own video box, vice versa for you. You should now be able to interact real time.

Technical details of how webrtc is working:

As it stands by default whether you confgure the STUN server in the Config example as the same or if not at all (Which will default to the same google server). the information will be sent to google's public server.

If you wanted you could enable console.log by function sendToServer is sending messages within client.js - you will the log out the messages sent to websocket.

When second user attempts to view person running webrtc an offer is sent via sockets to primary candidate. Which triggers a handshake followed by heavy payloads delivering icecandidate packets to the websocket server from both candidates. To understand more about it have a look here: SDP.

Once this is all done, it all goes very quiet on the socket connections.