Text to Speech [TTS] for Chat

MotoBrigade 17 days ago
@peckingbird Oh, I see. I didn’t have localhost:25005/alerts open in my browser. I just tried it and it works great! Thank you! As far as compatibility, it does work with Edge so that’s cool.

Can you clarify what you mean by “it does not post in the chat, to prevent it spamming”?

peckingbird 17 days ago
Ah good potatoes. Glad it works for you!
So the second version of speakSystem.js I posted does not have the bot post “Text to say” into the chat. So in the case of your earlier screenshot there would be no post by motobot_ saying “hello”.
Hope this helps clarify.

MotoBrigade 16 days ago
@peckingbird Yes, I noticed that change and I think it looks good as well in chat. Thank you, again, for your work on this! Looking forward to incorporating more PhantomBot in my streams!

Has anyone discovered a way of preventing the TTS being stopped by the use of a comma in the !shout command? and/or a way to increase the volume?

Sadly, I have not found a way to correct the comma problem. I’m sure it is something simple but I don’t know code and @peckingbird who wrote the original script hasn’t joined us here on the new forums. As far as volume control, maybe you could use a program like Voice Meeter to separate the channels and adjust to your liking?

Maybe @mausmani script here does not have that issue? Do we have somethins like tts?

1 Like

This TTS script works with commas, and periods in the input text.

Place the following file under BotFolder\scripts\systems :
speakSystem.js (3.1 KB)

Then in BotFolder\web\alerts\js\alertHandler.js , add the following code above the line:
imageFileBasename = imageFile.substring(0, imageFile.indexOf('.'));

		//START TTS
		if (imageFile.substring(0,7) == "<voice>"){//Check if voice alert.
			var textToSpeak = imageFile.substring(7);//Remove "<voice>"
			//Pass text to window object.
			var speech = new SpeechSynthesisUtterance(textToSpeak);
			var voices = window.speechSynthesis.getVoices();
			speech.default = false;
			speech.voice = voices.filter(function(voice) { return voice.name == 'Google UK English Female'; })[0];
			speech.lang = 'en-GB'; //Also added as for some reason android devices used for testing loaded spanish language 
			speech.volume = 0.70;
			window.speechSynthesis.speak(speech);
			return;
		}
		//END TTS

That’s it! You need to keep http://localhost:25000/alerts open, and then type:
!say Hello world
in chat to hear the text!

To customize this, here are the options:

  • If you want to change the voice, open the following site:


Scroll down to the section titled “HTML”, below which there will be a drop down with the available Voices and its corresponding language. Choose one you want and you can modify these 2 line in the code above:

speech.voice = voices.filter(function(voice) { return voice.name == ‘Google UK English Female’; })[0];
speech.lang = 'en-GB’;

  • If you want to adjust the volume of the speech, you can modify the below value between 0 (lowest) to 1 (loudest):

    speech.volume = 0.70;

  • In “speakSystem.js”, you can modify the price of the command by changing the following value:

    var PRICE = 20;

  • In “speakSystem.js”, to change the command that calls the TTS (default is !say), modify the below highlighted text:

    Line 88: if (command.equalsIgnoreCase(‘say’)){
    Line 95: $.registerChatCommand(’./systems/speakSystem.js’,‘say’,7);

2 Likes

I just tested this out, it works fine with OBS and just using a browser, but not with xsplit :stuck_out_tongue:

Cau you explain how to change voice language?
e.g., i want use google ru, what i need to change? I can’t understand…

Very thorough instructions. Thank you! :raised_hands:

Copy the values from the linked website which I had provided. For Russian, it is:

speech.voice = voices.filter(function(voice) { return voice.name == ‘Google русский’; })[0];
speech.lang = ‘ru-RU’;

1 Like

I could not find where it needed to be replaced, because I was looking for the wrong file. Now I have found. Thank you)

Is it possible to improve this script so that it reads the sender’s name as well?

You can use this updated script, which will read the sender’s name:

speakSystem.js (1.1 KB)

3 Likes

Thank you a lot!

sorry for more tiny request but u could provide the template for Brazilian language?

@mausmani Thank you so much for the thorough documentation. I tested this speaksystem in Chrome and it works well. When I try it using Microsoft Edge, it doesn’t speak. Now, the script that I initially posted in this thread does work with Microsoft Edge. Do you know what is the difference that makes the script by @peckingbird work in Edge and the one you wrote not work? To be clear, I love your script as it addresses many issues I had with the old script. I am trying to understand why it will not speak using Microsoft Edge. I feel that browser uses less memory and therefore is better when I stream. Thank you!

You will need to get the compatible voices for Edge browser. I just modified these 2 lines in alertHandler.js to the compatible voice in Edge browser:

speech.voice = voices.filter(function(voice) { return voice.name == 'Microsoft David Mobile - English (United States)'; })[0];
speech.lang = 'en-US';

This should work.

1 Like

Hi,

As per the website I had linked:

speech.voice = voices.filter(function(voice) { return voice.name == 'Google português do Brasil'; })[0];
speech.lang = 'pt-BR';
1 Like

Awesome! Thank you. It works great. I actually like Zira’s voice better so I changed it to:

speech.voice = voices.filter(function(voice) { return voice.name == 'Microsoft Zira Mobile - English (United States)'; })[0];
speech.lang = 'en-US';

I love it!

1 Like