cwilso / volume-meter Goto Github PK

Hi I'm trying to use this example and the input stream only lasts for 5 seconds on firefox (same with the input effects, but not audiorecorder?). Is this an issue with the examples or web audio api?

Thanks for taking a look at this, I'm more of an artist than a coder, the work with web audio is really exciting!

I like your project thank you for your great project.
I will volume meter just on system audio not on live input (mic), how to?
What do I replace and to come be? Would you like to show me the code, please?

I get this error when trying to load the page in chromium:

getUserMedia() no longer works on insecure origins. To use this feature, you should consider switching your application to a secure origin, such as HTTPS. See https://goo.gl/rStTGz for more details.

Here is TypeScript typings if someone is using this module in a TypeScript environment:

export = createAudioMeter;

declare type ScriptProcessorNodeMod = ScriptProcessorNode & {
  clipping = boolean;
  lastClip = number;
  volume = number;
  clipLevel = number;
  averaging = number;
  clipLag = number;

  checkClipping: () => boolean;
  shutdown: () => void;
};

declare function createAudioMeter(
  audioContext: AudioContext,
  clipLevel: number,
  averaging: number,
  clipLag: number,
): ScriptProcessorNodeMod;

Hello, thanks for useful example. I have integrated it in my React app, with calling of meter.shutdown() and window.cancelAnimationFrame(rafID) when component is unmounted. It works fine, however I can't relaunch this gotStream(stream) function when the stream is changed (user choosed another microphone). Maybe you have any suggestions about how it can be relaunched with updated stream?

Chrome stopped auto-loading of windows.onload. That's why the the demo stopped working.
I have created a fork with a fix:

https://happy-newton-2ba6da.netlify.app/

Hi!
How can I use it with playing mp3 from tag ?

navigator.getUserMedia is not working even if changed to navigator.mediaDevices.getUserMedia.

Hi!
For some reason I still get this error even with HTTPS protocol: Stream generation failed

I earlier created issue #5 for HTTP, but now HTTPS also seems to fail

I was wondering how one would have to change this to get it working with chrome.
For me it works well with Firefox, but on chrome and edge it only asks for mediaStream access but the meter does not animate after that....

Hi,

this small library would be perfect for me, but It doesn't work with Cordova.
Buffers are always to 0.

It's a bit weird because It work well in Android Chrome but not when in a Cordova App that use a Android Chrome webview..maybe It's related to this : https://bugs.chromium.org/p/chromium/issues/detail?id=419446

This isn't a bug from your library but If you have any idea why and how I could solve this, I would praise you like a god. If not, you can close this issue right now and thanks for that lib!

Hi! About a month ago this was working, but now shows "Stream generation failed" error in Chrome (I checked several PCs).

Just FYI. Many of the functions used here are or will be deprecated soon including navigator.getUserMedia and createScriptProcessor.

I use this lib and it works fine for audio like mp3, but
How to using this lib for video like mp4?

I saw what you wrote and thought the CPU issues would be caused by createScriptProcessor

Having between 30 to 45% CPU usage on this volume meter, I spend some time to look for ways to improve this.

In conclusion, it has nothing to do with it, this is cause by calling recursively requestAnimationFrame

This example with easily push your CPU usage to 30%:

var canvas = document.createElement('canvas');
canvas.width = 100;
canvas.height = 20;
var canvasContext = canvas.getContext('2d');
document.body.appendChild(canvas)
var rafId;
function drawLoop(time) {
  canvasContext.clearRect(0, 0, 100, 20);
  canvasContext.fillRect(0, 0, Math.random() * 100 * 1.4, 20);
  rafID = window.requestAnimationFrame(drawLoop);
}

This repo is more about the web audio API usage, but do you have any suggestion to improve this?