cuthbertlab / music21j Goto Github PK
View Code? Open in Web Editor NEWJavascript port of music21 -- Toolkit for Computational Musicology
License: Other
Javascript port of music21 -- Toolkit for Computational Musicology
License: Other
When note object in chords has a different color, it is not used:
const ch = new music21.chord.Chord(['C E G');
ch.notes[1].noteheadColor = 'red'
ch.notes[1].noteheadFill = 'red'
Might explain why this test is written oddly--there are eight notes in the stream, not seven--so the first one does not have an accidental. Should we fix the test or fix the functionality to be like m21p?
music21j/tests/moduleTests/pitch.ts
Lines 277 to 286 in 73e4b4a
Use the pyv8.PyV8 package to run the @example
sections in the JSDoc code to ensure that they do what they are supposed to do, like a Python doctest section. Write extensions for the "..." wildcard; to make this work with JSDoc, the doctests.js module won't work, but could be helpful. Best would be not to require Python and PyV8, but may be necessary. Important thing is to make the JSDoc still display properly.
Not sure if this is a known issue (or perhaps also a music21 issue?):
Calling duration()
on a Stream that contains, e.g., just 1 quarter note at offset 3.0 will give a Duration object with length 4.
This is because Stream.duration()
constructs a new Duration object based on Stream.highestTime()
-- the highest time is indeed 4 for this quarter note pickup stream, but seems to me that the duration should be 1.
Does this make sense @mscuthbert? Can patch in a fix if so.
Hello, I'm trying to use music21j
in my project.
I'm a bit new to the node environment, but I figured out that using webpack
was convenient for my purpose, so I created my project and then I run:
npm install --save music21j
Then in one of my source files I tried:
import { note } from "music21j"
But when I build the project using npx webpack
I get various resolve errors like the following:
ERROR in ./node_modules/music21j/src/music21_modules.js
Module not found: Error: Can't resolve './music21/articulations' in '/home/matteo/git/nuvola/node_modules/music21j/src'
@ ./node_modules/music21j/src/music21_modules.js 48:0-57 91:0-141:2
@ ./src/core/melody/melody.js
@ ./src/main.js
So I resorted to use the already built version provided (which however seems a bit of a hack to me, the above example should just work), by using
import { note } from "music21j/releases/music21.debug"
I suspect that the issue might be related to the fact that the modules are written in typescript, but typescript doesn't get added to my dependencies nor get configured in the proper way. I don't know which is the proper way to handle this thing.
The second problem I'm facing is related with MIDI soundfonts. If I just build like in the above example I don't get any playback, and in the browser console I see the following error:
Could not load soundfont; path was ../soundfonts/midi-js-soundfonts-master/FluidR3_GM//acoustic_grand_piano-ogg.js
The hack I found to make it work locally is to copy the files from ./node_modules/music21j/soundfonts
to ./dist/soundfonts
(I automated it using copy-webpack-plugin
), but it doesn't work when I deploy to GitHub Pages (because of the level up ..
at the beginning of ../soundf....
and because I'm deploying a project page, so my base url is mttbernardini.github.io/myproject
).
Is there a proper way to change the path of the soundfonts? I didn't find anything in the documentation and it seems to be hardcoded somewhere.
Let me know if you need more details, I'm willing to help.
Thank you in advance.
Timestamp: 13/10/14 20:56:41
Error: Error: Script error for: m21theory
http://requirejs.org/docs/errors.html#scripterror
Source File: http://192.168.2.1:8000/ext/require/require.js
Line: 8
Hello,
I'm trying to import m21j on my web pages without building it locally. I found it on jsDelivr but I have some comments / questions:
src/music21_modules.js
which confuses CDNs. It should probably refer to something in releases
.music21.debug.js
at 2.73MB. Would be great to have production, minified and gzipped files as well.Could not load soundfont; path was https://cdn.jsdelivr.net/npm/[email protected]/soundfonts/midi-js-soundfonts-master/FluidR3_GM//acoustic_grand_piano-ogg.js
Is there a way to configure the URL of soundfonts?
Thanks!
I've been playing around with the layout.html example and If I modify the code as follows to display just one bar on the stave then nothing is rendered:
require(['music21'], function () {
s = new music21.stream.Score();
p = music21.tinyNotation.TinyNotation('2/4 c2'); // or c4 c4
s.append(p);
s.appendNewDOM($("#scoreDiv"));
ps = s.parts;
ls = music21.layout.makeLayoutFromScore(s);
});
If I then decide to add another half note to the p object then everything works as expected.
Having a little trouble getting this set up. I am running Windows 8 and Node.js v4.5.0. After I clone this and run $ npm install
, I attempt to run $ grunt
, but get the following errors:
Loading "uglify.js" tasks...ERROR
>> Error: Cannot find module './lib/uglify'
Loading "jsdoc-plugin.js" tasks...ERROR
>> Error: Cannot find module './lib/exec'
Warning: Task "uglify:build" not found. Use --force to continue.
I also received cannot-find-module errors for chalk
and grunt-rollup
. Most example pages will not render or function. Are there any recommendations? Thanks.
IE support is quite unreliable -- it might be time to remove completely.
When done, remove WebAudioShim
Hi,
I am not that great at javascript and am a bit confused on how to load the music21 project into my own project. What are the scripts exactly I need to include in my html page? Do I need to copy the whole 'src' and 'require' directories into my own project or is there a better way of doing this?
Thanks
When I run grunt, I get the following error message:
Running "rollup:files" (rollup) task
Warning: Cannot call a namespace ('$') Use --force to continue.
Aborted due to warnings.
n = new music21.note.Note();
n.groups.push('yellow');
s = new music21.stream.Stream();
s.repeatAppend(n, 4);
s.notes.first().groups.push('red');
console.log(s.notes.map(n => n.groups)); // ['yellow', 'red'] * 4 (but red should appear on the first only)
I want to generate a json file in the following example
http://web.mit.edu/music21/doc/moduleReference/moduleVexflowToMusic21j.html
to tranportarlo to music21j the following example
https://github.com/cuthbertLab/music21j/blob/master/testHTML/jsonpickleParse.html
but when testing throws the following error in the console browser
"Uncaught TypeError: Cannot read property 'py/id' of null"
Problem in Vexflow with SVG -- able to make work in Firefox in the old canvas system and on vexflow in SVG on FF, so must be a problem with new SVG to Lyric to Vexflow
Fixes partial beam rendering, accidental coloring.
These modules have diverged a bit after cuthbertLab/music21@9dbf4e2
I've tried running a couple of the examples, the forms render but the rest is blank, I can't see any notes or play music. i get the following error when I try running the layout.html example using the provided python server:
python start_python_server.py Beginning HTTP/CGI server at 8000 127.0.0.1 - - [24/Jul/2016 00:47:44] "GET /testHTML/layout.html HTTP/1.1" 200 - 127.0.0.1 - - [24/Jul/2016 00:47:45] code 404, message File not found 127.0.0.1 - - [24/Jul/2016 00:47:45] "GET /src/ext/jsonpickle/main.js HTTP/1.1" 404 - 127.0.0.1 - - [24/Jul/2016 00:47:45] code 404, message File not found 127.0.0.1 - - [24/Jul/2016 00:47:45] "GET /src/ext/midijs/inc/shim/Base64binary.js HTTP/1.1" 404 - 127.0.0.1 - - [24/Jul/2016 00:47:45] code 404, message File not found 127.0.0.1 - - [24/Jul/2016 00:47:45] "GET /src/ext/midijs/inc/shim/WebAudioAPI.js HTTP/1.1" 404 - 127.0.0.1 - - [24/Jul/2016 00:47:45] code 404, message File not found 127.0.0.1 - - [24/Jul/2016 00:47:45] "GET /src/ext/midijs/inc/jasmid/midifile.js HTTP/1.1" 404 - 127.0.0.1 - - [24/Jul/2016 00:47:45] code 404, message File not found 127.0.0.1 - - [24/Jul/2016 00:47:45] "GET /src/ext/midijs/inc/jasmid/replayer.js HTTP/1.1" 404 - 127.0.0.1 - - [24/Jul/2016 00:47:45] code 404, message File not found 127.0.0.1 - - [24/Jul/2016 00:47:45] "GET /src/ext/midijs/inc/jasmid/stream.js HTTP/1.1" 404 - 127.0.0.1 - - [24/Jul/2016 00:47:45] code 404, message File not found 127.0.0.1 - - [24/Jul/2016 00:47:45] "GET /src/ext/midijs/examples/inc/event.js HTTP/1.1" 404 -
Hello. I am currently involved in a project where we wish to produce ‘live’ music notation in the browser. The app will be a javascript program that composes music based on an algorithm. Our goal is that as the composition program is running, the music notation will generate note by note in the browser. And one of the reasons for this, is that we would like to eventually use it for live performance – music that is being generated right before the eyes of the person performing it and that can change compositional direction depending on various variables during the performance.
However I’ve been having problems with music21j, and I’m no longer even sure if what we are attempting is even possible with the library. Here are our current biggest questions:
Do dynamics currently work with music21j? I can’t get them to render and I couldn’t find any examples of dynamics being used in the code from Github.
The generation of notes gradually gets slower and slower with every new note that is added to the piece (stream). I’m using ‘replaceDOM()’ after each beat or bar that has been composed. I assume that it gets slower and slower because it has to regenerate an ever growing svg file. What would be the best way to avoid this?
Is it possible to export an xml or midi file the way the python version does? Once a piece has been composed, we would love to save it somehow.
Many, many, thanks in advance!
Hello.
I got a problem when adopting music21j to the generated code from music21.vexflow.toMusic21j.py
I run the bellow code using music21.
n = note.Note('C#4')
print(vexflow.toMusic21j.fromObject(n, mode='jsbody'))
Then, I got the bellow code.
require(['music21'], function() {
var pickleIn = '{"m21Version": {"py/tuple": [2, 1, 2]}, "stream": {"py/object": "music21.stream.Stream", "py/state": {"_mutabl' +
'e": true, "_activeSite": null, "xPosition": null, "_priority": 0, "_elements": [], "_cache": {}, "definesExpli' +
'citPageBreaks": false, "_unlinkedDuration": null, "id": 140225177544656, "_duration": null, "_offsetDict": {},' +
' "streamStatus": {"py/object": "music21.stream.streamStatus.StreamStatus", "py/state": {"_enharmonics": null, ' +
'"_dirty": null, "_concertPitch": null, "_accidentals": null, "_ties": null, "_rests": null, "_ornaments": null' +
', "_client": null, "_beams": null, "_measures": null}}, "sites": {"py/object": "music21.sites.Sites", "py/stat' +
'e": {"siteDict": {}, "_lastID": -1, "_siteIndex": 0}}, "isFlat": true, "autoSort": true, "_storedElementOffset' +
'Tuples": [{"py/tuple": [{"py/object": "music21.note.Note", "py/state": {"lyrics": [], "_notehead": "normal", "' +
'_volume": null, "_activeSite": null, "xPosition": null, "_priority": 0, "pitch": {"py/object": "music21.pitch.' +
'Pitch", "_groups": null, "_overridden_freq440": null, "_step": "C", "_octave": 4, "_microtone": {"py/object": ' +
'"music21.pitch.Microtone", "py/state": {"_harmonicShift": 1, "_centShift": 0}}, "_accidental": {"py/object": "' +
'music21.pitch.Accidental", "py/state": {"_modifier": "#", "_alter": 1.0, "displayLocation": "normal", "_displa' +
'yType": "normal", "displaySize": "full", "_name": "sharp", "_displayStatus": null, "displayStyle": "normal"}},' +
' "fundamental": null, "defaultOctave": 4, "implicitAccidental": false}, "expressions": [], "id": 1402251775445' +
'92, "_duration": {"py/object": "music21.duration.Duration", "py/state": {"_componentsNeedUpdating": true, "_tu' +
'plets": {"py/tuple": []}, "_qtrLength": 1.0, "_linked": true, "_components": [], "_dotGroups": {"py/tuple": [0' +
']}, "_client": {"py/id": 4}, "_unlinkedType": null, "_quarterLengthNeedsUpdating": false, "_typeNeedsUpdating"' +
': false}}, "_noteheadParenthesis": false, "sites": {"py/object": "music21.sites.Sites", "py/state": {"siteDict' +
'": {}, "_lastID": -1, "_siteIndex": 4}}, "_editorial": null, "tie": null, "_noteheadFill": null, "beams": {"py' +
'/object": "music21.beam.Beams", "py/state": {"feathered": false, "beamsList": []}}, "_naiveOffset": 0.0, "grou' +
'ps": {"py/object": "music21.base.Groups", "py/seq": []}, "linkage": "tie", "articulations": [], "hideObjectOnP' +
'rint": false, "_activeSiteStoredOffset": null, "_stemDirection": "unspecified", "_derivation": null}}, 0.0]}],' +
' "_derivation": null, "_naiveOffset": 0.0, "groups": {"py/object": "music21.base.Groups", "py/seq": []}, "isSo' +
'rted": false, "hideObjectOnPrint": false, "_activeSiteStoredOffset": null, "_endElements": [], "_atSoundingPit' +
'ch": "unknown", "definesExplicitSystemBreaks": false}}}';
var jpc = new music21.jsonPickle.Converter();
streamObj = jpc.run(pickleIn);
streamObj.renderOptions.events.resize = "reflow";
streamObj.appendNewCanvas();
});
I made the test html file using the code. and I run the code on music21j.
% cd $MUSIC21J_HOME
% python start_python_server.py
On browser(Crome)
http://localhost:8000/testHTML/test.html
Finally, I got the error.
M21object without classes: Object {_activeSite: null, _activeSiteStoredOffset: null, _derivation: null, _duration: Object, _editorial: null…}
fromPython.js:137 Uncaught TypeError: s.append is not a function
I compared the jsonpickleParse.html of example and the generated code from music21.
The format of pickleIn is different.
This is where the renderOptions and some sort of a status marker are in conflict -- we are using "startNewSystem" to mean both "override layout to start new system" and also "in this render should I start a new system?"
Originally posted by @mscuthbert in #126 (comment)
We have overriddenWidth
but nothing similar for the other render options, so when for instance, systemWidthsAndBreaks()
sets left, width, displayClef, etc., we have only true/false values at our disposal, or possibly undefined, not a "never" or "always" or "overridden 400" etc.
I was receiving the error message "p.step is undefined" when using the editableAccidentalCanvas examples. I found that commenting out lines 1497–1500 of stream.js, in noteChanged, solved the problem. But maybe this code is there for other reasons.
p = new pitch.Pitch("C");
p.diatonicNoteNum = clickedDiatonicNoteNum;
p.accidental = n.pitch.accidental;
n.pitch = p;
Matthew
Hi, i'm referencing #27 as it is the same problem, i followed the instructions there. I also broke up my project pasing the night yesterday trying to import music21j. What i've done:
./my-project/music21j:
npm update
npm install
./my-project
npm install music21j
./my-project/main.js
import music21 from 'music21j'
page = new music21.Page()
and it's complaining about music21 being undefined
Manifestation of 0xfe/vexflow#104:
const c = new music21.chord.Chord("C5 G5");
c.duration.type = "whole";
const s = new music21.stream.Stream();
s.append(c);
s.replaceDOM();
c.notes[1].pitch = new music21.pitch.Pitch('F#4');
s.replaceDOM();
vexflow-debug.js:1 Warning: Unsorted keys in note will be sorted. See https://github.com/0xfe/vexflow/issues/104 for details. Error
at Function.b.StackTrace (http://127.0.0.1:8000/build/music21.debug.js:45756:4968)
at Function.b.W (http://127.0.0.1:8000/build/music21.debug.js:45756:5126)
at http://127.0.0.1:8000/build/music21.debug.js:45756:255597
at Array.forEach (<anonymous>)
at e.value (http://127.0.0.1:8000/build/music21.debug.js:45756:255564)
at new e (http://127.0.0.1:8000/build/music21.debug.js:45756:250349)
at Chord.vexflowNote (http://127.0.0.1:8000/build/music21.debug.js:14834:17)
at Renderer.vexflowNotes (http://127.0.0.1:8000/build/music21.debug.js:25499:28)
at Renderer.getVoice (http://127.0.0.1:8000/build/music21.debug.js:25116:24)
at Renderer.prepareFlat (http://127.0.0.1:8000/build/music21.debug.js:24965:27)
I have a similar issue when trying to using the converter. Except even when using the fix, I'm getting a bunch of Cannot append *some Music21 Object* to Stream, Error: activeSite cannot be set for an object not in the stream
. Is this not suitable for web environments? For context I'm trying to use this with a Vue app. I'm testing with xml files that do get parsed correctly in the Python version.
Originally posted by @peterg98 in #58 (comment)
e.g,. V/V in F major will return 'Dominant in F major'
We have a huge dependency only for a single demo!
--- a/testHTML/musicxmlTest.html
+++ b/testHTML/musicxmlTest.html
@@ -8,7 +8,7 @@
<script src="../build/music21.debug.js"></script>
<script>
- mxUrl = 'bachOut.xml';
+ mxUrl = 'https://raw.githubusercontent.com/cuthbertLab/music21/master/music21/corpus/trecento/PMFC_13_19-Credo Scabroso.xml';
sp = new music21.musicxml.xmlToM21.ScoreParser();
sp.scoreFromUrl(mxUrl).done(() => {
sc = sp.stream;
These tied notes should be unisons and continue in same register:
Pardon if user error, but I think parsing XML from a string (e.g. downloaded from a URL) isn't working. Known?
When I run:
import * as music21 from 'music21j';
var mxUrl = 'https://raw.githubusercontent.com/cuthbertLab/music21j/master/testHTML/bachOut.xml';
var sp = new music21.musicxml.xmlToM21.ScoreParser();
sp.scoreFromUrl(mxUrl).done(() => {
var sc = sp.stream;
sc.appendNewDOM();
});
I get:
"no parts found in score"
Here, when the jQuery result $(xmlDoc)
is created, <score-partwise>
is already in the result set, not among the children (which would be <work>
, <part-list>
, etc.):
music21j/src/musicxml/xmlToM21.ts
Lines 81 to 85 in bef273d
I can access <score-partwise>
with either [2]
or .filter('score-partwise')[0]
:
This was modeled off the Bach demo test in testHTML/
, which is working, curiously! There, xmlDoc
is a document object, not a string (perhaps because it was loaded from a local file and not requested over the web?)
Hi there, was reading that exporting midi files is not still possible, wanted to ask if you have any idea about when you might implement it?
Can we export the musicXML file(or String) with this music21j lib?
I'm attempting to run music21j in node js ( repo link , npm link ).
I get ReferenceError: self is not defined
When trying to simply initialize music21j:
const music21 = require('music21j');
const n = new music21.note.Note('F#');
Does this mean it's not possible to run outside of the browser, or am I somehow initializing to the wrong environment?
The github documentation states
...or use it in your javascript/typescript project
, hence my confusion.
Seems to occur when passing in a double flat—possibly also double sharp.
Line 1144 in c8afb21
https://unpkg.com/browse/[email protected]/src/stave.js
I can't find this instance variable in version 1.2.90 (or 3.0.9). We also don't have it in VexFlow 4.
Tempo in music21j is currently just a single number -- it does not have the richness of music21(p) tempo.MetronomeMarks -- should add this without breaking current very simple functionality for playback.
Line 654 in c8afb21
I'm currently migrating music21j to VexFlow 4. Pretty straightforward so far!
Vex.Flow.Staves (plural)... is that a typo?
See tests of stream.js (commented out)
Beaming is very complex, but worth getting into the system ASAP. Relying on Vexflow for beam groups is only a temporary step.
either get a stem direction for ALL if needed OR take first stem direction or something.
Hi, I'm not sure if it is a music21j issue or an npm issue. when I'm trying to install music21j with npm install music21j, the terminal says
npm WARN saveError ENOENT: no such file or directory, open '/Users/tianxuehu/package.json'
npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN enoent ENOENT: no such file or directory, open '/Users/tianxuehu/package.json'
npm WARN tianxuehu No description
npm WARN tianxuehu No repository field.
npm WARN tianxuehu No README data
npm WARN tianxuehu No license field.
Then it generates a package-lock.json in the current directory.
Both the start and end of each note/chords register as starts. Could this be to do with one of the ‘noteOffs’ in src/music21/miditools.js?
This I can only produce in Chrome— the others don’t recognise the midi keyboards I've tried (which may speak to another problem … )
the playStream's calling of .flat.elements is too simplistic for the more complex scores that music21j is now running across. Needs to factor out playStream into a midi module to work through it.
Barlines become just little ticks.
When you drag a fragment to the $svgDiv, the fragment clearly registers – it plays back correctly and a bar is added to the new stave — but the stave is empty. This one replicates in Chrome, Firefox, Safari.
I noticed something strange:
using this script:
function renderTune(options){
require(['music21'], function () {
var s1 = music21.tinyNotation.TinyNotation(options.notation);
var s = new music21.stream.Score();
s.insert(0, s1);
s.tempo = options.tempo;
lsf('xylophone', function(i) {
s1.instrument = i;
s.renderScrollableCanvas($("#score"))
})
})
};
I render this tinynotation: "4/4 a b c d e b a b trip{c d e} a b "
Most of the time this goes well but now and then the instrument "xylophone" returns to the default "piano" sound and the strange thing is: this happens always at the third note of the triplet
I don't have a clue what is happening there
Currently this runs fine through the python web server but not through 'normal' web servers.
Will it be self rooting or will you need a 'rootdirectory.js' to allow you to publish stuff on 'normal' web sites?
We should make it so that you can just get a CDN URL for this repo and plug it into a <script>
tag and be able to use the project. Currently the hardcoded soundfont path prevents it (we should just disable playback rather than not load the project).
Matteo discovered a workaround, but the workaround doesn't work for just loading into a simple HTML page or trying to use JSFiddle as a sandbox.
As for the second issue, I managed to fix it in the following way. Is it the way it should be done, though?
import { common } from "music21j/releases/music21.debug"
common.urls.soundfontUrl = "./soundfonts/midi-js-soundfonts-master/FluidR3_GM/"
Thank you again
Originally posted by @mttbernardini in #58 (comment)
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.