Quickstart Guide (Calling)

• Introduction
• Importing Calling SDK
  • NPM
  • CDN
• Initialize Calling SDK
  • Option 1
  • Option 2
• Calling Configuration
  • Client Configuration
  • Calling Client Configuration
  • Logger Configuration

Introduction

Welcome to the Quick Start Guide for the Calling module. This guide is designed to provide developers with a concise walkthrough to swiftly set up, authorize, and test the core calling functionalities within the module. By following the sequential flow of this document and integrating the provided code snippets, you'll be able to authenticate your application and initiate your first calls. Whether you're new to Webex's Calling SDK or looking to brush up on the basics, this guide ensures a streamlined experience to get you up and running in no time. Let's dive in!

Importing Calling SDK

To import the latest stable version of the Calling SDK one can use NPM or CDN.

NPM

npm install @webex/calling
(or)
yarn add @webex/calling

import Calling from '@webex/calling';

CDN

 A built, minified version of the Calling SDK is also provided. It can be accessed as mentioned below:

<script src="../calling.min.js"></script>

// TODO: Add the location of the published calling SDK

Initialize Calling SDK

To initialize Calling SDK, either a Webex object or Webex configuration is required.

Option 1

1. Initialize Webex object. (Refer to importing and initializing the Web SDK to find the steps for this)
2. Register with Webex Device Manager (WDM) and establish mercury connection.
3. Pass Webex object and calling configuration as arguments and create new Calling instance which will initialize different client modules that it offers. (Refer to the table in the Calling Configuration section to identify Calling Configuration attributes)

const calling  = new Calling(webex, callingConfig);

Option 2

1. Pass Webex configuration and calling configuration and create new Calling instance. (Refer to the attribute sectionto identify configuration attributes for Webex Configuration)
2. Wait for Calling instance to be ready by listening for the event.
3. Once the event is received, call the register API to trigger Webex Device Manager registration, establishing mercury connection and initializing the various client modules within Calling.

// Set webex configuration
const webexConfig = {
    config: {
      logger: {
        level: 'debug', // set the desired log level
      },
      meetings: {
        reconnection: {
          enabled: true,
        },
        enableRtx: true,
      },
      encryption: {
        kmsInitialTimeout: 8000,
        kmsMaxTimeout: 40000,
        batcherMaxCalls: 30,
        caroots: null,
      },
      dss: {},
    },
    credentials: {
      access_token: tokenElm.value
    }
  };

// Set calling configuration

const callingConfig = {
  clientConfig : {
    calling: true,
    contact: true,
    callHistory: true,
    callSettings: true,
    voicemail: true,
  },
  callingClientConfig: {
    logger: {
      level: 'info' <—
    },
  },
  logger: {
    level: 'info' <--
  }
}  

// Create Calling object

const calling  = Calling.init({webexConfig, callingConfig});
let callingClient;
calling.on("ready", () => {
    calling.register().then(() => {
        callingClient = calling.callingClient;	
    });
});

// Get Line object from callingClient. Currently, only a single
// line is supported in the Calling package

const line = callingClient.getLines()[0];

// Listen to the registered event from line

line.on("registered", (lineInfo) => {
    console.log("Line information: ", lineInfo);
});


line.register();

Note: Client objects will be created based on calling configuration inside Calling instance.

Calling Configuration

This is the example of calling configuration.

callingConfig: {
	clientConfig: {
		calling: boolean,
		contact: boolean,
		callHistory: boolean,
		callSettings: boolean,
		voicemail: boolean,
	},
	callingClientConfig: {
		logger: {
			level: string
		},
		discovery: {
			country: string,
			region: string,
		},
		serviceData: {
			domain: string,
			indicator: string,
		}
	},
	logger: {
		level: string
	}
}

Following tables cover different configuration attributes present inside calling configuration.

Client Configuration

| S.no

|

Attribute

|

Description

|

Data type

|

Default attribute?

|

Public attribute?

| | --- | --- | --- | --- | --- | --- | | 1. | calling | Toggles the availability of the callingClient module  | Boolean | No | YES | | 2. | contact | Toggles the availability of the contactClient module | Boolean | No | YES | | 3. | callHistory | Toggles the availability of the callHistory module | Boolean | No | YES | | 4. | callSettings | Toggles the availability of the callSettings module | Boolean | No | YES | | 5. | voicemail | Toggles the availability of the voicemailClient module | Boolean | No | YES |

Calling Client Configuration

S.no	Attribute	Description	Data type	Default attribute?	Public attribute?
1.	discovery
Object	No	Yes
1.a.	country	Country from where the device registration is triggered	String	No	Yes
1.b.	region	Region from where the device registration is triggered	String	No	Yes
2.	serviceIndicator
String	No	Yes
2.a.	domain	Identifies which service is using Calling SDK	String	Yes	Yes
2.b.	indicator
String	No	No
3.	logger	Logger Configuration	Object

|
|

Logger Configuration

S.no	Attribute	Description	Data type	Default attribute?	Public attribute?
1.	level	Maximum log level that should be printed to the console. One of `silent	error	warn	log
YES