Removed workarounf for title labels

src/MusicalScore/Graphical/VexFlow/VexFlowMusicSheetDrawer.ts

@@ -13,17 +13,15 @@ export class VexFlowMusicSheetDrawer extends MusicSheetDrawer {
     private renderer: Vex.Flow.Renderer;
     private vfctx: Vex.Flow.CanvasContext;
     private ctx: CanvasRenderingContext2D;
-    private titles: HTMLElement;
     private zoom: number = 1.0;
 
-    constructor(titles: HTMLElement, canvas: HTMLCanvasElement, isPreviewImageDrawer: boolean = false) {
+    constructor(canvas: HTMLCanvasElement, isPreviewImageDrawer: boolean = false) {
         super(new VexFlowTextMeasurer(), isPreviewImageDrawer);
         this.renderer = new Vex.Flow.Renderer(canvas, Vex.Flow.Renderer.Backends.CANVAS);
         this.vfctx = this.renderer.getContext();
         // The following is a hack to retrieve the actual canvas' drawing context
         // Not supposed to work forever....
         this.ctx = (this.vfctx as any).vexFlowCanvasContext;
-        this.titles = titles;
     }
 
     /**
@@ -77,20 +75,6 @@ export class VexFlowMusicSheetDrawer extends MusicSheetDrawer {
      */
     protected renderLabel(graphicalLabel: GraphicalLabel, layer: number, bitmapWidth: number,
                           bitmapHeight: number, heightInPixel: number, screenPosition: PointF2D): void {
-        // if (screenPosition.y < 0) {
-        //     // Temportary solution for title labels
-        //     let div: HTMLElement = document.createElement("div");
-        //     div.style.fontSize = (graphicalLabel.Label.fontHeight * this.zoom * 10.0) + "px";
-        //     //span.style.width = (bitmapWidth * this.zoom * 1.1) + "px";
-        //     //span.style.height = (bitmapHeight * this.zoom * 1.1) + "px";
-        //     //span.style.overflow = "hidden";
-        //     div.style.fontFamily = "Times New Roman";
-        //     //span.style.marginLeft = (screenPosition.x * this.zoom) + "px";
-        //     div.style.textAlign = "center";
-        //     div.appendChild(document.createTextNode(graphicalLabel.Label.text));
-        //     this.titles.appendChild(div);
-        //     return;
-        // }
         let ctx: CanvasRenderingContext2D = (this.vfctx as any).vexFlowCanvasContext;
         let old: string = ctx.font;
         ctx.font = VexFlowConverter.font(

src/OSMD/OSMD.ts

@@ -33,16 +33,14 @@ export class OSMD {
             throw new Error("Please pass a valid div container to OSMD");
         }
         // Create the elements inside the container
-        this.heading = document.createElement("div");
         this.canvas = document.createElement("canvas");
         this.canvas.style.zIndex = "0";
         let inner: HTMLElement = document.createElement("div");
         inner.style.position = "relative";
-        this.container.appendChild(this.heading);
         inner.appendChild(this.canvas);
         this.container.appendChild(inner);
         // Create the drawer
-        this.drawer = new VexFlowMusicSheetDrawer(this.heading, this.canvas);
+        this.drawer = new VexFlowMusicSheetDrawer(this.canvas);
         // Create the cursor
         this.cursor = new Cursor(inner, this);
         if (autoResize) {
@@ -54,7 +52,6 @@ export class OSMD {
     public zoom: number = 1.0;
 
     private container: HTMLElement;
-    private heading: HTMLElement;
     private canvas: HTMLCanvasElement;
     private sheet: MusicSheet;
     private drawer: VexFlowMusicSheetDrawer;
@@ -124,7 +121,6 @@ export class OSMD {
      * Render the music sheet in the container
      */
     public render(): void {
-        this.resetHeadings();
         if (!this.graphic) {
             throw new Error("OSMD: Before rendering a music sheet, please load a MusicXML file");
         }
@@ -152,15 +148,6 @@ export class OSMD {
     }
 
     /**
-     * Clear all the titles from the headings element
-     */
-    private resetHeadings(): void {
-        while (this.heading.firstChild) {
-            this.heading.removeChild(this.heading.firstChild);
-        }
-    }
-
-    /**
      * Initialize this object to default values
      * FIXME: Probably unnecessary
      */
@@ -169,7 +156,6 @@ export class OSMD {
         this.sheet = undefined;
         this.graphic = undefined;
         this.zoom = 1.0;
-        this.resetHeadings();
         this.canvas.width = 0;
         this.canvas.height = 0;
     }

test/MusicalScore/Graphical/VexFlow/VexFlowMusicSheetDrawer.ts

@@ -17,24 +17,31 @@ describe("VexFlow Music Sheet Drawer", () => {
         chai.expect(partwise).to.not.be.undefined;
         let calc: VexFlowMusicSheetCalculator = new VexFlowMusicSheetCalculator();
         let reader: MusicSheetReader = new MusicSheetReader();
-        let sheet: MusicSheet = reader.createMusicSheet(new IXmlElement(partwise), "path");
+        let sheet: MusicSheet = reader.createMusicSheet(new IXmlElement(partwise), "** missing path **");
         let gms: GraphicalMusicSheet = new GraphicalMusicSheet(sheet, calc);
-        gms.Cursors.push(gms.calculateCursorLineAtTimestamp(new Fraction(), OutlineAndFillStyleEnum.PlaybackCursor));
 
-        // Create heading in the test page
-        let h1: Element = document.createElement("h1");
-        h1.textContent = "VexFlowMusicSheetDrawer Test Output";
-        document.body.appendChild(h1);
         // Create the canvas in the document:
-        let titles: HTMLElement = document.createElement("div");
-        document.body.appendChild(titles);
         let canvas: HTMLCanvasElement = document.createElement("canvas");
-        document.body.appendChild(canvas);
-        (new VexFlowMusicSheetDrawer(titles, canvas)).drawSheet(gms);
-        // Clean up document.body
-        document.body.removeChild(h1);
-        document.body.removeChild(titles);
-        document.body.removeChild(canvas);
+        let drawer: VexFlowMusicSheetDrawer = new VexFlowMusicSheetDrawer(canvas);
+        drawer.drawSheet(gms);
+        done();
+    });
+
+    it("With cursor (as rectangle)", (done: MochaDone) => {
+        let score: Document = TestUtils.getScore("MuzioClementi_SonatinaOpus36No1_Part1");
+        chai.expect(score).to.not.be.undefined;
+        let partwise: Element = TestUtils.getPartWiseElement(score);
+        chai.expect(partwise).to.not.be.undefined;
+        let calc: VexFlowMusicSheetCalculator = new VexFlowMusicSheetCalculator();
+        let reader: MusicSheetReader = new MusicSheetReader();
+        let sheet: MusicSheet = reader.createMusicSheet(new IXmlElement(partwise), "** missing path **");
+        let gms: GraphicalMusicSheet = new GraphicalMusicSheet(sheet, calc);
+        gms.Cursors.push(gms.calculateCursorLineAtTimestamp(new Fraction(0, 4), OutlineAndFillStyleEnum.PlaybackCursor));
+
+        // Create the canvas in the document:
+        let canvas: HTMLCanvasElement = document.createElement("canvas");
+        let drawer: VexFlowMusicSheetDrawer = new VexFlowMusicSheetDrawer(canvas);
+        drawer.drawSheet(gms);
         done();
     });