From 9fcb3cc06b4e324f0913d2f61b89becc2baeef1b Mon Sep 17 00:00:00 2001
From: hnluo <haoneng.lhn@alibaba-inc.com>
Date: 星期一, 11 九月 2023 17:40:03 +0800
Subject: [PATCH] Merge pull request #932 from alibaba-damo-academy/dev_lhn
---
funasr/runtime/html5/static/main.js | 277 ++++++++++++++++++++++++++++++++++++++++++++-----------
1 files changed, 221 insertions(+), 56 deletions(-)
diff --git a/funasr/runtime/html5/static/main.js b/funasr/runtime/html5/static/main.js
index 35e533a..38811cd 100644
--- a/funasr/runtime/html5/static/main.js
+++ b/funasr/runtime/html5/static/main.js
@@ -31,6 +31,9 @@
btnConnect= document.getElementById('btnConnect');
btnConnect.onclick = start;
+
+var awsslink= document.getElementById('wsslink');
+
var rec_text=""; // for online rec asr result
var offline_text=""; // for offline rec asr result
@@ -41,27 +44,143 @@
var isfilemode=false; // if it is in file mode
+var file_ext="";
+var file_sample_rate=16000; //for wav file sample rate
var file_data_array; // array to save file data
-var isconnected=0; // for file rec, 0 is not begin, 1 is connected, -1 is error
-var totalsend=0;
+var totalsend=0;
+
+
+var now_ipaddress=window.location.href;
+now_ipaddress=now_ipaddress.replace("https://","wss://");
+now_ipaddress=now_ipaddress.replace("static/index.html","");
+var localport=window.location.port;
+now_ipaddress=now_ipaddress.replace(localport,"10095");
+document.getElementById('wssip').value=now_ipaddress;
+addresschange();
+function addresschange()
+{
+
+ var Uri = document.getElementById('wssip').value;
+ document.getElementById('info_wslink').innerHTML="鐐规澶勬墜宸ユ巿鏉冿紙IOS鎵嬫満锛�";
+ Uri=Uri.replace(/wss/g,"https");
+ console.log("addresschange uri=",Uri);
+
+ awsslink.onclick=function(){
+ window.open(Uri, '_blank');
+ }
+
+}
+
+upfile.onclick=function()
+{
+ btnStart.disabled = true;
+ btnStop.disabled = true;
+ btnConnect.disabled=false;
+
+}
+
+// from https://github.com/xiangyuecn/Recorder/tree/master
+var readWavInfo=function(bytes){
+ //璇诲彇wav鏂囦欢澶达紝缁熶竴鎴�44瀛楄妭鐨勫ご
+ if(bytes.byteLength<44){
+ return null;
+ };
+ var wavView=bytes;
+ var eq=function(p,s){
+ for(var i=0;i<s.length;i++){
+ if(wavView[p+i]!=s.charCodeAt(i)){
+ return false;
+ };
+ };
+ return true;
+ };
+
+ if(eq(0,"RIFF")&&eq(8,"WAVEfmt ")){
+
+ var numCh=wavView[22];
+ if(wavView[20]==1 && (numCh==1||numCh==2)){//raw pcm 鍗曟垨鍙屽０閬�
+ var sampleRate=wavView[24]+(wavView[25]<<8)+(wavView[26]<<16)+(wavView[27]<<24);
+ var bitRate=wavView[34]+(wavView[35]<<8);
+ var heads=[wavView.subarray(0,12)],headSize=12;//head鍙繚鐣欏繀瑕佺殑鍧�
+ //鎼滅储data鍧楃殑浣嶇疆
+ var dataPos=0; // 44 鎴栨湁鏇村鍧�
+ for(var i=12,iL=wavView.length-8;i<iL;){
+ if(wavView[i]==100&&wavView[i+1]==97&&wavView[i+2]==116&&wavView[i+3]==97){//eq(i,"data")
+ heads.push(wavView.subarray(i,i+8));
+ headSize+=8;
+ dataPos=i+8;break;
+ }
+ var i0=i;
+ i+=4;
+ i+=4+wavView[i]+(wavView[i+1]<<8)+(wavView[i+2]<<16)+(wavView[i+3]<<24);
+ if(i0==12){//fmt
+ heads.push(wavView.subarray(i0,i));
+ headSize+=i-i0;
+ }
+ }
+ if(dataPos){
+ var wavHead=new Uint8Array(headSize);
+ for(var i=0,n=0;i<heads.length;i++){
+ wavHead.set(heads[i],n);n+=heads[i].length;
+ }
+ return {
+ sampleRate:sampleRate
+ ,bitRate:bitRate
+ ,numChannels:numCh
+ ,wavHead44:wavHead
+ ,dataPos:dataPos
+ };
+ };
+ };
+ };
+ return null;
+};
+
upfile.onchange = function () {
銆�銆�銆�銆�銆�銆�var len = this.files.length;
for(let i = 0; i < len; i++) {
+
let fileAudio = new FileReader();
fileAudio.readAsArrayBuffer(this.files[i]);
+
+ file_ext=this.files[i].name.split('.').pop().toLowerCase();
+ var audioblob;
fileAudio.onload = function() {
- var audioblob= fileAudio.result;
+ audioblob = fileAudio.result;
+
+
file_data_array=audioblob;
- console.log(audioblob);
- btnConnect.disabled = false;
+
+
info_div.innerHTML='璇风偣鍑昏繛鎺ヨ繘琛岃瘑鍒�';
-
+
}
+
銆�銆�銆�銆�銆�銆�銆�銆�銆�銆�fileAudio.onerror = function(e) {
銆�銆�銆�銆�銆�銆�銆�銆�銆�銆�銆�銆�console.log('error' + e);
銆�銆�銆�銆�銆�銆�銆�銆�銆�銆�}
}
+ // for wav file, we get the sample rate
+ if(file_ext=="wav")
+ for(let i = 0; i < len; i++) {
+
+ let fileAudio = new FileReader();
+ fileAudio.readAsArrayBuffer(this.files[i]);
+ fileAudio.onload = function() {
+ audioblob = new Uint8Array(fileAudio.result);
+
+ // for wav file, we can get the sample rate
+ var info=readWavInfo(audioblob);
+ console.log(info);
+ file_sample_rate=info.sampleRate;
+
+
+ }
+
+銆�銆�銆�銆�銆�銆�
+ }
+
}
function play_file()
@@ -70,11 +189,11 @@
var audio_record = document.getElementById('audio_record');
audio_record.src = (window.URL||webkitURL).createObjectURL(audioblob);
audio_record.controls=true;
- audio_record.play();
+ //audio_record.play(); //not auto play
}
function start_file_send()
{
- sampleBuf=new Int16Array( file_data_array );
+ sampleBuf=new Uint8Array( file_data_array );
var chunk_size=960; // for asr chunk_size [5, 10, 5]
@@ -87,7 +206,7 @@
sendBuf=sampleBuf.slice(0,chunk_size);
totalsend=totalsend+sampleBuf.length;
sampleBuf=sampleBuf.slice(chunk_size,sampleBuf.length);
- wsconnecter.wsSend(sendBuf,false);
+ wsconnecter.wsSend(sendBuf);
}
@@ -97,24 +216,7 @@
}
-function start_file_offline()
-{
- console.log("start_file_offline",isconnected);
- if(isconnected==-1)
- {
- return;
- }
- if(isconnected==0){
-
- setTimeout(start_file_offline, 1000);
- return;
- }
- start_file_send();
-
-
-
-}
function on_recoder_mode_change()
{
@@ -133,19 +235,36 @@
document.getElementById("mic_mode_div").style.display = 'block';
document.getElementById("rec_mode_div").style.display = 'none';
- btnConnect.disabled=false;
+
+ btnStart.disabled = true;
+ btnStop.disabled = true;
+ btnConnect.disabled=false;
isfilemode=false;
}
else
{
document.getElementById("mic_mode_div").style.display = 'none';
document.getElementById("rec_mode_div").style.display = 'block';
- btnConnect.disabled = true;
+
+ btnStart.disabled = true;
+ btnStop.disabled = true;
+ btnConnect.disabled=true;
isfilemode=true;
info_div.innerHTML='璇风偣鍑婚�夋嫨鏂囦欢';
}
+}
+function getHotwords(){
+ var obj = document.getElementById("varHot");
+
+ if(typeof(obj) == 'undefined' || obj==null || obj.value.length<=0){
+ return "";
+ }
+ let val = obj.value.toString();
+ console.log("hotwords="+val);
+ return val;
+
}
function getAsrMode(){
@@ -168,16 +287,46 @@
return item;
}
+function handleWithTimestamp(tmptext,tmptime)
+{
+ console.log( "tmptext: " + tmptext);
+ console.log( "tmptime: " + tmptime);
+ if(tmptime==null || tmptime=="undefined" || tmptext.length<=0)
+ {
+ return tmptext;
+ }
+ tmptext=tmptext.replace(/銆�/g, ","); // in case there are a lot of "銆�"
+ var words=tmptext.split(",");
+ var jsontime=JSON.parse(tmptime); //JSON.parse(tmptime.replace(/\]\]\[\[/g, "],[")); // in case there are a lot segments by VAD
+ var char_index=0;
+ var text_withtime="";
+ for(var i=0;i<words.length;i++)
+ {
+ if(words[i]=="undefined" || words[i].length<=0)
+ {
+ continue;
+ }
+ console.log("words===",words[i]);
+ console.log( "words: " + words[i]+",time="+jsontime[char_index][0]/1000);
+ text_withtime=text_withtime+jsontime[char_index][0]/1000+":"+words[i]+"\n";
+ char_index=char_index+words[i].length;
+ }
+ return text_withtime;
+
+}
// 璇煶璇嗗埆缁撴灉; 瀵筳sonMsg鏁版嵁瑙ｆ瀽,灏嗚瘑鍒粨鏋滈檮鍔犲埌缂栬緫妗嗕腑
function getJsonMessage( jsonMsg ) {
//console.log(jsonMsg);
console.log( "message: " + JSON.parse(jsonMsg.data)['text'] );
var rectxt=""+JSON.parse(jsonMsg.data)['text'];
var asrmodel=JSON.parse(jsonMsg.data)['mode'];
- if(asrmodel=="2pass-offline")
+ var is_final=JSON.parse(jsonMsg.data)['is_final'];
+ var timestamp=JSON.parse(jsonMsg.data)['timestamp'];
+ if(asrmodel=="2pass-offline" || asrmodel=="offline")
{
- offline_text=offline_text+rectxt; //.replace(/ +/g,"");
+
+ offline_text=offline_text+handleWithTimestamp(rectxt,timestamp); //rectxt; //.replace(/ +/g,"");
rec_text=offline_text;
}
else
@@ -189,13 +338,13 @@
varArea.value=rec_text;
console.log( "offline_text: " + asrmodel+","+offline_text);
console.log( "rec_text: " + rec_text);
- if (isfilemode==true){
+ if (isfilemode==true && is_final==false){
console.log("call stop ws!");
play_file();
wsconnecter.wsStop();
info_div.innerHTML="璇风偣鍑昏繛鎺�";
- isconnected=0;
+
btnStart.disabled = true;
btnStop.disabled = true;
btnConnect.disabled=false;
@@ -207,12 +356,19 @@
// 杩炴帴鐘舵�佸搷搴�
function getConnState( connState ) {
- if ( connState === 0 ) {
+ if ( connState === 0 ) { //on open
info_div.innerHTML='杩炴帴鎴愬姛!璇风偣鍑诲紑濮�';
if (isfilemode==true){
info_div.innerHTML='璇疯�愬績绛夊緟,澶ф枃浠剁瓑寰呮椂闂存洿闀�';
+ start_file_send();
+ }
+ else
+ {
+ btnStart.disabled = false;
+ btnStop.disabled = true;
+ btnConnect.disabled=true;
}
} else if ( connState === 1 ) {
//stop();
@@ -220,9 +376,11 @@
stop();
console.log( 'connecttion error' );
- alert("杩炴帴鍦板潃"+document.getElementById('wssip').value+"澶辫触,璇锋鏌sr鍦板潃鍜岀鍙ｏ紝骞剁‘淇漢5鏈嶅姟鍜宎sr鏈嶅姟鍦ㄥ悓涓�涓煙鍐呫�傛垨鎹釜娴忚鍣ㄨ瘯璇曘��");
+ alert("杩炴帴鍦板潃"+document.getElementById('wssip').value+"澶辫触,璇锋鏌sr鍦板潃鍜岀鍙ｃ�傛垨璇曡瘯鐣岄潰涓婃墜鍔ㄦ巿鏉冿紝鍐嶈繛鎺ャ��");
btnStart.disabled = true;
- isconnected=0;
+ btnStop.disabled = true;
+ btnConnect.disabled=false;
+
info_div.innerHTML='璇风偣鍑昏繛鎺�';
}
@@ -234,7 +392,9 @@
rec.open( function(){
rec.start();
console.log("寮�濮�");
- btnStart.disabled = true;
+ btnStart.disabled = true;
+ btnStop.disabled = false;
+ btnConnect.disabled=true;
});
}
@@ -247,27 +407,29 @@
// 娓呴櫎鏄剧ず
clear();
//鎺т欢鐘舵�佹洿鏂�
- console.log("isfilemode"+isfilemode+","+isconnected);
- info_div.innerHTML="姝ｅ湪杩炴帴asr鏈嶅姟鍣紝璇风瓑寰�...";
+ console.log("isfilemode"+isfilemode);
+
//鍚姩杩炴帴
var ret=wsconnecter.wsStart();
+ // 1 is ok, 0 is error
if(ret==1){
+ info_div.innerHTML="姝ｅ湪杩炴帴asr鏈嶅姟鍣紝璇风瓑寰�...";
isRec = true;
- btnStart.disabled = false;
- btnStop.disabled = false;
+ btnStart.disabled = true;
+ btnStop.disabled = true;
btnConnect.disabled=true;
- if (isfilemode)
- {
- console.log("start file now");
- start_file_offline();
- btnStart.disabled = true;
- btnStop.disabled = true;
- btnConnect.disabled = true;
- }
return 1;
}
- return 0;
+ else
+ {
+ info_div.innerHTML="璇风偣鍑诲紑濮�";
+ btnStart.disabled = true;
+ btnStop.disabled = true;
+ btnConnect.disabled=false;
+
+ return 0;
+ }
}
@@ -282,17 +444,17 @@
};
console.log(request);
if(sampleBuf.length>0){
- wsconnecter.wsSend(sampleBuf,false);
+ wsconnecter.wsSend(sampleBuf);
console.log("sampleBuf.length"+sampleBuf.length);
sampleBuf=new Int16Array();
}
- wsconnecter.wsSend( JSON.stringify(request) ,false);
+ wsconnecter.wsSend( JSON.stringify(request) );
- //isconnected=0;
+
// 鎺т欢鐘舵�佹洿鏂�
isRec = false;
@@ -301,12 +463,15 @@
if(isfilemode==false){
btnStop.disabled = true;
btnStart.disabled = true;
- btnConnect.disabled=false;
+ btnConnect.disabled=true;
+ //wait 3s for asr result
setTimeout(function(){
console.log("call stop ws!");
wsconnecter.wsStop();
- isconnected=0;
+ btnConnect.disabled=false;
info_div.innerHTML="璇风偣鍑昏繛鎺�";}, 3000 );
+
+
rec.stop(function(blob,duration){
@@ -317,7 +482,7 @@
var audio_record = document.getElementById('audio_record');
audio_record.src = (window.URL||webkitURL).createObjectURL(theblob);
audio_record.controls=true;
- audio_record.play();
+ //audio_record.play();
} ,function(msg){
@@ -361,7 +526,7 @@
while(sampleBuf.length>=chunk_size){
sendBuf=sampleBuf.slice(0,chunk_size);
sampleBuf=sampleBuf.slice(chunk_size,sampleBuf.length);
- wsconnecter.wsSend(sendBuf,false);
+ wsconnecter.wsSend(sendBuf);
--
Gitblit v1.9.1