WebRTC

Add the JavaScript API

  <head>
    <script src="https://api4.apidaze.io/javascript/releases/APIdaze-0.2.6.min.js"></script>
  </head>

Initialize the APIdaze client

Just create a CLIENT instance with parameters.

var client = new APIdaze.CLIENT(
	{
		type: "webrtc",
		apiKey: "d3adb33f",
		onReady: function() {
            // Put your JavaScript code
		},
		onDisconnected: function() {
            // Put your JavaScript code
		},
        onAudiostats: function(event) {
            // Put your JavaScript code
        }
	});

type : Specify the connection type (webrtc, flash or auto, which defaults to flash)
debug : true or false defaults to false
apiKey : Your API key
onReady : A JavaScript function that gets called when the connection is setup.
onDisconnected : A JavaScript function that gets called when the connection to the server gets down.
onAudiostats : A JavaScript function that gets called every five second during a call and contains information about the audio quality of the call. The event parameter object structure is given hereafter as a sample

var eventsample = 
{
  type: "audiostats",
  data: {
          duration: "00:01:05", // Total call duration
          opackets: "3238 ",    // Packets sent to server
          olostpackets: "0",    // Packets sent to server and lost on the way
          ipackets: "2981 ",    // Packets received from server
          ilostpackets: "0",    // Packets sent from server and lost on the way
          rtt: "0.033000"       // Round Trip Time to server in seconds (also called "ping time")
        }
};

Place a call from your web pages

Just call the call function on the previously created CLIENT object. Add any parameter along with your listener functions that will let you handle in-call events. All the parameters set as the first argument will be forwarded to your ExternalScript URL as HTTP parameters, therefore allowing to control the call.

In order to allow the call to the number 0123456789, your ExternalScript must return the following XML to APIdaze :

<document>
 <work>
  <dial>
   <number>0123456789</number>
  </dial>
 </work>
</document>

In the following example, the number to call is sent in the my_parameter_that_contains_a_number, and a string that identifies the web session is sent in the my_web_session_id parameter.

var call = client.call(
	{
		my_parameter_that_contains_a_number: "0123456789",
		my_web_session_id: "3d1n1de32bge65hbokapdm"
	},
	{
		onRinging: function() {
			// Put your JavaScript code
		},
		onAnswer: function() {
			// Put your JavaScript code
		},
		onHangup: function() {
			// Put your JavaScript code
		}
	}
);

Object : A set of attributs and values sent as HTTP parameters to your ExternalScript URL.
onRinging: function() {}: A function that gets called when the remote end is ringing.
onAnswer: function() {}: A function that gets called when the call has been answered.
onHangup: function() {}: A function that gets called when the call is hung up.

While in a call, you can call these two methods on the call object to turn on and off your audio input.

call.stopLocalAudio();  // Stop sending your audio input
call.startLocalAudio(); // Start sending your audio input

Join a conference room, add text and video chat to your web pages

Just call the joinroom function on the previously created CLIENT object. Add the room name your want to join along with your nickname for the room and listener functions as parameters. All the parameters set as the first argument will be forwarded to your ExternalScript URL as HTTP parameters, therefore allowing to open access to the room.

When calling joinroom, your ExternalScript receives an HTTP request with the following parameters :

roomName
nickName
…

In order to grant access to the room named myroom, your ExternalScript must return the following XML to APIdaze :

<document>
 <work>
  <conference>myroom</conference>
 </work>
</document>

On the JavaScript side, here is what you would display :

var room = client.joinroom(
	{
		roomName: "myroom",		// Mandatory
		nickName: "nick"		// Mandatory
	},
	{
		onConfbridgejoin: function(event) {
			console.log("Confbridge Join Event : " + event.data);
			// Put your JavaScript code
		},
		onConfbridgeleave: function(event) {
			console.log("Confbridge Leave Event : " + event.data);
			// Put your JavaScript code
		},
		onConfbridgemembers: function(event) {
			console.log("Members list : " + event.data);
			// Put your JavaScript code
		},
		onConfbridgetalking: function(event) {
			var jsondata = JSON.parse(event.data);
			console.log("Channel " + jsondata.channel + " in room " + jsondata.room + " talking status : " + jsondata.talkingstatus);
			// Put your JavaScript code
		},
        onConfbridgetextmessage: function(event) {
            console.log("Received text : " + event.data);
            // Put your JavaScript code
        }

	}
);

Object : A set of attributes and values sent as HTTP parameters to your ExternalScript URL. nickName and roomName are mandatory.
onConfbridgejoin: function() {}: A function that gets called when someone joins the room.
onConfbridgeleave: function() {}: A function that gets called when someone leaves the room.
onConfbridgemembers: function() {}: A function that gets called when you enter the room.
onConfbridgetalking: function() {}: A function that gets called when someone is talking.
onConfbridgetextmessage: function() {}: A function that gets called when receiving text from one of the room members. More on this function in the next section.

More on rooms : text and video chat

The room JavaScript object brings methods and handlers that allows you to easily add text and video chat to your webpage.

Adding text chat

Sending a text message to the room members :

room.sendMessage("public", "anyone", "Hi everybody !");

Handling text messages from the room members is just a matter of putting your JavaScript code in the onConfbridgetextmessage handler.

Join the room in video

Call the joinInVideo method on an existing room to activate video.

room.joinInVideo(
	{
		videoContainerId: "remotevideos",	// Optional
		mode: "sendrecv"					// "sendrecv" or "recvonly". Defaults to "sendrecv".
	},
	{
		onConfbridgevideomembers: function(event) {
			console.log("Video members: " + JSON.parse(event.data));
			// Put your JavaScript code
		},
		onConfbridgenewssrc: function(event) {
			console.log("New user in video bridge : " + event.data);
			// Put your JavaScript code
		},
		onConfbridgeleftssrc: function(event) {
			console.log("User left video bridge : " + event.data);
			// Put your JavaScript code
		}
	}
);

videoContainerId : The DOM id of the element that contains the video elements in the HTML page. Will be created automatically if not set.
mode : Valid values are “sendrecv” (to send and receive video streams) and “recvonly” (won’t send your own video stream to the members). The default value is “sendrecv”.
onConfbridgevideomembers: function() {}: Returns the list of video peers in the room. This function is called when you join the room in video (after calling the joinInVideo method).
onConfbridgenewssrc: function() {}: A function that gets called when a new video stream coming from the room has been detected.
onConfbridgeleftssrc: function() {}: A function that gets called when a user stopped sending his video stream to the room.

While in a video call, you can call these two methods on the room object to turn on and off sending your video stream to the peers. Note that audio and text chat will still remain available.

room.stopLocalVideo();  // Stop sending your video stream to the room
room.startLocalVideo(); // Start sending your video stream to the room