Cant detect if responsiveVoice isPlaying()

问题

There isnt much information on http://responsivevoice.org about isPlaying().

Here is what I tried which isnt working. I do not get the console.log().

setInterval(function(){ // continuously check if the audio is being played
  if(responsiveVoice.isPlaying()){
    console.log('playing..');
  }, 
    100
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://responsivevoice.org/responsivevoice/responsivevoice.js"></script>

<textarea id="text" cols="45" rows="3">Hello, world!</textarea>
 
<input 
  onclick="responsiveVoice.speak($('#text').val(),'US English Female');" 
  type="button" 
  value="Play" 
/>

How do I detect if an audio is playing? Also, is there a way to get callback once the audio is done playing?

回答1:

Thanks for using ResponsiveVoice!

We've added the function isPlaying() to ResponsiveVoice since v1.3.4 and updated the API documentation.

You can now use:

responsiveVoice.isPlaying()

which works for both native SpeechSynthesis and fallback audio TTS.

You can get it here:

http://code.responsivevoice.org/develop/1.3/responsivevoice.js (points to latest release in 1.3.x cycle)

also to get specific version:

http://code.responsivevoice.org/develop/1.3.4/responsivevoice.js

回答2:

They are actually using the window.speechSynthesis Object of the speech API. So you can check for its playing boolean.

//Their code
  var voicelist = responsiveVoice.getVoices();

  var vselect = $("#voiceselection");

  $.each(voicelist, function() {
    vselect.append($("<option />").val(this.name).text(this.name));
  });

// Yours
  $('#isPlaying').on('click', function() {
    $('#r').text(window.speechSynthesis.speaking)
  })

<script src="http://responsivevoice.org/responsivevoice/responsivevoice.js"></script>
<script src="http://code.jquery.com/jquery-git2.js"></script>

<textarea id="text" cols="45" rows="3">Hello world this is some text to say</textarea>

<select id="voiceselection"></select>

<input onclick="responsiveVoice.speak($('#text').val(),$('#voiceselection').val());" type="button" value="Play" />
<br>
<button id="isPlaying">Playing:</button>
<p id="r">?</p>

回答3:

The Audio tag has a paused property. If it is not paused, then it's playing. So:

function isPlaying(audelem) { 
      return !audelem.paused; 
}

$('audio').on('play ended',function() { 
    setInterval(function(){
        if(isPlaying(this)){
           console.log('playing...');
        }
    }, 100);
});

回答4:

The isPlaying method doesn't seem to actually exist. I was able to create a solution using responsiveVoice.OnFinishedPlaying hook. It is a function you can set that will be called whenever speaking is completed. It is a little kludgy but can be wrapped as below to fire a callback when the text is complete. Of course this breaks down if you try to start speaking again before the previous text completes.

function speak(text, voice, callback) {
     if (callback) {
          responsiveVoice.OnFinishedPlaying = function () {
               responsiveVoice.OnFinishedPlaying = null;
               callback();
          };
     }                
     responsiveVoice.speak(text, voice);
}

回答5:

"is there a way to get callback once the audio is done playing?"

YES!! Here is the solution that worked for me, after looking into responsiveVoice code:

responsiveVoice.speak(text, voice, {"onend": function() { msgonend(text); }});

when:

function msgonend(text) {
    console.log("'" + text + "' ended.");
...        } 
};

来源：https://stackoverflow.com/questions/27885616/cant-detect-if-responsivevoice-isplaying

标签

javascript

jquery

responsivevoice