add connect button for ws html5 (#621)

zhaomingwork

2023-06-12 d7e3ae17c3ac056752ecf5c41ff9a96645fcad49

add connect button for ws html5 (#621)

 funasr/runtime/html5/static/index.html

@@ -36,6 +36,7 @@
                <br>

                <div id="info_div">请点击开始</div>

                <div class="div_class_buttons">

                    <button id="btnConnect">连接</button>

                    <button id="btnStart">开始</button>

                    <button id="btnStop">停止</button>

 


 funasr/runtime/html5/static/main.js

@@ -23,12 +23,14 @@
var sampleBuf=new Int16Array();

// 定义按钮响应事件

var btnStart = document.getElementById('btnStart');

btnStart.onclick = start;

btnStart.onclick = record;

var btnStop = document.getElementById('btnStop');

btnStop.onclick = stop;

btnStop.disabled = true;

btnStart.disabled = true;

 



btnConnect= document.getElementById('btnConnect');

btnConnect.onclick = start;

 

var rec_text="";

var offline_text="";

@@ -38,7 +40,7 @@
//now_ipaddress=now_ipaddress.replace("https://","wss://");

//now_ipaddress=now_ipaddress.replace("static/index.html","");

//document.getElementById('wssip').value=now_ipaddress;



 
function getAsrMode(){



            var item = null;

@@ -82,11 +84,14 @@
function getConnState( connState ) {

    if ( connState === 0 ) {

 

        rec.open( function(){

            rec.start();

            console.log("开始录音");

        //rec.open( function(){

        //    rec.start();

        //    console.log("开始录音");

 

        });

        //});

        btnStart.disabled = false;

        btnConnect.disabled = true;

        info_div.innerHTML='连接成功!请点击开始';

    } else if ( connState === 1 ) {

        //stop();

    } else if ( connState === 2 ) {

@@ -95,11 +100,19 @@
         

        alert("连接地址"+document.getElementById('wssip').value+"失败,请检查asr地址和端口，并确保h5服务和asr服务在同一个域内。或换个浏览器试试。");

        btnStart.disabled = true;

        info_div.innerHTML='请点击开始';



        info_div.innerHTML='请点击连接';

    }

}





function record()

{

         rec.open( function(){

         rec.start();

         console.log("开始");

         btnStart.disabled = true;

         });

}

// 识别启动、停止、清空操作

function start() {

    

@@ -107,14 +120,15 @@
    clear();

    //控件状态更新

         



    info_div.innerHTML="正在连接asr服务器，请等待...";

    //启动连接

    var ret=wsconnecter.wsStart();

    if(ret==1){

        isRec = true;

        btnStart.disabled = true;

        btnStop.disabled = false;

        info_div.innerHTML="正在连接asr服务器，请等待...";

        btnConnect.disabled=true;



    }

}



@@ -147,7 +161,10 @@
    btnStop.disabled = true;

    setTimeout(function(){

        console.log("call stop ws!");

        wsconnecter.wsStop();btnStart.disabled = false;info_div.innerHTML="请点击开始";}, 3000 );

        wsconnecter.wsStop();

        btnStart.disabled = true;

        btnConnect.disabled=false;

        info_div.innerHTML="请点击连接";}, 3000 );

    rec.stop(function(blob,duration){

  

        console.log(blob);