Use alda.js

[daveyarwood]

We still have some work to do on alda-cljs*, but we could go ahead and hook it up to the JavaScript file that alda-cljs generates, which for the moment just generates the parse tree that this web demo is using. Then we could type actual Alda code into the text box, instead of a JSON parse tree.

*The next step is for it to hand you a JavaScript object representing the score, containing information about the instruments and note events, i.e. the equivalent of evaluating the alda.lisp code generated by Alda's parser + Instaparse transformations. Once this happens, we can start refactoring the code here to use the score object.

[ondras]

@daveyarwood Do you have some version of alda.js generated somewhere, or am I supposed to use alda-cljs to create it myself?

[daveyarwood]

If you have Boot installed, you can clone alda-cljs and run boot build in the root of the project directory. This will generate an optimized/minified main.js file in the target directory, which you can rename alda.js and copy here.

You should then be able to use the alda_cljs.parser.parse method as described in the alda-cljs README. (This is how ClojureScript exports functions by default... I'm thinking we will eventually export an Alda object or something though, so it would be something like Alda.parse("trombone: c d e f g") instead)

[AdrienFromToulouse]

Hi everyone,

@ondras you did a great job! I said few days ago about my desire to port alda to the browser for our platform, you were fast at doing that!

I will try to follow, but it sounds like the pace is very fast over here :)

I might start to integrate your example into our platform (bandlab.com) as a proof of concept on my feature branch. Hope to be able to include this feature in my work load this week.

Will try to give some feedback as well if I notice some major issues.

Cheers!

[ondras]

Hi @AdrienFromToulouse,

thanks! But most of the work was done by Alda and midi.js projects; I just glued them together.

I will try to follow, but it sounds like the pace is very fast over here :)

Well my time will be far more limited this week. Also once the initial work is done, all that is left is those remaining 20% that take 80% of the total time :smile:

I now need to switch to alda.js (as mentioned earlier in this thread); this will imply some radical changes in the existing JS codebase.

@daveyarwood, I was also thinking about visualizing the score (using some canvas-based engraver, such as https://github.com/0xfe/vexflow). For this, the completely parsed score object is probably too advanced and high-level -- info about slurs and similar needs to be preserved.

[daveyarwood]

For the record, I'm happy to help with this project too!

I like the idea of visualizing the score -- this is something I'd like for Alda to be able to do as well, so that we'll eventually be able to export scores to LilyPond format.

I think we should find a way for the completely parsed score to include "visual" information as well, such as whether it's under a phrasing line / tie, etc. This is a modification we can make to Alda itself -- I'll be working to keep both projects "synced up," so definitely let me know whenever you need some information that is not included in the completely parsed score!

[ondras]

@daveyarwood I was also looking into LilyPond. But when we consider <canvas>-based rendering, the VexFlow (and its sister notation language, VexTab) seems to be producing the best results, as far as I can tell after some rudimentary googling.

Finally, there is also MusicXML, apparently understood by the main LilyPond program as an input format.

[daveyarwood]

Being able to export to MusicXML would also be a killer feature of Alda itself -- it would allow us to do things like loading Alda scores into arbitrary GUI programs like MuseScore. That might be a good avenue to pursue. Is there any integration between MusicXML and VexFlow, i.e. can you convert MusicXML to VexFlow?

[ondras]

Is there any integration between MusicXML and VexFlow, i.e. can you convert MusicXML to VexFlow?

I do not see any official way (VexTab being the only supported language). I saw some work-in-progress forks of VexFlow with MusicXML support, but I would prefer building on something more battle-tested. So perhaps a generic MusicXML output, conversion to LilyPond (both being reasonable standard formats) and then some LilyPond HTML5 renderer?

(This is getting complex. I will track it in a separate issue, sooner or later.)

[ondras]

Starting from https://github.com/alda-lang/web-demo/commit/3ef0c8e0e97178c525b7f3ce70bb2edd6a31832b, we now use alda.js to parse the input :-)