toosoon-utils 4.1.9 → 4.2.0

package/lib/extras/paths/PathSVG.d.ts

@@ -1,14 +1,9 @@
-import Curve from '../curves/Curve';
-import LineCurve from '../curves/LineCurve';
-import PolylineCurve from '../curves/PolylineCurve';
-import QuadraticBezierCurve from '../curves/QuadraticBezierCurve';
-import CubicBezierCurve from '../curves/CubicBezierCurve';
-import CatmullRomCurve from '../curves/CatmullRomCurve';
-import SplineCurve from '../curves/SplineCurve';
-import EllipseCurve from '../curves/EllipseCurve';
-import ArcCurve from '../curves/ArcCurve';
+import { Curve, LineCurve, PolylineCurve, QuadraticBezierCurve, CubicBezierCurve, CatmullRomCurve, SplineCurve, EllipseCurve, ArcCurve } from '../curves';
+import { type Vector2 } from '../geometry';
 import PathContext from './PathContext';
-export type SerializationParams = {
+import Path from './Path';
+export type PathSVGSerializationParams = {
+    approximate?: boolean;
     curveResolution?: number;
 };
 /**
@@ -21,80 +16,97 @@ export type SerializationParams = {
  * @extends PathContext
  */
 export default class PathSVG extends PathContext {
+    /**
+     * Convert a {@link Curve} into spaced points
+     *
+     * @param {Curve} curve Curve to approximate
+     * @param {number} [resolution=5] Approximation resolution
+     * @returns
+     */
+    static approximate(curve: Curve<Vector2>, resolution?: number): Vector2[];
     /**
      * Serialize a {@link Curve}
      *
-     * @param {Curve} curve
-     * @param {object} [params.curveResolution=5] Resolution used for Catmull-Rom curves and Spline curves approximations
+     * @param {Curve} curve Curve to serialize
+     * @param {object} [params] Serialization parameters
+     * @param {boolean} [params.approximate]    Flag indicating if given curve should be approximated into straight lines
+     * @param {number} [params.curveResolution] Resolution used for curve approximations
      * @returns string
      */
-    static serialize(curve: Curve, { curveResolution }?: SerializationParams): string;
+    static serialize(curve: Curve<Vector2>, { approximate, curveResolution }?: PathSVGSerializationParams): string;
     /**
      * Serialize a {@link LineCurve}
      *
-     * @param {LineCurve} curve
+     * @param {LineCurve} curve LineCurve to serialize
      * @returns string
      */
     static serializeLineCurve(curve: LineCurve): string;
     /**
      * Serialize a {@link PolylineCurve}
      *
-     * @param {PolylineCurve} curve
+     * @param {PolylineCurve} curve PolylineCurve to serialize
      * @returns string
      */
     static serializePolylineCurve(curve: PolylineCurve): string;
     /**
      * Serialize a {@link QuadraticBezierCurve}
      *
-     * @param {QuadraticBezierCurve} curve
+     * @param {QuadraticBezierCurve} curve QuadraticBezierCurve to serialize
      * @returns string
      */
     static serializeQuadraticBezierCurve(curve: QuadraticBezierCurve): string;
     /**
      * Serialize a {@link CubicBezierCurve}
      *
-     * @param {CubicBezierCurve} curve
+     * @param {CubicBezierCurve} curve CubicBezierCurve to serialize
      * @returns string
      */
     static serializeCubicBezierCurve(curve: CubicBezierCurve): string;
     /**
-     * Serialize a {@link CatmullRomCurve}
+     * Serialize a {@link CatmullRomCurve} by approximating it into straight lines
      *
-     * @param {CatmullRomCurve} curve
-     * @param {object} params
-     * @param {number} [params.curveResolution=5]
+     * @param {CatmullRomCurve} curve CatmullRomCurve to serialize
+     * @param {number} [curveResolution] Approximation resolution
      * @returns string
      */
-    static serializeCatmullRomCurve(curve: CatmullRomCurve, { curveResolution }: Pick<SerializationParams, 'curveResolution'>): string;
+    static serializeCatmullRomCurve(curve: CatmullRomCurve, curveResolution?: number): string;
     /**
-     * Serialize a {@link SplineCurve}
+     * Serialize a {@link SplineCurve} by approximating it into straight lines
      *
-     * @param {SplineCurve} curve
-     * @param {object} params
-     * @param {number} [params.curveResolution=5]
+     * @param {SplineCurve} curve SplineCurve to serialize
+     * @param {number} [curveResolution] Approximation resolution
      * @returns string
      */
-    static serializeSplineCurve(curve: SplineCurve, { curveResolution }: Pick<SerializationParams, 'curveResolution'>): string;
+    static serializeSplineCurve(curve: SplineCurve, curveResolution?: number): string;
     /**
      * Serialize an {@link EllipseCurve}
      *
-     * @param {EllipseCurve} curve
+     * @param {EllipseCurve} curve EllipseCurve to serialize
      * @returns string
      */
     static serializeEllipseCurve(curve: EllipseCurve): string;
     /**
      * Serialize an {@link ArcCurve}
      *
-     * @param {ArcCurve} curve
+     * @param {ArcCurve} curve ArcCurve to serialize
      * @returns string
      */
     static serializeArcCurve(curve: ArcCurve): string;
+    /**
+     * Serialize an {@link Path}
+     *
+     * @param {Path} path Path to serialize
+     * @param {object} [params]
+     * @param {object} [params.curveResolution] Resolution used for curves approximations
+     * @returns string
+     */
+    static serializePath(path: Path<Vector2>, params?: PathSVGSerializationParams): string;
     /**
      * Return SVG path data string
      *
      * @param {object} [params]
-     * @param {object} [params.curveResolution=5] Resolution used for Catmull-Rom curves and Spline curves approximations
+     * @param {object} [params.curveResolution] Resolution used for curves approximations
      * @returns {string}
      */
-    toString(params?: SerializationParams): string;
+    toString(params?: PathSVGSerializationParams): string;
 }

package/lib/extras/paths/PathSVG.js

@@ -1,13 +1,6 @@
-import { EPSILON, PI, TWO_PI, TAU_EPSILON } from '../../constants';
-import { isCoincident, toDegrees } from '../../geometry';
-import LineCurve from '../curves/LineCurve';
-import PolylineCurve from '../curves/PolylineCurve';
-import QuadraticBezierCurve from '../curves/QuadraticBezierCurve';
-import CubicBezierCurve from '../curves/CubicBezierCurve';
-import CatmullRomCurve from '../curves/CatmullRomCurve';
-import SplineCurve from '../curves/SplineCurve';
-import EllipseCurve from '../curves/EllipseCurve';
-import ArcCurve from '../curves/ArcCurve';
+import { EPSILON, PI, TWO_PI } from '../../constants';
+import { toDegrees } from '../../geometry';
+import { LineCurve, PolylineCurve, QuadraticBezierCurve, CubicBezierCurve, CatmullRomCurve, SplineCurve, EllipseCurve, ArcCurve } from '../curves';
 import PathContext from './PathContext';
 /**
  * Utility class for manipulating connected curves and generating SVG path
@@ -19,14 +12,31 @@ import PathContext from './PathContext';
  * @extends PathContext
  */
 export default class PathSVG extends PathContext {
+    /**
+     * Convert a {@link Curve} into spaced points
+     *
+     * @param {Curve} curve Curve to approximate
+     * @param {number} [resolution=5] Approximation resolution
+     * @returns
+     */
+    static approximate(curve, resolution = 5) {
+        const divisions = (curve.getLength() * resolution) / 100;
+        return curve.getSpacedPoints(divisions);
+    }
     /**
      * Serialize a {@link Curve}
      *
-     * @param {Curve} curve
-     * @param {object} [params.curveResolution=5] Resolution used for Catmull-Rom curves and Spline curves approximations
+     * @param {Curve} curve Curve to serialize
+     * @param {object} [params] Serialization parameters
+     * @param {boolean} [params.approximate]    Flag indicating if given curve should be approximated into straight lines
+     * @param {number} [params.curveResolution] Resolution used for curve approximations
      * @returns string
      */
-    static serialize(curve, { curveResolution } = {}) {
+    static serialize(curve, { approximate, curveResolution } = {}) {
+        if (approximate === true) {
+            const points = PathSVG.approximate(curve, curveResolution);
+            return points.map(([x, y]) => `L${x},${y}`).join(' ');
+        }
         if (curve instanceof LineCurve) {
             return PathSVG.serializeLineCurve(curve);
         }
@@ -40,10 +50,10 @@ export default class PathSVG extends PathContext {
             return PathSVG.serializeCubicBezierCurve(curve);
         }
         if (curve instanceof CatmullRomCurve) {
-            return PathSVG.serializeCatmullRomCurve(curve, { curveResolution });
+            return PathSVG.serializeCatmullRomCurve(curve, curveResolution);
         }
         if (curve instanceof SplineCurve) {
-            return PathSVG.serializeSplineCurve(curve, { curveResolution });
+            return PathSVG.serializeSplineCurve(curve, curveResolution);
         }
         if (curve instanceof EllipseCurve) {
             return PathSVG.serializeEllipseCurve(curve);
@@ -56,7 +66,7 @@ export default class PathSVG extends PathContext {
     /**
      * Serialize a {@link LineCurve}
      *
-     * @param {LineCurve} curve
+     * @param {LineCurve} curve LineCurve to serialize
      * @returns string
      */
     static serializeLineCurve(curve) {
@@ -66,7 +76,7 @@ export default class PathSVG extends PathContext {
     /**
      * Serialize a {@link PolylineCurve}
      *
-     * @param {PolylineCurve} curve
+     * @param {PolylineCurve} curve PolylineCurve to serialize
      * @returns string
      */
     static serializePolylineCurve(curve) {
@@ -76,7 +86,7 @@ export default class PathSVG extends PathContext {
     /**
      * Serialize a {@link QuadraticBezierCurve}
      *
-     * @param {QuadraticBezierCurve} curve
+     * @param {QuadraticBezierCurve} curve QuadraticBezierCurve to serialize
      * @returns string
      */
     static serializeQuadraticBezierCurve(curve) {
@@ -86,7 +96,7 @@ export default class PathSVG extends PathContext {
     /**
      * Serialize a {@link CubicBezierCurve}
      *
-     * @param {CubicBezierCurve} curve
+     * @param {CubicBezierCurve} curve CubicBezierCurve to serialize
      * @returns string
      */
     static serializeCubicBezierCurve(curve) {
@@ -94,39 +104,31 @@ export default class PathSVG extends PathContext {
         return `C${cp1x},${cp1y},${cp2x},${cp2y},${x2},${y2}`;
     }
     /**
-     * Serialize a {@link CatmullRomCurve}
+     * Serialize a {@link CatmullRomCurve} by approximating it into straight lines
      *
-     * @param {CatmullRomCurve} curve
-     * @param {object} params
-     * @param {number} [params.curveResolution=5]
+     * @param {CatmullRomCurve} curve CatmullRomCurve to serialize
+     * @param {number} [curveResolution] Approximation resolution
      * @returns string
      */
-    static serializeCatmullRomCurve(curve, { curveResolution = 5 }) {
-        const divisions = (curve.getLength() * curveResolution) / 100;
-        return curve
-            .getSpacedPoints(divisions)
-            .map(([x, y]) => `L${x},${y}`)
-            .join(' ');
+    static serializeCatmullRomCurve(curve, curveResolution) {
+        const points = PathSVG.approximate(curve, curveResolution);
+        return points.map(([x, y]) => `L${x},${y}`).join(' ');
     }
     /**
-     * Serialize a {@link SplineCurve}
+     * Serialize a {@link SplineCurve} by approximating it into straight lines
      *
-     * @param {SplineCurve} curve
-     * @param {object} params
-     * @param {number} [params.curveResolution=5]
+     * @param {SplineCurve} curve SplineCurve to serialize
+     * @param {number} [curveResolution] Approximation resolution
      * @returns string
      */
-    static serializeSplineCurve(curve, { curveResolution = 5 }) {
-        const divisions = (curve.getLength() * curveResolution) / 100;
-        return curve
-            .getSpacedPoints(divisions)
-            .map(([x, y]) => `L${x},${y}`)
-            .join(' ');
+    static serializeSplineCurve(curve, curveResolution) {
+        const points = PathSVG.approximate(curve, curveResolution);
+        return points.map(([x, y]) => `L${x},${y}`).join(' ');
     }
     /**
      * Serialize an {@link EllipseCurve}
      *
-     * @param {EllipseCurve} curve
+     * @param {EllipseCurve} curve EllipseCurve to serialize
      * @returns string
      */
     static serializeEllipseCurve(curve) {
@@ -137,7 +139,7 @@ export default class PathSVG extends PathContext {
         const xAxisRotation = toDegrees(rotation);
         const largeArcFlag = deltaAngle >= PI ? 1 : 0;
         const sweepFlag = counterclockwise ? 0 : 1;
-        if (deltaAngle > TAU_EPSILON) {
+        if (deltaAngle > TWO_PI - EPSILON) {
             const dx = Math.cos(startAngle) * rx;
             const dy = Math.sin(startAngle) * ry;
             return (`A${rx},${ry},${xAxisRotation},1,${sweepFlag},${cx - dx},${cy - dy}` +
@@ -153,35 +155,46 @@ export default class PathSVG extends PathContext {
     /**
      * Serialize an {@link ArcCurve}
      *
-     * @param {ArcCurve} curve
+     * @param {ArcCurve} curve ArcCurve to serialize
      * @returns string
      */
     static serializeArcCurve(curve) {
         return PathSVG.serializeEllipseCurve(curve);
     }
     /**
-     * Return SVG path data string
+     * Serialize an {@link Path}
      *
+     * @param {Path} path Path to serialize
      * @param {object} [params]
-     * @param {object} [params.curveResolution=5] Resolution used for Catmull-Rom curves and Spline curves approximations
-     * @returns {string}
+     * @param {object} [params.curveResolution] Resolution used for curves approximations
+     * @returns string
      */
-    toString(params = {}) {
-        return this.curves
+    static serializePath(path, params = {}) {
+        return path.subpaths
             .map((curve, index) => {
             let commands = ``;
-            const lastPoint = index === 0 ? this.curves[0]?.getPoint(0) : this.curves[index - 1]?.getPoint(1);
-            if (index === 0 || !isCoincident(...lastPoint, ...curve.getPoint(0))) {
-                commands += `M${lastPoint[0]},${lastPoint[1]}`;
+            const previousPoint = path.subpaths[index - 1]?.getPoint(1);
+            const newPoint = curve.getPoint(0);
+            if (!previousPoint?.equals(newPoint)) {
+                commands += `M${newPoint.x},${newPoint.y}`;
             }
-            // commands += PathSVG.serialize(curve, params);
-            const divisions = curve.getLength() / 50;
-            commands += curve
-                .getSpacedPoints(divisions)
-                .map(([x, y]) => `L${x},${y}`)
-                .join(' ');
+            commands += PathSVG.serialize(curve, params);
             return commands;
         })
             .join(' ');
     }
+    /**
+     * Return SVG path data string
+     *
+     * @param {object} [params]
+     * @param {object} [params.curveResolution] Resolution used for curves approximations
+     * @returns {string}
+     */
+    toString(params = {}) {
+        let commands = ``;
+        const firstPoint = this.subpaths[0]?.getPoint(0);
+        commands += `M${firstPoint.x},${firstPoint.y}`;
+        commands += PathSVG.serialize(this, params);
+        return commands;
+    }
 }

package/lib/geometry.d.ts

@@ -1,4 +1,3 @@
-import type { Point, Point3 } from './types';
 /**
  * Convert a radians value into degrees
  *
@@ -41,26 +40,6 @@ export declare function closestAngle(source: number, target: number): number;
  * @returns {number} Computed distance
  */
 export declare function distance(x1: number, y1: number, x2: number, y2: number): number;
-/**
- * Calculate the dot product of two vectors
- *
- * @param {number} x1 X-axis coordinate of the first vector
- * @param {number} y1 Y-axis coordinate of the first vector
- * @param {number} x2 X-axis coordinate of the second vector
- * @param {number} y2 Y-axis coordinate of the second vector
- * @returns {number} Computed dot product
- */
-export declare function dot(x1: number, y1: number, x2: number, y2: number): number;
-/**
- * Calculate the cross product of two vectors
- *
- * @param {number} x1 X-axis coordinate of the first vector
- * @param {number} y1 Y-axis coordinate of the first vector
- * @param {number} x2 X-axis coordinate of the second vector
- * @param {number} y2 Y-axis coordinate of the second vector
- * @returns {number} Computed cross product
- */
-export declare function cross(x1: number, y1: number, x2: number, y2: number): number;
 /**
  * Calculate the length of the diagonal of a rectangle
  *
@@ -69,120 +48,6 @@ export declare function cross(x1: number, y1: number, x2: number, y2: number): n
  * @returns {number} Diagonal length
  */
 export declare function diagonal(width: number, height: number): number;
-/**
- * Convert radians to a 3D point on the surface of a unit sphere
- *
- * @param  {number} radius  Radius of the sphere
- * @param  {number} phi     Polar angle from the y (up) axis     : [0, PI]
- * @param  {number} theta   Equator angle around the y (up) axis : [0, 2*PI]
- * @param  {Point3} target Target 3D point
- * @returns {Point3}
- */
-export declare function radToSphere(radius: number, phi: number, theta: number, target?: Point3): Point3;
-/**
- * Interpolate a point on a line
- *
- * @param {number} t  Normalized time value to interpolate
- * @param {number} x1 X-axis coordinate of the start point
- * @param {number} y1 Y-axis coordinate of the start point
- * @param {number} x2 X-axis coordinate of the end point
- * @param {number} y2 Y-axis coordinate of the end point
- * @returns {Point} Interpolated coordinates on the line
- */
-export declare function line(t: number, x1: number, y1: number, x2: number, y2: number): Point;
-/**
- * Interpolate a point on a Quadratic Bézier curve
- *
- * @param {number} t   Normalized time value to interpolate
- * @param {number} x1  X-axis coordinate of the start point
- * @param {number} y1  Y-axis coordinate of the start point
- * @param {number} cpx X-axis coordinate of the control point
- * @param {number} cpy Y-axis coordinate of the control point
- * @param {number} x2  X-axis coordinate of the end point
- * @param {number} y2  Y-axis coordinate of the end point
- * @returns {Point} Interpolated coordinates on the curve
- */
-export declare function quadraticBezier(t: number, x1: number, y1: number, cpx: number, cpy: number, x2: number, y2: number): Point;
-/**
- * Interpolate a point on a Cubic Bézier curve
- *
- * @param {number} t    Normalized time value to interpolate
- * @param {number} x1   X-axis coordinate of the start point
- * @param {number} y1   Y-axis coordinate of the start point
- * @param {number} cp1x X-axis coordinate of the first control point
- * @param {number} cp1y Y-axis coordinate of the first control point
- * @param {number} cp2x X-axis coordinate of the second control point
- * @param {number} cp2y Y-axis coordinate of the second control point
- * @param {number} x2   X-axis coordinate of the end point
- * @param {number} y2   Y-axis coordinate of the end point
- * @returns {Point} Interpolated coordinates on the curve
- */
-export declare function cubicBezier(t: number, x1: number, y1: number, cp1x: number, cp1y: number, cp2x: number, cp2y: number, x2: number, y2: number): Point;
-/**
- * Interpolate a point on a Catmull-Rom spline
- *
- * @param {number} t   Normalized time value to interpolate
- * @param {number} x1  X-axis coordinate of the start point
- * @param {number} y1  Y-axis coordinate of the start point
- * @param {number} cp1x X-axis coordinate of the first control point
- * @param {number} cp1y Y-axis coordinate of the first control point
- * @param {number} cp2x X-axis coordinate of the second control point
- * @param {number} cp2y Y-axis coordinate of the second control point
- * @param {number} x2  X-axis coordinate of the end point
- * @param {number} y2  Y-axis coordinate of the end point
- * @returns {Point} Interpolated coordinates on the spline
- */
-export declare function catmullRom(t: number, x1: number, y1: number, cp1x: number, cp1y: number, cp2x: number, cp2y: number, x2: number, y2: number): Point;
-/**
- * Interpolate a point on an elliptical arc
- *
- * @param {number} t  Normalized time value to interpolate
- * @param {number} cx X-axis coordinate of the center of the ellipse
- * @param {number} cy Y-axis coordinate of the center of the ellipse
- * @param {number} rx X-radius of the ellipse
- * @param {number} ry Y-radius of the ellipse
- * @param {number} [rotation=0] Rotation angle of the ellipse (in radians), counterclockwise from the positive X-axis
- * @param {number} [startAngle=0]  Start angle of the arc (in radians)
- * @param {number} [endAngle=2*PI] End angle of the arc (in radians)
- * @param {boolean} [counterclockwise=false] Flag indicating the direction of the arc
- * @returns {Point} Interpolated coordinates on the arc
- */
-export declare function ellipse(t: number, cx: number, cy: number, rx: number, ry: number, rotation?: number, startAngle?: number, endAngle?: number, counterclockwise?: boolean): Point;
-/**
- * Interpolate a point on a circular arc
- *
- * @param {number} t  Normalized time value to interpolate
- * @param {number} cx X-axis coordinate of the center of the circle
- * @param {number} cy Y-axis coordinate of the center of the circle
- * @param {number} radius Radius of the circle
- * @param {number} [startAngle] Start angle of the arc (in radians)
- * @param {number} [endAngle]   End angle of the arc (in radians)
- * @param {boolean} [counterclockwise=false] Flag indicating the direction of the arc
- * @returns {Point} Interpolated coordinates on the arc
- */
-export declare function arc(t: number, cx: number, cy: number, radius: number, startAngle?: number, endAngle?: number, counterclockwise?: boolean): Point;
-/**
- * Check if two points are coincident
- *
- * @param {number} x1 X-axis coordinate of the first point
- * @param {number} y1 Y-axis coordinate of the first point
- * @param {number} x2 X-axis coordinate of the second point
- * @param {number} y2 Y-axis coordinate of the second point
- * @returns {boolean} True if the two are coincident, false otherwise
- */
-export declare function isCoincident(x1: number, y1: number, x2: number, y2: number): boolean;
-/**
- * Check if three points are collinear (aligned on the same line)
- *
- * @param {number} x1 X-axis coordinate of the first point
- * @param {number} y1 Y-axis coordinate of the first point
- * @param {number} x2 X-axis coordinate of the second point
- * @param {number} y2 Y-axis coordinate of the second point
- * @param {number} x3 X-axis coordinate of the third point
- * @param {number} y3 Y-axis coordinate of the third point
- * @returns {boolean} True if the three points are collinear, false otherwise
- */
-export declare function isCollinear(x1: number, y1: number, x2: number, y2: number, x3: number, y3: number): boolean;
 export type FitInput = {
     width: number;
     height: number;