abcjs 6.6.1 → 6.6.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "abcjs",
-  "version": "6.6.1",
+  "version": "6.6.3",
   "description": "Renderer for abc music notation",
   "main": "index.js",
   "types": "types/index.d.ts",

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

@@ -718,8 +718,9 @@ AbstractEngraver.prototype.addNoteToAbcElement = function (abselem, elem, dot, s
 		}
 
 		var hasStem = !nostem && durlog <= -1;
+		var chordPos = pp > 1 ? p+1 : null
 		var ret = createNoteHead(abselem, c, elem.pitches[p],
-			{ dir: dir, extrax: -roomTaken, flag: flag, dot: dot, dotshiftx: dotshiftx, scale: this.voiceScale, accidentalSlot: accidentalSlot, shouldExtendStem: !stemdir, printAccidentals: !voice.isPercussion });
+			{ dir: dir, extrax: -roomTaken, flag: flag, dot: dot, dotshiftx: dotshiftx, scale: this.voiceScale, accidentalSlot: accidentalSlot, shouldExtendStem: !stemdir, printAccidentals: !voice.isPercussion, chordPos: chordPos });
 		symbolWidth = Math.max(glyphs.getSymbolWidth(c), symbolWidth);
 		abselem.extraw -= ret.extraLeft;
 		noteHead = ret.notehead;
@@ -765,7 +766,7 @@ AbstractEngraver.prototype.addNoteToAbcElement = function (abselem, elem, dot, s
 	return { noteHead: noteHead, roomTaken: roomTaken, roomTakenRight: roomTakenRight, min: min, additionalLedgers: additionalLedgers, dir: dir, symbolWidth: symbolWidth };
 };
 
-AbstractEngraver.prototype.addLyric = function (abselem, elem) {
+AbstractEngraver.prototype.addLyric = function (abselem, elem, voiceNumber) {
 	var lyricStr = "";
 	elem.lyric.forEach(function (ly) {
 		var div = ly.divider === ' ' ? "" : ly.divider;
@@ -773,7 +774,7 @@ AbstractEngraver.prototype.addLyric = function (abselem, elem) {
 	});
 	var lyricDim = this.getTextSize.calc(lyricStr, 'vocalfont', "lyric");
 	var position = elem.positioning ? elem.positioning.vocalPosition : 'below';
-	abselem.addCentered(new RelativeElement(lyricStr, 0, lyricDim.width, undefined, { type: "lyric", position: position, height: lyricDim.height / spacing.STEP, dim: this.getTextSize.attr('vocalfont', "lyric") }));
+	abselem.addCentered(new RelativeElement(lyricStr, 0, lyricDim.width, undefined, { type: "lyric", position: position, height: lyricDim.height / spacing.STEP, dim: this.getTextSize.attr('vocalfont', "lyric"), voiceNumber: voiceNumber }));
 };
 
 AbstractEngraver.prototype.createNote = function (elem, nostem, isSingleLineStaff, voice) { //stem presence: true for drawing stemless notehead
@@ -827,7 +828,7 @@ AbstractEngraver.prototype.createNote = function (elem, nostem, isSingleLineStaf
 	}
 
 	if (elem.lyric !== undefined) {
-		this.addLyric(abselem, elem);
+		this.addLyric(abselem, elem, voice.voicenumber);
 	}
 
 	if (elem.gracenotes !== undefined) {

package/src/write/creation/create-note-head.js

@@ -13,6 +13,7 @@ var createNoteHead = function (abselem, c, pitchelem, options) {
 	var accidentalSlot = (options.accidentalSlot !== undefined) ? options.accidentalSlot : [];
 	var shouldExtendStem = (options.shouldExtendStem !== undefined) ? options.shouldExtendStem : false;
 	var printAccidentals = (options.printAccidentals !== undefined) ? options.printAccidentals : true;
+	var chordPos = options.chordPos
 
 	// TODO scale the dot as well
 	var pitch = pitchelem.verticalPos;
@@ -23,14 +24,14 @@ var createNoteHead = function (abselem, c, pitchelem, options) {
 	if (c === undefined)
 		abselem.addFixed(new RelativeElement("pitch is undefined", 0, 0, 0, { type: "debug" }));
 	else if (c === "") {
-		notehead = new RelativeElement(null, 0, 0, pitch);
+		notehead = new RelativeElement(null, 0, 0, pitch, {chordPos:chordPos});
 	} else {
 		var shiftheadx = headx;
 		if (pitchelem.printer_shift) {
 			var adjust = (pitchelem.printer_shift === "same") ? 1 : 0;
 			shiftheadx = (dir === "down") ? -glyphs.getSymbolWidth(c) * scale + adjust : glyphs.getSymbolWidth(c) * scale - adjust;
 		}
-		var opts = { scalex: scale, scaley: scale, thickness: glyphs.symbolHeightInPitches(c) * scale, name: pitchelem.name };
+		var opts = { scalex: scale, scaley: scale, thickness: glyphs.symbolHeightInPitches(c) * scale, name: pitchelem.name, chordPos: chordPos };
 		notehead = new RelativeElement(c, shiftheadx, glyphs.getSymbolWidth(c) * scale, pitch, opts);
 		notehead.stemDir = dir;
 		if (flag) {
@@ -44,12 +45,12 @@ var createNoteHead = function (abselem, c, pitchelem, options) {
 			}
 			//if (scale===1 && (dir==="down")?(pos>6):(pos<6)) pos=6;
 			var xdelta = (dir === "down") ? headx : headx + notehead.w - 0.6;
-			abselem.addRight(new RelativeElement(flag, xdelta, glyphs.getSymbolWidth(flag) * scale, pos, { scalex: scale, scaley: scale }));
+			abselem.addRight(new RelativeElement(flag, xdelta, glyphs.getSymbolWidth(flag) * scale, pos, { scalex: scale, scaley: scale, chordPos: chordPos }));
 		}
 		newDotShiftX = notehead.w + dotshiftx - 2 + 5 * dot;
 		for (; dot > 0; dot--) {
 			var dotadjusty = (1 - Math.abs(pitch) % 2); //PER: take abs value of the pitch. And the shift still happens on ledger lines.
-			abselem.addRight(new RelativeElement("dots.dot", notehead.w + dotshiftx - 2 + 5 * dot, glyphs.getSymbolWidth("dots.dot"), pitch + dotadjusty));
+			abselem.addRight(new RelativeElement("dots.dot", notehead.w + dotshiftx - 2 + 5 * dot, glyphs.getSymbolWidth("dots.dot"), pitch + dotadjusty, {chordPos:chordPos}));
 		}
 	}
 	if (notehead)
@@ -96,7 +97,7 @@ var createNoteHead = function (abselem, c, pitchelem, options) {
 			accidentalshiftx = (glyphs.getSymbolWidth(symb) * scale + 2);
 		}
 		var h = glyphs.symbolHeightInPitches(symb);
-		abselem.addExtra(new RelativeElement(symb, accPlace, glyphs.getSymbolWidth(symb), pitch, { scalex: scale, scaley: scale, top: pitch + h / 2, bottom: pitch - h / 2 }));
+		abselem.addExtra(new RelativeElement(symb, accPlace, glyphs.getSymbolWidth(symb), pitch, { scalex: scale, scaley: scale, top: pitch + h / 2, bottom: pitch - h / 2, chordPos: chordPos }));
 		extraLeft = glyphs.getSymbolWidth(symb) / 2; // TODO-PER: We need a little extra width if there is an accidental, but I'm not sure why it isn't the full width of the accidental.
 	}
 

package/src/write/creation/elements/relative-element.js

@@ -13,6 +13,7 @@ var RelativeElement = function RelativeElement(c, dx, w, pitch, opt) {
 	this.pitch2 = opt.pitch2;
 	this.linewidth = opt.linewidth;
 	this.klass = opt.klass;
+	this.chordPos = opt.chordPos;
 	this.anchor = opt.anchor ? opt.anchor : 'middle'
 	this.top = pitch;
 	if (this.pitch2 !== undefined && this.pitch2 > this.top) this.top = this.pitch2;
@@ -32,6 +33,8 @@ var RelativeElement = function RelativeElement(c, dx, w, pitch, opt) {
 		this.dim = opt.dim;
 	if (opt.position)
 		this.position = opt.position;
+	if (opt.voiceNumber !== undefined)
+		this.voiceNumber = opt.voiceNumber
 	this.height = opt.height ? opt.height : 4; // The +1 is to give a little bit of padding.
 	if (opt.top)
 		this.top = opt.top;

package/src/write/draw/absolute.js

@@ -20,6 +20,12 @@ function drawAbsolute(renderer, params, bartop, selectables, staffPos) {
 				if (child.type === "symbol" && child.c && child.c.indexOf('notehead') >= 0) {
 					el.setAttribute('class', 'abcjs-notehead')
 				}
+				if (el && child.chordPos && child.name.indexOf('flags.') !== 0) {
+					var klass = el.getAttribute("class")
+					if (klass) klass = klass + ' abcjs-chord-pos-'+child.chordPos
+					else klass = 'abcjs-chord-pos-'+child.chordPos
+					el.setAttribute('class', klass)
+				}
 		}
 	}
 	var klass = params.type;

package/src/write/draw/triplet.js

@@ -6,7 +6,7 @@ var roundNumber = require("./round-number");
 function drawTriplet(renderer, params, selectables) {
 	renderer.paper.openGroup({ klass: renderer.controller.classes.generate('triplet ' + params.durationClass), "data-name": "triplet" });
 	if (!params.hasBeam) {
-		drawBracket(renderer, params.anchor1.x, params.startNote, params.anchor2.x + params.anchor2.w, params.endNote);
+		drawBracket(renderer, params.anchor1.x, params.startNote, params.anchor2.x + params.anchor2.w, params.endNote, params.up);
 	}
 	// HACK: adjust the position of "3". It is too high in all cases so we fudge it by subtracting 1 here.
 	renderText(renderer, { x: params.xTextPos, y: renderer.calcY(params.yTextPos - 1), text: "" + params.number, type: 'tripletfont', anchor: "middle", centerVertically: true, noClass: true, name: "" + params.number }, true);
@@ -19,10 +19,10 @@ function drawLine(l, t, r, b) {
 	return sprintf("M %f %f L %f %f", roundNumber(l), roundNumber(t), roundNumber(r), roundNumber(b));
 }
 
-function drawBracket(renderer, x1, y1, x2, y2) {
+function drawBracket(renderer, x1, y1, x2, y2, up) {
 	y1 = renderer.calcY(y1);
 	y2 = renderer.calcY(y2);
-	var bracketHeight = 5;
+	var bracketHeight = up ? 5 : -5;
 
 	// Draw vertical lines at the beginning and end
 	var pathString = "";

package/src/write/layout/beam.js

@@ -143,6 +143,27 @@ function createStems(elems, asc, beam, dy, mainNote) {
 
 }
 
+
+// Helper function to find the next non-rest element in the array
+function findNextNonRest(elems, startIndex) {
+	for (var k = startIndex + 1; k < elems.length; k++) {
+		if (!elems[k].abcelem.rest) {
+			return k;
+		}
+	}
+	return -1; // No non-rest element found
+}
+
+// Helper function to find the previous non-rest element in the array
+function findPrevNonRest(elems, startIndex) {
+	for (var k = startIndex - 1; k >= 0; k--) {
+		if (!elems[k].abcelem.rest) {
+			return k;
+		}
+	}
+	return -1; // No non-rest element found
+}
+
 function createAdditionalBeams(elems, asc, beam, isGrace, dy) {
 	var beams = [];
 	var auxBeams = [];  // auxbeam will be {x, y, durlog, single} auxbeam[0] should match with durlog=-4 (16th) (j=-4-durlog)
@@ -182,27 +203,36 @@ function createAdditionalBeams(elems, asc, beam, isGrace, dy) {
 		}
 
 		for (var j = auxBeams.length - 1; j >= 0; j--) {
-			if (i === elems.length - 1 || getDurlog(elems[i + 1].abcelem.duration) > (-j - 4)) {
+			// Find the next non-rest element to check if we should end the beam
+			var nextNonRestIndex = findNextNonRest(elems, i);
+			var shouldEndBeam = (nextNonRestIndex === -1) ||
+				(nextNonRestIndex < elems.length && getDurlog(elems[nextNonRestIndex].abcelem.duration) > (-j - 4));
 
+			if (shouldEndBeam) {
 				var auxBeamEndX = x;
 				var auxBeamEndY = bary + sy * (j + 1);
 
-
 				if (auxBeams[j].single) {
-					if(i === 0) {
+					var prevNonRestIndex = findPrevNonRest(elems, i);
+					var isFirstNote = (prevNonRestIndex === -1);
+					var isLastNote = (nextNonRestIndex === -1);
+
+					if (isFirstNote) {
 						// This is the first note in the group, always draw the beam to the right
 						auxBeamEndX = x + 5;
-					} else if (i === elems.length - 1) {
+					} else if (isLastNote) {
 						// This is the last note in the group, always draw the beam to the left
 						auxBeamEndX = x - 5;
 					} else {
-						// This is a middle note, check the note durations of the notes to the left and right
-						if(elems[i-1].duration === elems[i+1].duration) {
-						// The notes on either side are the same duration, alternate which side the beam goes to
-						auxBeamEndX = i%2 === 0 ? x + 5 : x - 5;
+						// This is a middle note, check the note durations of the notes to the left and right (skipping rests)
+						var prevDuration = elems[prevNonRestIndex].abcelem.duration;
+						var nextDuration = elems[nextNonRestIndex].abcelem.duration;
+						if (prevDuration === nextDuration) {
+							// The notes on either side are the same duration, alternate which side the beam goes to
+							auxBeamEndX = i%2 === 0 ? x + 5 : x - 5;
 						} else {
-						// The notes on either side are different durations, draw the beam to the shorter note
-						auxBeamEndX = elems[i-1].duration > elems[i+1].duration ? x + 5 : x - 5;
+							// The notes on either side are different durations, draw the beam to the longer note
+							auxBeamEndX = prevDuration < nextDuration ? x + 5 : x - 5;
 						}
 					}
 					auxBeamEndY = getBarYAt(beam.startX, beam.startY, beam.endX, beam.endY, auxBeamEndX) + sy * (j + 1);

package/src/write/layout/layout.js

@@ -3,6 +3,7 @@ var setUpperAndLowerElements = require('./set-upper-and-lower-elements');
 var layoutStaffGroup = require('./staff-group');
 var getLeftEdgeOfStaff = require('./get-left-edge-of-staff');
 var layoutInGrid = require('./layout-in-grid');
+var toTimeAndStaffBased = require("./to-time-and-staff-based");
 
 // This sets the "x" attribute on all the children in abctune.lines
 // It also sets the "w" and "startx" attributes on "voices"
@@ -40,6 +41,16 @@ var layout = function (renderer, abctune, width, space, expandToWidest, timeBase
 		}
 	}
 
+	// See if there are collisions between voices that need to be tweaked
+	var timeBased = toTimeAndStaffBased(abctune.lines)
+	for (i = 0; i < abctune.lines.length; i++) {
+		abcLine = abctune.lines[i];
+		if (abcLine.staffGroup) {
+			fixVoiceCollisions(timeBased[i])
+			//setUpperAndLowerElements(renderer, abcLine.staffGroup);
+		}
+	}
+
 	// Set the staff spacing
 	// TODO-PER: we should have been able to do this by the time we called setUpperAndLowerElements, but for some reason the "bottom" element seems to be set as a side effect of setting the X spacing.
 	for (i = 0; i < abctune.lines.length; i++) {
@@ -126,4 +137,83 @@ function centerWholeRests(voices) {
 	}
 }
 
+function fixVoiceCollisions(timeBasedLine) {
+	for (var s = 0; s < timeBasedLine.length; s++) {
+		var timeSlot = timeBasedLine[s]
+		// If there is more than one thing happening at the same time,
+		// and one of those things is a rest, then:
+		// If the rest is in the first element, check to see if the bottom bumps into the top of any of the rest of the elements
+		// If the rest is in the last element, check to see if the top bumps into the bottom of any of the rest of the elements.
+		// Note: if there are more than two voices the staff will get sloppy, so there is a limit to how much that can be improved, but this should be fine when there are two voices.
+		// If there is a collision, move the rest up or down to fix that.
+		var keys = Object.keys(timeSlot)
+		for (var z = 0; z < keys.length; z++) {
+			var slot = timeSlot[keys[z]] // slot is an array of all the things happening at a particular time
+			var lastIndex = slot.length - 1
+			if (slot.length > 1) {
+				var isRealRest = slot[0].abcelem.rest && slot[0].abcelem.rest.type === 'rest' // weed out invisible rests
+				var isRealRest2 = slot[lastIndex].abcelem.rest && slot[lastIndex].abcelem.rest.type === 'rest' // weed out invisible rests
+				if (isRealRest && !slot[lastIndex].abcelem.rest) {
+					// the first voice has a rest and the second doesn't
+					var restTop = slot[0].children.find(function (ch) { return ch.name.includes('rest') })
+					var otherTop = closeTop(slot[lastIndex])
+					if (restTop) {
+						var distance1 = restTop.bottom - otherTop
+						distance1 -= 2 // give some room between the rest and the note
+						if (distance1 < 0 && slot[0].children.length > 0) {
+							slot[0].bottom -= distance1
+							slot[0].top -= distance1
+							slot[0].children[0].bottom -= distance1
+							slot[0].children[0].top -= distance1
+							slot[0].children[0].pitch -= distance1
+						}
+					}
+				} else if (isRealRest2 && !slot[0].abcelem.rest) {
+					// the last voice has a rest and the first doesn't
+					var restBottom = slot[lastIndex].children.find(function (ch) { return ch.name.includes('rest') })
+					if (restBottom) {
+						var distance2 = restBottom.top - closeBottom(slot[0])
+						distance2 += 2 // give some room between the rest and the note
+						if (distance2 > 0 && slot[lastIndex].children.length > 0) {
+							slot[lastIndex].bottom -= distance2
+							slot[lastIndex].top -= distance2
+							slot[lastIndex].children[0].bottom -= distance2
+							slot[lastIndex].children[0].top -= distance2
+							slot[lastIndex].children[0].pitch -= distance2
+						}
+					}
+				}
+			}
+		}
+	}
+}
+
+function closeTop(absElem) {
+	if (absElem.children) {
+		var max = -90 // This is clearly way lower than the max calculated below
+		for (var i = 0; i < absElem.children.length; i++) {
+			var child = absElem.children[i]
+			if (child.type !== 'chord')
+				max = Math.max(max, child.top)
+		}
+		if (max > -90)
+			return max
+	}
+	return absElem.top
+}
+
+function closeBottom(absElem) {
+	if (absElem.children) {
+		var min = 90 // This is clearly way higher than the min calculated below
+		for (var i = 0; i < absElem.children.length; i++) {
+			var child = absElem.children[i]
+			if (child.type !== 'lyric')
+				min = Math.min(min, child.bottom)
+		}
+		if (min < 90)
+			return min
+	}
+	return absElem.bottom
+}
+
 module.exports = layout;

package/src/write/layout/set-upper-and-lower-elements.js

@@ -75,7 +75,8 @@ var setUpperAndLowerElements = function (renderer, staffGroup) {
 
 		for (var j = 0; j < staff.voices.length; j++) {
 			var voice = staffGroup.voices[staff.voices[j]];
-			setUpperAndLowerVoiceElements(positionY, voice, renderer.spacing);
+			var diff = setUpperAndLowerVoiceElements(positionY, voice, renderer.spacing);
+			staff.bottom -= diff//
 		}
 		// We might need a little space in between staves if the staves haven't been pushed far enough apart by notes or extra vertical stuff.
 		// Only try to put in extra space if this isn't the top staff.
@@ -112,9 +113,16 @@ function incTop(staff, positionY, item, count) {
 function setUpperAndLowerVoiceElements(positionY, voice, spacing) {
 	var i;
 	var abselem;
+	var diff = 0
 	for (i = 0; i < voice.children.length; i++) {
 		abselem = voice.children[i];
-		setUpperAndLowerAbsoluteElements(positionY, abselem, spacing);
+		var bottom = setUpperAndLowerAbsoluteElements(positionY, abselem, spacing);
+		if (bottom < abselem.bottom) {
+			// We're moving things down so tell the staff that it needs to be taller
+			diff = abselem.bottom - bottom
+			abselem.bottom = bottom//
+			voice.bottom = bottom//
+		}
 	}
 	for (i = 0; i < voice.otherchildren.length; i++) {
 		abselem = voice.otherchildren[i];
@@ -138,6 +146,7 @@ function setUpperAndLowerVoiceElements(positionY, voice, spacing) {
 				break;
 		}
 	}
+	return diff
 }
 
 // For each of the relative elements that can't be placed in advance (because their vertical placement depends on everything
@@ -145,6 +154,7 @@ function setUpperAndLowerVoiceElements(positionY, voice, spacing) {
 // hash with the vertical placement (in pitch units) for each type.
 // TODO-PER: I think this needs to be separated by "above" and "below". How do we know that for dynamics at the point where they are being defined, though? We need a pass through all the relative elements to set "above" and "below".
 function setUpperAndLowerAbsoluteElements(specialYResolved, element, spacing) {
+	var bottom = element.bottom
 	// specialYResolved contains the actual pitch for each of the classes of elements.
 	for (var i = 0; i < element.children.length; i++) {
 		var child = element.children[i];
@@ -152,6 +162,11 @@ function setUpperAndLowerAbsoluteElements(specialYResolved, element, spacing) {
 			if (element.specialY.hasOwnProperty(key)) {
 				if (child[key]) { // If this relative element has defined a height for this class of element
 					child.pitch = specialYResolved[key];
+					if (key === 'lyricHeightBelow' && child.type === 'lyric' && child.voiceNumber) {
+						// TODO-PER: This can result in extra unused vertical space if there are lyrics only on the second but not the first voice.
+						child.pitch -= child.voiceNumber*child[key]//
+						bottom = Math.min(element.bottom, child.pitch)//
+					}
 					if (child.top === undefined) { // TODO-PER: HACK! Not sure this is the right place to do this.
 						if (child.type === 'TempoElement') {
 							setUpperAndLowerTempoElement(specialYResolved, child);
@@ -165,6 +180,7 @@ function setUpperAndLowerAbsoluteElements(specialYResolved, element, spacing) {
 			}
 		}
 	}
+	return bottom
 }
 
 function setUpperAndLowerCrescendoElements(positionY, element) {

package/src/write/layout/to-time-and-staff-based.js

@@ -0,0 +1,35 @@
+function toTimeAndStaffBased(abcLines) {
+	var results = []
+	for (var lin = 0; lin < abcLines.length; lin++) {
+		var line = abcLines[lin]
+		var staffGroup = line.staffGroup
+
+		var group = []
+		if (staffGroup && staffGroup && staffGroup.staffs) {
+			for (var s = 0; s < staffGroup.staffs.length; s++) {
+				var staff = staffGroup.staffs[s]
+				var timeSlot = {}
+				for (var i = 0; i < staff.voices.length; i++) {
+					var voice = staffGroup.voices[staff.voices[i]]
+					var time = 0
+					for (var k = 0; k < voice.children.length; k++) {
+						var index = 'T' + Math.round(time*1000) // There can be inexactness when calculating triplets, so we'll round, but we'll make sure that no make sure that we don't lose necessary precision by making it a shorter time than would ever happen
+						if (!timeSlot[index])
+							timeSlot[index] = []
+						if (voice.children[k].abcelem.el_type === 'note') {
+							timeSlot[index].push(voice.children[k])
+							time += voice.children[k].duration
+						}
+					}
+				}
+				// Now timeSlot is an object with all the voices on a particular staff that
+				// happen at the same time as an array.
+				group.push(timeSlot)
+			}
+		}
+		results.push(group)
+	}
+	return results
+}
+
+module.exports = toTimeAndStaffBased;

package/src/write/layout/triplet.js

@@ -21,34 +21,60 @@ function layoutTriplet(element) {
 			if (isAbove(beam))
 				element.endingHeightAbove = 4;
 		} else {
-			// If there isn't a beam, then we need to draw the bracket and the text. The bracket is always above.
+			// If there isn't a beam, then we need to draw the bracket and the text. The bracket is either above or below depending on the stem direction of the notes.
+			// Above:
 			// The bracket is never lower than the 'a' line, but is 4 pitches above the first and last notes. If there is
 			// a tall note in the middle, the bracket is horizontal and above the highest note.
-			element.startNote = Math.max(element.anchor1.parent.top, 9) + 4;
-			element.endNote = Math.max(element.anchor2.parent.top, 9) + 4;
+			// Below: The bracket is never higher than the 'C' line, and is 4 pitches below.
+
+			// To decide if the bracket goes above or below, go in the direction of the most stems. If there are the same number it will put the bracket above.
+			var up = stemDirectionUp(element)
+			element.up = up
+			element.startNote = up ? Math.max(element.anchor1.parent.top, 9) + 4 : Math.min(element.anchor1.parent.bottom, 0) - 2
+			element.endNote = up ? Math.max(element.anchor2.parent.top, 9) + 4 : Math.min(element.anchor2.parent.bottom, 0) - 2
+
 			// If it starts or ends on a rest, make the beam horizontal
 			if (element.anchor1.parent.type === "rest" && element.anchor2.parent.type !== "rest")
 				element.startNote = element.endNote;
 			else if (element.anchor2.parent.type === "rest" && element.anchor1.parent.type !== "rest")
 				element.endNote = element.startNote;
-			// See if the middle note is really high.
-			var max = 0;
-			for (var i = 0; i < element.middleElems.length; i++) {
-				max = Math.max(max, element.middleElems[i].top);
-			}
-			max += 4;
-			if (max > element.startNote || max > element.endNote) {
-				element.startNote = max;
-				element.endNote = max;
+			if (up) {
+				// See if the middle note is really high.
+				var max = 0;
+				for (var i = 0; i < element.middleElems.length; i++) {
+					max = Math.max(max, element.middleElems[i].top);
+				}
+				max += 4;
+				if (max > element.startNote || max > element.endNote) {
+					element.startNote = max + 3;
+					element.endNote = max + 3;
+				}
+			} else {
+				// See if the middle note is really low.
+				var min = 0;
+				for (var i = 0; i < element.middleElems.length; i++) {
+					min = Math.min(min, element.middleElems[i].bottom-element.middleElems[i].height);
+				}
+				min -= 3;
+				if (min < element.startNote && min < element.endNote) {
+					element.startNote = Math.min(min, element.startNote) - 2;
+					element.endNote = Math.min(min, element.endNote) - 2;
+				}
 			}
 			if (element.flatBeams) {
-				element.startNote = Math.max(element.startNote, element.endNote);
-				element.endNote = Math.max(element.startNote, element.endNote);
+				if (up) {
+					element.startNote = Math.max(element.startNote, element.endNote);
+					element.endNote = Math.max(element.startNote, element.endNote);
+				} else {
+					element.startNote = Math.min(element.startNote, element.endNote);
+					element.endNote = Math.min(element.startNote, element.endNote);
+				}
 			}
 
 			element.yTextPos = element.startNote + (element.endNote - element.startNote) / 2;
 			element.xTextPos = element.anchor1.x + (element.anchor2.x + element.anchor2.w - element.anchor1.x) / 2;
 			element.top = element.yTextPos + 1;
+			element.bottom = element.yTextPos - 2;
 		}
 	}
 	delete element.middleElems;
@@ -59,6 +85,27 @@ function isAbove(beam) {
 	return beam.stemsUp;
 }
 
+function stemDirectionUp(element) {
+	var up = 0
+	var down = 0
+	if (element.anchor1) {
+		if (element.anchor1.stemDir === 'up') up++
+		if (element.anchor1.stemDir === 'down') down++
+	}
+	if (element.anchor2) {
+		if (element.anchor2.stemDir === 'up') up++
+		if (element.anchor2.stemDir === 'down') down++
+	}
+	if (element.middleElems) {
+		for (var i = 0; i < element.middleElems.length; i++) {
+			var elem = element.middleElems[i]
+			if (elem.stemDir === 'up') up++
+			if (elem.stemDir === 'down') down++
+		}
+	}
+	return up >= down
+}
+
 // We can't just use the entire beam for the calculation. The range has to be passed in, because the beam might extend into some unrelated notes. for instance, (3_a'f'e'f'2 when L:16
 function heightAtMidpoint(startX, endX, beam) {
 	if (beam.beams.length === 0)

package/version.js

@@ -1,3 +1,3 @@
-var version = '6.6.1';
+var version = '6.6.3';
 
 module.exports = version;