Koha/koha-tmpl/opac-tmpl/bootstrap/js/verovio.js
Agustin Moyano 426a055a07
Bug 22581: Show and play musical inscripts
This patch adds musical inscripts to OPAC's detail page

To test:
1. run previous patch test plan
2. apply this patch
3. edit a the marc structure of a MARC bibliographic framework, and in tag 031 enable the following subfiels to be visible in editor: 2, g, n, o, p, u
4. search the catalog for a record that belongs to that framework, and edit tag 031 with the following:
   * 2:pe
   * g:G-2
   * n:xFCGD
   * o:3/8
   * p:'6B/{8B+(6B''E'B})({AFD})/{6.E3G},8B-/({6'EGF})({FAG})({GEB})/4F6-
   * u:http://nonexistent.org/url/of/a/midi
5. save and click in opac view
CHECK => even though you add a 031 tag there is no musical inscript shown in opac view
6. in admin module enable OPACShowMusicalInscripts preference
7. refresh opac view
SUCCESS => it takes a few seconds to load, but you see a link that says 'Audio file' pointing to the URL you placed in 'u' subfield, and below you see the musical inscript
8. in admin module enable OPACPlayMusicalInscripts preference
9. refresh opac view
SUCCESS => You see a play button below the musical inscript, and when you click, the song is played
10. sign off

Sponsored-by: Biblioteca Provincial Fr. Mamerto Esquiú (Provincia Franciscana de la Asunción)
Co-authored-by: Owen Leonard <oleonard@myacpl.org>
Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
2019-11-03 08:11:38 +00:00

108 lines
No EOL
5 KiB
JavaScript

/* global PREF_OPACPlayMusicalInscripts interface verovio */
$(document).ready(function() {
if( $(".musical_inscripts").length > 0 ){
// Check support for WebAssembly
// https://stackoverflow.com/questions/47879864/how-can-i-check-if-a-browser-supports-webassembly
var webassenbly_supported = (() => {
try {
if (typeof WebAssembly === "object"
&& typeof WebAssembly.instantiate === "function") {
const module = new WebAssembly.Module(Uint8Array.of(0x0, 0x61, 0x73, 0x6d, 0x01, 0x00, 0x00, 0x00));
if (module instanceof WebAssembly.Module)
return new WebAssembly.Instance(module) instanceof WebAssembly.Instance;
}
} catch (e) {
}
return false;
})();
if( webassenbly_supported ){
$.ajaxSetup({
cache: true
});
$.getScript( interface + "/lib/verovio/verovio-toolkit.js", function( data, textStatus, jqxhr ) {
$('.musical_inscripts .inscript').each(function() {
var vrvToolkit = new verovio.toolkit();
var $t = $(this);
var data = "@clef:"+$t.data('clef')+"\n@keysig:"+$t.data('keysig')+"\n@timesig:"+$t.data('timesig')+"\n@data:"+$t.data('notation')+"\n";
var svg = vrvToolkit.renderData(data, {
inputFormat: $t.data('system'),
spacingStaff: 0,
adjustPageHeight: 1,
scale: 40,
pageHeight: 300
});
$t.html(svg);
var base64midi = vrvToolkit.renderToMIDI();
var song = 'data:audio/midi;base64,' + base64midi;
var play_btn = $('.play_btn', $t.parent());
if(play_btn.length) {
play_btn.data('song', song);
play_btn.data('toolkit', vrvToolkit);
}
});
if( PREF_OPACPlayMusicalInscripts ){
$(".audio_controls").show();
var playmusic_1 = $.getScript( interface + "/lib/verovio/000_acoustic_grand_piano.js" );
var playmusic_2 = $.getScript( interface + "/lib/verovio/midiplayer.js" );
$.when( playmusic_1, playmusic_2 ).done(function () {
var ids = [];
var currentToolkit;
var player = $('.inscript_audio');
var midiUpdate = function(time) {
// time needs to - 400 for adjustment
var vrvTime = Math.max(0, time - 400);
var elementsattime = currentToolkit.getElementsAtTime(vrvTime);
if (elementsattime.page > 0) {
if ((elementsattime.notes.length > 0) && (ids != elementsattime.notes)) {
ids.forEach(function(noteid) {
if ($.inArray(noteid, elementsattime.notes) == -1) {
$("#" + noteid).attr("fill", "#000").attr("stroke", "#000");
}
});
ids = elementsattime.notes;
ids.forEach(function(noteid) {
if ($.inArray(noteid, elementsattime.notes) != -1) {
$("#" + noteid).attr("fill", "#c00").attr("stroke", "#c00");
}
});
}
}
};
var midiStop = function() {
ids.forEach(function(noteid) {
$("#" + noteid).attr("fill", "#000").attr("stroke", "#000");
});
player.hide();
};
if(player.length) {
player.midiPlayer({
locateFile: function(file) {
return interface + '/lib/verovio/'+file;
},
color: "#c00",
onUpdate: midiUpdate,
onStop: midiStop
});
}
$('.musical_inscripts .play_btn').click(function() {
var $t = $(this);
player.show();
currentToolkit = $t.data('toolkit')
player.midiPlayer.play($t.data('song'));
});
});
}
});
}
}
});