Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • Oct 14 13:25

    sschmidTU on develop

    chore: Readme.md wording (compare)

  • Oct 12 19:50
    sschmidTU labeled #1070
  • Oct 12 06:14
    rianlu opened #1070
  • Oct 08 20:37
    sschmidTU commented #1069
  • Oct 08 20:35
    sschmidTU edited #1069
  • Oct 08 20:34
    sschmidTU commented #1069
  • Oct 08 20:33
    sschmidTU commented #1069
  • Oct 08 20:32
    sschmidTU closed #1069
  • Oct 08 20:32

    sschmidTU on develop

    fix(MusicSystemBuilder): Preven… (compare)

  • Oct 08 16:04
    sschmidTU commented #977
  • Oct 08 08:04
    showtan001 commented #977
  • Oct 08 07:58
    showtan001 commented #977
  • Oct 08 07:58
    showtan001 commented #977
  • Oct 08 06:14
    rianlu opened #1069
  • Oct 07 03:45
    kenboy2304 commented #1068
  • Oct 05 16:59
    sschmidTU labeled #1068
  • Oct 05 16:59
    sschmidTU commented #1068
  • Oct 05 16:33

    sschmidTU on develop

    docs: docstring correction Fix… (compare)

  • Oct 05 16:33
    sschmidTU closed #1067
  • Oct 05 16:32
    sschmidTU commented #1067
Simon
@sschmidTU

@norppa have you seen our React example project?
https://github.com/opensheetmusicdisplay/react-opensheetmusicdisplay

also, OSMD can read mxl files (which is zipped musicxml) and unzip them, so you should be able to pass in the compressed file to osmd.load().

but if you really want OSMD to handle the filestream directly, i don't know that there's a universal filestream API for javascript/typescript, so you'll probably have to convert the stream to string anyways. (and pass that to OSMD)
Jari Haavisto
@norppa
yes, I'm using that example as the basis
and it processes local mxl files no problem, it's just that if I fetch them from an API it doesn't seem to be able to handle them and I haven't been able to find an example of how to read the compressed file to a string
Jari Haavisto
@norppa
this works for xml file, but not for the mxl file
const getScore = async (id) => {
const url = './app/music/Example.mxl'
const decoder = new TextDecoder('utf-8')
await fetch(url)
.then(response => {
response.body.getReader().read()
.then(({ value, done }) => {
setSelectedScore(decoder.decode(value))
})
})
}
Simon
@sschmidTU
you should be able to take some code from osmd.load() to turn the mxl file to an xml string.
禄碌无为
@rianlu
I have two problems now:
How to display only the left/right hand scores?
How to get the beat of the score? Such as 3/4 4/4
Does anyone know how to solve it?
禄碌无为
@rianlu
phamconganh
@phamconganh
@rianlu you can get staff id, 1 for right hand, > 1 for left hand
phamconganh
@phamconganh
sourceStaffEntry.ParentStaff.Id == 1 for right hand
禄碌无为
@rianlu
Yes, I have seen the previous chat, but I want to show only the left or right hand, is there any good way?
phamconganh
@phamconganh
@rianlu you create 2 custom cursor right hand and left hand, and a function moveToSourceStaffEntry(sourceStaffEntry) and condition for move is sourceStaffEntry.ParentStaff.Id == 1 for right hand and sourceStaffEntry.ParentStaff.Id > 1 for left hand
phamconganh
@phamconganh
image.png
禄碌无为
@rianlu
@phamconganh Thank you for your reply. Now I can use osmd.cursor.iterator.CurrentVoiceEntries[0].ParentSourceStaffEntry.parentStaff.id to judge the left and right hands, but it is not clear how to use it, because I am also new to osmd. I want to be able to use code to control the display of the left and right hands of the score, just like controlling the display of the scores of different instruments: osmd.sheet.Instruments[0].Visible = false. My idea is to be able to display only the left hand or the right hand, or Some special treatments are performed on the right hand, such as setting transparency, etc. This way, you can practice the left and right hands separately. I don’t know if this will be difficult to achieve.
image.png
The picture above is what I hope to achieve
Simon
@sschmidTU
you can't only display the right or left hand of a piano score right now, unfortunately, because they are part of the same Instrument.
maybe you can remove the staff from the xml, using osmd.OnXMLRead to give a function that manipulates the xml and returns a new xml before it is loaded by OSMD.
Simon
@sschmidTU

@rianlu regarding checking for rhythm, I just changed SourceMeasure.RhythmPrinted to be of type RhythmInstruction instead of boolean. So you'll be able to check sourceMeasure.RhythmPrinted.Rhythm.Nominator (3) and Denominator (4) for a 3/4 score. this is updated on the develop branch, will be in the next OSMD release.

if you need the information now, with a method that works in the current OSMD release, see MusicSystemBuilder.AddInstructionsAtMeasureBegin in the source code.

Simon
@sschmidTU
so you would check e.g. osmd.sheet.SourceMeasures[0].RhythmPrinted
Simon
@sschmidTU
actually, showing e.g. only the right hand from a piano score by removing the other staff from the xml doesn't seem to work that simply. i tried setting staff-layout number="1" and removing notes with <note><staff>1 in a very simple piano score, but that wasn't enough.
so, we'd like to implement this feature, but it would take some time.
禄碌无为
@rianlu
@sschmidTU Thank you for your answer! I'm going to try next!
禄碌无为
@rianlu
image.png
I got it!
Simon
@sschmidTU
nice! the other method i mentioned will probably be easier once the next osmd version is released, but if you already got it working, no reason to worry about it i guess ;)
禄碌无为
@rianlu
I used osmd.cursor.iterator.CurrentVoiceEntries[0].ParentSourceStaffEntry.parentStaff.id to distinguish the left and right hands, and I have got all the notes for the left and right hands. Is there a way to make the cursor jump to the specified position? In other words, the cursor can only be moved based on the left-hand score or the right-hand score?
For example only based on the left hand
image.png
禄碌无为
@rianlu

I also tried osmd.cursor.iterator.currentVoiceEntries[0].notes[0].printObject = false to hide note,
then use

osmd.cursor.iterator.moveToNextVisibleVoiceEntry()
osmd.cursor.update()

to control and update the cursor, but still the same as before

禄碌无为
@rianlu
I found a solution, take out all the notes, and save the corresponding id (used to distinguish between left and right hands) in the note, and then judge the id when moving the cursor. For example, if I am following the left-handed score, when I move the cursor at a fixed speed, the id will be judged. If it is left-handed, there will be a duration, and then move the cursor; if it is right-handed, move the cursor directly until the next left hand
Hallvord R. M. Steen
@hallvors
@sschmidTU is this the right place to discuss the osmd-extended project and ask questions?
Simon
@sschmidTU
@hallvors better would be on our Discord server: osmd.org/discord
i'll give you the sponsor role so you'll see the sponsor exclusive channels.
or of course in the osmd-extended Issues section on github
Tom Pe
@taat
image.png
Hi guys! How can I change the head color of one specific note under the cursor, without re-rendering the whole sheet? (I need it to be lightning fast). Is there a way to access the actual head element in the SVG?
Simon
@sschmidTU
@taat yes.
osmd.rules.GNote(osmd.cursor.NotesUnderCursor()[0]).getSVGGElement()
it will have one or more subelements vf-notehead whose color you can change.
Tom Pe
@taat
@sschmidTU Than you Simon, that was really helpful.
@sschmidTU Next question: How can I add/remove a note head without re-rendering at the current cursor position? (I want to show currently pressed keyboard note).
Simon
@sschmidTU
@taat for removing, you can remove the svg element of the notehead. adding is not possible out of the box, but you can try copying a notehead element and placing it somewhere else.
Tom Pe
@taat
@sschmidTU That's exactly what I did, thanks. How can I overload the Cursor class and use my CursorExtended class instead? I'm using OSMD with TypeScript/Angular.
Simon
@sschmidTU
just extend the cursor class
then set osmd.cursors = [myCursor] (needs to be an array)
Tom Pe
@taat
@sschmidTU Hmm. That did not work. I tried:
image.png
Simon
@sschmidTU
oh, you need to implement the hide() method in your Cursor class, apparently. It's strange because that should be taken from the OSMD cursor via extends, it's a public method there.
Simon
@sschmidTU
maybe you can do it like this:
public hide() {
  base.hide();
}
Tom Pe
@taat
@sschmidTU This didn't work either. It's not inheriting the methods at all. (I'm using this npm package with latest Angular). I get the following error:
image.png
Tom Pe
@taat
How does OSMD draw the notes? How can I draw a C# whole note (halftone 49) at the current cursor location? (assumming we're dealing with piano sheet)
Simon
@sschmidTU
That's strange. The Cursor class is exported in OSMD. May be an error with how webpack builds the module.