jazz-soft / JZZ-gui-Player

MIDI Player for browsers
MIT License
11 stars 0 forks source link

Player sounds nothing #6

Open HoaLeMinh opened 1 year ago

HoaLeMinh commented 1 year ago

Hi, I am trying to use the JZZ-gui-Player, loading midi file from an url using the Java script vanilla. Everything looks ok without any errors but the player plays no sound.

I tested it on Chrome and Edge.

Below is the html:

<html>
  <head>
    <title>Midi Player</title>
<script src="https://cdn.jsdelivr.net/npm/jzz"></script>
<script src="https://cdn.jsdelivr.net/npm/jzz-midi-smf"></script>
<script src="https://cdn.jsdelivr.net/npm/jzz-gui-player"></script>
  </head>
  <body>
 <div id=player></div>

<script>
  let player = new JZZ.gui.Player('player');
  let midiUrl = 'https://bitmidi.com/uploads/112561.mid';
fetch(midiUrl, {
    method: 'GET',
        headers: {
            'Access-Control-Allow-Origin': '*',
        },
    })
    .then(response => response.ok && response.arrayBuffer())
    .then(buffer => {
       console.log(buffer);
       player.load(new JZZ.MIDI.SMF(buffer));
       player.play();
    })
    .catch(err => console.error(err));
</script>
  </body>
</html>

Is it missing something?

jazz-soft commented 1 year ago

Hi! Thanks for asking! Web Audio API requires user's action to enable the sound (please see the docs). Try to remove the 'player.play()' line and make the user press the 'play' button manually. Or pack the whole code into the function that is called when the user presses the button or do some other action.

HoaLeMinh commented 1 year ago

I removed the 'player.play()' line, pressed the Play button and get the same issue. I see the progress bar is moving without sound. Please note that I am using the JZZ.gui.Player class having its player control panel.

louiesun commented 3 weeks ago

I removed the 'player.play()' line, pressed the Play button and get the same issue. I see the progress bar is moving without sound. Please note that I am using the JZZ.gui.Player class having its player control panel.我删除了“player.play()”行,按下了“播放”按钮并遇到了同样的问题。我看到进度条正在移动,没有声音。请注意,我正在使用 JZZ.gui.Player 类及其播放器控制面板。

I meet the problem too. I noticed that on the demo, when we press the button on the right (icon is a musical note), there is an alternative Web Audio. But, on my personal website, nothing appears. So this requires some settings? And have you dealt with the problem?