How to use Rythm.js with 0 Volume?

[PromptJar]

How to use Rythm.js with 0 Volume?

[Okazari]

Arg, I though that would do the trick.
Did you try the first option (by only removing the analyser.connect(audioCtx.destination) instruction) ?

Also, are you completely sure the modified source in the node_modules are loaded ? There might be some cache involved that could prevent your modifications to be applied. (You could check that by adding a quick console.log).
If modifications aren't working, you could checkout the Rythm.js repository and link it in your project (I usually use yarn with the yarn link).

Could you share a bit more code on how you integrated Rythm.js ?
Ideally, could you share a minimal reproduction of your use case ? (On codesandbox or similar). So that I could try to investigate a bit a more 👍

[Okazari]

Hello @PromptJar first, many thanks for using Rythm.js 😄

Right now this isn't a feature that i had in my mind and Rythm.js animation is tied to the volume.

I think we might want to add an option around here

Rythm.js/src/Player.js

Line 43 in 6279915

Analyser.analyser.connect(this.audioCtx.destination)

that either doesn't connect the rythm.js player to the audioContext destination or add another gain that mute the sound right before connecting to the audio destination.

if(!noOutput) {
      Analyser.analyser.connect(this.audioCtx.destination)
}

or

if(!noOutput) {
  const muteNode = this.audioCtx.createGain()
  muteNode.gain = 0
  Analyser.analyser.connect(muteNode)
  muteNode.connect(this.audioCtx.destination)
} else {
  Analyser.analyser.connect(this.audioCtx.destination)
}

Unfortunatly, either way, it will require to update Rythm.js internal code in order to do that 😢.

I can't say when i'll have the time to do that, if you really want that feature, feel free to create a PR 👍 I'll try to merge it and deploy the new version right away.

[PromptJar]

So I took your snippet above and modified the node_modules source (quick & dirty).

This is the part I changed:

this.connectSource = function (source) {
    source.connect(_this.gain);
    _this.gain.connect(Analyser$1.analyser);
    if (_this.currentInputType !== _this.inputTypeList['STREAM']) {
      // Analyser$1.analyser.connect(_this.audioCtx.destination); // COMMENTED OUT

     // NEW CODE
      const muteNode = _this.audioCtx.createGain()
      muteNode.gain = 0
      Analyser$1.analyser.connect(muteNode);
      muteNode.connect(_this.audioCtx.destination)


      _this.audio.addEventListener('ended', _this.stop);
    } else {
      Analyser$1.analyser.disconnect();
    }
  };

Unfortunately nothing happens (audio plays with sound), and I'm really bad at audio 😥

Will try a few different things but first I'll check how this all works.

[PromptJar]

Add caching to the list of stuff I'm not good at 😰

The muteNode.gain = 0 part will not work as it throws an error about it being only a getter.

However, just commeting out the first line like you initially said works perfectly.

Thanks for holding my hand here!

[Okazari]

@PromptJar Glad i did help :) !

Feel free to open a PR to add that option to Rythm.js 🙏 that could help others that may want to use it the same way you are 👍