abc2svg icon indicating copy to clipboard operation
abc2svg copied to clipboard

using AbcPlay and soundfonts

Open jisike opened this issue 8 years ago • 13 comments

I'm trying to use AbcPlay. When I call play it throws this

GET http://127.0.0.1:3000//undefined-0/C0.0 404 (Not Found)

Uncaught (in promise) DOMException: Unable to decode audio data

Heres my code:

function play () {
    if (position == 2) {
      abcPlay.stop();
      endplay()
      return
    }

    position = 2

    if (!abcPlayEvents) { // if no playing event
      if (!abcPlay) {
        abcPlay = new AbcPlay({
          endplay: endplay
        })

        abcPlay.clear(); 
      }

      abcPlayEvents = abcPlay.clear() // keep the playing events
    }

    abcPlay.play(0, 100000, abc)
}

I think this is related to the soundfont url but isn't there a default? When I try:

abcPlay.set_sft(0)
abcPlay.set_sfu('http://moinejf.free.fr/js/FluidR3_GM')

it throws these errors:

GET http://moinejf.free.fr/js/FluidR3_GM/undefined-0/C0.0 404 (Not Found) decode_note @ play.js:5 play_start @ play.js:5 Audio5.Audio5.play @ play.js:5 app.play @ main-debug.js:1038 (anonymous) @ VM6950:1 index-debug.html:1 Failed to load http://moinejf.free.fr/js/FluidR3_GM/undefined-0/C0.0: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://127.0.0.1:3000' is therefore not allowed access. The response had HTTP status code 404.

And now I think its the instrument but can't find the func to set the instrument. It'd be great if there were documentation for this.

jisike avatar Nov 05 '17 21:11 jisike

Are you sure that you have chosen an instrument which is available? the 'undefined' in the url indicates that your instrument is not in the list of midi instruments which you find in play-1.js.

http://127.0.0.1:3000//undefined-0/C0.0

you also have to set url and type. And you need to copy the files to a folder in your webserver.

bwl21 avatar Nov 05 '17 21:11 bwl21

How do you set the instrument? Ex a grand piano? Wheres the function?

jisike avatar Nov 05 '17 21:11 jisike

I see the instr_tb array and load_instr function in audio5 but i searched the repo and dont see it called anywhere.

jisike avatar Nov 05 '17 22:11 jisike

From your code, you have nothing to play! For the abc2svg core, you have to define a callback function user.get_abcmodel() that calls abcPlay.add (have a look at util/abcemb.js).

moinejf avatar Nov 06 '17 09:11 moinejf

I do I just left that out because its in another code block

abcPlay = new AbcPlay({
  endplay: stop
})
abcPlay.set_sft(0)
abcPlay.set_sfu('http://moinejf.free.fr/js/FluidR3_GM')
// abcPlay.audio5.load_instr('acoustic_grand_piano')

var user = {
  'imagesize': 'width="100%"',
  'img_out': function(str) {
    abcSvg += str;
  },
  'errmsg': function errmsg(txt) {
    errors += txt + '\n'
  },
  'read_file': function(x) {
    return '';
  }, // %%abc-include, unused
  'anno_stop': function(type, start, stop, x, y, w, h) {
    if (name == 'sheet-2') {
      if (type == 'bar') {
        abc2Svg.out_svg('<rect class="bar-box" x="');
        abc2Svg.out_sxsy(x, '" y="', y);
        abc2Svg.out_svg('" width="' + w.toFixed(2) +
          '" height="' + h.toFixed(2) + '"/>\n');
      } else if (type == 'note' || type == 'rest') {
        abc2Svg.out_svg('<rect class="notes-box" x="');
        abc2Svg.out_sxsy(x, '" y="', y);
        abc2Svg.out_svg('" width="' + w.toFixed(2) + '" height="' +
          h.toFixed(2) + '"/>\n');
      }
    }
  },
  'page_format': true, // define the non-page-breakable blocks
  'get_abcmodel': function(tsfirst, voice_tb, music_types, info) { 
    abcPlay.add(tsfirst, voice_tb)
  }
}

abc2Svg = new Abc(user);
abc2Svg.tosvg('abc2Svg', abcTune);

I added a breakpoint to double check 'get_abcmodel' was being called and it is.

jisike avatar Nov 06 '17 13:11 jisike

im still having issues getting this to work. any more suggestions?

jisike avatar Nov 07 '17 13:11 jisike

Start from a working piece of software as abcemb.js and adapt it step by step to your needs. Use a javascript debugger or console.log messages to know what is wrong with your changes.

moinejf avatar Nov 07 '17 14:11 moinejf

i already did that... also abcemb.js doesn't help because im generating it from a var not inline abc. could you help by answering questions i asked in my first post about the errors relating to the soundfonts.

jisike avatar Nov 07 '17 17:11 jisike

The soundfont may be loaded by two means:

  • either by AJAX (XMLHttpRequest), note per note,
  • or by script, instrument per instrument. With AJAX, the files must be on the same server, so, you cannot use the moinejf.free.fr URL. The soundfont by script are in gleitz.github.io. There are set by default when sfu and sft are not set (see util/toaudio5.js line 589).

moinejf avatar Nov 07 '17 17:11 moinejf

if the default is set to gleitz.github.io should it still play? why is the code looking for the fonts on your server even though I didnt set them? why is the instrument undefined? is there not a default instrument? also when i try and run the example au_clair.xhtml it throws cross-origin errors too. how can i that the examlple locally? could you direct to a soundfont or file i can use to test. thanks!

jisike avatar Nov 07 '17 17:11 jisike

also http://gleitz.github.io/ is a broken link

jisike avatar Nov 07 '17 17:11 jisike

if the default is set to gleitz.github.io should it still play? It should. why is the code looking for the fonts on your server even though I didnt set them? It should not: if you don't set sfu nor sft, the font is searched in gleitz.github.io/. why is the instrument undefined? I don't know. It is your code. is there not a default instrument? There is one: MIDI program 1 (internal value 0). also when i try and run the example au_clair.xhtml it throws cross-origin errors too. If you call it from my site, there is no error. If you copied the source and try to access it directly, you must change the script paths. how can i that the examlple locally? If you got the full abc2svg sources and generated the *-1 files, everything should work with correct paths in your .xhtml files. could you direct to a soundfont or file i can use to test. The fonts are in gleitz.github.io/. See http://gleitz.github.io/midi-js-soundfonts/ for more information, or search in the internet.

moinejf avatar Nov 07 '17 18:11 moinejf

Just 2 quick notes. If you look at https://github.com/moinejf/abc2svg/issues/23 there are ways to get the fonts from github, but you have to use the raw prefix. Also, on the initial image, there is a 'Access-Control-Allow-Origin' message, which usually means that the server is reporting that it doesn't allow serving content to other locations. (please excuse me if I misunderstood the issue)

joaocc avatar Nov 13 '17 13:11 joaocc