Accept incoming call in Genesys
Your media toolbar application listens to different events published from the microservice.
- From your media toolbar application.
- From your Fusion application.
- From your softphone configured for Genesys.
The following flow diagram shows the sequence of operations performed once an agent accepts an incoming call from media toolbar or from the Fusion application:
Scenario 1 and 2: Accept call from media toolbar and Fusion applications
- An agent can accept the call either from the Fusion application or from the
media toolbar application. When agent clicks the
Answer button in the Fusion application, the
onToolbarInteractionCommand
event is fired with the command asaccept
. When the agent accepts the call from media toolbar application,your microservice is notified that the call is accepted. - The media toolbar application receives this event and if the event is to accept a call, your microservice is notified to accept the call.
- When your microservice receives this notification, it requests the Genesys
server to accept the call using the
com.genesyslab.platform.voice.protocol.tserver.requests.party.RequestAnswerCall
request. - When the
RequestAnswerCall
request is success, theEventEstablished
message is propagated from Genesys through your microservice to your media toolbar application. - The media toolbar application receives the
EventEstablished
message through the web socket and fires thestartCommEvent
action. - When the Fusion application identifies this action, the matched contact and an engagement panel are opened based on the rules configured in the fusion configuration management for the screen pop.
Agent accepts the call either from Fusion or from the media toolbar application
The incoming call notification is shown in your media toolbar and your Fusion application. You can answer the call by accepting it from anywhere.
Notify your microservice to accept the call
When the agent answers the call from media toolbar application or from the Fusion
application, the microservice is notified that the agent has accepted the call. To
enable this, you must update your acceptCall
function in the
vendorHandler.ts
file as shown in the following example:
public async acceptCall(): Promise<void> {
const headers: Headers = (new Headers()) as Headers;
headers.set('Content-type', 'application/json');
const message: any = {
"type": "Accept",
"connectionId": VendorHandler.connectionId
};
const request: Request = new Request(`${VendorHandler.REST_ENDPOINT_URL}`, {
method: 'POST',
headers: headers,
body: JSON.stringify(message)
}) as Request;
await fetch(request);
}
Microservice creates request for accepting the call
The microservice then uses the PSDK
to create request for answering
the call.
Microservice receives EventEstablished message
Once the request for answering the call succeeds, the Genesys server responds with
the EventEstablished
message which is propagated to your media
toolbar application through the microservice.
Call the startCommEvent from media toolbar application
When the EventEstablished
message is received through the web
socket, the callAcceptedHandler
function is called from the
integrationEventsHandler.ts
file as shown in the following
example:
public webSocketOnMessage(event: MessageEvent): void {
const jsonMessage = JSON.parse(event.data);
console.log(jsonMessage);
if (jsonMessage.eventName === "EventRegistered") {
// Genesys notifies that the agent is ready
this.integrationEventsHandler.makeAgentAvailable();
} else if (jsonMessage.eventName === "EventRinging") {
// Show incoming call notification
this.integrationEventsHandler.incomingCallHandler(jsonMessage.ANI, jsonMessage.eventId);
VendorHandler.connectionId = jsonMessage.connectionId;
} else if (jsonMessage.eventName === "EventEstablished") {
// Genesys notifies that the call is accepted
this.integrationEventsHandler.callAcceptedHandler(jsonMessage.eventId);
} else if (jsonMessage.eventName === "EventReleased") {
// Genesys notifies that the call is disconnected
}
console.log("Message is received");
}
Call is accepted in Fusion application
Your Fusion application shows the call is accepted and the media toolbar application UI updated.
Scenario 3: Accept call from softphone
When the agent accepts the call from softphone, the EventEstablished
event sends and accepted notification. You can add logic for handling call accepted
scenario in the EventEstablished
event.
The following flow diagram shows the sequence of operations performed once an agent accepts an incoming call from the softphone:
- When an agent accepts the call from the softphone application, the Genesys
server is notified to accept the call and when the call accept succeeds, the
Genesys server sends the
EventEstablished
message to your microservice and your microservice propagates this message to your media toolbar application through the web socket. - The media toolbar application receives this event, and fires the
startCommEvent
action. - Once the Fusion application identifies this action, the matched contact and an engagement panel will be opened based on the rules configured in the Fusion configuration management for the screen pop.
Microservice propagates EventEstablished message to your media toolbar application
When the agent accepts the call from the softphone application, the Genesys server is
notified to accept the call, and once the call is accepted, the Genesys server sends
the EventEstablished
message to your microservice and your
microservice propagates this message to your media toolbar application through the
web socket.
Call the startCommEvent from media toolbar application
When the EventEstablished
message is received through the web
socket, the callAcceptedHandler
function is called from the
integrationEventsHandler.ts
file as shown in the following
example:
public webSocketOnMessage(event: MessageEvent): void {
const jsonMessage = JSON.parse(event.data);
console.log(jsonMessage);
if (jsonMessage.eventName === "EventRegistered") {
// Genesys notifies that the agent is ready
this.integrationEventsHandler.makeAgentAvailable();
} else if (jsonMessage.eventName === "EventRinging") {
// Show incoming call notification
this.integrationEventsHandler.incomingCallHandler(jsonMessage.ANI, jsonMessage.eventId);
VendorHandler.connectionId = jsonMessage.connectionId;
} else if (jsonMessage.eventName === "EventEstablished") {
// Genesys notifies that the call is accepted
this.integrationEventsHandler.callAcceptedHandler(jsonMessage.eventId);
} else if (jsonMessage.eventName === "EventReleased") {
// Genesys notifies that the call is disconnected
}
console.log("Message is received");
}
Call is accepted in Fusion application
Your Fusion application will show that the call is accepted and the media toolbar application UI will be updated.
Complete Code
Here's the complete code for the vendorHandler.ts
file for accepting
an incoming call.
import { ICtiVendorHandler } from './ICtiVendorHandler';
import { IntegrationEventsHandler } from '../integrationEventsHandler';
export class VendorHandler implements ICtiVendorHandler {
public static connectionId: string;
private static REST_ENDPOINT_URL: string = 'http://localhost:8087/genesys/events';
private static WS_ENDPOINT_URL: string = 'ws://localhost:8087/genesysWs';
private integrationEventsHandler: IntegrationEventsHandler;
constructor(integrationEventsHandler: IntegrationEventsHandler) {
this.integrationEventsHandler = integrationEventsHandler;
}
public async webSocketOnOpenHandler(): Promise<void> {
console.log("WebSocket opened");
const headers: Headers = (new Headers()) as Headers;
headers.set('Content-type', 'application/json');
const message: any = {
"type": "initialize"
};
const request: Request = new Request(`${VendorHandler.REST_ENDPOINT_URL}`, {
method: 'POST',
headers: headers,
body: JSON.stringify(message)
}) as Request;
await fetch(request);
}
public webSocketErrorHandler(error: any): void {
console.log("WebSocket error", error);
}
public webSocketCloseHandler(event: Event): void {
console.log("WebSocket is closed", event);
}
public webSocketOnMessage(event: MessageEvent): void {
const jsonMessage = JSON.parse(event.data);
console.log(jsonMessage);
if (jsonMessage.eventName === "EventRegistered") {
// Genesys notifies that the agent is ready
this.integrationEventsHandler.makeAgentAvailable();
} else if (jsonMessage.eventName === "EventRinging") {
// Show incoming call notification
this.integrationEventsHandler.incomingCallHandler(jsonMessage.ANI, jsonMessage.eventId);
VendorHandler.connectionId = jsonMessage.connectionId;
} else if (jsonMessage.eventName === "EventEstablished") {
// Genesys notifies that the call is accepted
this.integrationEventsHandler.callAcceptedHandler(jsonMessage.eventId);
VendorHandler.connectionId = jsonMessage.connectionId;
} else if (jsonMessage.eventName === "EventReleased") {
// Genesys notifies that the call is disconnected
}
console.log("Message is received");
}
public async makeAgentAvailable(): Promise<void> {
let webSocket: WebSocket = new WebSocket(`${VendorHandler.WS_ENDPOINT_URL}`);
webSocket.onopen = this.webSocketOnOpenHandler.bind(this);
webSocket.onmessage = this.webSocketOnMessage.bind(this);
webSocket.onclose = this.webSocketCloseHandler.bind(this);
webSocket.onerror = this.webSocketErrorHandler.bind(this);
}
public async makeAgentUnavailable(): Promise<void> {
// TODO: call the vendor specific api to make the agent available
}
public async makeOutboundCall(phoneNumber: string, eventId: string): Promise<void> {
// TODO: call the vendor specific api to make the make an outbound call
}
public async acceptCall(): Promise<void> {
const headers: Headers = (new Headers()) as Headers;
headers.set('Content-type', 'application/json');
const message: any = {
"type": "Accept",
"connectionId": VendorHandler.connectionId
};
const request: Request = new Request(`${VendorHandler.REST_ENDPOINT_URL}`, {
method: 'POST',
headers: headers,
body: JSON.stringify(message)
}) as Request;
await fetch(request);
}
public async rejectCall(): Promise<void> {
// TODO: call the vendor specific api to reject a call
}
public async hangupCall(): Promise<void> {
// TODO: call the vendor specific api to hangup a call
}
}
Verify your progress
After finishing these steps, use OJET server to start you application and sign in to your Fusion application. Open the media toolbar and make your agent available for calls by clicking on the Agent Availability button. Then, start a call to your customer care number. You'll receive the incoming call notification in your media toolbar application and in your Fusion application window. You can accept the call from your media toolbar application or from your Fusion application or from your softphone application. Once you accept the call, your media toolbar state will change to the ACCEPTED state and the engagement is opened in your Fusion application.