File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
import Glyph from './Glyph';
import Path from './Path';
import BBox from './BBox';
import r from '@foliojs-fork/restructure';
// The header for both simple and composite glyphs
let GlyfHeader = new r.Struct({
numberOfContours: r.int16, // if negative, this is a composite glyph
xMin: r.int16,
yMin: r.int16,
xMax: r.int16,
yMax: r.int16
});
// Flags for simple glyphs
const ON_CURVE = 1 << 0;
const X_SHORT_VECTOR = 1 << 1;
const Y_SHORT_VECTOR = 1 << 2;
const REPEAT = 1 << 3;
const SAME_X = 1 << 4;
const SAME_Y = 1 << 5;
// Flags for composite glyphs
const ARG_1_AND_2_ARE_WORDS = 1 << 0;
const ARGS_ARE_XY_VALUES = 1 << 1;
const ROUND_XY_TO_GRID = 1 << 2;
const WE_HAVE_A_SCALE = 1 << 3;
const MORE_COMPONENTS = 1 << 5;
const WE_HAVE_AN_X_AND_Y_SCALE = 1 << 6;
const WE_HAVE_A_TWO_BY_TWO = 1 << 7;
const WE_HAVE_INSTRUCTIONS = 1 << 8;
const USE_MY_METRICS = 1 << 9;
const OVERLAP_COMPOUND = 1 << 10;
const SCALED_COMPONENT_OFFSET = 1 << 11;
const UNSCALED_COMPONENT_OFFSET = 1 << 12;
// Represents a point in a simple glyph
export class Point {
constructor(onCurve, endContour, x = 0, y = 0) {
this.onCurve = onCurve;
this.endContour = endContour;
this.x = x;
this.y = y;
}
copy() {
return new Point(this.onCurve, this.endContour, this.x, this.y);
}
}
// Represents a component in a composite glyph
class Component {
constructor(glyphID, dx, dy) {
this.glyphID = glyphID;
this.dx = dx;
this.dy = dy;
this.pos = 0;
this.scaleX = this.scaleY = 1;
this.scale01 = this.scale10 = 0;
}
}
/**
* Represents a TrueType glyph.
*/
export default class TTFGlyph extends Glyph {
// Parses just the glyph header and returns the bounding box
_getCBox(internal) {
// We need to decode the glyph if variation processing is requested,
// so it's easier just to recompute the path's cbox after decoding.
if (this._font._variationProcessor && !internal) {
return this.path.cbox;
}
let stream = this._font._getTableStream('glyf');
stream.pos += this._font.loca.offsets[this.id];
let glyph = GlyfHeader.decode(stream);
let cbox = new BBox(glyph.xMin, glyph.yMin, glyph.xMax, glyph.yMax);
return Object.freeze(cbox);
}
// Parses a single glyph coordinate
_parseGlyphCoord(stream, prev, short, same) {
if (short) {
var val = stream.readUInt8();
if (!same) {
val = -val;
}
val += prev;
} else {
if (same) {
var val = prev;
} else {
var val = prev + stream.readInt16BE();
}
}
return val;
}
// Decodes the glyph data into points for simple glyphs,
// or components for composite glyphs
_decode() {
let glyfPos = this._font.loca.offsets[this.id];
let nextPos = this._font.loca.offsets[this.id + 1];
// Nothing to do if there is no data for this glyph
if (glyfPos === nextPos) { return null; }
let stream = this._font._getTableStream('glyf');
stream.pos += glyfPos;
let startPos = stream.pos;
let glyph = GlyfHeader.decode(stream);
if (glyph.numberOfContours > 0) {
this._decodeSimple(glyph, stream);
} else if (glyph.numberOfContours < 0) {
this._decodeComposite(glyph, stream, startPos);
}
return glyph;
}
_decodeSimple(glyph, stream) {
// this is a simple glyph
glyph.points = [];
let endPtsOfContours = new r.Array(r.uint16, glyph.numberOfContours).decode(stream);
glyph.instructions = new r.Array(r.uint8, r.uint16).decode(stream);
let flags = [];
let numCoords = endPtsOfContours[endPtsOfContours.length - 1] + 1;
while (flags.length < numCoords) {
var flag = stream.readUInt8();
flags.push(flag);
// check for repeat flag
if (flag & REPEAT) {
let count = stream.readUInt8();
for (let j = 0; j < count; j++) {
flags.push(flag);
}
}
}
for (var i = 0; i < flags.length; i++) {
var flag = flags[i];
let point = new Point(!!(flag & ON_CURVE), endPtsOfContours.indexOf(i) >= 0, 0, 0);
glyph.points.push(point);
}
let px = 0;
for (var i = 0; i < flags.length; i++) {
var flag = flags[i];
glyph.points[i].x = px = this._parseGlyphCoord(stream, px, flag & X_SHORT_VECTOR, flag & SAME_X);
}
let py = 0;
for (var i = 0; i < flags.length; i++) {
var flag = flags[i];
glyph.points[i].y = py = this._parseGlyphCoord(stream, py, flag & Y_SHORT_VECTOR, flag & SAME_Y);
}
if (this._font._variationProcessor) {
let points = glyph.points.slice();
points.push(...this._getPhantomPoints(glyph));
this._font._variationProcessor.transformPoints(this.id, points);
glyph.phantomPoints = points.slice(-4);
}
return;
}
_decodeComposite(glyph, stream, offset = 0) {
// this is a composite glyph
glyph.components = [];
let haveInstructions = false;
let flags = MORE_COMPONENTS;
while (flags & MORE_COMPONENTS) {
flags = stream.readUInt16BE();
let gPos = stream.pos - offset;
let glyphID = stream.readUInt16BE();
if (!haveInstructions) {
haveInstructions = (flags & WE_HAVE_INSTRUCTIONS) !== 0;
}
if (flags & ARG_1_AND_2_ARE_WORDS) {
var dx = stream.readInt16BE();
var dy = stream.readInt16BE();
} else {
var dx = stream.readInt8();
var dy = stream.readInt8();
}
var component = new Component(glyphID, dx, dy);
component.pos = gPos;
if (flags & WE_HAVE_A_SCALE) {
// fixed number with 14 bits of fraction
component.scaleX =
component.scaleY = ((stream.readUInt8() << 24) | (stream.readUInt8() << 16)) / 1073741824;
} else if (flags & WE_HAVE_AN_X_AND_Y_SCALE) {
component.scaleX = ((stream.readUInt8() << 24) | (stream.readUInt8() << 16)) / 1073741824;
component.scaleY = ((stream.readUInt8() << 24) | (stream.readUInt8() << 16)) / 1073741824;
} else if (flags & WE_HAVE_A_TWO_BY_TWO) {
component.scaleX = ((stream.readUInt8() << 24) | (stream.readUInt8() << 16)) / 1073741824;
component.scale01 = ((stream.readUInt8() << 24) | (stream.readUInt8() << 16)) / 1073741824;
component.scale10 = ((stream.readUInt8() << 24) | (stream.readUInt8() << 16)) / 1073741824;
component.scaleY = ((stream.readUInt8() << 24) | (stream.readUInt8() << 16)) / 1073741824;
}
glyph.components.push(component);
}
if (this._font._variationProcessor) {
let points = [];
for (let j = 0; j < glyph.components.length; j++) {
var component = glyph.components[j];
points.push(new Point(true, true, component.dx, component.dy));
}
points.push(...this._getPhantomPoints(glyph));
this._font._variationProcessor.transformPoints(this.id, points);
glyph.phantomPoints = points.splice(-4, 4);
for (let i = 0; i < points.length; i++) {
let point = points[i];
glyph.components[i].dx = point.x;
glyph.components[i].dy = point.y;
}
}
return haveInstructions;
}
_getPhantomPoints(glyph) {
let cbox = this._getCBox(true);
if (this._metrics == null) {
this._metrics = Glyph.prototype._getMetrics.call(this, cbox);
}
let { advanceWidth, advanceHeight, leftBearing, topBearing } = this._metrics;
return [
new Point(false, true, glyph.xMin - leftBearing, 0),
new Point(false, true, glyph.xMin - leftBearing + advanceWidth, 0),
new Point(false, true, 0, glyph.yMax + topBearing),
new Point(false, true, 0, glyph.yMax + topBearing + advanceHeight)
];
}
// Decodes font data, resolves composite glyphs, and returns an array of contours
_getContours() {
let glyph = this._decode();
if (!glyph) {
return [];
}
let points = [];
if (glyph.numberOfContours < 0) {
// resolve composite glyphs
for (let component of glyph.components) {
let contours = this._font.getGlyph(component.glyphID)._getContours();
for (let i = 0; i < contours.length; i++) {
let contour = contours[i];
for (let j = 0; j < contour.length; j++) {
let point = contour[j];
let x = point.x * component.scaleX + point.y * component.scale01 + component.dx;
let y = point.y * component.scaleY + point.x * component.scale10 + component.dy;
points.push(new Point(point.onCurve, point.endContour, x, y));
}
}
}
} else {
points = glyph.points || [];
}
// Recompute and cache metrics if we performed variation processing, and don't have an HVAR table
if (glyph.phantomPoints && !this._font.directory.tables.HVAR) {
this._metrics.advanceWidth = glyph.phantomPoints[1].x - glyph.phantomPoints[0].x;
this._metrics.advanceHeight = glyph.phantomPoints[3].y - glyph.phantomPoints[2].y;
this._metrics.leftBearing = glyph.xMin - glyph.phantomPoints[0].x;
this._metrics.topBearing = glyph.phantomPoints[2].y - glyph.yMax;
}
let contours = [];
let cur = [];
for (let k = 0; k < points.length; k++) {
var point = points[k];
cur.push(point);
if (point.endContour) {
contours.push(cur);
cur = [];
}
}
return contours;
}
_getMetrics() {
if (this._metrics) {
return this._metrics;
}
let cbox = this._getCBox(true);
super._getMetrics(cbox);
if (this._font._variationProcessor && !this._font.HVAR) {
// No HVAR table, decode the glyph. This triggers recomputation of metrics.
this.path;
}
return this._metrics;
}
// Converts contours to a Path object that can be rendered
_getPath() {
let contours = this._getContours();
let path = new Path;
for (let i = 0; i < contours.length; i++) {
let contour = contours[i];
let firstPt = contour[0];
let lastPt = contour[contour.length - 1];
let start = 0;
if (firstPt.onCurve) {
// The first point will be consumed by the moveTo command, so skip in the loop
var curvePt = null;
start = 1;
} else {
if (lastPt.onCurve) {
// Start at the last point if the first point is off curve and the last point is on curve
firstPt = lastPt;
} else {
// Start at the middle if both the first and last points are off curve
firstPt = new Point(false, false, (firstPt.x + lastPt.x) / 2, (firstPt.y + lastPt.y) / 2);
}
var curvePt = firstPt;
}
path.moveTo(firstPt.x, firstPt.y);
for (let j = start; j < contour.length; j++) {
let pt = contour[j];
let prevPt = j === 0 ? firstPt : contour[j - 1];
if (prevPt.onCurve && pt.onCurve) {
path.lineTo(pt.x, pt.y);
} else if (prevPt.onCurve && !pt.onCurve) {
var curvePt = pt;
} else if (!prevPt.onCurve && !pt.onCurve) {
let midX = (prevPt.x + pt.x) / 2;
let midY = (prevPt.y + pt.y) / 2;
path.quadraticCurveTo(prevPt.x, prevPt.y, midX, midY);
var curvePt = pt;
} else if (!prevPt.onCurve && pt.onCurve) {
path.quadraticCurveTo(curvePt.x, curvePt.y, pt.x, pt.y);
var curvePt = null;
} else {
throw new Error("Unknown TTF path state");
}
}
// Connect the first and last points
if (curvePt) {
path.quadraticCurveTo(curvePt.x, curvePt.y, firstPt.x, firstPt.y);
}
path.closePath();
}
return path;
}
}