Add a New line button for another fingering row.

Each line keeps its own charts and staff. Save PNG stacks every line. Version 0.2.3.

Co-authored-by: catpersonisme <catpersonisme@gmail.com>

tests/converter.test.ts

@@ -10,10 +10,13 @@ import {
   dropIndexFromPoint,
   insertNote,
   LINE_EXAMPLES,
+  appendLine,
   moveNote,
   neighborDuration,
+  removeLine,
   removeNote,
   setDuration,
+  transferNote,
 } from "@/lib/line";
 import {
   ledgerIndexes,
@@ -23,7 +26,7 @@ import {
   stemDown,
 } from "@/lib/notation";
 import { parsePitch } from "@/lib/pitch";
-import { pngFilename, pngItemFromNote, pngLayout } from "@/lib/png-layout";
+import { pngFilename, pngItemFromNote, pngLayout, pngStackLayout } from "@/lib/png-layout";
 import { extraBeatArrows } from "@/lib/score";
 
 const BAROQUE: Record<string, string> = {
@@ -167,6 +170,29 @@ describe("fingering line", () => {
     expect(pngFilename("   ")).toBe("line.png");
   });
 
+  it("appends a line and can move a note onto it", () => {
+    const top = { id: "a", notes: [createNote("C5", quarter, "c"), createNote("E5", quarter, "e")] };
+    const next = appendLine([top], "b");
+    expect(next.map((line) => line.id)).toEqual(["a", "b"]);
+    expect(next[1].notes).toEqual([]);
+    expect(next[0].notes.map((note) => note.pitch)).toEqual(["C5", "E5"]);
+    const moved = transferNote(next, "a", "e", "b", 0);
+    expect(moved[0].notes.map((note) => note.pitch)).toEqual(["C5"]);
+    expect(moved[1].notes.map((note) => note.pitch)).toEqual(["E5"]);
+    expect(removeLine(moved, "b").map((line) => line.id)).toEqual(["a"]);
+    expect(removeLine([{ id: "a", notes: [] }], "a")).toHaveLength(1);
+  });
+
+  it("stacks every fingering line in the PNG", () => {
+    const top = [pngItemFromNote(createNote("C5", quarter, "c"))];
+    const bottom = [pngItemFromNote(createNote("G5", quarter, "g"))];
+    const one = pngStackLayout([top], "Your line");
+    const two = pngStackLayout([top, bottom], "Your line");
+    expect(two.rows).toHaveLength(2);
+    expect(two.height).toBeGreaterThan(one.height);
+    expect(pngLayout(top, "Your line").glyphHeight).toBe(one.rows[0].glyphHeight);
+  });
+
   it("steps duration without skipping a preset", () => {
     expect(neighborDuration(1, 1)?.quarters).toBe(1.5);
     expect(neighborDuration(1, -1)?.quarters).toBe(0.75);