Merge https://github.com/0xfe/vexflow

Gruntfile.js

@@ -1,7 +1,6 @@
 /* global module, __dirname, process, require */
 
 const path = require('path');
-const glob = require('glob');
 
 module.exports = (grunt) => {
   const BANNER = [
@@ -17,20 +16,14 @@ module.exports = (grunt) => {
   const RELEASE_DIR = path.join(BASE_DIR, 'releases');
   const REFERENCE_DIR = path.join(BASE_DIR, 'reference');
   const MODULE_ENTRY = path.join(BASE_DIR, 'src/index.js');
+  const MODULE_ENTRY_TESTS = path.join(BASE_DIR, 'tests/run.js');
   const TARGET_RAW = 'vexflow-debug.js';
   const TARGET_MIN = 'vexflow-min.js';
+  const TARGET_TESTS = 'vexflow-tests.js';
 
   // Used for eslint and docco
   const SOURCES = ['./src/*.ts', './src/*.js', '!./src/header.js'];
 
-  // Take all test files in 'tests/' and build TARGET_TESTS_BROWSER
-  const TARGET_TESTS_BROWSER = 'vexflow-tests.js';
-  const TEST_SOURCES = [
-    './tests/vexflow_test_helpers.js',
-    ...['./tests/mocks.js', './tests/*_tests.js', './tests/*_tests.ts'].flatMap((file) => glob.sync(file)),
-    './tests/run.js',
-  ];
-
   function webpackConfig(target, moduleEntry, mode, libraryName) {
     return {
       mode: mode,
@@ -64,20 +57,10 @@ module.exports = (grunt) => {
 
   const webpackProd = webpackConfig(TARGET_MIN, MODULE_ENTRY, 'production', 'Vex');
   const webpackDev = webpackConfig(TARGET_RAW, MODULE_ENTRY, 'development', 'Vex');
-  const webpackTest = webpackConfig(TARGET_TESTS_BROWSER, TEST_SOURCES, 'development', 'VFTests');
+  const webpackTest = webpackConfig(TARGET_TESTS, MODULE_ENTRY_TESTS, 'development', 'VFTests');
 
   grunt.initConfig({
     pkg: grunt.file.readJSON('package.json'),
-    concat: {
-      options: {
-        banner: BANNER,
-        sourceMap: true,
-      },
-      tests: {
-        src: TEST_SOURCES,
-        dest: TARGET_TESTS_BROWSER,
-      },
-    },
     webpack: {
       build: webpackProd,
       buildDev: webpackDev,
@@ -180,7 +163,6 @@ module.exports = (grunt) => {
   });
 
   // Load the plugin that provides the "uglify" task.
-  grunt.loadNpmTasks('grunt-contrib-concat');
   grunt.loadNpmTasks('grunt-contrib-qunit');
   grunt.loadNpmTasks('grunt-contrib-copy');
   grunt.loadNpmTasks('grunt-contrib-clean');

src/barnote.js → src/barnote.ts

@@ -10,14 +10,20 @@
 
 import { Vex } from './vex';
 import { Note } from './note';
-import { Barline } from './stavebarline';
+import { Barline, BarlineType } from './stavebarline';
 
 // To enable logging for this class. Set `Vex.Flow.BarNote.DEBUG` to `true`.
-function L(...args) {
+function L(
+  // eslint-disable-next-line
+  ...args: any[]) {
   if (BarNote.DEBUG) Vex.L('Vex.Flow.BarNote', args);
 }
 
 export class BarNote extends Note {
+  protected metrics: { widths: Record<string, number> };
+  static DEBUG: boolean;
+  protected type!: BarlineType;
+
   constructor(type = Barline.type.SINGLE) {
     super({ duration: 'b' });
     this.setAttribute('type', 'BarNote');
@@ -43,40 +49,39 @@ export class BarNote extends Note {
   }
 
   // Get and set the type of Bar note. `type` must be one of `Vex.Flow.Barline.type`.
-  getType() {
+  getType(): BarlineType {
     return this.type;
   }
-  setType(type) {
+
+  setType(type: string | BarlineType): this {
     this.type = typeof type === 'string' ? Barline.typeString[type] : type;
 
     // Set width to width of relevant `Barline`.
     this.setWidth(this.metrics.widths[this.type]);
     return this;
   }
 
-  getBoundingBox() {
-    return super.getBoundingBox();
-  }
-
-  addToModifierContext() {
+  addToModifierContext(): this {
     /* overridden to ignore */
     return this;
   }
 
-  preFormat() {
+  preFormat(): this {
     /* overridden to ignore */
     this.setPreFormatted(true);
     return this;
   }
 
   // Render note to stave.
-  draw() {
-    this.checkContext();
+  draw(): void {
+    const ctx = this.checkContext();
     if (!this.stave) throw new Vex.RERR('NoStave', "Can't draw without a stave.");
     L('Rendering bar line at: ', this.getAbsoluteX());
+    if (this.style) this.applyStyle(ctx);
     const barline = new Barline(this.type);
     barline.setX(this.getAbsoluteX());
     barline.draw(this.stave);
+    if (this.style) this.restoreStyle(ctx);
     this.setRendered();
   }
 }

src/curve.ts

@@ -17,7 +17,7 @@ export interface CurveOptions {
   cps: { x: number; y: number }[];
 }
 
-export enum Position {
+export enum CurvePosition {
   NEAR_HEAD = 1,
   NEAR_TOP = 2,
 }
@@ -27,8 +27,8 @@ export class Curve extends Element {
   protected from: Note;
   protected to: Note;
 
-  static get Position(): typeof Position {
-    return Position;
+  static get Position(): typeof CurvePosition {
+    return CurvePosition;
   }
 
   static get PositionString(): Record<string, number> {

src/glyph.ts

@@ -113,14 +113,14 @@ export class Glyph extends Element {
   bbox: BoundingBox = new BoundingBox(0, 0, 0, 0);
   code: string;
   metrics?: GlyphMetrics;
-  topGlyphs?: Glyph[];
-  botGlyphs?: Glyph[];
+  topGlyphs: Glyph[] = [];
+  botGlyphs: Glyph[] = [];
 
   protected options: GlyphOptions;
   protected originShift: { x: number; y: number };
   protected x_shift: number;
   protected y_shift: number;
-  protected scale: number = 1;
+  scale: number = 1;
   protected point: number;
   protected stave?: Stave;
 
@@ -371,10 +371,10 @@ export class Glyph extends Element {
       x_max: this.metrics.x_max * this.scale * this.metrics.scale,
       width: this.bbox.getW(),
       height: this.bbox.getH(),
-      scale: 1,
-      x_shift: 0,
-      y_shift: 0,
-      outline: [],
+      scale: this.scale * this.metrics.scale,
+      x_shift: this.metrics.x_shift,
+      y_shift: this.metrics.y_shift,
+      outline: this.metrics.outline,
     };
   }
 

src/gracenote.js → src/gracenote.ts

@@ -1,24 +1,35 @@
 // [VexFlow](http://vexflow.com) - Copyright (c) Mohit Muthanna 2010.
 
-import { StaveNote } from './stavenote';
+import { Vex } from './vex';
+import { StaveNote, StaveNoteStruct } from './stavenote';
 import { Stem } from './stem';
 import { Flow } from './tables';
 
+export interface GraceNoteStruct extends StaveNoteStruct {
+  slash: boolean;
+}
 export class GraceNote extends StaveNote {
-  static get CATEGORY() {
+  protected slash: boolean;
+  protected slur: boolean;
+
+  static get CATEGORY(): string {
     return 'gracenotes';
   }
-  static get LEDGER_LINE_OFFSET() {
+
+  static get LEDGER_LINE_OFFSET(): number {
     return 2;
   }
-  static get SCALE() {
+
+  static get SCALE(): number {
     return 0.66;
   }
 
-  constructor(note_struct) {
+  constructor(note_struct: GraceNoteStruct) {
     super({
-      glyph_font_scale: Flow.DEFAULT_NOTATION_FONT_SCALE * GraceNote.SCALE,
-      stroke_px: GraceNote.LEDGER_LINE_OFFSET,
+      ...{
+        glyph_font_scale: Flow.DEFAULT_NOTATION_FONT_SCALE * GraceNote.SCALE,
+        stroke_px: GraceNote.LEDGER_LINE_OFFSET,
+      },
       ...note_struct,
     });
     this.setAttribute('type', 'GraceNote');
@@ -31,8 +42,8 @@ export class GraceNote extends StaveNote {
     this.width = 3;
   }
 
-  getStemExtension() {
-    if (this.stem_extension_override != null) {
+  getStemExtension(): number {
+    if (this.stem_extension_override) {
       return this.stem_extension_override;
     }
 
@@ -49,16 +60,16 @@ export class GraceNote extends StaveNote {
     return 0;
   }
 
-  getCategory() {
+  getCategory(): string {
     return GraceNote.CATEGORY;
   }
 
   // FIXME: move this to more basic class.
-  getStaveNoteScale() {
+  getStaveNoteScale(): number {
     return this.render_options.glyph_font_scale / Flow.DEFAULT_NOTATION_FONT_SCALE;
   }
 
-  draw() {
+  draw(): void {
     super.draw();
     this.setRendered();
     const stem = this.stem;
@@ -85,20 +96,20 @@ export class GraceNote extends StaveNote {
         const noteStemHeight = stem.getHeight();
         let x = this.getAbsoluteX();
         let y =
-          stem_direction === Flow.Stem.DOWN
+          stem_direction === Stem.DOWN
             ? noteHeadBounds.y_top - noteStemHeight
             : noteHeadBounds.y_bottom - noteStemHeight;
 
         const defaultStemExtention =
-          stem_direction === Flow.Stem.DOWN ? this.glyph.stem_down_extension : this.glyph.stem_up_extension;
+          stem_direction === Stem.DOWN ? this.glyph.stem_down_extension : this.glyph.stem_up_extension;
 
         let defaultOffsetY = Flow.STEM_HEIGHT;
         defaultOffsetY -= defaultOffsetY / 2.8;
         defaultOffsetY += defaultStemExtention;
         y += defaultOffsetY * staveNoteScale * stem_direction;
 
         const offsets =
-          stem_direction === Flow.Stem.UP
+          stem_direction === Stem.UP
             ? {
                 x1: 1,
                 y1: 0,
@@ -124,7 +135,7 @@ export class GraceNote extends StaveNote {
 
       // FIXME: avoide staff lines, leadger lines or others.
 
-      const ctx = this.context;
+      const ctx = this.checkContext();
       ctx.save();
       ctx.setLineWidth(1 * offsetScale); // FIXME: use more appropriate value.
       ctx.beginPath();
@@ -136,8 +147,14 @@ export class GraceNote extends StaveNote {
     }
   }
 
-  calcBeamedNotesSlashBBox(slashStemOffset, slashBeamOffset, protrusions) {
+  calcBeamedNotesSlashBBox(
+    slashStemOffset: number,
+    slashBeamOffset: number,
+    protrusions: { beam: number; stem: number }
+  ): Record<string, number> {
     const beam = this.beam;
+    if (!beam) throw new Vex.RERR('NoBeam', "Can't calculate without a beam.");
+
     const beam_slope = beam.slope;
     const isBeamEndNote = beam.notes[beam.notes.length - 1] === this;
     const scaleX = isBeamEndNote ? -1 : 1;
@@ -158,7 +175,7 @@ export class GraceNote extends StaveNote {
 
     const stemX = this.getStemX();
     const stem0X = beam.notes[0].getStemX();
-    const stemY = this.beam.getBeamYToDraw() + (stemX - stem0X) * beam_slope;
+    const stemY = beam.getBeamYToDraw() + (stemX - stem0X) * beam_slope;
 
     const ret = {
       x1: stemX - protrusion_stem_dx,

src/gracetabnote.ts

@@ -8,8 +8,7 @@
 //
 // See `tests/gracetabnote_tests.js` for usage examples.
 
-import { TabNote } from './tabnote';
-import { StaveNoteStruct } from './stavenote';
+import { TabNote, TabNoteStruct } from './tabnote';
 
 /** Implements Crace Tab Note. */
 export class GraceTabNote extends TabNote {
@@ -18,7 +17,7 @@ export class GraceTabNote extends TabNote {
   }
 
   /** Constructor providing a stave note struct */
-  constructor(note_struct: StaveNoteStruct) {
+  constructor(note_struct: TabNoteStruct) {
     super(note_struct, false);
     this.setAttribute('type', 'GraceTabNote');
 

src/parser.ts

@@ -11,7 +11,7 @@ function L(...args: any[]) {
   if (Parser.DEBUG) Vex.L('Vex.Flow.Parser', args);
 }
 
-export const X = Vex.MakeException('ParserError');
+const X = Vex.MakeException('ParserError');
 
 const NO_ERROR_POS = -1;
 

src/registry.ts

@@ -20,7 +20,7 @@
 import { Vex } from './vex';
 import { Element } from './element';
 
-export const X = Vex.MakeException('RegistryError');
+const X = Vex.MakeException('RegistryError');
 
 // Indexes are represented as maps of maps of maps. This allows
 // for both multi-labeling (e.g., an element can have multiple classes)

src/stave.ts

@@ -343,14 +343,12 @@ export class Stave extends Element {
     return (y - this.y) / spacing - headroom;
   }
 
-  getYForTopText(line: number): number {
-    const l = line || 0;
-    return this.getYForLine(-l - this.options.top_text_position);
+  getYForTopText(line: number = 0): number {
+    return this.getYForLine(-line - this.options.top_text_position);
   }
 
-  getYForBottomText(line: number): number {
-    const l = line || 0;
-    return this.getYForLine(this.options.bottom_text_position + l);
+  getYForBottomText(line: number = 0): number {
+    return this.getYForLine(this.options.bottom_text_position + line);
   }
 
   getYForNote(line: number): number {