Advanced Usage

Accessing the Scene and Persona instance

Our widget is designed to be extensible, allowing you to incorporate your own functionality on top of the features provided out-of-the-box. To enable this extensibility we have exposed our scene and persona class instances as properties of the widget. This allows you to call any of the properties or methods you see in the websdk docs.

These two properties become available after the component has successfully rendered on a webpage, this is signified by the 'ready' event on the widget.

Can be used like this:

let widget = document.getElementsByTagName('sm-widget')[0]; widget.addEventListener('ready', () => { // Log the objects to the console console.log(widget.scene); console.log(widget.persona); // Example of how to call methods on instances widget.scene.connectionState.onConnectionStateUpdated.addListener((connectionState) => {}); widget.persona.onSpeechMarkerEvent.addListener((marker) => {}); });

Sending a message to the Digital Person

A Digital Person inside the widget only responds to verbal commands. To send text to a Digital Person you can use the sendTextMessage method. To implement this scenario select the widget element and call the function. The example below shows how to send the text 'hello' to a Digital Person. document.querySelector('sm-widget').sendTextMessage('hello')

An active connection to a Digital Person session is required to use this method. If you call the method before establishing a Digital Person connection our SDK will throw an error.

Debugging

By default the widget will display warning and error logs. If you’d prefer verbose logs, enable the widget to show all logs by following these steps:

  • Open the browser console on the webpage where the widget is rendered

  • Paste in document.querySelector('sm-widget').enableDebugLogging(true) and push enter. This will enable the debug logging.

  • Click the connect button. You should see a lot more logs being logged to the console.

When you want to disable the logs, repeat the same steps as above but set the debug logging to false document.querySelector('sm-widget').enableDebugLogging(false)