xl-public-utils 1.0.11 → 1.0.13

package/src/threeFont/TextGeometry/FontLoader.js

@@ -0,0 +1,114 @@
+import { ShapePath } from './ShapePath.js';
+
+class Font {
+    constructor(data) {
+        this.isFont = true;
+
+        this.type = 'Font';
+
+        this.data = data;
+    }
+
+    generateShapes(text, size = 100) {
+        const shapes = [];
+        const paths = createPaths(text, size, this.data);
+
+        for (let p = 0, pl = paths.length; p < pl; p++) {
+            shapes.push(...paths[p].toShapes());
+        }
+
+        return shapes;
+    }
+}
+
+function createPaths(text, size, data) {
+    const chars = Array.from(text);
+    const scale = size / data.resolution;
+    const line_height = (data.boundingBox.yMax - data.boundingBox.yMin + data.underlineThickness) * scale;
+
+    const paths = [];
+
+    let offsetX = 0,
+        offsetY = 0;
+
+    for (let i = 0; i < chars.length; i++) {
+        const char = chars[i];
+
+        if (char === '\n') {
+            offsetX = 0;
+            offsetY -= line_height;
+        } else {
+            const ret = createPath(char, scale, offsetX, offsetY, data);
+            offsetX += ret.offsetX;
+            paths.push(ret.path);
+        }
+    }
+
+    return paths;
+}
+
+function createPath(char, scale, offsetX, offsetY, data) {
+    const glyph = data.glyphs[char] || data.glyphs['?'];
+
+    if (!glyph) {
+        console.error('THREE.Font: character "' + char + '" does not exists in font family ' + data.familyName + '.');
+
+        return;
+    }
+
+    const path = new ShapePath();
+
+    let x, y, cpx, cpy, cpx1, cpy1, cpx2, cpy2;
+
+    if (glyph.o) {
+        const outline = glyph._cachedOutline || (glyph._cachedOutline = glyph.o.split(' '));
+
+        for (let i = 0, l = outline.length; i < l; ) {
+            const action = outline[i++];
+
+            switch (action) {
+                case 'm': // moveTo
+                    x = outline[i++] * scale + offsetX;
+                    y = outline[i++] * scale + offsetY;
+
+                    path.moveTo(x, y);
+
+                    break;
+
+                case 'l': // lineTo
+                    x = outline[i++] * scale + offsetX;
+                    y = outline[i++] * scale + offsetY;
+
+                    path.lineTo(x, y);
+
+                    break;
+
+                case 'q': // quadraticCurveTo
+                    cpx = outline[i++] * scale + offsetX;
+                    cpy = outline[i++] * scale + offsetY;
+                    cpx1 = outline[i++] * scale + offsetX;
+                    cpy1 = outline[i++] * scale + offsetY;
+
+                    path.quadraticCurveTo(cpx1, cpy1, cpx, cpy);
+
+                    break;
+
+                case 'b': // bezierCurveTo
+                    cpx = outline[i++] * scale + offsetX;
+                    cpy = outline[i++] * scale + offsetY;
+                    cpx1 = outline[i++] * scale + offsetX;
+                    cpy1 = outline[i++] * scale + offsetY;
+                    cpx2 = outline[i++] * scale + offsetX;
+                    cpy2 = outline[i++] * scale + offsetY;
+
+                    path.bezierCurveTo(cpx1, cpy1, cpx2, cpy2, cpx, cpy);
+
+                    break;
+            }
+        }
+    }
+
+    return { offsetX: glyph.ha * scale, path: path };
+}
+
+export { Font };

package/src/threeFont/TextGeometry/Path.js

@@ -0,0 +1,146 @@
+import { Vector2 } from '../Math/Vector2.js';
+import { CurvePath } from '../Curve/CurvePath.js';
+import { EllipseCurve } from '../curves/EllipseCurve.js';
+import { SplineCurve } from '../curves/SplineCurve.js';
+import { CubicBezierCurve } from '../curves/CubicBezierCurve.js';
+import { QuadraticBezierCurve } from '../curves/QuadraticBezierCurve.js';
+import { LineCurve } from '../curves/LineCurve.js';
+
+class Path extends CurvePath {
+    constructor(points) {
+        super();
+
+        this.type = 'Path';
+        this.currentPoint = new Vector2();
+
+        if (points) {
+            this.setFromPoints(points);
+        }
+    }
+
+    setFromPoints(points) {
+        this.moveTo(points[0].x, points[0].y);
+
+        for (let i = 1, l = points.length; i < l; i++) {
+            this.lineTo(points[i].x, points[i].y);
+        }
+
+        return this;
+    }
+
+    moveTo(x, y) {
+        this.currentPoint.set(x, y); // TODO consider referencing vectors instead of copying?
+
+        return this;
+    }
+
+    lineTo(x, y) {
+        const curve = new LineCurve(this.currentPoint.clone(), new Vector2(x, y));
+        this.curves.push(curve);
+
+        this.currentPoint.set(x, y);
+
+        return this;
+    }
+
+    quadraticCurveTo(aCPx, aCPy, aX, aY) {
+        const curve = new QuadraticBezierCurve(this.currentPoint.clone(), new Vector2(aCPx, aCPy), new Vector2(aX, aY));
+
+        this.curves.push(curve);
+
+        this.currentPoint.set(aX, aY);
+
+        return this;
+    }
+
+    bezierCurveTo(aCP1x, aCP1y, aCP2x, aCP2y, aX, aY) {
+        const curve = new CubicBezierCurve(this.currentPoint.clone(), new Vector2(aCP1x, aCP1y), new Vector2(aCP2x, aCP2y), new Vector2(aX, aY));
+
+        this.curves.push(curve);
+
+        this.currentPoint.set(aX, aY);
+
+        return this;
+    }
+
+    splineThru(pts /*Array of Vector*/) {
+        const npts = [this.currentPoint.clone()].concat(pts);
+
+        const curve = new SplineCurve(npts);
+        this.curves.push(curve);
+
+        this.currentPoint.copy(pts[pts.length - 1]);
+
+        return this;
+    }
+
+    arc(aX, aY, aRadius, aStartAngle, aEndAngle, aClockwise) {
+        const x0 = this.currentPoint.x;
+        const y0 = this.currentPoint.y;
+
+        this.absarc(aX + x0, aY + y0, aRadius, aStartAngle, aEndAngle, aClockwise);
+
+        return this;
+    }
+
+    absarc(aX, aY, aRadius, aStartAngle, aEndAngle, aClockwise) {
+        this.absellipse(aX, aY, aRadius, aRadius, aStartAngle, aEndAngle, aClockwise);
+
+        return this;
+    }
+
+    ellipse(aX, aY, xRadius, yRadius, aStartAngle, aEndAngle, aClockwise, aRotation) {
+        const x0 = this.currentPoint.x;
+        const y0 = this.currentPoint.y;
+
+        this.absellipse(aX + x0, aY + y0, xRadius, yRadius, aStartAngle, aEndAngle, aClockwise, aRotation);
+
+        return this;
+    }
+
+    absellipse(aX, aY, xRadius, yRadius, aStartAngle, aEndAngle, aClockwise, aRotation) {
+        const curve = new EllipseCurve(aX, aY, xRadius, yRadius, aStartAngle, aEndAngle, aClockwise, aRotation);
+
+        if (this.curves.length > 0) {
+            // if a previous curve is present, attempt to join
+            const firstPoint = curve.getPoint(0);
+
+            if (!firstPoint.equals(this.currentPoint)) {
+                this.lineTo(firstPoint.x, firstPoint.y);
+            }
+        }
+
+        this.curves.push(curve);
+
+        const lastPoint = curve.getPoint(1);
+        this.currentPoint.copy(lastPoint);
+
+        return this;
+    }
+
+    copy(source) {
+        super.copy(source);
+
+        this.currentPoint.copy(source.currentPoint);
+
+        return this;
+    }
+
+    toJSON() {
+        const data = super.toJSON();
+
+        data.currentPoint = this.currentPoint.toArray();
+
+        return data;
+    }
+
+    fromJSON(json) {
+        super.fromJSON(json);
+
+        this.currentPoint.fromArray(json.currentPoint);
+
+        return this;
+    }
+}
+
+export { Path };

package/src/threeFont/TextGeometry/ShapePath.js

@@ -0,0 +1,222 @@
+import { Path } from './Path.js';
+import { Shape } from '../Curve/Shape.js';
+import { ShapeUtils } from '../TextGeometry/ShapeUtils.js';
+
+class ShapePath {
+    constructor() {
+        this.type = 'ShapePath';
+        this.color = [1.0, 1.0, 1.0];
+
+        this.subPaths = [];
+        this.currentPath = null;
+    }
+
+    moveTo(x, y) {
+        this.currentPath = new Path();
+        this.subPaths.push(this.currentPath);
+        this.currentPath.moveTo(x, y);
+
+        return this;
+    }
+
+    lineTo(x, y) {
+        this.currentPath.lineTo(x, y);
+
+        return this;
+    }
+
+    quadraticCurveTo(aCPx, aCPy, aX, aY) {
+        this.currentPath.quadraticCurveTo(aCPx, aCPy, aX, aY);
+
+        return this;
+    }
+
+    bezierCurveTo(aCP1x, aCP1y, aCP2x, aCP2y, aX, aY) {
+        this.currentPath.bezierCurveTo(aCP1x, aCP1y, aCP2x, aCP2y, aX, aY);
+
+        return this;
+    }
+
+    splineThru(pts) {
+        this.currentPath.splineThru(pts);
+
+        return this;
+    }
+
+    toShapes(isCCW) {
+        function toShapesNoHoles(inSubpaths) {
+            const shapes = [];
+
+            for (let i = 0, l = inSubpaths.length; i < l; i++) {
+                const tmpPath = inSubpaths[i];
+
+                const tmpShape = new Shape();
+                tmpShape.curves = tmpPath.curves;
+
+                shapes.push(tmpShape);
+            }
+
+            return shapes;
+        }
+
+        function isPointInsidePolygon(inPt, inPolygon) {
+            const polyLen = inPolygon.length;
+
+            // inPt on polygon contour => immediate success    or
+            // toggling of inside/outside at every single! intersection point of an edge
+            //  with the horizontal line through inPt, left of inPt
+            //  not counting lowerY endpoints of edges and whole edges on that line
+            let inside = false;
+            for (let p = polyLen - 1, q = 0; q < polyLen; p = q++) {
+                let edgeLowPt = inPolygon[p];
+                let edgeHighPt = inPolygon[q];
+
+                let edgeDx = edgeHighPt.x - edgeLowPt.x;
+                let edgeDy = edgeHighPt.y - edgeLowPt.y;
+
+                if (Math.abs(edgeDy) > Number.EPSILON) {
+                    // not parallel
+                    if (edgeDy < 0) {
+                        edgeLowPt = inPolygon[q];
+                        edgeDx = -edgeDx;
+                        edgeHighPt = inPolygon[p];
+                        edgeDy = -edgeDy;
+                    }
+
+                    if (inPt.y < edgeLowPt.y || inPt.y > edgeHighPt.y) continue;
+
+                    if (inPt.y === edgeLowPt.y) {
+                        if (inPt.x === edgeLowPt.x) return true; // inPt is on contour ?
+                        // continue;				// no intersection or edgeLowPt => doesn't count !!!
+                    } else {
+                        const perpEdge = edgeDy * (inPt.x - edgeLowPt.x) - edgeDx * (inPt.y - edgeLowPt.y);
+                        if (perpEdge === 0) return true; // inPt is on contour ?
+                        if (perpEdge < 0) continue;
+                        inside = !inside; // true intersection left of inPt
+                    }
+                } else {
+                    // parallel or collinear
+                    if (inPt.y !== edgeLowPt.y) continue; // parallel
+                    // edge lies on the same horizontal line as inPt
+                    if ((edgeHighPt.x <= inPt.x && inPt.x <= edgeLowPt.x) || (edgeLowPt.x <= inPt.x && inPt.x <= edgeHighPt.x)) return true; // inPt: Point on contour !
+                    // continue;
+                }
+            }
+
+            return inside;
+        }
+
+        const isClockWise = ShapeUtils.isClockWise;
+
+        const subPaths = this.subPaths;
+        if (subPaths.length === 0) return [];
+
+        let solid, tmpPath, tmpShape;
+        const shapes = [];
+
+        if (subPaths.length === 1) {
+            tmpPath = subPaths[0];
+            tmpShape = new Shape();
+            tmpShape.curves = tmpPath.curves;
+            shapes.push(tmpShape);
+            return shapes;
+        }
+
+        let holesFirst = !isClockWise(subPaths[0].getPoints());
+        holesFirst = isCCW ? !holesFirst : holesFirst;
+
+        // console.log("Holes first", holesFirst);
+
+        const betterShapeHoles = [];
+        const newShapes = [];
+        let newShapeHoles = [];
+        let mainIdx = 0;
+        let tmpPoints;
+
+        newShapes[mainIdx] = undefined;
+        newShapeHoles[mainIdx] = [];
+
+        for (let i = 0, l = subPaths.length; i < l; i++) {
+            tmpPath = subPaths[i];
+            tmpPoints = tmpPath.getPoints();
+            solid = isClockWise(tmpPoints);
+            solid = isCCW ? !solid : solid;
+
+            if (solid) {
+                if (!holesFirst && newShapes[mainIdx]) mainIdx++;
+
+                newShapes[mainIdx] = { s: new Shape(), p: tmpPoints };
+                newShapes[mainIdx].s.curves = tmpPath.curves;
+
+                if (holesFirst) mainIdx++;
+                newShapeHoles[mainIdx] = [];
+
+                //console.log('cw', i);
+            } else {
+                newShapeHoles[mainIdx].push({ h: tmpPath, p: tmpPoints[0] });
+
+                //console.log('ccw', i);
+            }
+        }
+
+        // only Holes? -> probably all Shapes with wrong orientation
+        if (!newShapes[0]) return toShapesNoHoles(subPaths);
+
+        if (newShapes.length > 1) {
+            let ambiguous = false;
+            let toChange = 0;
+
+            for (let sIdx = 0, sLen = newShapes.length; sIdx < sLen; sIdx++) {
+                betterShapeHoles[sIdx] = [];
+            }
+
+            for (let sIdx = 0, sLen = newShapes.length; sIdx < sLen; sIdx++) {
+                const sho = newShapeHoles[sIdx];
+
+                for (let hIdx = 0; hIdx < sho.length; hIdx++) {
+                    const ho = sho[hIdx];
+                    let hole_unassigned = true;
+
+                    for (let s2Idx = 0; s2Idx < newShapes.length; s2Idx++) {
+                        if (isPointInsidePolygon(ho.p, newShapes[s2Idx].p)) {
+                            if (sIdx !== s2Idx) toChange++;
+
+                            if (hole_unassigned) {
+                                hole_unassigned = false;
+                                betterShapeHoles[s2Idx].push(ho);
+                            } else {
+                                ambiguous = true;
+                            }
+                        }
+                    }
+
+                    if (hole_unassigned) {
+                        betterShapeHoles[sIdx].push(ho);
+                    }
+                }
+            }
+
+            if (toChange > 0 && ambiguous === false) {
+                newShapeHoles = betterShapeHoles;
+            }
+        }
+
+        let tmpHoles;
+
+        for (let i = 0, il = newShapes.length; i < il; i++) {
+            tmpShape = newShapes[i].s;
+            shapes.push(tmpShape);
+            tmpHoles = newShapeHoles[i];
+
+            for (let j = 0, jl = tmpHoles.length; j < jl; j++) {
+                tmpShape.holes.push(tmpHoles[j].h);
+            }
+        }
+
+        //console.log("shape", shapes);
+
+        return shapes;
+    }
+}
+
+export { ShapePath };

package/src/threeFont/TextGeometry/ShapeUtils.js

@@ -0,0 +1,70 @@
+import { Earcut } from './Earcut.js';
+
+class ShapeUtils {
+    // calculate area of the contour polygon
+
+    static area(contour) {
+        const n = contour.length;
+        let a = 0.0;
+
+        for (let p = n - 1, q = 0; q < n; p = q++) {
+            a += contour[p].x * contour[q].y - contour[q].x * contour[p].y;
+        }
+
+        return a * 0.5;
+    }
+
+    static isClockWise(pts) {
+        return ShapeUtils.area(pts) < 0;
+    }
+
+    static triangulateShape(contour, holes) {
+        const vertices = []; // flat array of vertices like [ x0,y0, x1,y1, x2,y2, ... ]
+        const holeIndices = []; // array of hole indices
+        const faces = []; // final array of vertex indices like [ [ a,b,d ], [ b,c,d ] ]
+
+        removeDupEndPts(contour);
+        addContour(vertices, contour);
+
+        //
+
+        let holeIndex = contour.length;
+
+        holes.forEach(removeDupEndPts);
+
+        for (let i = 0; i < holes.length; i++) {
+            holeIndices.push(holeIndex);
+            holeIndex += holes[i].length;
+            addContour(vertices, holes[i]);
+        }
+
+        //
+
+        const triangles = Earcut.triangulate(vertices, holeIndices);
+
+        //
+
+        for (let i = 0; i < triangles.length; i += 3) {
+            faces.push(triangles.slice(i, i + 3));
+        }
+
+        return faces;
+    }
+}
+
+function removeDupEndPts(points) {
+    const l = points.length;
+
+    if (l > 2 && points[l - 1].equals(points[0])) {
+        points.pop();
+    }
+}
+
+function addContour(vertices, contour) {
+    for (let i = 0; i < contour.length; i++) {
+        vertices.push(contour[i].x);
+        vertices.push(contour[i].y);
+    }
+}
+
+export { ShapeUtils };

package/src/threeFont/curves/CubicBezierCurve.js

@@ -0,0 +1,66 @@
+import { Curve } from '../Curve/Curve.js';
+import { Vector2 } from '../Math/Vector2.js';
+import { CubicBezier } from '../Curve/Interpolations.js';
+
+class CubicBezierCurve extends Curve {
+    constructor(v0 = new Vector2(), v1 = new Vector2(), v2 = new Vector2(), v3 = new Vector2()) {
+        super();
+
+        this.isCubicBezierCurve = true;
+
+        this.type = 'CubicBezierCurve';
+
+        this.v0 = v0;
+        this.v1 = v1;
+        this.v2 = v2;
+        this.v3 = v3;
+    }
+
+    getPoint(t, optionalTarget = new Vector2()) {
+        const point = optionalTarget;
+
+        const v0 = this.v0,
+            v1 = this.v1,
+            v2 = this.v2,
+            v3 = this.v3;
+
+        point.set(CubicBezier(t, v0.x, v1.x, v2.x, v3.x), CubicBezier(t, v0.y, v1.y, v2.y, v3.y));
+
+        return point;
+    }
+
+    copy(source) {
+        super.copy(source);
+
+        this.v0.copy(source.v0);
+        this.v1.copy(source.v1);
+        this.v2.copy(source.v2);
+        this.v3.copy(source.v3);
+
+        return this;
+    }
+
+    toJSON() {
+        const data = super.toJSON();
+
+        data.v0 = this.v0.toArray();
+        data.v1 = this.v1.toArray();
+        data.v2 = this.v2.toArray();
+        data.v3 = this.v3.toArray();
+
+        return data;
+    }
+
+    fromJSON(json) {
+        super.fromJSON(json);
+
+        this.v0.fromArray(json.v0);
+        this.v1.fromArray(json.v1);
+        this.v2.fromArray(json.v2);
+        this.v3.fromArray(json.v3);
+
+        return this;
+    }
+}
+
+export { CubicBezierCurve };

package/src/threeFont/curves/Curves.js

@@ -0,0 +1,10 @@
+// export { ArcCurve } from './ArcCurve.js';
+// export { CatmullRomCurve3 } from './CatmullRomCurve3.js';
+// export { CubicBezierCurve } from './CubicBezierCurve.js';
+// export { CubicBezierCurve3 } from './CubicBezierCurve3.js';
+// export { EllipseCurve } from './EllipseCurve.js';
+export { LineCurve } from './LineCurve.js';
+// export { LineCurve3 } from './LineCurve3.js';
+// export { QuadraticBezierCurve } from './QuadraticBezierCurve.js';
+// export { QuadraticBezierCurve3 } from './QuadraticBezierCurve3.js';
+// export { SplineCurve } from './SplineCurve.js';