Coaching and Recording

This guide will show you how to use Coaching and Recording features. Quickly learn how to implement conference controls that are the foundation of many call center dial flows.

The Coach attribute accepts a call SID of a call that is currently connected to an in-progress conference. The application we will be building out examines an agent and a customer on a call, with a supervisor who later joins by coaching the conference.

What do I need to run this application?

Find the full implementation on the Github Repo.

You will need to install SignalWire's Node.js Relay SDK

You will also need to have a SignalWire phone number, and have your SignalWire Space credentials ready to go (API Token, Space URL, and Project ID). You can find all of these credentials in an easily-copyable format under the API tab of your SignalWire Space. For more information on where to find this stuff, check out our Navigating your SignalWire Space section!

Running the Application

Build and Run on Docker

1. Use our pre-built image from Docker Hub

docker pull signalwire/snippets-coaching:node

(or build your own image)

1. Build your image

docker build -t snippets-coaching .

2. Run your image

docker run --publish 5000:5000 --env-file .env snippets-coaching

3. The application will run on port 5000

Build and Run Natively

Let's set up your Node.js environment with Express to handle web requests.

On the command line in your current directory, run the following command:

To install Signalwire SDK via NPM (Node Package Manager)

npm install @signalwire/compatibility-api

To install express via NPM (Node Package Manager)

npm install express

To build your react components run

npm run build

To run the example, and start the express server run the following command.
The server will run on port 5000, you can change the port in the code if you wish.

node server.js

You can now load the Dashboard by visiting your hostname on port 5000, and as you make calls they will appear on the Dashboard.

Step by Step Code Walkthrough

Within the github repo, you will find many files. The two that we will be looking into are:

• example.env
• server.js

Setup Your Environment File

1. Copy from example.env and fill in your values
2. Save new file called .env

Your file should look something like this

# This is the full name of your SignalWire Space. e.g.: example.signalwire.com
SIGNALWIRE_SPACE=
# Your Project ID - you can find it on the `API` page in your Dashboard.
SIGNALWIRE_PROJECT=
# Your API token - you can generate one on the `API` page in your Dashboard
SIGNALWIRE_TOKEN=
# The phone number you'll be using for this guide. Must include the `+1`,
INBOUND_NUMBER=
# The phone number you'll be using for this guide. Must include the `+1`,
AGENT_NUMBER=
# The phone number you'll be using for this guide. Must include the `+1`,
SUPERVISOR_NUMBER=
# Hostname, the IP address, or Fully Qualified Domain Name of your host and port, for routing action URLs
HOSTNAME=

server.js file

When your Signalwire number receives an incoming voice call to the /inbound endpoint, Signalwire will dial the predefined agent phone number as specified in the environment file, and then once the agent is connected, will connect the supervisor to the call.

Endpoint: /inbound
Methods: GET OR POST
This endpoint handles the incoming call and will spawn a call to an agent and a supervisor.

// Inbound Voice Endpoint
app.get("/inbound", (req, res) => {
  console.log(req.query);

  var callSid = req.query.CallSid;

  // For demo store customer call sid in variable
  customerCallSid = callSid;
  CUSTOMER_NUMBER = req.query.From;

  // Connect Agent
  client.calls
    .create({
      url:
        HOSTNAME +
        "/connect_agent?conf_name=" +
        CONF_NAME +
        "&customerCallSid=" +
        callSid,
      to: AGENT,
      from: INBOUND,
    })
    .then((agentCall) => {
      console.log("agent");
      console.log(agentCall.sid);

      // For demo store agent call sid in variable
      agentCallSid = agentCall.sid;
    });

  // Now that agent and supervisor have been requested, add the customer in
  var response = new VoiceResponse();
  response = dial_conference(
    CONF_NAME,
    (coachSid = ""),
    (muted = false),
    (startConferenceOnEnter = true),
    (endConferenceOnExit = true)
  );
  res.writeHead(200, {
    "Content-Type": "text/xml",
  });
  res.end(response.toString());
});

Now that we know how to connect the agent, customer and supervisor through coaching, we can enhance our call flow with more features such as recording manipulation, participant management other simple calling features.

Web API Endpoints

Below are all of the other included features to this call flow, look at whichever endpoints you need and you can find the javascript translations of each of these features in the server.js file.

// updates an in progress conference.
/api/conferences/update

// updates an in progress call
/api/calls/update

// entry for dashboard
/api/dashboard

// helper for demo that keeps track of caller role i.e. agent, supervisor, customer
/api/helpers/lookupCaller

// start recording
/api/recordings/start

// stop recording
/api/recordings/stop

// resume recording
/api/recordings/resume

// List recording for a call
/api/recordings/list

// Get Participants for call
/api/participants

Wrap Up

Coaching can be a very useful tool for connecting and controlling in a conference call contexts. In this application, we built out a solution with an agent, a customer, and a supervisor to all converse in a single conference that is managed in real time.

It is then not too tricky to incorporate more call features such as recording or muting into your conference experience, just like you would in any other calling context.

Required Resources:

• SignalWire's Node.js Relay SDK
• SignalWIre Github Repo
• Express JS

Sign Up Here

If you would like to test this example out, create a SignalWire account and Space.

Please feel free to reach out to us on our Community Slack or create a Support ticket if you need guidance!