gracenote.js

Table of Contents

  1. accidental.js
  2. annotation.js
  3. articulation.js
  4. barnote.js
  5. beam.js
  6. bend.js
  7. boundingbox.js
  8. boundingboxcomputation.js
  9. canvascontext.js
  10. clef.js
  11. clefnote.js
  12. crescendo.js
  13. curve.js
  14. dot.js
  15. easyscore.js
  16. element.js
  17. factory.js
  18. formatter.js
  19. fraction.js
  20. frethandfinger.js
  21. ghostnote.js
  22. glyph.js
  23. gracenote.js
  24. gracenotegroup.js
  25. gracetabnote.js
  26. index.js
  27. keymanager.js
  28. keysignature.js
  29. modifier.js
  30. modifiercontext.js
  31. music.js
  32. note.js
  33. notehead.js
  34. notesubgroup.js
  35. ornament.js
  36. parser.js
  37. pedalmarking.js
  38. raphaelcontext.js
  39. renderer.js
  40. stave.js
  41. stavebarline.js
  42. staveconnector.js
  43. stavehairpin.js
  44. staveline.js
  45. stavemodifier.js
  46. stavenote.js
  47. staverepetition.js
  48. stavesection.js
  49. stavetempo.js
  50. stavetext.js
  51. stavetie.js
  52. stavevolta.js
  53. stem.js
  54. stemmablenote.js
  55. stringnumber.js
  56. strokes.js
  57. svgcontext.js
  58. system.js
  59. tables.js
  60. tabnote.js
  61. tabslide.js
  62. tabstave.js
  63. tabtie.js
  64. textbracket.js
  65. textdynamics.js
  66. textnote.js
  67. tickable.js
  68. tickcontext.js
  69. timesignature.js
  70. timesignote.js
  71. tremolo.js
  72. tuning.js
  73. tuplet.js
  74. vex.js
  75. vibrato.js
  76. vibratobracket.js
  77. voice.js
  78. voicegroup.js

VexFlow - Copyright (c) Mohit Muthanna 2010.

import { StaveNote } from './stavenote';
import { Flow } from './tables';

export class GraceNote extends StaveNote {
  static get CATEGORY() { return 'gracenotes'; }
  static get LEDGER_LINE_OFFSET() { return 2; }
  static get SCALE() { return 0.66; }

  constructor(note_struct) {
    super(Object.assign(note_struct, {
      glyph_font_scale: Flow.DEFAULT_NOTATION_FONT_SCALE * GraceNote.SCALE,
      stroke_px: GraceNote.LEDGER_LINE_OFFSET,
    }));
    this.attrs.type = 'GraceNote';

    this.slash = note_struct.slash;
    this.slur = true;

    this.buildNoteHeads();

    this.width = 3;
  }

  getStemExtension() {
    const glyph = this.getGlyph();

    if (this.stem_extension_override != null) {
      return this.stem_extension_override;
    }

    if (glyph) {
      return this.getStemDirection() === 1
        ? glyph.gracenote_stem_up_extension
        : glyph.gracenote_stem_down_extension;
    }

    return 0;
  }

  getCategory() { return GraceNote.CATEGORY; }

  draw() {
    super.draw();
    const ctx = this.context;
    const stem_direction = this.getStemDirection();

    if (this.slash) {
      ctx.beginPath();

      let x = this.getAbsoluteX();
      let y = this.getYs()[0] - (this.stem.getHeight() / 2.8);
      if (stem_direction === 1) {
        x += 1;
        ctx.moveTo(x, y);
        ctx.lineTo(x + 13, y - 9);
      } else if (stem_direction === -1) {
        x -= 4;
        y += 1;
        ctx.moveTo(x, y);
        ctx.lineTo(x + 13, y + 9);
      }

      ctx.closePath();
      ctx.stroke();
    }
  }
}
h