E-Kuerschner / useAudioPlayer

React hooks for controlling audio on the web
MIT License
332 stars 37 forks source link

How to play multiple piano samples #92

Closed JanVeb closed 2 years ago

JanVeb commented 2 years ago

Is your feature request related to a problem? Please describe. A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like A clear and concise description of what you want to happen.

Describe alternatives you've considered A clear and concise description of any alternative solutions or features you've considered.

Additional context Add any other context or screenshots about the feature request here.

Hi there, in Howler Im able to play simultaneously multiple piano samples for piano app, though when using react hooks, sound will start to get very distorted and then stop playing, so im looking for replacement, basically need ability to load multiple files and to fade out sounds, neither of which I was able to figure yet out, is there any example? Example in this library with useState will stop playing first file if second is started so need different solution.

This is code im using in Howler.js that is working, but couldn't figure out how to do similar with this library

  var m21 = new Howl({ src: ['assets/PianoWav/21.wav'] });
  var m22 = new Howl({ src: ['assets/PianoWav/22.wav'] });
  var m23 = new Howl({ src: ['assets/PianoWav/23.wav'] });

  let midiToHowl = {
    21: m21,
    22: m22,
    23: m23,
}

  function OsmdNoteOn(n, dur) {
    let noteName;
    noteName = midiToHowl[n];
    noteName.play();
    setTimeout(() => noteName.fade(1, 0, 2000), dur);
  }
JanVeb commented 2 years ago

I've managed to sort it all out in howler ja, had to move howler instances declarations outside of react component and then works great, so I'm not looking for howler replacement anymore.

Have fun