Comandos de voz (reconocimiento de voz) y síntesis de voz con Electron Framework

Electron Framework utiliza el marco de cromo integrado, por lo tanto, la mayoría (no todas) de las funciones disponibles en Google Chrome están disponibles en una aplicación de Electron.

En este artículo, aprenderá cómo agregar comandos de voz y sintetizar texto usando Artyom.js . Artyom.js es un envoltorio útil de reconocimiento de voz y síntesis de voz, que permite agregar comandos de voz y texto de voz fácilmente con un par de líneas de código.

Incluir artyom.js

Agregue artyom a su proyecto ejecutando el siguiente comando en la línea de comandos de node.js:

npm install artyom.js --save

Es recomendable leer la documentación de artyom aquí o visitar el repositorio oficial aquí .

Incluya el archivo artyom.js en su proyecto utilizando una etiqueta de secuencia de comandos en el encabezado de su documento html.

<script src="path-to-file/artyom.min.js"></script>

Síntesis de voz

Lamentablemente, con Electron Framework no podrá elegir la voz que desee , sino que se seleccionará la voz predeterminada de la computadora. Eso significa que está limitado a su idioma predeterminado, es decir, si su computadora está en español , solo podrá leer fluido en español . A menos que desee escribir su propio módulo de síntesis de voz leyendo la documentación de la API de síntesis de voz y aprender a elegir una voz, lo cual se vuelve inútil ya que puede que solo esté disponible para la computadora en la que está trabajando (no se puede mantener).

Para sintetizar texto, use la función artyom.say:

artyom.say("I will read this text on your computer, great isn't?");

Nota: Artyom resuelve en Google Chrome la limitación de 200 caracteres, sin embargo en una App Electron, este límite no existe ya que no se utiliza ningún servicio remoto. La síntesis de voz utiliza la voz local del SO.

Comandos de voz

Para agregar comandos de voz a nuestra aplicación Electron usaremos la función artyom.addCommands. Cada comando es un objeto literal con las palabras que activan el comando en una matriz y un parámetro de acción que es una función que se activará cuando la voz coincida con el comando.

El siguiente comando responde hola si el usuario dice hello o hi:

var adminName = "Carlos";

artyom.addCommands({
    indexes: ["Hello","Hi"],
    action: function(){
        artyom.say("Hello, how are you today "+ adminName +"?");
    }
});

Ahora que sabes cómo agregar comandos, comencemos con un ejemplo básico.

Ejemplo

Agregue 3 botones y adjunte cada una de las siguientes funciones en el evento onclick.

Uno iniciará artyom en modo continuo y otro en un escucha de comandos.

Nota: En Google Chrome se requiere una conexión https para usar el modo continuo, sin embargo en la App Electron funciona sin ningún tipo de inconveniente.

<button type="button" onclick="StartArtyomOneCommand();">Start artyom one command</button>
<button type="button" onclick="StartArtyomContinuous();">Start artyom continuous assistant</button>
<br>
<button type="button" onclick="StopArtyom();">Stop recognition</button>

<script>
function StartArtyomOneCommand(){
    console.log("One command");
    if(artyom.isRecognizing()){
        return alert("Stop artyom first !");
    }

    //Although the voice can't be changed,
    // You need to set the language for the speech
    // Recognition, see the documentation for more examples
    return artyom.initialize({
        lang:"en-GB",
        debug:true,
        continuous:false,
        listen:true
    });
}

function StartArtyomContinuous(){
    console.log("Continuous commands");
    if(artyom.isRecognizing()){
        return alert("Stop artyom first !");
    }

    // You can create a permanent voice assistant
    // if you want using the continuous mode !
    return artyom.initialize({
        lang:"en-GB",
        debug:true,
        continuous:false,
        listen:true
    });
}

function StopArtyom(){
    artyom.fatality();
}
</script>

Ahora agregue algunos comandos y agregue el detector de errores para artyom en el evento window.onload:

<script>
'use strict';
    window.onload = function(){

        // Add the error listeners
        artyom.when("ERROR",function(err){
            console.error("An error ocurred : ", err.code);
        });

        console.log("Artyom is ready");
        
        // Important, add the commands to process.
        artyom.addCommands([
            {
                indexes:["Hello","Hi"],
                action: function(i){
                    artyom.say("Hello, how are you today?");
                }
            },
            {
                indexes:["Say * please"],
                smart:true,
                action: function(i,wildcard,sentence){
                    artyom.say(wildcard);
                }
            },
            {
                indexes:["Text content *"],
                smart:true,
                action: function(i,wildcard,sentence){
                    document.getElementById("text-content").value = wildcard;
                }
            },
            {
                indexes:["write * in the console"],
                smart:true,
                action: function(i,wildcard,sentence){
                    console.log(wildcard);
                }
            }
        ]);
    };
</script>

Finalmente, simplemente cree su aplicación usando npm starty pruebe los comandos que acabamos de agregar. La síntesis de voz no requiere demostración, solo necesita pasar una cadena como primer parámetro a la función artyom.say.

Puede ver el ejemplo anterior en los ejemplos oficiales de electrones del repositorio aquí .