Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Rendering issue crash drum notation #752

Closed
jeroenlammerts opened this issue Mar 28, 2020 · 7 comments
Closed

Rendering issue crash drum notation #752

jeroenlammerts opened this issue Mar 28, 2020 · 7 comments

Comments

@jeroenlammerts
Copy link
Contributor

jeroenlammerts commented Mar 28, 2020

        let notes = [
          new VF.StaveNote({ keys: ['f/4', 'g/5/x3'], duration: '8' }),
          new VF.StaveNote({ keys: ['f/5/x2'], duration: '8' }),
          new VF.StaveNote({ keys: ['c/5', 'f/5/x2'], duration: '8' }),
          new VF.StaveNote({ keys: ['f/5/x2'], duration: '16' }),
          new VF.StaveNote({ keys: ['f/4'], duration: '16' }),
          new VF.StaveNote({ keys: ['f/4', 'f/5/x2'], duration: '8' }),
          new VF.StaveNote({ keys: ['f/4', 'f/5/x2'], duration: '8' }),
          new VF.StaveNote({ keys: ['c/5', 'f/5/x2'], duration: '8' }),
          new VF.StaveNote({ keys: ['f/5/x2'], duration: '8' }),
        ];

          let voice1 = new VF.Voice({})
            .addTickables(notes)
            .setStave(measure);

          let beams = VF.Beam.generateBeams(voice1.getTickables(), {
            maintain_stem_directions: true,
            flat_beams: true,
          });

          new VF.Formatter()
            .joinVoices([voice1])
            .formatToStave([voice1], measure);

          voice1.setContext(this.ctx).draw();

          beams.forEach(beam => {
            beam.setContext(this.ctx).draw();
          });

Screenshot from 2020-03-28 17-34-42

The crash should be more to the left.

@0xfe
Copy link
Owner

0xfe commented Apr 1, 2020

Looking into this. More weird cases:

Screen Shot 2020-04-01 at 2 54 28 PM

@0xfe
Copy link
Owner

0xfe commented Apr 1, 2020

This was a super thorny issue -- took three hours to figure out and fix. Running regression tests now and hope I haven't broken anything in the process.

@0xfe
Copy link
Owner

0xfe commented Apr 1, 2020

Okay, all fixed, however there are still some minor adjustments required on a few glyphs. Whew.

Screen Shot 2020-04-01 at 5 40 18 PM

@0xfe 0xfe closed this as completed Apr 1, 2020
@jeroenlammerts
Copy link
Contributor Author

jeroenlammerts commented Apr 2, 2020

Thanks @0xfe for the effort looking into this. Actually the latest release (1.2.91) gives me some error.

Screenshot from 2020-04-02 19-45-33
Screenshot from 2020-04-02 19-45-16

I've tested it with 1.2.90 which doesn't show the error:
Screenshot from 2020-04-02 19-48-44

@0xfe
Copy link
Owner

0xfe commented Apr 2, 2020

How are you importing the library? Can you send me reproducible sample please?

@jeroenlammerts
Copy link
Contributor Author

import * as Vex from 'vexflow';

but now only works with

import Vex from 'vexflow';

@sschmidTU
Copy link
Contributor

sschmidTU commented Apr 17, 2020

I can confirm, the OSMD webpack build actually still compiled, but starting with Vexflow 1.2.91, when running the build/webpack server, Vex.Flow was undefined at runtime.
We had to use:
import Vex from "vexflow";
instead of:
import Vex = require("vexflow");

Also, in Typescript, I had to add this to tsconfig.json (to existing compilerOptions):

  "compilerOptions": {
    "esModuleInterop": true,
  }

Without that, this new import syntax was giving compile errors.

Now the build is running fine and looking good, so far!

It's unfortunate we weren't discussing this in a dedicated issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants