Click to Call example

This example allows to place outgoing audio call with one button click using account specified in server config file

/usr/local/FlashphonerWebCallServer/conf/apps/click-to-call/accounts.xml

Image Removed

Image Added

Code of the example

The path to the source code of the example on WCS server is:

/usr/local/FlashphonerWebCallServer/client/examples/demo/sip/click-to-call

click-to-call.css - stylesheet for the example page
click-to-call.html - page of the example
click-to-call.js - script providing functionality for the example

...

Here host is the address of the WCS server.

Work with code of the example

To analyze the code, let's take the version of file click-to-call.js with hash 66cc39302c8028, which is available here and can be downloaded with corresponding build 2.0.5.28.2753.133178.

1. Initialization of the API

Flashphoner.init() code

    try {
        Flashphoner.init();
    } catch({flashMediaProviderSwfLocation: '../../../../media-provider.swf'});e) {
        $("#notifyFlash").text("Your browser doesn't support WebRTC technology needed for this example");
        return;
    }

2. Connection to server.

createSession() code

Object with connection options is passed to the method when session is created

• urlServer - URL for WebSocket connection to WCS server
• appKey - internal server-side application 'clickToCallApp'

...

• sipOptions - SIP connection

...

• parameters from a hidden form fields

        var url = $('#urlServer').val();
	        var appKey = "clickToCallApp";

	sipOptions = {
            login: $('#sipLogin').val(),
            authenticationName: $('#sipAuthenticationName').val(),
            password: $('#sipPassword').val(),
            domain: $('#sipDomain').val(),
            outboundProxy: $('#sipOutboundProxy').val(),
            port: $('#sipPort').val(),
            registerRequired: true
        };
    
        var connectionOptions = {
		            urlServer: url,
		            appKeysipOptions: appKey
	sipOptions
        };

	        //create session
	        console.log("Create new session with url " + url);
	        Flashphoner.createSession(connectionOptions).on(SESSION_STATUS.ESTABLISHED, function(session){
            ...
		        });

3. Receiving the event confirming successful connection

ConnectionStatusEvent ESTABLISHED code

On this event, outgoing call is created

...

session.createCall(), call() code

The following parameters are passed when call is created

...

5. Call hangup

call.hangup() code

    $("#callBtn").text("Hangup").removeClass("btn-success").addClass("btn-danger").off('click').click(function(){
        $(this).prop('disabled', true);
	    outCall.hangup();
    }).prop('disabled', false);