article by Frank Nimphius, July 2022

 

Oracle Digital Assistant offers a web SDK for customers to integrate their digital assistant into web applications and websites. A feature of the Oracle Web SDK is voice support. If you configure the Web SDK with the enableSpeech property set to true (which is also the default), a microphone icon will appear next to the user message input field so that the user can speak to the bot instead of typing the messages.

This article explains how users can launch the speech recording without explicitly clicking the microphone icon.

 

The image below shows Oracle Digital Assistant running within the Web SDK. As you can see in the image, the transcript of the recorded voice gets automatically added to the message field from where it is passed on to the Oracle Digital Assistant. To save the user from having to press a send button, make sure the enableSpeechAutoSend property in the Web SDK configuration also is set to true (the default)

voice controlled conversation with ODA

 

How to use the spacebar key on the keyboard to launch the user voice recording

If you download the Oracle Web SDK and unzip it on your local file system, then you see the following folder structure

Oracle Web SDK folder structure

The samples folder contains an index.html file as well as a settings.js file that you can copy to the public directory of a server you use for testing Oracle Digital Assistant deploymen to the web.

Sample folder structure

 

To configure access to the Oracle Digital Assistant you open the "scripts" folder and edit the settings.js file. Add the URI to your ODA instance and the ID of the web channel you created in Oracle Digital Assistant (See this tutorial for a step-by-step instruction: Web SDK Tutorial ). Also ensure that the "enableSpeech" property is set to true.

Add the following JavaScript to the top of the settings.js file to allow users to start the microphone using the space-bar key (the key that adds a blank character)

window.onkeypress = function(e) {
 var messageField = document.getElementsByClassName('oda-chat-user-input oda-chat-user-input-inline-send');
if (messageField[0].value.length == 0 && e.key === " " || e.key === "Spacebar") {
  e.preventDefault();
  var micbutton = document.getElementsByClassName('oda-chat-icon oda-chat-footer-button oda-chat-flex oda-chat-button-switch-voice');
  micbutton[0].click();
  }
}

The image below shows how the code needs to be added. As you can see it is saved above the initSdk(name) function declaration.

JavaScript to be added into settings.js

The JavaScript code adds a listener to the message field. So when the cursor is in the message field and a user presses the spacebar, the JavaScript code finds and clicks on the microphone icon. When a user starts typing a message, the microphone doesn't activate, even if a space is added in the text.

So, with this little script, users get a conventient option to launch the speech recording to speak to their digital assistant.

Related content

related content like tutorials, videos, examples and more can be found on the Oracle Digital Assistant documentation page: bit.ly/ODADoc . And if you don't know how to find something, then ask Artie. Artie is the digital assistant that lives on the documentation page. 

 

Author