Table of Contents |
---|
Example of web phone for audio calls
Code of the example
The path to the source code of the example on WCS server is:
...
Here host is the address of the WCS server.
...
Analyzing the code
To analyze the code, let's take the version of file phone.js with hash 66cc393 ecbadc3, which is available here and and can be downloaded with corresponding build build 2.0.5.28.2753.133.212.
1. Initialization of the API
Flashphoner.init() code
Code Block | ||||
---|---|---|---|---|
| ||||
Flashphoner.init({flashMediaProviderSwfLocation: '../../../../media-provider.swf'}); |
2. Connection to server.
Flashphoner.createSession() code
Object with connection options is passed to the method
...
Code Block | ||||
---|---|---|---|---|
| ||||
function createSession(authToken) { var url = $('#urlServer').val(); var registerRequired = $("#sipRegisterRequired").is(':checked'); var sipOptions = { login: $("#sipLogin").val(), authenticationName: $("#sipAuthenticationName").val(), password: $("#sipPassword").val(), domain: $("#sipDomain").val(), outboundProxy: $("#sipOutboundProxy").val(), port: $("#sipPort").val(), registerRequired: registerRequired }; if (authToken) { var connectionOptions = { urlServer: url, authToken: authToken, keepAlive: true }; }if else(authToken) { connectionOptions.authToken = {authToken; } urlServer: url,else { connectionOptions.sipOptions = sipOptions: sipOptions, keepAlive: true }; } //create session console.log("Create new session with url " + url); Flashphoner.createSession(connectionOptions).on(SESSION_STATUS.ESTABLISHED, function(session, connection){ ... }); } |
3. Receiving the event confirming successful connection
ConnectionStatusEvent ESTABLISHED codeESTABLISHED code
On this event, the token is stored to connect to the same session in 1 hour
Code Block | ||||
---|---|---|---|---|
| ||||
Flashphoner.createSession(connectionOptions).on(SESSION_STATUS.ESTABLISHED, function(session, connection){ setStatus("#regStatus", SESSION_STATUS.ESTABLISHED); $("#authToken").val(connection.authToken); onConnected(session); if (!registerRequired) { disableOutgoing(false); } }).on(SESSION_STATUS.REGISTERED, function(session){ ... }).on(SESSION_STATUS.DISCONNECTED, function(){ ... }).on(SESSION_STATUS.FAILED, function(){ ... }).on(SESSION_STATUS.INCOMING_CALL, function(call){ ... }); |
4. Receiving the event confirming successful registration on SIP server
ConnectionStatusEvent REGISTERED REGISTERED code
Code Block | ||||
---|---|---|---|---|
| ||||
Flashphoner.createSession(connectionOptions).on(SESSION_STATUS.ESTABLISHED, function(session, connection){ ... }).on(SESSION_STATUS.REGISTERED, function(session){ setStatus("#regStatus", SESSION_STATUS.REGISTERED); onConnected(session); if (registerRequired) { disableOutgoing(false); } }).on(SESSION_STATUS.DISCONNECTED, function(){ ... }).on(SESSION_STATUS.FAILED, function(){ ... }).on(SESSION_STATUS.INCOMING_CALL, function(call){ ... }); |
...
ConnectionStatusEvent INCOMING_CALL CALL code
Code Block | ||||
---|---|---|---|---|
| ||||
Flashphoner.createSession(connectionOptions).on(SESSION_STATUS.ESTABLISHED, function(session, connection){ ... }).on(SESSION_STATUS.REGISTERED, function(session){ ... }).on(SESSION_STATUS.DISCONNECTED, function(){ ... }).on(SESSION_STATUS.FAILED, function(){ ... }).on(SESSION_STATUS.INCOMING_CALL, function(call){ call.on(CALL_STATUS.RING, function(){ ... }); onIncomingCall(call); }); |
...
session.createCall(), call.call() code
The following parameters are passed when call is created
...
7. Answering incoming call.
call.answer() code
Object with answer options is passed to the method
...
8. Outgoing call hangup.
call.hangup() code
Code Block | ||||
---|---|---|---|---|
| ||||
$("#callBtn").text("Hangup").off('click').click(function(){ $(this).prop('disabled', true); outCall.hangup(); }).prop('disabled', false); |
9. Incoming call hangup.
call.hangup() code
Code Block | ||||
---|---|---|---|---|
| ||||
$("#hangupBtn").off('click').click(function(){ $(this).prop('disabled', true); $("#answerBtn").prop('disabled', true); inCall.hangup(); }).prop('disabled', false); |
10. Call hangup on session disconnection
call.hangup() code
Code Block | ||||
---|---|---|---|---|
| ||||
function onConnected(session) { $("#connectBtn, #connectTokenBtn").text("Disconnect").off('click').click(function(){ $(this).prop('disabled', true); if (currentCall) { showOutgoing(); disableOutgoing(true); setStatus("#callStatus", ""); currentCall.hangup(); } session.disconnect(); }).prop('disabled', false); } |
...
currentCall.muteAudio(), currentCall.unmuteAudio() code
Code Block | ||||
---|---|---|---|---|
| ||||
// Mute audio in the call function mute() { if (currentCall) { currentCall.muteAudio(); } } // Unmute audio in the call function unmute() { if (currentCall) { currentCall.unmuteAudio(); } } |