Merge pull request #1486 from rvilarl/refactor/metrics

Refactor FontMetrics

Author: rvilarl

src/annotation.ts

@@ -73,7 +73,7 @@ export class Annotation extends Modifier {
   // words don't run into each other.
   static get minAnnotationPadding(): number {
     const musicFont = Tables.currentMusicFont();
-    return musicFont.lookupMetric('glyphs.noteHead.minPadding');
+    return musicFont.lookupMetric('noteHead.minPadding');
   }
   /** Arrange annotations within a `ModifierContext` */
   static format(annotations: Annotation[], state: ModifierContextState): boolean {

src/chordsymbol.ts

@@ -18,7 +18,7 @@ import { StemmableNote } from './stemmablenote';
 import { Tables } from './tables';
 import { TextFormatter } from './textformatter';
 import { Category, isStemmableNote } from './typeguard';
-import { log } from './util';
+import { log, RuntimeError } from './util';
 
 // To enable logging for this class. Set `Vex.Flow.ChordSymbol.DEBUG` to `true`.
 // eslint-disable-next-line
@@ -37,6 +37,25 @@ export interface ChordSymbolBlock {
   glyph?: Glyph;
 }
 
+export interface ChordSymbolGlyphMetrics {
+  leftSideBearing: number;
+  advanceWidth: number;
+  yOffset: number;
+}
+
+export interface ChordSymbolMetrics {
+  global: {
+    superscriptOffset: number;
+    subscriptOffset: number;
+    kerningOffset: number;
+    lowerKerningText: string[];
+    upperKerningText: string[];
+    spacing: number;
+    superSubRatio: number;
+  };
+  glyphs: Record<string, ChordSymbolGlyphMetrics>;
+}
+
 export enum ChordSymbolHorizontalJustify {
   LEFT = 1,
   CENTER = 2,
@@ -104,10 +123,9 @@ export class ChordSymbol extends Modifier {
     return ChordSymbol.noFormat;
   }
 
-  // eslint-disable-next-line
-  static getMetricForGlyph(glyphCode: string): any {
-    if (ChordSymbol.metrics[glyphCode]) {
-      return ChordSymbol.metrics[glyphCode];
+  static getMetricForGlyph(glyphCode: string): ChordSymbolGlyphMetrics | undefined {
+    if (ChordSymbol.metrics.glyphs[glyphCode]) {
+      return ChordSymbol.metrics.glyphs[glyphCode];
     }
     return undefined;
   }
@@ -224,9 +242,11 @@ export class ChordSymbol extends Modifier {
 
   static readonly symbolModifiers = SymbolModifiers;
 
-  // eslint-disable-next-line
-  static get metrics(): any {
-    return Tables.currentMusicFont().getMetrics().glyphs.chordSymbol;
+  static get metrics(): ChordSymbolMetrics {
+    const chordSymbol = Tables.currentMusicFont().getMetrics().chordSymbol;
+
+    if (!chordSymbol) throw new RuntimeError('BadMetrics', `chordSymbol missing`);
+    return chordSymbol;
   }
 
   static get lowerKerningText(): string[] {
@@ -250,7 +270,7 @@ export class ChordSymbol extends Modifier {
 
   static get minPadding(): number {
     const musicFont = Tables.currentMusicFont();
-    return musicFont.lookupMetric('glyphs.noteHead.minPadding');
+    return musicFont.lookupMetric('noteHead.minPadding');
   }
   /**
    * Estimate the width of the whole chord symbol, based on the sum of the widths of the individual blocks.

src/clef.ts

@@ -12,7 +12,23 @@ import { defined, log } from './util';
 export interface ClefType {
   point: number;
   code: string;
-  line?: number;
+  line: number;
+}
+
+export interface ClefAnnotatiomType extends ClefType {
+  x_shift: number;
+  code: string;
+  line: number;
+}
+
+export interface ClefMetrics {
+  width: number;
+  annotations: {
+    [key: string]: {
+      point: number;
+      [type: string]: { line?: number; shiftX?: number } | number;
+    };
+  };
 }
 
 // eslint-disable-next-line
@@ -33,20 +49,14 @@ export class Clef extends StaveModifier {
     return Category.Clef;
   }
 
-  annotation?: {
-    code: string;
-    line: number;
-    x_shift: number;
-    point: number;
-  };
+  annotation?: ClefAnnotatiomType;
 
   /**
    * The attribute `clef` must be a key from
    * `Clef.types`
    */
   clef: ClefType = Clef.types['treble'];
 
-  protected glyph?: Glyph;
   protected attachment?: Glyph;
   protected size?: string;
   protected type?: string;
@@ -114,18 +124,26 @@ export class Clef extends StaveModifier {
       },
       tab: {
         code: '6stringTabClef',
+        line: 3,
         point: 0,
       },
     };
   }
 
+  static get annotationSmufl(): Record<string, string> {
+    return {
+      '8va': 'timeSig8',
+      '8vb': 'timeSig8',
+    };
+  }
+
   /** Create a new clef. */
   constructor(type: string, size?: string, annotation?: string) {
     super();
 
     this.setPosition(StaveModifierPosition.BEGIN);
     this.setType(type, size, annotation);
-    this.setWidth(Tables.currentMusicFont().lookupMetric(`clef.${this.size}.width`));
+    this.setWidth(Tables.currentMusicFont().lookupMetric(`clef_${this.size}.width`));
     L('Creating clef:', type);
   }
 
@@ -141,17 +159,12 @@ export class Clef extends StaveModifier {
 
     const musicFont = Tables.currentMusicFont();
 
-    this.clef.point = musicFont.lookupMetric(`clef.${this.size}.point`, 0);
-    this.glyph = new Glyph(this.clef.code, this.clef.point, {
-      category: `clef.${this.clef.code}.${this.size}`,
-    });
-
     // If an annotation, such as 8va, is specified, add it to the Clef object.
     if (annotation !== undefined) {
-      const code = musicFont.lookupMetric(`clef.annotations.${annotation}.smuflCode`);
-      const point = musicFont.lookupMetric(`clef.annotations.${annotation}.${this.size}.point`);
-      const line = musicFont.lookupMetric(`clef.annotations.${annotation}.${this.size}.${this.type}.line`);
-      const x_shift = musicFont.lookupMetric(`clef.annotations.${annotation}.${this.size}.${this.type}.shiftX`);
+      const code = Clef.annotationSmufl[annotation];
+      const point = musicFont.lookupMetric(`clef_${this.size}.annotations.${annotation}.point`);
+      const line = musicFont.lookupMetric(`clef_${this.size}.annotations.${annotation}.${this.type}.line`);
+      const x_shift = musicFont.lookupMetric(`clef_${this.size}.annotations.${annotation}.${this.type}.shiftX`);
 
       this.annotation = { code, point, line, x_shift };
 
@@ -176,35 +189,20 @@ export class Clef extends StaveModifier {
   /** Set associated stave. */
   setStave(stave: Stave): this {
     this.stave = stave;
-    if (this.type === 'tab') {
-      const glyph = defined(this.glyph, 'ClefError', "Can't set stave without glyph.");
-
-      const numLines = this.stave.getNumLines();
-      const musicFont = Tables.currentMusicFont();
-      const point = musicFont.lookupMetric(`clef.lineCount.${numLines}.point`);
-      const shiftY = musicFont.lookupMetric(`clef.lineCount.${numLines}.shiftY`);
-      glyph.setPoint(point);
-      glyph.setYShift(shiftY);
-    }
     return this;
   }
 
   /** Render clef. */
   draw(): void {
-    const glyph = defined(this.glyph, 'ClefError', "Can't draw clef without glyph.");
     const stave = this.checkStave();
     const ctx = stave.checkContext();
     this.setRendered();
 
     this.applyStyle(ctx);
     ctx.openGroup('clef', this.getAttribute('id'));
-    glyph.setStave(stave);
-    glyph.setContext(ctx);
-    if (this.clef.line !== undefined) {
-      this.placeGlyphOnLine(glyph, stave, this.clef.line);
-    }
-    glyph.renderToStave(this.x);
-
+    Glyph.renderGlyph(ctx, this.x, stave.getYForLine(this.clef.line), this.clef.point, this.clef.code, {
+      category: `clef_${this.size}`,
+    });
     if (this.annotation !== undefined && this.attachment !== undefined) {
       this.placeGlyphOnLine(this.attachment, stave, this.annotation.line);
       this.attachment.setStave(stave);

src/clefnote.ts

@@ -2,10 +2,9 @@
 // Author Taehoon Moon 2014
 // MIT License
 
-import { Clef, ClefType } from './clef';
+import { Clef, ClefAnnotatiomType, ClefType } from './clef';
 import { Glyph } from './glyph';
 import { Note } from './note';
-import { RenderContext } from './rendercontext';
 import { Category } from './typeguard';
 
 /** ClefNote implements clef annotations in measures. */
@@ -14,16 +13,19 @@ export class ClefNote extends Note {
     return Category.ClefNote;
   }
 
-  protected glyph: Glyph;
-  protected clef: Clef;
+  protected clef: ClefType;
+  protected annotation?: ClefAnnotatiomType;
   protected type: string;
+  protected size: string;
 
   constructor(type: string, size?: string, annotation?: string) {
     super({ duration: 'b' });
     this.type = type;
-    this.clef = new Clef(type, size, annotation);
-    this.glyph = new Glyph(this.clef.clef.code, this.clef.clef.point);
-    this.setWidth(this.glyph.getMetrics().width);
+    const clef = new Clef(type, size, annotation);
+    this.clef = clef.clef;
+    this.annotation = clef.annotation;
+    this.size = size === undefined ? 'default' : size;
+    this.setWidth(Glyph.getWidth(this.clef.code, this.clef.point, `clefNote_${this.size}`));
 
     // Note properties
     this.ignore_ticks = true;
@@ -32,22 +34,17 @@ export class ClefNote extends Note {
   /** Set clef type, size and annotation. */
   setType(type: string, size: string, annotation: string): this {
     this.type = type;
-    this.clef = new Clef(type, size, annotation);
-    this.glyph = new Glyph(this.clef.clef.code, this.clef.clef.point);
-    this.setWidth(this.glyph.getMetrics().width);
+    this.size = size;
+    const clef = new Clef(type, size, annotation);
+    this.clef = clef.clef;
+    this.annotation = clef.annotation;
+    this.setWidth(Glyph.getWidth(this.clef.code, this.clef.point, `clefNote_${this.size}`));
     return this;
   }
 
   /** Get associated clef. */
   getClef(): ClefType {
-    return this.clef.clef;
-  }
-
-  /** Set associated context. */
-  setContext(context: RenderContext): this {
-    super.setContext(context);
-    this.glyph.setContext(this.getContext());
-    return this;
+    return this.clef;
   }
 
   preFormat(): this {
@@ -58,26 +55,22 @@ export class ClefNote extends Note {
   /** Render clef note. */
   draw(): void {
     const stave = this.checkStave();
-    if (!this.glyph.getContext()) {
-      this.glyph.setContext(this.getContext());
-    }
+    const ctx = this.checkContext();
 
     this.setRendered();
     const abs_x = this.getAbsoluteX();
 
-    this.glyph.setStave(stave);
-    this.glyph.setYShift(stave.getYForLine(this.clef.clef.line ?? 0) - stave.getYForGlyphs());
-    this.glyph.renderToStave(abs_x);
+    Glyph.renderGlyph(ctx, abs_x, stave.getYForLine(this.clef.line), this.clef.point, this.clef.code, {
+      category: `clefNote_${this.size}`,
+    });
 
     // If the Vex.Flow.Clef has an annotation, such as 8va, draw it.
-    if (this.clef.annotation !== undefined) {
-      const attachment = new Glyph(this.clef.annotation.code, this.clef.annotation.point);
-      if (!attachment.getContext()) {
-        attachment.setContext(this.getContext());
-      }
+    if (this.annotation !== undefined) {
+      const attachment = new Glyph(this.annotation.code, this.annotation.point);
+      attachment.setContext(ctx);
       attachment.setStave(stave);
-      attachment.setYShift(stave.getYForLine(this.clef.annotation.line) - stave.getYForGlyphs());
-      attachment.setXShift(this.clef.annotation.x_shift);
+      attachment.setYShift(stave.getYForLine(this.annotation.line) - stave.getYForGlyphs());
+      attachment.setXShift(this.annotation.x_shift);
       attachment.renderToStave(abs_x);
     }
   }

src/font.ts

@@ -1,4 +1,9 @@
+import { ChordSymbolMetrics } from './chordsymbol';
+import { ClefMetrics } from './clef';
+import { NoteHeadMetrics } from './notehead';
+import { OrnamentMetrics } from './ornament';
 import { StringNumberMetrics } from './stringnumber';
+import { TupletMetrics } from './tuplet';
 import { defined } from './util';
 
 export interface FontInfo {
@@ -34,18 +39,27 @@ export interface FontMetrics extends Record<string, any> {
   smufl: boolean;
   stave?: Record<string, number>;
   accidental?: Record<string, number>;
-  // eslint-disable-next-line
-  clef?: Record<string, any>;
+  clef_default?: ClefMetrics;
+  clef_small?: ClefMetrics;
   pedalMarking?: Record<string, Record<string, number>>;
   digits?: Record<string, number>;
-  // Not specified in gonville_metrics.ts.
   articulation?: Record<string, Record<string, number>>;
   tremolo?: Record<string, Record<string, number>>;
-  // Not specified in bravura_metrics.ts or gonville_metrics.ts.
-  noteHead?: Record<string, Record<string, number>>;
+  chordSymbol?: ChordSymbolMetrics;
+  ornament?: Record<string, OrnamentMetrics>;
+  noteHead?: NoteHeadMetrics;
   stringNumber?: StringNumberMetrics;
-  // eslint-disable-next-line
-  glyphs: Record<string, Record<string, any>>;
+  tuplet?: TupletMetrics;
+  glyphs: Record<
+    string,
+    {
+      point?: number;
+      shiftX?: number;
+      shiftY?: number;
+      scale?: number;
+      [key: string]: { point?: number; shiftX?: number; shiftY?: number; scale?: number } | number | undefined;
+    }
+  >;
 }
 
 export interface FontGlyph {