From 45285a9027db851125992017c0e0b7c3cffcbac8 Mon Sep 17 00:00:00 2001
From: yinhew <46698869+yinhew@users.noreply.github.com>
Date: Mon, 11 Dec 2023 05:27:46 +0000
Subject: [PATCH] [Avatar] Update real time avatar sample code to support
 multi-lingual (#2174)

* [TalkingAvatar] Add sample code for TTS talking avatar real-time API

* sample codes for batch avatar synthesis

* Address repository check failure

* update

* [Avatar] Update real time avatar sample code to support multi-lingual

---------

Co-authored-by: Yulin Li <yulili@microsoft.com>
---
 samples/js/browser/avatar/basic.html | 2 +-
 samples/js/browser/avatar/chat.html  | 6 +++---
 samples/js/browser/avatar/js/chat.js | 8 +++++---
 3 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/samples/js/browser/avatar/basic.html b/samples/js/browser/avatar/basic.html
index 3260e74f2..c08ed9fd3 100644
--- a/samples/js/browser/avatar/basic.html
+++ b/samples/js/browser/avatar/basic.html
@@ -33,7 +33,7 @@ <h2 style="background-color: white; width: 300px;">ICE Server</h2>
 
   <h2 style="background-color: white; width: 300px;">TTS Configuration</h2>
   <label style="font-size: medium;" for="ttsVoice">TTS Voice:</label>
-  <input id="ttsVoice" type="text" size="32" style="font-size: medium;" value="en-US-JennyNeural"></input><br />
+  <input id="ttsVoice" type="text" size="32" style="font-size: medium;" value="en-US-JennyMultilingualV2Neural"></input><br />
   <label style="font-size: medium;" for="customVoiceEndpointId">Custom Voice Deployment ID (Endpoint ID):</label>
   <input id="customVoiceEndpointId" type="text" size="32" style="font-size: medium;" value=""></input><br />
   <br />
diff --git a/samples/js/browser/avatar/chat.html b/samples/js/browser/avatar/chat.html
index ff81c3ec6..f48549561 100644
--- a/samples/js/browser/avatar/chat.html
+++ b/samples/js/browser/avatar/chat.html
@@ -54,10 +54,10 @@ <h2 style="background-color: white; width: 150px;">ICE Server</h2>
   <br />
 
   <h2 style="background-color: white; width: 300px;">STT / TTS Configuration</h2>
-  <label style="font-size: medium;" for="sttLocale">STT Locale:</label>
-  <input id="sttLocale" type="text" size="32" style="font-size: medium;" value="en-US"></input><br />
+  <label style="font-size: medium;" for="sttLocale">STT Locale(s):</label>
+  <input id="sttLocales" type="text" size="64" style="font-size: medium;" value="en-US,de-DE,es-ES,fr-FR,it-IT,ja-JP,ko-KR,zh-CN"></input><br />
   <label style="font-size: medium;" for="ttsVoice">TTS Voice:</label>
-  <input id="ttsVoice" type="text" size="32" style="font-size: medium;" value="en-US-JennyNeural"></input><br />
+  <input id="ttsVoice" type="text" size="32" style="font-size: medium;" value="en-US-JennyMultilingualV2Neural"></input><br />
   <label style="font-size: medium;" for="customVoiceEndpointId">Custom Voice Deployment ID (Endpoint ID):</label>
   <input id="customVoiceEndpointId" type="text" size="32" style="font-size: medium;" value=""></input><br />
   <br />
diff --git a/samples/js/browser/avatar/js/chat.js b/samples/js/browser/avatar/js/chat.js
index c59131fc0..fc298bd54 100644
--- a/samples/js/browser/avatar/js/chat.js
+++ b/samples/js/browser/avatar/js/chat.js
@@ -236,9 +236,11 @@ window.startSession = () => {
         console.log("Event received: " + e.description + offsetMessage)
     }
 
-    const speechRecognitionConfig = SpeechSDK.SpeechConfig.fromSubscription(cogSvcSubKey, cogSvcRegion)
-    speechRecognitionConfig.speechRecognitionLanguage = document.getElementById('sttLocale').value
-    speechRecognizer = new SpeechSDK.SpeechRecognizer(speechRecognitionConfig, SpeechSDK.AudioConfig.fromDefaultMicrophoneInput())
+    const speechRecognitionConfig = SpeechSDK.SpeechConfig.fromEndpoint(new URL(`wss://${cogSvcRegion}.stt.speech.microsoft.com/speech/universal/v2`), cogSvcSubKey)
+    speechRecognitionConfig.setProperty(SpeechSDK.PropertyId.SpeechServiceConnection_LanguageIdMode, "Continuous")
+    var sttLocales = document.getElementById('sttLocales').value.split(',')
+    var autoDetectSourceLanguageConfig = SpeechSDK.AutoDetectSourceLanguageConfig.fromLanguages(sttLocales)
+    speechRecognizer = SpeechSDK.SpeechRecognizer.FromConfig(speechRecognitionConfig, autoDetectSourceLanguageConfig, SpeechSDK.AudioConfig.fromDefaultMicrophoneInput())
 
     const azureOpenAIEndpoint = document.getElementById('azureOpenAIEndpoint').value
     const azureOpenAIApiKey = document.getElementById('azureOpenAIApiKey').value