VexTab API documentation

[Sven Haiges]

Hi all, 

I've been trying to build up a cool arduino/keyboad integration. The idea is to have a physical keyboard on the ground, connect the sensors to a web app and have the users of this system play easy pieces of music that appear on the screen. This is sort of a game- the system comes up with a music notation, the users have to follow and play the same sequence of notes (duration etc. does not matter in this case).

I've been trying to do all this with VexFlow, but I am having issues when it comes to differnt notes length, the corresponding beats/voices/etc. so I am turning to vexTab right now as a higher level abstraction (you recommended that already). 

All right, but now I really have issues understanding VexTab :-) I mean the notation is easy to understand, but I am missing the binding between the textarea eelements that allow the user to enter the notation and the rendering of the music. Is this automatic? E.g. does vextab monitor all .vex-tabdiv areas and then render the music in the above div?

    <div style="width:420; margin-left: auto; margin-right: auto;">
    <div class="vex-tabdiv"
      width=400 scale=1.0 editor="true"
      editor_height=80>tabstave</div>
    </div>

What I need to do is this:

1) render a piece of music, very easy. Ask the user to play that with the keyboard.
2) sequentially build up a second piece of music based on the current game challenge and the sensors / keyboard presses. 

I basically would create the  vextab notation on the fly, maybe in a JavaScript String for example. I would then want to give that string, which holds the notation, to the vexTab API to re-render a div. Is this programmatically possible?

Thx!
Sven

[Sven Haiges]

Ok, after playing a bit I got a basic vextab/editor combination working. The question is now more: how can I run this without a visible editor. e.g. editor=false  - how do I supply the vextab notation in this case?

Thx

Sven

[Mohit Muthanna]

For what you want to do, you can use the VexTab API directly instead of using TabDiv.

      renderer = new Vex.Flow.Renderer($('#boo')[0],

        Vex.Flow.Renderer.Backends.CANVAS);

      artist = new Vex.Flow.Artist(10, 10, 600, {scale: 0.8});
      vextab = new Vex.Flow.VexTab(artist);


      vextab.parse("tabstave"); // your VexTab here
      artist.render(renderer);

--
--
You received this message because you are subscribed to the Google
Groups "vexflow" group.
To post to this group, send email to vex...@googlegroups.com
To unsubscribe from this group, send email to
vexflow+u...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/vexflow?hl=en
 
---
You received this message because you are subscribed to the Google Groups "vexflow" group.
To unsubscribe from this group and stop receiving emails from it, send an email to vexflow+u...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

--
Mohit Muthanna [mohit (at) muthanna (uhuh) com]

[Sven Haiges]

Thx a lot, it works beautifully. 

Sorry for having more questions though. As you can see in the screenshot, the second row of notes is built up as the user plays the song. If he does it correctly, the notes that are correct are added one by one to the lower row. The problem is now that the notes are all equally spaced, and that makes it really hard to compare to the above notes. Is there a way to have the notes left-aligned? I am redrawing the complete notation each time the user enters a note. Could I maybe just fill the space up with non-visible notes?

Also, there is the vexflow.com watermark. This is not an issue for now, but at a later point I'd like to get that out. Can you tell me a bit about licensing for a 'prototype'/'demo' that we do?

Thx!
Sven

[Sven Haiges]

mmh, another good solution would be to fade the remaining notes, the user has to play, in a different color (e..g grey) once played correctly, the notes show up in dark black. Is it possible to define the color of each note using tabstave?

thx

Sven

[Mohit Muthanna]

The VexTab language doesn't support colors as yet, but it does let you annotate notes in various ways. One option would be to add a text annotation (or a marcato / stacatto symbol) when the note is played.

Mohit.