paulrosen / abcjs

javascript for rendering abc music notation
Other
1.92k stars 283 forks source link

Things that confuse me with the full synth example #452

Closed SteveALee closed 3 years ago

SteveALee commented 4 years ago
soundFontUrl:
            'https://paulrosen.github.io/midi-js-soundfonts/MusyngKite/'

I can see it is passed directly to the newly created synth yet I see the default font is being fetched. I really cannot understand why.

SteveALee commented 4 years ago

Also on https://musicpracticetools.net/tunes/brown-eyed-girl/ half the loaded sounds are correctly electric bass and the others are piano (0). My code is based on the example - see below

X: 1
K: G cleff=bass transpose=-8
M: 4/4
Q: 1/4=145
L: 1/8
C: Van Morrison
T: Brown Eyed Girl
R: Pop
[I: MIDI=program 33]
EF|:"G"G2z3GB2|"C"c2zce2g2|"G"g2z3c^c2|"D"d2zEzFzF:|

Might be related to #452 as a lot of notes are loaded compared to those used.

SteveALee commented 4 years ago
      if (ABCJS.synth.supportsAudio()) {
        synthControl = new ABCJS.synth.SynthController()
        synthControl.load('#audioControls', abcCursorControl, {
          displayLoop: true,
          displayRestart: true,
          displayPlay: true,
          displayProgress: false,
          displayWarp: false,
        })
      }

      // TOD this synth may be unnessary - only used by click before playing
      let midiBuffer = new ABCJS.synth.CreateSynth()
      midiBuffer
        .init({
          visualObj: visualObj[0],
          soundFontUrl:
            'https://paulrosen.github.io/midi-js-soundfonts/MusyngKite/',
        })
        .then(function () {
          if (synthControl) {
            synthControl
              .setTune(visualObj[0], false, {
                soundFontUrl:
                  'https://paulrosen.github.io/midi-js-soundfonts/MusyngKite/',
                chordsOff: true,
              })
              .catch(function (error) {
                console.warn('Audio problem:', error)
              })
          }
        })
        .catch(function (error) {
          console.warn('Audio problem:', error)
        })
    }
  }
paulrosen commented 4 years ago

That's odd - I went to the link you posted above and it sounds like bass to me. (On firefox)

The one thing I noticed though is that the sound mp3 are loaded at page load instead of on first click. Are you constructing the tune before the user has interacted with the page? I'm not sure if that is affecting anything. It seems like you'd get a different message for that, though.

SteveALee commented 4 years ago

Yes the sound is good, but unneeded notes in piano are downlaoded after the correct ones looking at the network tab. The current code creates the synth and then calls setTune which creates another. Im also using Firefox

Which function are you thinking of as "construction"? Yes the Render, CreateSynth and setTtune all happen on page load. Then either

Those both involve user interactions and I beleive are when the AudioContext is actually used,

I that not OK? Perhasp I'm doing things in an untest order There is no initial user inteaction that I could sensible use without adding some extra annoying step.

paulrosen commented 4 years ago

The piano notes are for the accompaniment - it is because you have the "G" symbols. I guess you are suppressing that. I could look for the chords off command and not download the notes as an optimization. It shouldn't hurt anything though.

paulrosen commented 4 years ago

Never mind about my comment about the early downloading of notes - that is ok. The user interaction you're doing is fine.

SteveALee commented 4 years ago

The piano notes are for the accompaniment - it is because you have the "G" symbols

Aha! yes I turned off as was not a good sound and a distraction from tleanrng the bass :)

Agree good to not download if not required. But would say v low priority. Certainly for me.

I was intregued tha tthe docs mention a metronome as well which I don't get (nor want)

paulrosen commented 4 years ago

This is what I get when I play the example on your site. It is all bass. Is this different from what you are getting?

beg.mp3.zip

SteveALee commented 4 years ago

Out of interest how do you generate recordings like that?

Oh, another confusing thing about the example to add to that list is the MDI link. it does nothing much and seems to have a very weird URL - probably incorrectly based on the base URL

paulrosen commented 4 years ago

I use a program called piezo that will record whatever the browser puts out.

Thanks for letting me know about the midi link. I just fixed that.

SteveALee commented 4 years ago

I use a program called piezo

boo, it's Mac only :(

I was wonderng if things would go better if setTune would take an optional midi buffer. That could be used rather than always createing a new one. However it doesn't sit well with other params so perhaps a seperate setBuffer method? But then theres a fiddly order dependency.

Finally The click Handler in the example requires a synth and controller to function but the controller is neither a global object not passed in t the callback (understandably I guess). That makes things a bit messy - I used a closure and see the example a object property.