abcjs 6.0.0-beta.9 → 6.0.2

package/src/write/abc_beam_element.js

@@ -1,33 +1,4 @@
 //    abc_beam_element.js: Definition of the BeamElem class.
-//    Copyright (C) 2010-2020 Gregory Dyke (gregdyke at gmail dot com) and Paul Rosen
-//
-//    Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated
-//    documentation files (the "Software"), to deal in the Software without restriction, including without limitation
-//    the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and
-//    to permit persons to whom the Software is furnished to do so, subject to the following conditions:
-//
-//    The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-//
-//    THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING
-//    BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
-//    NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,
-//    DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-//    OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
-
-var AbsoluteElement = require('./abc_absolute_element');
-var RelativeElement = require('./abc_relative_element');
-var spacing = require('./abc_spacing');
-
-var getDurlog = function(duration) {
-        // TODO-PER: This is a hack to prevent a Chrome lockup. Duration should have been defined already,
-        // but there's definitely a case where it isn't. [Probably something to do with triplets.]
-        if (duration === undefined) {
-                return 0;
-        }
-//        console.log("getDurlog: " + duration);
-  return Math.floor(Math.log(duration)/Math.log(2));
-};
-
 
 // Most elements on the page are related to a particular absolute element -- notes, rests, bars, etc. Beams, however, span multiple elements.
 // This means that beams can't be laid out until the absolute elements are placed. There is the further complication that the stems for beamed
@@ -41,22 +12,19 @@ var getDurlog = function(duration) {
 // There are three phases: the setup phase, when new elements are being discovered, the layout phase, when everything is calculated, and the drawing phase,
 // when the object is not changed, but is used to put the elements on the page.
 
-var BeamElem;
-
-(function() {
-	"use strict";
-
-	//
-	// Setup phase
-	//
-	BeamElem = function BeamElem(stemHeight, type, flat, firstElement) {
+//
+// Setup phase
+//
+var BeamElem = function BeamElem(stemHeight, type, flat, firstElement) {
 		// type is "grace", "up", "down", or undefined. flat is used to force flat beams, as it commonly found in the grace notes of bagpipe music.
+		this.type = "BeamElem";
 		this.isflat = !!flat;
-		this.isgrace = (type && type === "grace");
-		this.forceup = this.isgrace || (type && type === "up");
-		this.forcedown = (type && type === "down");
+		this.isgrace = !!(type && type === "grace");
+		this.forceup = !!(this.isgrace || (type && type === "up"));
+		this.forcedown = !!(type && type === "down");
 		this.elems = []; // all the AbsoluteElements that this beam touches. It may include embedded rests.
 		this.total = 0;
+		this.average = 6; // use middle line as start for average.
 		this.allrests = true;
 		this.stemHeight = stemHeight;
 		this.beams = []; // During the layout phase, this will become a list of the beams that need to be drawn.
@@ -90,260 +58,32 @@ var BeamElem;
 		}
 	};
 
-	var middleLine = 6;	// hardcoded 6 is B
-
-	BeamElem.prototype.calcDir = function() {
-		if (this.forceup) return true;
-		if (this.forcedown) return false;
-		var average = calcAverage(this.total, this.elems.length);
-		return average < middleLine;
-	};
-
-	//
-	// layout phase
-	//
-	BeamElem.prototype.layout = function() {
-		if (this.elems.length === 0 || this.allrests) return;
-
-		this.stemsUp = this.calcDir(); // True means the stems are facing up.
-		var dy = calcDy(this.stemsUp, this.isgrace); // This is the width of the beam line.
-
-		// create the main beam
-		var firstElement = this.elems[0];
-		var lastElement = this.elems[this.elems.length - 1];
-		var minStemHeight = 0; // The following is to leave space for "!///!" marks.
-		var referencePitch = this.stemsUp ? firstElement.abcelem.maxpitch : firstElement.abcelem.minpitch;
-		minStemHeight = minStem(firstElement, this.stemsUp, referencePitch, minStemHeight);
-		minStemHeight = minStem(lastElement, this.stemsUp, referencePitch, minStemHeight);
-		minStemHeight = Math.max(this.stemHeight, minStemHeight + 3); // TODO-PER: The 3 is the width of a 16th beam. The actual height of the beam should be used instead.
-		var yPos = calcYPos(this.total, this.elems.length, minStemHeight, this.stemsUp, firstElement.abcelem.averagepitch, lastElement.abcelem.averagepitch, this.isflat, this.min, this.max, this.isgrace);
-		var xPos = calcXPos(this.stemsUp, firstElement, lastElement);
-		this.beams.push({ startX: xPos[0], endX: xPos[1], startY: yPos[0], endY: yPos[1], dy: dy });
-
-		// create the rest of the beams (in the case of 1/16th notes, etc.
-		var beams = createAdditionalBeams(this.elems, this.stemsUp, this.beams[0], this.isgrace, dy);
-		for (var i = 0; i < beams.length; i++)
-			this.beams.push(beams[i]);
-
-		// Now that the main beam is defined, we know how tall the stems should be, so create them and attach them to the original notes.
-		createStems(this.elems, this.stemsUp, this.beams[0], dy, this.mainNote);
-	};
-
-	BeamElem.prototype.isAbove = function() {
-		return this.stemsUp;
-	};
-
-	// 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
-	BeamElem.prototype.heightAtMidpoint = function(startX, endX) {
-		if (this.beams.length === 0)
-			return 0;
-		var beam = this.beams[0];
-		var midPoint = startX + (endX - startX) / 2;
-		return getBarYAt(beam.startX, beam.startY, beam.endX, beam.endY, midPoint);
-	};
-
-	BeamElem.prototype.yAtNote = function(element) {
-		var beam = this.beams[0];
-		return getBarYAt(beam.startX, beam.startY, beam.endX, beam.endY, element.x);
-	};
-
-	BeamElem.prototype.xAtMidpoint = function(startX, endX) {
-		return startX + (endX - startX)/2;
-	};
-
-	//
-	// Drawing phase
-	//
-	BeamElem.prototype.draw = function(renderer) {
-		if (this.beams.length === 0) return;
-
-		var klass = 'beam-elem';
-		if (this.hint)
-			klass += " abcjs-hint";
-
-		var pathString = "";
-		for (var i = 0; i < this.beams.length; i++) {
-			var beam = this.beams[i];
-			pathString += drawBeam(renderer, beam.startX, beam.startY, beam.endX, beam.endY, beam.dy);
-		}
-		var durationClass = ("abcjs-d"+this.duration).replace(/\./g,"-");
-		var klasses = renderer.addClasses('beam-elem '+durationClass);
-		renderer.controller.currentAbsEl = { tuneNumber: renderer.controller.engraver.tuneNumber, elemset: [], abcelem: { el_type: "beam", startChar: -1, endChar: -1 }};
-		var el = renderer.printPath({
-			path: pathString,
-			stroke: "none",
-			fill: "#000000",
-			'class': klasses
-		}, {history: 'not-selectable'});
-		renderer.controller.currentAbsEl.elemset.push(el);
+	BeamElem.prototype.addBeam = function(beam) {
+		this.beams.push(beam);
 	};
 
-	//
-	// private functions
-	//
-	function minStem(element, stemsUp, referencePitch, minStemHeight) {
-		if (!element.children)
-			return minStemHeight;
-		for (var i = 0; i < element.children.length; i++) {
-			var elem = element.children[i];
-			if (stemsUp && elem.top !== undefined && elem.c === "flags.ugrace")
-				minStemHeight = Math.max(minStemHeight, elem.top - referencePitch);
-			else if (!stemsUp && elem.bottom !== undefined && elem.c === "flags.ugrace")
-				minStemHeight = Math.max(minStemHeight, referencePitch - elem.bottom + 7); // The extra 7 is because we are measuring the slash from the top.
-		}
-		return minStemHeight;
-	}
-
-	function calcSlant(leftAveragePitch, rightAveragePitch, numStems, isFlat) {
-		if (isFlat)
-			return 0;
-		var slant = leftAveragePitch - rightAveragePitch;
-		var maxSlant = numStems / 2;
-
-		if (slant > maxSlant) slant = maxSlant;
-		if (slant < -maxSlant) slant = -maxSlant;
-		return slant;
-	}
-
-	function calcAverage(total, numElements) {
-		if (!numElements)
-			return 0;
-		return total / numElements;
-	}
-
-	function getBarYAt(startx, starty, endx, endy, x) {
-		return starty + (endy - starty) / (endx - startx) * (x - startx);
-	}
-
-	function calcDy(asc, isGrace) {
-		var dy = (asc) ? spacing.STEP : -spacing.STEP;
-		if (isGrace) dy = dy * 0.4;
-		return dy;
-	}
-
-	function drawBeam(renderer, startX, startY, endX, endY, dy) {
-		// the X coordinates are actual coordinates, but the Y coordinates are in pitches.
-		startY = renderer.calcY(startY);
-		endY = renderer.calcY(endY);
-		return "M" + startX + " " + startY + " L" + endX + " " + endY +
-			"L" + endX + " " + (endY + dy) + " L" + startX + " " + (startY + dy) + "z";
-	}
-
-	function calcXPos(asc, firstElement, lastElement) {
-		var starthead = firstElement.heads[asc ? 0 : firstElement.heads.length - 1];
-		var endhead = lastElement.heads[asc ? 0 : lastElement.heads.length - 1];
-		var startX = starthead.x;
-		if (asc) startX += starthead.w - 0.6;
-		var endX = endhead.x;
-		if (asc) endX += endhead.w;
-		return [ startX, endX ];
-	}
-
-	function calcYPos(total, numElements, stemHeight, asc, firstAveragePitch, lastAveragePitch, isFlat, minPitch, maxPitch, isGrace) {
-		var average = calcAverage(total, numElements); // This is the average pitch for the all the notes that will be beamed.
-		var barpos = stemHeight - 2; // (isGrace)? 5:7;
-		var barminpos = stemHeight - 2;
-		var pos = Math.round(asc ? Math.max(average + barpos, maxPitch + barminpos) : Math.min(average - barpos, minPitch - barminpos));
-
-		var slant = calcSlant(firstAveragePitch, lastAveragePitch, numElements, isFlat);
-		var startY = pos + Math.floor(slant / 2);
-		var endY = pos + Math.floor(-slant / 2);
-
-		// If the notes are too high or too low, make the beam go down to the middle
-		if (!isGrace) {
-			if (asc && pos < 6) {
-				startY = 6;
-				endY = 6;
-			} else if (!asc && pos > 6) {
-				startY = 6;
-				endY = 6;
-			}
+	BeamElem.prototype.calcDir = function() {
+		this.average = calcAverage(this.total, this.elems.length);
+		if (this.forceup) {
+			this.stemsUp = true;
+		} else if (this.forcedown) {
+			this.stemsUp = false;
+		} else {
+			var middleLine = 6;	// hardcoded 6 is B
+			this.stemsUp = this.average < middleLine; // true is up, false is down;
 		}
-
-		return [ startY, endY];
-	}
-
-	function createStems(elems, asc, beam, dy, mainNote) {
-		for (var i = 0; i < elems.length; i++) {
-			var elem = elems[i];
-			if (elem.abcelem.rest)
-				continue;
-			// TODO-PER: This is odd. If it is a regular beam then elems is an array of AbsoluteElements, if it is a grace beam then it is an array of objects , so we directly attach the element to the parent. We tell it if is a grace note because they are passed in as a generic object instead of an AbsoluteElement.
-			var isGrace = elem.addExtra ? false : true;
-			var parent = isGrace ? mainNote : elem;
-			var furthestHead = elem.heads[(asc) ? 0 : elem.heads.length - 1];
-			var ovalDelta = 1 / 5;//(isGrace)?1/3:1/5;
-			var pitch = furthestHead.pitch + ((asc) ? ovalDelta : -ovalDelta);
-			var dx = asc ? furthestHead.w : 0; // down-pointing stems start on the left side of the note, up-pointing stems start on the right side, so we offset by the note width.
-			var x = furthestHead.x + dx; // this is now the actual x location in pixels.
-			var bary = getBarYAt(beam.startX, beam.startY, beam.endX, beam.endY, x);
-			var lineWidth = (asc) ? -0.6 : 0.6;
-			if (!asc)
-				bary -= (dy / 2) / spacing.STEP;	// TODO-PER: This is just a fudge factor so the down-pointing stems don't overlap.
-			if (isGrace)
-				dx += elem.heads[0].dx;
-			// TODO-PER-HACK: One type of note head has a different placement of the stem. This should be more generically calculated:
-			if (furthestHead.c === 'noteheads.slash.quarter') {
-				if (asc)
-					pitch += 1;
-				else
-					pitch -= 1;
+		var dir = this.stemsUp ? 'up' : 'down';
+		for (var i = 0; i < this.elems.length; i++) {
+			for (var j = 0; j < this.elems[i].heads.length; j++) {
+				this.elems[i].heads[j].stemDir = dir;
 			}
-			var stem = new RelativeElement(null, dx, 0, pitch, {
-				"type": "stem",
-				"pitch2": bary,
-				linewidth: lineWidth
-			});
-			stem.setX(parent.x); // This is after the x coordinates were set, so we have to set it directly.
-			parent.addExtra(stem);
 		}
+	};
 
-	}
-
-	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)
-		for (var i = 0; i < elems.length; i++) {
-			var elem = elems[i];
-			if (elem.abcelem.rest)
-				continue;
-			var furthestHead = elem.heads[(asc) ? 0 : elem.heads.length - 1];
-			var x = furthestHead.x + ((asc) ? furthestHead.w : 0);
-			var bary = getBarYAt(beam.startX, beam.startY, beam.endX, beam.endY, x);
-
-			var sy = (asc) ? -1.5 : 1.5;
-			if (isGrace) sy = sy * 2 / 3; // This makes the second beam on grace notes closer to the first one.
-			var duration = elem.abcelem.duration; // get the duration via abcelem because of triplets
-			if (duration === 0) duration = 0.25; // if this is stemless, then we use quarter note as the duration.
-			for (var durlog = getDurlog(duration); durlog < -3; durlog++) {
-				if (auxBeams[-4 - durlog]) {
-					auxBeams[-4 - durlog].single = false;
-				} else {
-					auxBeams[-4 - durlog] = {
-						x: x + ((asc) ? -0.6 : 0), y: bary + sy * (-4 - durlog + 1),
-						durlog: durlog, single: true
-					};
-				}
-			}
-
-			for (var j = auxBeams.length - 1; j >= 0; j--) {
-				if (i === elems.length - 1 || getDurlog(elems[i + 1].abcelem.duration) > (-j - 4)) {
-
-					var auxBeamEndX = x;
-					var auxBeamEndY = bary + sy * (j + 1);
-
-
-					if (auxBeams[j].single) {
-						auxBeamEndX = (i === 0) ? x + 5 : x - 5;
-						auxBeamEndY = getBarYAt(beam.startX, beam.startY, beam.endX, beam.endY, auxBeamEndX) + sy * (j + 1);
-					}
-					beams.push({ startX: auxBeams[j].x, endX: auxBeamEndX, startY: auxBeams[j].y, endY: auxBeamEndY, dy: dy });
-					auxBeams = auxBeams.slice(0, j);
-				}
-			}
-		}
-		return beams;
-	}
-})();
+function calcAverage(total, numElements) {
+	if (!numElements)
+		return 0;
+	return total / numElements;
+}
 
 module.exports = BeamElem;

package/src/write/abc_brace_element.js

@@ -1,38 +1,22 @@
 //    abc_brace_element.js: Definition of the BraceElement class.
-//    Copyright (C) 2010-2020 Gregory Dyke (gregdyke at gmail dot com) and Paul Rosen
-//
-//    Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated
-//    documentation files (the "Software"), to deal in the Software without restriction, including without limitation
-//    the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and
-//    to permit persons to whom the Software is furnished to do so, subject to the following conditions:
-//
-//    The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-//
-//    THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING
-//    BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
-//    NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,
-//    DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-//    OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 
-var sprintf = require('./sprintf');
-var spacing = require('./abc_spacing');
-
-var BraceElem = function BraceElem(staff, type) {
-    this.startStaff = staff;
+var BraceElem = function BraceElem(voice, type) {
+    this.startVoice = voice;
     this.type = type;
 };
 
-BraceElem.prototype.setBottomStaff = function(staff) {
-	this.endStaff = staff;
+BraceElem.prototype.setBottomStaff = function(voice) {
+	this.endVoice = voice;
+	// If only the start brace has a name then the name belongs to the brace instead of the staff.
+	if (this.startVoice.header && !this.endVoice.header) {
+		this.header = this.startVoice.header;
+		delete this.startVoice.header;
+	}
 };
 
-BraceElem.prototype.continuing = function(staff) {
+BraceElem.prototype.continuing = function(voice) {
 	// If the final staff isn't present, then use the last one we saw.
-	this.lastContinuedStaff = staff;
-};
-
-BraceElem.prototype.setLocation = function(x) {
-	this.x = x;
+	this.lastContinuedVoice = voice;
 };
 
 BraceElem.prototype.getWidth = function() {
@@ -40,102 +24,9 @@ BraceElem.prototype.getWidth = function() {
 };
 
 BraceElem.prototype.isStartVoice = function (voice) {
-	if (this.startStaff && this.startStaff.voices.length > 0 && this.startStaff.voices[0] === voice)
+	if (this.startVoice && this.startVoice.staff && this.startVoice.staff.voices.length > 0 && this.startVoice.staff.voices[0] === voice)
 		return true;
 	return false;
 };
 
-BraceElem.prototype.draw = function (renderer, top, bottom) {
-	// The absoluteY number is the spot where the note on the first ledger line is drawn (i.e. middle C if treble clef)
-	// The STEP offset here moves it to the top and bottom lines
-	this.startY = this.startStaff.absoluteY - spacing.STEP*10;
-	if (this.endStaff)
-		this.endY = this.endStaff.absoluteY - spacing.STEP*2;
-	else if (this.lastContinuedStaff)
-		this.endY = this.lastContinuedStaff.absoluteY - spacing.STEP*2;
-	else
-		this.endY = this.startStaff.absoluteY - spacing.STEP*2;
-    this.drawBrace(renderer, this.x,this.startY, this.endY);
-};
-
-function straightPath(renderer, xLeft, yTop, yBottom, type) {
-	xLeft += spacing.STEP;
-	var xLineWidth = spacing.STEP*0.75;
-	var yOverlap = spacing.STEP*0.75;
-	var height = yBottom - yTop;
-	// Straight line
-	var pathString = sprintf("M %f %f l %f %f l %f %f l %f %f z",
-		xLeft, yTop-yOverlap, // top left line
-		0, height+yOverlap*2, // bottom left line
-		xLineWidth, 0, // bottom right line
-		0, - (height+yOverlap*2) // top right line
-	);
-	// Top arm
-	var wCurve = spacing.STEP*2;
-	var hCurve = spacing.STEP;
-	pathString += sprintf("M %f %f q %f %f %f %f q %f %f %f %f z",
-		xLeft+xLineWidth, yTop-yOverlap, // top left arm
-		wCurve*0.6, hCurve*0.2,
-		wCurve, -hCurve, // right point
-		-wCurve*0.1, hCurve*0.3,
-		-wCurve, hCurve+spacing.STEP // left bottom
-	);
-	// Bottom arm
-	pathString += sprintf("M %f %f q %f %f %f %f q %f %f %f %f z",
-		xLeft+xLineWidth, yTop+yOverlap+height, // bottom left arm
-		wCurve*0.6, -hCurve*0.2,
-		wCurve, hCurve, // right point
-		-wCurve*0.1, -hCurve*0.3,
-		-wCurve, -hCurve-spacing.STEP // left bottom
-	);
-	return renderer.paper.path({path:pathString, stroke:"#000000", fill:"#000000", 'class': renderer.addClasses(type)});
-}
-
-function curvyPath(renderer, xLeft, yTop, yBottom, type) {
-	var yHeight = yBottom - yTop;
-
-	var xCurve = [7.5, -8, 21, 0, 18.5, -10.5, 7.5];
-	var yCurve = [0, yHeight/5.5, yHeight/3.14, yHeight/2, yHeight/2.93, yHeight/4.88, 0];
-
-	var pathString = sprintf("M %f %f C %f %f %f %f %f %f C %f %f %f %f %f %f z",
-		xLeft+xCurve[0], yTop+yCurve[0],
-		xLeft+xCurve[1], yTop+yCurve[1],
-		xLeft+xCurve[2], yTop+yCurve[2],
-		xLeft+xCurve[3], yTop+yCurve[3],
-		xLeft+xCurve[4], yTop+yCurve[4],
-		xLeft+xCurve[5], yTop+yCurve[5],
-		xLeft+xCurve[6], yTop+yCurve[6]);
-
-	xCurve = [0, 17.5, -7.5, 6.6, -5, 20, 0];
-	yCurve = [yHeight/2, yHeight/1.46, yHeight/1.22, yHeight, yHeight/1.19, yHeight/1.42, yHeight/2];
-
-	pathString += sprintf("M %f %f C %f %f %f %f %f %f C %f %f %f %f %f %f z",
-		xLeft+xCurve[0], yTop+yCurve[0],
-		xLeft+xCurve[1], yTop+yCurve[1],
-		xLeft+xCurve[2], yTop+yCurve[2],
-		xLeft+xCurve[3], yTop+yCurve[3],
-		xLeft+xCurve[4], yTop+yCurve[4],
-		xLeft+xCurve[5], yTop+yCurve[5],
-		xLeft+xCurve[6], yTop+yCurve[6]);
-	return renderer.paper.path({path:pathString, stroke:"#000000", fill:"#000000", 'class': renderer.addClasses(type)});
-}
-
-BraceElem.prototype.drawBrace = function(renderer, xLeft, yTop, yBottom) {//Tony
-	var type = this.type;
-	var ret = renderer.wrapInAbsElem({ el_type: type, startChar: -1, endChar: -1 }, 'abcjs-'+type, function() {
-		var ret;
-		if (type === "brace")
-			ret = curvyPath(renderer, xLeft, yTop, yBottom, type);
-		else if (type === "bracket")
-			ret = straightPath(renderer, xLeft, yTop, yBottom, type);
-		renderer.controller.recordHistory(ret, true);
-		return ret;
-	});
-
-	if (renderer.doRegression){
-		renderer.addToRegression(ret);
-	}
-	return ret;
-};
-
 module.exports = BraceElem;

package/src/write/abc_create_clef.js

@@ -1,31 +1,13 @@
 //    abc_create_clef.js
-//    Copyright (C) 2010-2020 Gregory Dyke (gregdyke at gmail dot com) and Paul Rosen
-//
-//    Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated
-//    documentation files (the "Software"), to deal in the Software without restriction, including without limitation
-//    the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and
-//    to permit persons to whom the Software is furnished to do so, subject to the following conditions:
-//
-//    The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-//
-//    THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING
-//    BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
-//    NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,
-//    DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-//    OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 
 var AbsoluteElement = require('./abc_absolute_element');
 var glyphs = require('./abc_glyphs');
 var RelativeElement = require('./abc_relative_element');
 
-var createClef;
-
-(function() {
-	"use strict";
-
-	createClef = function(elem, tuneNumber) {
+var createClef = function(elem, tuneNumber) {
 		var clef;
 		var octave = 0;
+		elem.el_type = "clef";
 		var abselem = new AbsoluteElement(elem,0,10, 'staff-extra clef', tuneNumber);
 		abselem.isClef = true;
 		switch (elem.type) {
@@ -43,26 +25,23 @@ var createClef;
 			case 'alto-8': clef="clefs.C"; octave = -1; break;
 			case 'none': return null;
 			case 'perc': clef="clefs.perc"; break;
-			default: abselem.addChild(new RelativeElement("clef="+elem.type, 0, 0, undefined, {type:"debug"}));
+			default: abselem.addFixed(new RelativeElement("clef="+elem.type, 0, 0, undefined, {type:"debug"}));
 		}
 		// if (elem.verticalPos) {
 		// pitch = elem.verticalPos;
 		// }
 		var dx =5;
 		if (clef) {
-			abselem.addRight(new RelativeElement(clef, dx, glyphs.getSymbolWidth(clef), elem.clefPos));
+			var height = glyphs.symbolHeightInPitches(clef);
+			var ofs = clefOffsets(clef);
+			abselem.addRight(new RelativeElement(clef, dx, glyphs.getSymbolWidth(clef), elem.clefPos, { top: height+elem.clefPos+ofs, bottom: elem.clefPos+ofs}));
 
-			if (clef === 'clefs.G') {
-				abselem.top = 13;
-				abselem.bottom = -1;
-			} else {
-				abselem.top = 10;
-				abselem.bottom = 2;
-			}
 			if (octave !== 0) {
 				var scale = 2 / 3;
 				var adjustspacing = (glyphs.getSymbolWidth(clef) - glyphs.getSymbolWidth("8") * scale) / 2;
 				var pitch = (octave > 0) ? abselem.top + 3 : abselem.bottom - 1;
+				var top = (octave > 0) ? abselem.top + 3 : abselem.bottom - 3;
+				var bottom = top-2;
 				if (elem.type === "bass-8") {
 					// The placement for bass octave is a little different. It should hug the clef.
 					pitch = 3;
@@ -70,14 +49,24 @@ var createClef;
 				}
 				abselem.addRight(new RelativeElement("8", dx + adjustspacing, glyphs.getSymbolWidth("8") * scale, pitch, {
 					scalex: scale,
-					scaley: scale
+					scaley: scale,
+					top: top,
+					bottom: bottom
 				}));
-				abselem.top += 2;
+				//abselem.top += 2;
 			}
 		}
 		return abselem;
 	};
 
-})();
+	function clefOffsets(clef) {
+		switch (clef) {
+			case "clefs.G": return -5;
+			case "clefs.C": return -4;
+			case "clefs.F": return -4;
+			case "clefs.perc": return -2;
+			default: return 0;
+		}
+	}
 
 module.exports = createClef;

package/src/write/abc_create_key_signature.js

@@ -1,18 +1,4 @@
 //    abc_create_key_signature.js
-//    Copyright (C) 2010-2020 Gregory Dyke (gregdyke at gmail dot com) and Paul Rosen
-//
-//    Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated
-//    documentation files (the "Software"), to deal in the Software without restriction, including without limitation
-//    the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and
-//    to permit persons to whom the Software is furnished to do so, subject to the following conditions:
-//
-//    The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-//
-//    THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING
-//    BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
-//    NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,
-//    DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-//    OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 
 var AbsoluteElement = require('./abc_absolute_element');
 var glyphs = require('./abc_glyphs');
@@ -20,12 +6,8 @@ var RelativeElement = require('./abc_relative_element');
 
 var parseCommon = require('../parse/abc_common');
 
-var createKeySignature;
-
-(function() {
-	"use strict";
-
-	createKeySignature = function(elem, tuneNumber) {
+var createKeySignature = function(elem, tuneNumber) {
+	elem.el_type = "keySignature";
 		if (!elem.accidentals || elem.accidentals.length === 0)
 			return null;
 		var abselem = new AbsoluteElement(elem, 0, 10, 'staff-extra key-signature', tuneNumber);
@@ -33,19 +15,19 @@ var createKeySignature;
 		var dx = 0;
 		parseCommon.each(elem.accidentals, function(acc) {
 			var symbol;
+			var fudge = 0;
 			switch(acc.acc) {
-				case "sharp": symbol = "accidentals.sharp"; break;
+				case "sharp": symbol = "accidentals.sharp"; fudge = -3; break;
 				case "natural": symbol = "accidentals.nat"; break;
-				case "flat": symbol = "accidentals.flat"; break;
-				case "quartersharp": symbol = "accidentals.halfsharp"; break;
-				case "quarterflat": symbol = "accidentals.halfflat"; break;
+				case "flat": symbol = "accidentals.flat"; fudge = -1.2; break;
+				case "quartersharp": symbol = "accidentals.halfsharp"; fudge = -2.5; break;
+				case "quarterflat": symbol = "accidentals.halfflat"; fudge = -1.2; break;
 				default: symbol = "accidentals.flat";
 			}
-			abselem.addRight(new RelativeElement(symbol, dx, glyphs.getSymbolWidth(symbol), acc.verticalPos, {thickness: glyphs.symbolHeightInPitches(symbol)}));
+			abselem.addRight(new RelativeElement(symbol, dx, glyphs.getSymbolWidth(symbol), acc.verticalPos, {thickness: glyphs.symbolHeightInPitches(symbol), top: acc.verticalPos+glyphs.symbolHeightInPitches(symbol)+fudge, bottom: acc.verticalPos+fudge }));
 			dx += glyphs.getSymbolWidth(symbol) + 2;
 		}, this);
 		return abselem;
 	};
-})();
 
 module.exports = createKeySignature;