From Bright Pattern Documentation
Jump to: navigation, search
Tracy (talk | contribs)
No edit summary
Tracy (talk | contribs)
No edit summary
Line 4: Line 4:


The following methods (with callbacks) are useful when used together:
The following methods (with callbacks) are useful when used together:
* [[Embedded-agent-desktop-sdk-specification/Methods/getState |  getState]]
* [[Embedded-agent-desktop-api-specification/Methods/getState |  getState]]
* [[Embedded-agent-desktop-sdk-specification/Methods/getCallRecordingStatusCallback |  getCallRecordingStatusCallback]]
* [[Embedded-agent-desktop-api-specification/Methods/getCallRecordingStatusCallback |  getCallRecordingStatusCallback]]
* [[Embedded-agent-desktop-sdk-specification/Methods/startCallRecordingCallback |  startCallRecordingCallback]]
* [[Embedded-agent-desktop-api-specification/Methods/startCallRecordingCallback |  startCallRecordingCallback]]
* [[Embedded-agent-desktop-sdk-specification/Methods/stopCallRecordingCallback | stopCallRecordingCallback]]
* [[Embedded-agent-desktop-api-specification/Methods/stopCallRecordingCallback | stopCallRecordingCallback]]
* [[Embedded-agent-desktop-sdk-specification/Methods/muteCallRecordingCallback |  muteCallRecordingCallback]]
* [[Embedded-agent-desktop-api-specification/Methods/muteCallRecordingCallback |  muteCallRecordingCallback]]
* [[Embedded-agent-desktop-sdk-specification/Methods/unmuteCallRecordingCallback |  unmuteCallRecordingCallback]]
* [[Embedded-agent-desktop-api-specification/Methods/unmuteCallRecordingCallback |  unmuteCallRecordingCallback]]


This article will show you how to put those methods to use on a webpage on which your Agent Desktop widget is embedded.
This article will show you how to put those methods to use on a webpage on which your Agent Desktop widget is embedded.
Line 54: Line 54:
  sample code]] into the body of your HTML file. This is the bare minimum that you need for the SDK to work. Make sure you replace "<tenant>" with the name of your Agent Desktop web server.<br /><br />
  sample code]] into the body of your HTML file. This is the bare minimum that you need for the SDK to work. Make sure you replace "<tenant>" with the name of your Agent Desktop web server.<br /><br />
# Save and open the page in your web browser. Make sure the agent is logged in and "Ready."<br /><br />
# Save and open the page in your web browser. Make sure the agent is logged in and "Ready."<br /><br />
# A call comes in and the agent accepts it.<br /><br />[[File:ControlRecord1-53.PNG|800px|center|Incoming call]]<br /><br />
# A call comes in and the agent accepts it.<br /><br />[[File:ControlRecord1b-53.png|800px|center|Incoming call]]<br /><br />
# During the call, try clicking all the buttons:
# During the call, try clicking all the buttons:
## '''Get State''' will retrieve agent state and interaction data; copy the "item_id" from the logs and paste it into the "Interaction ID" field<br /><br />[[File:ControlRecord2-53.PNG|800px|center|Interaction ID is "item_id"]]<br /><br />
## '''Get State''' will retrieve agent state and interaction data; copy the "item_id" from the logs and paste it into the "Interaction ID" field<br /><br />[[File:ControlRecord2-53.PNG|800px|center|Interaction ID is "item_id"]]<br /><br />

Revision as of 18:04, 26 March 2019

<translate>

Control Call Recordings and Get Status

During a call, it's possible that a party might provide sensitive information or say something that should not be stored in any way by your contact center. When such a call is being recorded, you can use the Outpage JS API's recordings control methods to mute a recording, unmute a recording, start recording, and stop recording. In addition, you can get information about the status of a call recording, including whether the call is being recorded at all.

The following methods (with callbacks) are useful when used together:

This article will show you how to put those methods to use on a webpage on which your Agent Desktop widget is embedded.

Sample Code

<script type="text/javascript" src="https://<tenant>.brightpattern.com/agentdesktop/libs/servicepattern-sdk-v1.js"> 
</script>

<iframe id="repeater" style="position:absolute; right: 8px; width: 300px; height: 700px;" src="https://<tenant>.brightpattern.com/agentdesktop/UniversalRepeater.jsp"></iframe>//The Agent Desktop widget ("repeater") and display properties. In the source, replace "<tenant>" with your actual Agent Desktop web server name.

<button onclick="bpspat.api.getState(log)">Get State</button>//Button with getState method attached
<br>
<br>
<input id="item" type="text" placeholder="Interaction Id, see Logs"/>
<br>
<br>
<button onclick="bpspat.api.getCallRecordingStatus(document.getElementById('item').value)">Get Call Recording Status</button>//Button with getCallRecordingStatus method attached
<button onclick="bpspat.api.startCallRecording(document.getElementById('item').value)">Start Call Recording</button>//Button with startCallRecording method attached
<button onclick="bpspat.api.stopCallRecording(document.getElementById('item').value)">Stop Call Recording</button>//Button with stopCallRecording method attached
<br>
<br>
<button onclick="bpspat.api.muteCallRecording(document.getElementById('item').value)">Mute Call Recording</button>//Button with muteCallRecording method attached
<button onclick="bpspat.api.unmuteCallRecording(document.getElementById('item').value)">Unmute Call Recording</button>//Button with unmuteCallRecording method attached
<br>
<br>
<div id="log">Logs...//Logs section.
<br>
<br>

<script type="text/javascript">//Uses the log function to place requested data on the page.
window.bpspat.api.init("https://<tenant>.brightpattern.com");//The window.bpspat.api object will appear on an external webpage ONLY when this part is included in the script. Replace "<tenant>" with your actual Agent Desktop web server name.
function log(data) {
let div = document.createElement("div");
div.innerHTML = JSON.stringify(data);
document.getElementById("log").appendChild(div);
}

</script>

How to Use Call Recordings Control Methods

Of course, there are many ways to style your page elements and Agent Desktop widget display. The following is provided for example purposes only.

  1. Paste the sample code into the body of your HTML file. This is the bare minimum that you need for the SDK to work. Make sure you replace "<tenant>" with the name of your Agent Desktop web server.

  2. Save and open the page in your web browser. Make sure the agent is logged in and "Ready."

  3. A call comes in and the agent accepts it.

    Incoming call
    Incoming call


  4. During the call, try clicking all the buttons:
    1. Get State will retrieve agent state and interaction data; copy the "item_id" from the logs and paste it into the "Interaction ID" field

      Interaction ID is "item_id"
      Interaction ID is "item_id"


    2. Get Call Recording Status will retrieve status and place it in the logs; this shows whether the call is being recorded and if it's muted (see the bottom of the example response shown)

      Incoming call
      Incoming call


    3. Start Call Recording starts the recording

    4. Stop Call Recording stops the recording

    5. Mute Call Recording mutes the recording

    6. Unmute Call Recording unmutes the recording

  5. Note that only "Get State" and "Get Call Recording Status" provide a response in the logs.




</translate>

< Previous