How to implement Web Speech API in NG Titanium?

Hi everyone,

I am looking for guidance on implementing the Web Speech API (Speech Recognition) within a Servoy NG Titanium application and capturing the recognized text.

My Environment:

  • OS: Windows

  • Browser: Google Chrome

  • Servoy Version: 2024.03 (NG Titanium)

The Issue:
I have been exploring clientutils.generateBrowserFunction, but I am struggling with two specific parts of the workflow:

  1. How to correctly trigger the client-side speech recognition process from the server.

  2. How to pass the recognized text back from the browser to my Servoy solution once the recognition is complete.

Does anyone have a code snippet or a recommended pattern for handling this type of client-side event and callback in NG Titanium?

This is some code:

function iniVoiceRecognition() {
    var jsCode = "var SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;" +
                 "if (!SpeechRecognition) {" +
                 "  alert('Your webBrowser not support Voice Recognition');" +
                 "  return;" +
                 "}" +
                 "var recognition = new SpeechRecognition();" +
                 "recognition.lang = 'es-ES';" +
                 "recognition.continuous = false;" +
                 "recognition.interimResults = false;" +
                 "recognition.onresult = function(event) {" +
                 "  var transcript = event.results[0][0].transcript;" +
                 "  callback(transcript);" +
                 "};" +
                 "recognition.onerror = function(event) {" +
                 "  alert('Error: ' + event.error);" +
                 "};" +
                 "recognition.start();";
    
    clientutils.generateBrowserFunction(jsCode);
    
}

function updateText(_recognizedText) {
    // Asignar el texto al campo
    myField = _recognizedText;
}

Thanks in advance for your help!