这是firefox中的一个错误,还是主动修复了我做错的事情?

时间:2016-06-07 20:44:18

标签: javascript html5 google-chrome firefox web-audio

只要来自麦克风的信号超过设定的阈值,以下代码就会将一个框变为红色。它一整天都在linux上使用chrome和在windows上运行chrome。它在两个平台上的firefox上运行良好 - 大约15秒。当它停止在firefox上工作时它没有错误,.getChannelData只是开始返回全零。我是否在FF中发现了一个错误,或者只是做了更好的工作来清理我的shonky javascipt?

<!DOCTYPE html>
<html lang="en-us">
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width">
  <style>
    #wrapper { width:100px; height: 100px; background-color: #00F; }
  </style>
</head>
<body>
  <div id="wrapper">
  </div>
  <div id="outs">
    Audio blocks processed: <span id="audProcEnv">none</span><br>
  </div>
  <script>
    const MINFRAMETIME = 100;
    const SCRIPTPROCESSORBUFFER = 1024;
    const TRIGGERTHRESHOLD = 0.1;

    navigator.getUserMedia = (navigator.getUserMedia ||
                              navigator.webkitGetUserMedia ||
                              navigator.mozGetUserMedia ||
                              navigator.msGetUserMedia);

    var audioContext = new (window.AudioContext || window.webkitAudioContext)();
    var gainNode = audioContext.createGain();
    gainNode.gain.value = 0; // Mute the output / Don't output sound - feedback!
    var scriptNode = audioContext.createScriptProcessor(SCRIPTPROCESSORBUFFER, 2, 2);

    var vu = document.querySelector('#wrapper');
    var audioProcessingEventDiv = document.querySelector('#audProcEnv');
    var audioProcessingEventCounter = 0;
    var lastRedraw = 0;
    var signal = false;
    var drawStuff;

    navigator.getUserMedia (
      { audio: true },
      function(stream) {
        var source = audioContext.createMediaStreamSource(stream);
        source.connect(scriptNode);
        scriptNode.connect(gainNode);
        gainNode.connect(audioContext.destination);
        draw();
      },
      function(err) {
        console.log('Error:' + err);
      }
    );

    scriptNode.onaudioprocess = function(audioProcessingEvent) {
      dispPeak = 0;
      signal = false;
      audioProcessingEventCounter++;
      var left = audioProcessingEvent.inputBuffer.getChannelData (0);
      var leftout = audioProcessingEvent.outputBuffer.getChannelData (0);
      for (var sample = 0; sample < SCRIPTPROCESSORBUFFER; sample++) {
        leftout[sample] = left[sample];
        if (left[sample] > dispPeak) { dispPeak = left[sample]; }
        if (left[sample] < -dispPeak) { dispPeak = -left[sample]; }
        if (dispPeak > TRIGGERTHRESHOLD) { signal = true; }
      }
    };

    function draw() {
      drawStuff = requestAnimationFrame(draw);
      if (Date.now() > (lastRedraw + MINFRAMETIME)) {
        if (signal) {
          vu.style.backgroundColor = "#F00";
        } else {
          vu.style.backgroundColor = "#00F";
      }
      audioProcessingEventDiv.innerHTML = audioProcessingEventCounter;
      lastRedraw = Date.now();
      }
    }
    draw();

  </script>
</body>
</html>

0 个答案:

没有答案