Javascript for generation of music notation in quiz module

Javascript for generation of music notation in quiz module

by Lars Isdahl -
Number of replies: 2

Hello all. smile

I have been trying to get VexFlow and VexTab to work with moodle for some time now, but I have hit a solid brick wall in the area where the script would help the most.

VexFlow/VexTab is an HTML5/javascript music editor. I am currently trying to develop a music theory course and VexFlow integration would make generating quizzes and examples a breeze. I am familiar with the flash modules which serves the purpose, but I would rather avoid using flash in order to maintain compatibility with iPads and iPhones.

I have linked the necessary scripts in the head tag via the "Additional HTML" feature, and everything is working just fine on regular pages and in the "file" and "page" type resources. When I try to add the same script in a quiz module noting shows.

This is the code for generating the sheet music:

<div style="width:700; margin-left: auto; margin-right: auto;">
<div class="vex-tabdiv"
width=680 scale=1.0 editor="true"
editor_width=680 editor_height=330>options space=20

tabstave
notation=true
key=A time=4/4

notes :q =|: (5/2.5/3.7/4) :8 7-5h6/3 ^3^ 5h6-7/5 ^3^ :q 7V/4 |
notes :8 t12p7/4 s5s3/4 :8 3s:16:5-7/5 :h p5/4
text :w, |#segno, ,|, :hd, , #tr

options space=25

tabstave
notation=true

notes :q (5/4.5/5) (7/4.7/5)s(5/4.5/5) ^3^
notes :8 7-5/4 $.a./b.$ (5/4.5/5)h(7/5) =:|
notes :8 (12/5.12/4)ds(5/5.5/4)u 3b4/5
notes :h (5V/6.5/4.6/3.7/2) $.italic.let ring$ =|=

text :h, ,.font=Times-12-italic, D.S. al coda, |#coda
text :h, ,.-1, .font=Arial-14-bold,A13
text ++, .23, #f</div>
</div>

This exact code is used to generate the music on the bottom of my site: http://monody.no/moodle, but when added through the editor in a quiz module or elsewhere the result is blank. When I look at the database (*_question) the formatting of the code is intact.

Is there a way to solve this?

Average of ratings: -