abcjs 6.5.2 → 6.6.0

package/src/synth/abc_midi_sequencer.js

@@ -2,12 +2,13 @@
 
 var sequence;
 var parseCommon = require("../parse/abc_common");
+var Repeats = require("./repeats");
 
 (function() {
 	"use strict";
 
 	var measureLength = 1; // This should be set by the meter, but just in case that is missing, we'll take a guess.
-	// The abc is provided to us line by line. It might have repeats in it. We want to re arrange the elements to
+	// The abc is provided to us line by line. It might have repeats in it. We want to rearrange the elements to
 	// be an array of voices with all the repeats embedded, and no lines. Then it is trivial to go through the events
 	// one at a time and turn it into midi.
 
@@ -142,8 +143,7 @@ var parseCommon = require("../parse/abc_common");
 		var tempoChanges = {};
 		tempoChanges["0"] = { el_type: 'tempo', qpm: qpm, timing: 0 };
 		var currentVolume;
-		var startRepeatPlaceholder = []; // There is a place holder for each voice.
-		var skipEndingPlaceholder = []; // This is the place where the first ending starts.
+		var repeats = []
 		var startingDrumSet = false;
 		var lines = abctune.lines; //abctune.deline(); TODO-PER: can switch to this, then simplify the loops below.
 		for (var i = 0; i < lines.length; i++) {
@@ -166,6 +166,7 @@ var parseCommon = require("../parse/abc_common");
 							var voiceName = getTrackTitle(line.staff, voiceNumber);
 							if (voiceName)
 								voices[voiceNumber].unshift({el_type: "name", trackName: voiceName});
+							repeats[voiceNumber] = new Repeats(voices[voiceNumber])
 						}
 						// Negate any transposition for the percussion staff.
 						if (transpose && staff.clef.type === "perc")
@@ -316,31 +317,7 @@ var parseCommon = require("../parse/abc_common");
 										voices[voiceNumber].push({ el_type: 'bar' }); // We need the bar marking to reset the accidentals.
 									setDynamics(elem);
 									noteEventsInBar = 0;
-									// figure out repeats and endings --
-									// The important part is where there is a start repeat, and end repeat, or a first ending.
-									var endRepeat = (elem.type === "bar_right_repeat" || elem.type === "bar_dbl_repeat");
-									var startEnding = (elem.startEnding === '1');
-									var startRepeat = (elem.type === "bar_left_repeat" || elem.type === "bar_dbl_repeat" || elem.type === "bar_right_repeat");
-									if (endRepeat) {
-										var s = startRepeatPlaceholder[voiceNumber];
-										if (!s) s = 0; // If there wasn't a left repeat, then we repeat from the beginning.
-										var e = skipEndingPlaceholder[voiceNumber];
-										if (!e) e = voices[voiceNumber].length; // If there wasn't a first ending marker, then we copy everything.
-										// duplicate each of the elements - this has to be a deep copy.
-										for (var z = s; z < e; z++) {
-											var item = Object.assign({},voices[voiceNumber][z]);
-											if (item.pitches)
-												item.pitches = parseCommon.cloneArray(item.pitches);
-											voices[voiceNumber].push(item);
-										}
-										// reset these in case there is a second repeat later on.
-										skipEndingPlaceholder[voiceNumber] = undefined;
-										startRepeatPlaceholder[voiceNumber] = undefined;
-									}
-									if (startEnding)
-										skipEndingPlaceholder[voiceNumber] = voices[voiceNumber].length;
-									if (startRepeat)
-										startRepeatPlaceholder[voiceNumber] = voices[voiceNumber].length;
+									repeats[voiceNumber].addBar(elem, voiceNumber)
 									rhythmHeadThisBar = false;
 									break;
 								case 'style':
@@ -524,6 +501,9 @@ var parseCommon = require("../parse/abc_common");
 				}
 			}
 		}
+		for (var r = 0; r < repeats.length; r++)
+			voices[r] = repeats[r].resolveRepeats()
+
 		// If there are tempo changes, make sure they are in all the voices. This must be done post process because all the elements in all the voices need to be created first.
 		insertTempoChanges(voices, tempoChanges);
 
@@ -647,19 +627,29 @@ var parseCommon = require("../parse/abc_common");
 		switch (element.type) {
 			case "common_time":
 				meter = { el_type: 'meter', num: 4, den: 4 };
+				measureLength = 4/4
 				break;
 			case "cut_time":
 				meter = { el_type: 'meter', num: 2, den: 2 };
+				measureLength = 2/2
 				break;
 			case "specified":
 				// TODO-PER: only taking the first meter, so the complex meters are not handled.
-				meter = { el_type: 'meter', num: element.value[0].num, den: element.value[0].den };
+				let num = 0
+				if (element.value && element.value.length > 0 && element.value[0].num.indexOf('+') > 0) {
+					var parts = element.value[0].num.split('+')
+					for (var i = 0; i < parts.length; i++)
+						num += parseInt(parts[i],10)
+				} else
+					num = parseInt(element.value[0].num, 10);
+				meter = { el_type: 'meter', num: num, den: element.value[0].den };
+				measureLength = num / parseInt(element.value[0].den,10)
 				break;
 			default:
 				// This should never happen.
 				meter = { el_type: 'meter' };
+				measureLength = 1
 		}
-		measureLength = meter.num/meter.den;
 		return meter;
 	}
 

package/src/synth/create-synth.js

@@ -116,7 +116,7 @@ function CreateSynth() {
 			self.flattened = options.visualObj.setUpAudio(params);
 			var meter = options.visualObj.getMeterFraction();
 			if (meter.den)
-				self.meterSize = options.visualObj.getMeterFraction().num / options.visualObj.getMeterFraction().den;
+				self.meterSize = meter.num / meter.den;
 			self.pickupLength = options.visualObj.getPickupLength()
 		} else if (options.sequence)
 			self.flattened = options.sequence;

package/src/synth/repeats.js

@@ -0,0 +1,200 @@
+const parseCommon = require("../parse/abc_common");
+
+function Repeats(voice) {
+	this.sections = [{type: 'startRepeat', index: -1}]
+
+	this.addBar = function(elem) {
+		// Record the "interesting" parts for analysis at the end.
+		var thisIndex = voice.length - 1
+		var isStartRepeat = elem.type === "bar_left_repeat" || elem.type === "bar_dbl_repeat"
+		var isEndRepeat = elem.type === "bar_right_repeat" || elem.type === "bar_dbl_repeat"
+		var startEnding = elem.startEnding ? startEndingNumbers(elem.startEnding) : undefined
+		if (isEndRepeat)
+			this.sections.push({type:"endRepeat", index: thisIndex})
+		if (isStartRepeat)
+			this.sections.push({type:"startRepeat", index: thisIndex})
+		if (startEnding)
+			this.sections.push({type:"startEnding", index: thisIndex, endings: startEnding})
+	}
+
+	this.resolveRepeats = function() {
+		// this.sections contain all the interesting bars - start and end repeats.
+		var e
+
+		// There may be one last set of events after the last interesting bar, so capture that now.
+		var lastSection = this.sections[this.sections.length-1]
+		var lastElement = voice.length-1
+		if (lastSection.type === 'startRepeat')
+			lastSection.end = lastElement
+		else if (lastSection.index+1 < lastElement)
+			this.sections.push({type: "startRepeat", index: lastSection.index+1})
+
+		// console.log(voice.map((el,index) => {
+		// 	return JSON.stringify({i: index, t: el.el_type, p: el.pitches ? el.pitches[0].name: undefined})
+		// }).join("\n"))
+
+		// console.log(this.sections.map(s => JSON.stringify(s)).join("\n"))
+		if (this.sections.length < 2)
+			return voice // If there are no repeats then don't bother copying anything
+
+		// Go through all the markers and turn that into an array of sets of sections in order.
+		// The output is repeatInstructions. If "endings" is not present, then the common section should just
+		// be copied once. If "endings" is present but is empty, that means it is a plain repeat without
+		// endings so the common section is copied twice. If "endings" contains items, then copy the
+		// common section followed by each ending in turn. If the last item in "endings" is -1, then
+		// the common section should be copied one more time but there isn't a corresponding ending for it.
+		var repeatInstructions = [] // { common: { start: number, end: number }, endings: Array<{start:number, end:number> }
+		var currentRepeat = null
+		for (var i = 0; i < this.sections.length; i++) {
+			var section = this.sections[i]
+			//var end = i < this.sections.length-1 ? this.sections[i+1].index : lastElement
+			switch (section.type) {
+				case "startRepeat":
+					if (currentRepeat) {
+						if (!currentRepeat.common.end)
+							currentRepeat.common.end = section.index
+						if (currentRepeat.endings) {
+							for (e = 0; e < currentRepeat.endings.length; e++) {
+								if (currentRepeat.endings[e] && !currentRepeat.endings[e].end && currentRepeat.endings[e].start !== section.index)
+									currentRepeat.endings[e].end = section.index
+							}
+						}
+						// If the last event was an end repeat, then there is one more repeat of just the common area. (Only when there are ending markers - otherwise it is already taken care of.)
+						if (this.sections[i-1].type === 'endRepeat' && currentRepeat.endings && currentRepeat.endings.length)
+							currentRepeat.endings[currentRepeat.endings.length] = { start: -1, end: -1}
+
+						repeatInstructions.push(currentRepeat)
+					}
+
+					// if there is a gap between the last event and this start, then
+					// insert those items.
+					if (currentRepeat) {
+						var lastUsed = currentRepeat.common.end
+						if (currentRepeat.endings) {
+							for (e = 0; e < currentRepeat.endings.length; e++) {
+								if (currentRepeat.endings[e])
+									lastUsed = Math.max(lastUsed, currentRepeat.endings[e].end)
+							}
+						}
+
+						if (lastUsed < section.index - 1) {
+							console.log("gap", voice.slice(lastUsed+1, section.index))
+							repeatInstructions.push({common: {start: lastUsed+1, end: section.index}})
+						}
+					}
+					currentRepeat = { common: { start: section.index} }
+					break;
+				case "startEnding": {
+					if (currentRepeat) {
+						if (!currentRepeat.common.end)
+							currentRepeat.common.end = section.index
+						if (!currentRepeat.endings)
+							currentRepeat.endings = []
+						for (e = 0; e < section.endings.length; e++)
+							currentRepeat.endings[section.endings[e]] = {start: section.index+1}
+					}
+					break;
+				}
+				case "endRepeat":
+					if (currentRepeat) {
+						if (!currentRepeat.endings)
+							currentRepeat.endings = []
+						if (currentRepeat.endings.length > 0) {
+							for (e = 0; e < currentRepeat.endings.length; e++) {
+								if (currentRepeat.endings[e] && !currentRepeat.endings[e].end)
+									currentRepeat.endings[e].end = section.index
+							}
+						}
+						if (!currentRepeat.common.end)
+							// This is a repeat that doesn't have first and second endings
+							currentRepeat.common.end = section.index
+					}
+					break;
+			}
+		}
+		if (currentRepeat) {
+			if (!currentRepeat.common.end)
+				currentRepeat.common.end = lastElement
+			if (currentRepeat.endings) {
+				for (e = 0; e < currentRepeat.endings.length; e++) {
+					if (currentRepeat.endings[e] && !currentRepeat.endings[e].end)
+						currentRepeat.endings[e].end = lastElement
+				}
+			}
+			repeatInstructions.push(currentRepeat)
+		}
+		// for (var x = 0; x < repeatInstructions.length; x++) {
+		// 	console.log(JSON.stringify(repeatInstructions[x]))
+		// }
+
+		var output = []
+		var lastEnd = -1
+		for (var r = 0; r < repeatInstructions.length; r++) {
+			var instructions = repeatInstructions[r]
+			if (!instructions.endings) {
+				duplicateSpan(voice, output, instructions.common.start, instructions.common.end)
+			} else if (instructions.endings.length === 0) {
+				// this is when there is no endings specified - it is just a repeat
+				duplicateSpan(voice, output, instructions.common.start, instructions.common.end)
+				duplicateSpan(voice, output, instructions.common.start, instructions.common.end)
+			} else {
+				for (e = 0; e < instructions.endings.length; e++) {
+					var ending = instructions.endings[e]
+					if (ending) { // this is a sparse array so skip the empty ones
+						duplicateSpan(voice, output, instructions.common.start, instructions.common.end)
+						if (ending.start > 0) {
+							duplicateSpan(voice, output, ending.start, ending.end)
+						}
+						lastEnd = Math.max(lastEnd, ending.end)
+					}
+				}
+			}
+		}
+		return output
+	}
+}
+
+function duplicateSpan(input, output, start, end) {
+	//console.log("dup", {start, end})
+	for (var i = start; i <= end; i++) {
+		output.push(duplicateItem(input[i]))
+	}
+}
+
+function duplicateItem(src) {
+	var item = Object.assign({},src);
+	if (item.pitches)
+		item.pitches = parseCommon.cloneArray(item.pitches);
+	return item
+}
+
+function startEndingNumbers(startEnding) {
+	// The ending can be in four different types: "random-string", "number", "number-number", "number,number"
+	// If we don't get a number out of it then we will just skip the ending - we don't know what to do with it.
+	var nums = []
+	var ending, endings, i;
+	if (startEnding.indexOf(',') > 0) {
+		endings = startEnding.split(',')
+		for (i = 0; i < endings.length; i++) {
+			ending = parseInt(endings[i],10)
+			if (ending > 0) {
+				nums.push(ending)
+			}
+		}
+	} else if (startEnding.indexOf('-') > 0) {
+		endings = startEnding.split('-')
+		var se = parseInt(endings[0],10)
+		var ee = parseInt(endings[1],10)
+		for (i = se; i <= ee; i++) {
+			nums.push(i)
+		}
+	} else {
+		ending = parseInt(startEnding,10)
+		if (ending > 0) {
+			nums.push(ending)
+		}
+	}
+	return nums
+}
+
+module.exports = Repeats;

package/src/write/creation/abstract-engraver.js

@@ -348,8 +348,11 @@ AbstractEngraver.prototype.createABCElement = function (isFirstStaff, isSingleLi
 			elemset[0] = abselem;
 			break;
 		case "tempo":
+			// MAE 20 Nov 2025 For %%printtempo after initial header
 			var abselem3 = new AbsoluteElement(elem, 0, 0, 'tempo', this.tuneNumber);
-			abselem3.addFixedX(new TempoElement(elem, this.tuneNumber, createNoteHead));
+			if (!elem.suppress){
+				abselem3.addFixedX(new TempoElement(elem, this.tuneNumber, createNoteHead));
+			}
 			elemset[0] = abselem3;
 			break;
 		case "style":

package/src/write/draw/chord-grid.js

@@ -0,0 +1,252 @@
+const printSymbol = require("./print-symbol");
+const printStem = require("./print-stem");
+
+function drawChordGrid(renderer, parts, leftMargin, pageWidth, fonts) {
+	const chordFont = fonts.gchordfont
+	const partFont = fonts.partsfont
+	const annotationFont = fonts.annotationfont
+	const endingFont = fonts.repeatfont
+	const textFont = fonts.textfont
+	const subtitleFont = fonts.subtitlefont
+
+	const ROW_HEIGHT = 50
+	const ENDING_HEIGHT = 10
+	const ANNOTATION_HEIGHT = 14
+	const PART_MARGIN_TOP = 10
+	const PART_MARGIN_BOTTOM = 20
+	const TEXT_MARGIN = 16
+
+	parts.forEach(part => {
+		switch (part.type) {
+			case "text": {
+				text(renderer, part.text, leftMargin, renderer.y, 16, textFont, null, null, false )
+				renderer.moveY(TEXT_MARGIN)
+			}
+				break
+			case "subtitle": {
+				text(renderer, part.subtitle, leftMargin, renderer.y+PART_MARGIN_TOP, 20, subtitleFont, null, "abcjs-subtitle", false )
+				renderer.moveY(PART_MARGIN_BOTTOM)
+			}
+				break
+			case "part":
+				if (part.lines.length > 0) {
+					text(renderer, part.name, leftMargin, renderer.y+PART_MARGIN_TOP, 20, subtitleFont, part.name, "abcjs-part", false )
+
+					renderer.moveY(PART_MARGIN_BOTTOM)
+					const numCols = part.lines[0].length
+					const colWidth = pageWidth / numCols
+					part.lines.forEach((line, lineNum) => {
+						let hasEnding = false
+						let hasAnnotation = false
+						line.forEach(measure => {
+							if (measure.ending)
+								hasEnding = true
+							if (measure.annotations && measure.annotations.length > 0)
+								hasAnnotation = true
+						})
+						const extraTop = hasAnnotation ? ANNOTATION_HEIGHT : hasEnding ? ENDING_HEIGHT : 0
+						line.forEach((measure, barNum) => {
+							const RECT_WIDTH = 1
+							if (!measure.noBorder) {
+								renderer.paper.rect({x: leftMargin + barNum * colWidth, y: renderer.y, width: colWidth, height: extraTop + ROW_HEIGHT})
+								renderer.paper.rect({x: leftMargin + barNum * colWidth + RECT_WIDTH, y: renderer.y + RECT_WIDTH, width: colWidth - RECT_WIDTH * 2, height: extraTop + ROW_HEIGHT - RECT_WIDTH * 2})
+								let repeatLeft = 0
+								let repeatRight = 0
+								const top = renderer.y
+								const left = leftMargin + colWidth * barNum
+								if (measure.hasStartRepeat) {
+									drawRepeat(renderer, left, top, top+ROW_HEIGHT+extraTop, true, extraTop)
+									repeatLeft = 12
+								}
+								if (measure.hasEndRepeat) {
+									drawRepeat(renderer, left+colWidth, top, top+ROW_HEIGHT+extraTop, false, extraTop)
+									repeatRight = 12
+								}
+
+								let endingWidth = 0
+								if (measure.ending) {
+									const endingEl = text(renderer, measure.ending, leftMargin + barNum * colWidth + 4, top + 10, 12, endingFont, null, null, false )
+									endingWidth = endingEl.getBBox().width + 4
+								}
+								drawMeasure(renderer, top, leftMargin+repeatLeft, colWidth, lineNum, barNum, measure.chord, chordFont, repeatLeft+repeatRight, ROW_HEIGHT, extraTop)
+								if (measure.annotations && measure.annotations.length > 0) {
+									drawAnnotations(renderer, top, leftMargin + barNum * colWidth +endingWidth, measure.annotations, annotationFont)
+								}
+								if (extraTop) {
+									renderer.paper.rectBeneath({x: leftMargin + barNum * colWidth, y: renderer.y, width: colWidth, height: extraTop, fill: '#e8e8e8', stroke: 'none'})
+								}
+							}
+						})
+						renderer.moveY(extraTop + ROW_HEIGHT)
+					})
+					renderer.moveY(PART_MARGIN_BOTTOM)
+				}
+				break;
+		}
+	})
+}
+
+function drawPercent(renderer, x, y, offset) {
+	var lineX1 = x - 10
+	var lineX2 = x + 10
+	var lineY1 = y + 10
+	var lineY2 = y - 10
+	var leftDotX = x - 10
+	var leftDotY = -renderer.yToPitch(offset) + 2
+	var rightDotX = x + 6.5
+	var rightDotY = -renderer.yToPitch(offset) -2.3
+
+	renderer.paper.lineToBack({x1: lineX1, x2: lineX2, y1: lineY1, y2: lineY2, 'stroke-width': '3px', 'stroke-linecap':"round"  })
+
+	printSymbol(renderer, leftDotX, leftDotY, "dots.dot", {
+		scalex: 1,
+		scaley: 1,
+		klass: "",
+		name: "dot"
+	});
+
+	printSymbol(renderer, rightDotX, rightDotY, "dots.dot", {
+		scalex: 1,
+		scaley: 1,
+		klass: "",
+		name: "dot"
+	});
+
+}
+
+function drawRepeat(renderer, x, y1, y2, isStart, offset) {
+	const lineX = isStart ? x+2 : x-4
+	const circleX = isStart ? x+9 : x-11
+
+	renderer.paper.openGroup({klass:'abcjs-repeat'})
+	printStem(renderer, lineX, 3 + renderer.lineThickness, y1, y2, null, "bar")
+
+	printSymbol(renderer, circleX, -renderer.yToPitch(offset)-4, "dots.dot", {
+		scalex: 1,
+		scaley: 1,
+		klass: "",
+		name: "dot"
+	});
+
+	printSymbol(renderer, circleX, -renderer.yToPitch(offset)-8, "dots.dot", {
+		scalex: 1,
+		scaley: 1,
+		klass: "",
+		name: "dot"
+	});
+	renderer.paper.closeGroup()
+}
+
+const symbols = {
+	'segno': "scripts.segno",
+	'coda': "scripts.coda",
+	"fermata": "scripts.ufermata",
+}
+
+function drawAnnotations(renderer, offset, left, annotations, annotationFont) {
+	left += 3
+	let el
+	for (let a = 0; a < annotations.length; a++) {
+		switch (annotations[a]) {
+			case 'segno':
+			case 'coda':
+			case "fermata": {
+				left += 12
+				el = printSymbol(renderer, left, -3, symbols[annotations[a]], {
+					scalex: 1,
+					scaley: 1,
+					//klass: renderer.controller.classes.generate(klass),
+					name: symbols[annotations[a]]
+				});
+				const box = el.getBBox()
+				left += box.width
+			}
+				break;
+			default:
+				text(renderer, annotations[a], left, offset + 12, 12, annotationFont, null, null, false )
+		}
+	}
+
+}
+
+function drawMeasure(renderer, offset, leftMargin, colWidth, lineNum, barNum, chords, chordFont, margin, height, extraTop) {
+	const left = leftMargin + colWidth * barNum
+	if (!chords[1] && !chords[2] && !chords[3])
+		drawSingleChord(renderer, left, offset+extraTop, colWidth-margin, height, chords[0], chordFont, extraTop)
+	else if (!chords[1] && !chords[3])
+		drawTwoChords(renderer, left, offset, colWidth-margin, height, chords[0], chords[2], chordFont, extraTop)
+	else
+		drawFourChords(renderer, left, offset, colWidth-margin, height, chords, chordFont, extraTop)
+}
+
+function renderChord(renderer, x, y, size, chord, font, maxWidth) {
+	const el = text(renderer, chord, x, y, size, font, null, "abcjs-chord", true)
+	let bb = el.getBBox()
+	let fontSize = size
+	while (bb.width > maxWidth && fontSize >= 14) {
+		fontSize -= 2
+		el.setAttribute('font-size', fontSize)
+		bb = el.getBBox()
+	}
+}
+
+const MAX_ONE_CHORD = 34
+const MAX_TWO_CHORDS = 26
+const MAX_FOUR_CHORDS = 20
+const TOP_MARGIN = -3
+
+function drawSingleChord(renderer, left, top, width, height, chord, font, extraTop) {
+	if (chord === '%')
+		drawPercent(renderer, left+width/2, top+height/2, extraTop+height/2)
+	else
+		renderChord(renderer, left+width/2, top+height/2+TOP_MARGIN, MAX_ONE_CHORD, chord, font, width)
+}
+
+function drawTwoChords(renderer, left, top, width, height, chord1, chord2, font, extraTop) {
+	renderer.paper.lineToBack({x1: left, x2: left+width, y1: top+height+extraTop, y2: top+2 })
+	renderChord(renderer, left+width/4, top+height/4+5+extraTop+TOP_MARGIN, MAX_TWO_CHORDS, chord1, font, width/2)
+	renderChord(renderer, left+3*width/4, top+3*height/4+extraTop+TOP_MARGIN, MAX_TWO_CHORDS, chord2, font, width/2)
+}
+
+function drawFourChords(renderer, left, top, width, height, chords, font, extraTop) {
+	const MARGIN = 3
+	renderer.paper.lineToBack({x1: left+MARGIN, x2: left+width-MARGIN, y1: top+height/2+extraTop, y2: top+height/2+extraTop })
+	renderer.paper.lineToBack({x1: left+width/2, x2: left+width/2, y1: top+MARGIN+extraTop, y2: top+height-MARGIN+extraTop })
+
+	if (chords[0])
+		renderChord(renderer, left+width/4, top+height/4+2+extraTop+TOP_MARGIN, MAX_FOUR_CHORDS, shortenChord(chords[0]), font, width / 2)
+	if (chords[1])
+		renderChord(renderer, left+3*width/4, top+height/4+2+extraTop+TOP_MARGIN, MAX_FOUR_CHORDS, shortenChord(chords[1]), font, width / 2)
+	if (chords[2])
+		renderChord(renderer, left+width/4, top+3*height/4+extraTop+TOP_MARGIN, MAX_FOUR_CHORDS, shortenChord(chords[2]), font, width / 2)
+	if (chords[3])
+		renderChord(renderer, left+3*width/4, top+3*height/4+extraTop+TOP_MARGIN, MAX_FOUR_CHORDS, shortenChord(chords[3]), font, width / 2)
+}
+
+function shortenChord(chord) {
+	if (chord === "No Chord")
+		return "N.C."
+	return chord
+}
+
+function text(renderer, str, x, y, size, font, dataName, klass, alignCenter) {
+	const attr = {
+		x: x,
+		y: y,
+		stroke:"none",
+		'font-size':size,
+		'font-style':font.style,
+		'font-family':font.face,
+		'font-weight':font.weight,
+		'text-decoration':font.decoration,
+	}
+	if (dataName)
+		attr['data-name'] = dataName
+	if (klass)
+		attr['class'] = klass
+	attr["text-anchor"] = alignCenter ? "middle" : "start"
+
+	return renderer.paper.text(str, attr, null, {"alignment-baseline": "middle"})
+}
+
+module.exports = drawChordGrid

package/src/write/draw/draw.js

@@ -3,8 +3,9 @@ var setPaperSize = require('./set-paper-size');
 var nonMusic = require('./non-music');
 var spacing = require('../helpers/spacing');
 var Selectables = require('./selectables');
+var drawChordGrid = require('./chord-grid');
 
-function draw(renderer, classes, abcTune, width, maxWidth, responsive, scale, selectTypes, tuneNumber, lineOffset) {
+function draw(renderer, classes, abcTune, width, maxWidth, responsive, scale, selectTypes, tuneNumber, lineOffset, chordGrid) {
 	var selectables = new Selectables(renderer.paper, selectTypes, tuneNumber);
 	var groupClasses = {}
 	if (classes.shouldAddClasses)
@@ -14,48 +15,60 @@ function draw(renderer, classes, abcTune, width, maxWidth, responsive, scale, se
 	nonMusic(renderer, abcTune.topText, selectables);
 	renderer.paper.closeGroup()
 	renderer.moveY(renderer.spacing.music);
+
+	let suppressMusic = false
+	if (chordGrid && abcTune.chordGrid) {
+		drawChordGrid(renderer, abcTune.chordGrid, renderer.padding.left, width, abcTune.formatting)
+		if (chordGrid === 'noMusic')
+			suppressMusic = true
+	}
+
 	var staffgroups = [];
 	var nStaves = 0;
-	for (var line = 0; line < abcTune.lines.length; line++) {
-		classes.incrLine();
-		var abcLine = abcTune.lines[line];
-		if (abcLine.staff) {
-			// MAE 26 May 2025 - for incipits staff count limiting
-			nStaves++;
-			if (abcTune.formatting.maxStaves){
-				if (nStaves > abcTune.formatting.maxStaves){
-					break;
+	if (!suppressMusic) {
+		for (var line = 0; line < abcTune.lines.length; line++) {
+			classes.incrLine();
+			var abcLine = abcTune.lines[line];
+			if (abcLine.staff) {
+				// MAE 26 May 2025 - for incipits staff count limiting
+				nStaves++;
+				if (abcTune.formatting.maxStaves) {
+					if (nStaves > abcTune.formatting.maxStaves) {
+						break;
+					}
 				}
+				if (classes.shouldAddClasses)
+					groupClasses.klass = "abcjs-staff-wrapper abcjs-l" + classes.lineNumber
+				renderer.paper.openGroup(groupClasses)
+				if (abcLine.vskip) {
+					renderer.moveY(abcLine.vskip);
+				}
+				if (staffgroups.length >= 1)
+					addStaffPadding(renderer, renderer.spacing.staffSeparation, staffgroups[staffgroups.length - 1], abcLine.staffGroup);
+				var staffgroup = engraveStaffLine(renderer, abcLine.staffGroup, selectables, line);
+				staffgroup.line = lineOffset + line; // If there are non-music lines then the staffgroup array won't line up with the line array, so this keeps track.
+				staffgroups.push(staffgroup);
+				renderer.paper.closeGroup()
+			} else if (abcLine.nonMusic) {
+				if (classes.shouldAddClasses)
+					groupClasses.klass = "abcjs-non-music"
+				renderer.paper.openGroup(groupClasses)
+				nonMusic(renderer, abcLine.nonMusic, selectables);
+				renderer.paper.closeGroup()
 			}
-			if (classes.shouldAddClasses)
-				groupClasses.klass = "abcjs-staff-wrapper abcjs-l" + classes.lineNumber
-			renderer.paper.openGroup(groupClasses)
-			if (abcLine.vskip) {
-				renderer.moveY(abcLine.vskip);
-			}
-			if (staffgroups.length >= 1)
-				addStaffPadding(renderer, renderer.spacing.staffSeparation, staffgroups[staffgroups.length - 1], abcLine.staffGroup);
-			var staffgroup = engraveStaffLine(renderer, abcLine.staffGroup, selectables, line);
-			staffgroup.line = lineOffset + line; // If there are non-music lines then the staffgroup array won't line up with the line array, so this keeps track.
-			staffgroups.push(staffgroup);
-			renderer.paper.closeGroup()
-		} else if (abcLine.nonMusic) {
-			if (classes.shouldAddClasses)
-				groupClasses.klass = "abcjs-non-music"
-			renderer.paper.openGroup(groupClasses)
-			nonMusic(renderer, abcLine.nonMusic, selectables);
-			renderer.paper.closeGroup()
 		}
 	}
 
 	classes.reset();
-	if (abcTune.bottomText && abcTune.bottomText.rows && abcTune.bottomText.rows.length > 0) {
-		if (classes.shouldAddClasses)
-			groupClasses.klass = "abcjs-meta-bottom"
-		renderer.paper.openGroup(groupClasses)
-		renderer.moveY(24); // TODO-PER: Empirically discovered. What variable should this be?
-		nonMusic(renderer, abcTune.bottomText, selectables);
-		renderer.paper.closeGroup()
+	if (!suppressMusic) {
+		if (abcTune.bottomText && abcTune.bottomText.rows && abcTune.bottomText.rows.length > 0) {
+			if (classes.shouldAddClasses)
+				groupClasses.klass = "abcjs-meta-bottom"
+			renderer.paper.openGroup(groupClasses)
+			renderer.moveY(24); // TODO-PER: Empirically discovered. What variable should this be?
+			nonMusic(renderer, abcTune.bottomText, selectables);
+			renderer.paper.closeGroup()
+		}
 	}
 	setPaperSize(renderer, maxWidth, scale, responsive);
 	return { staffgroups: staffgroups, selectables: selectables.getElements() };