toosoon-utils 4.1.8 → 4.2.0

package/lib/extras/geometry/index.d.ts

@@ -0,0 +1,3 @@
+export { type Vector } from './Vector';
+export { default as Vector2 } from './Vector2';
+export { default as Vector3 } from './Vector3';

package/lib/extras/geometry/index.js

@@ -0,0 +1,2 @@
+export { default as Vector2 } from './Vector2';
+export { default as Vector3 } from './Vector3';

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

@@ -1,5 +1,5 @@
-import type { Point } from '../../types';
-import Curve from '../curves/Curve';
+import { Curve } from '../curves';
+import { type Vector, Vector2, Vector3 } from '../geometry';
 /**
  * Utility class for manipulating connected curves
  *
@@ -7,53 +7,59 @@ import Curve from '../curves/Curve';
  * @class Path
  * @extends Curve
  */
-export default class Path extends Curve {
+export default class Path<V extends Vector = Vector2 | Vector3, S extends Curve<V> = Curve<V>> extends Curve<V> {
     readonly isPath = true;
     readonly type: string;
     /**
-     * Array of curves composing the path
+     * Array of curves composing this path
      */
-    curves: Curve[];
+    subpaths: S[];
     /**
-     * Array of points composing the path
+     * Array of points composing this path
+     */
+    points: V[];
+    /**
+     * Define if a last point should be automatically added to close this path
      */
-    points: Point[];
     autoClose: boolean;
+    constructor({ autoClose }?: {
+        autoClose?: boolean;
+    });
     /**
-     * Add a curve to this curve path
+     * Add a curve to this path
      *
      * @param {Curve} curve Curve to add
      */
-    add(curve: Curve): void;
+    add(curve: S): void;
     /**
-     * Interpolate a point on the curve path
+     * Interpolate a point on this path
      *
      * @param {number} t Normalized time value to interpolate
-     * @returns {Point|null} Interpolated coordinates on the curve
+     * @returns {Vector} Interpolated coordinates on the curve
      */
-    getPoint(t: number): Point;
+    getPoint(t: number): V;
     /**
      * Compute the curve shape into an array of points
      *
      * @param {number} [divisions=40] Number of divisions
-     * @returns {Point[]}
+     * @returns {Vector[]}
      */
-    getPoints(divisions?: number): Point[];
+    getPoints(divisions?: number): V[];
     /**
      * Compute the curve shape into an array of equi-spaced points across the entire curve path
      *
      * @param {number} [divisions=40] Number of divisions
-     * @returns {Point[]}
+     * @returns {Vector[]}
      */
-    getSpacedPoints(divisions?: number): Point[];
+    getSpacedPoints(divisions?: number): V[];
     /**
-     * Compute the total arc length of the curve path
+     * Compute the total arc length of this path
      *
      * @returns {number}
      */
     getLength(): number;
     /**
-     * Compute the cumulative curve lengths of the curve path
+     * Compute the cumulative curve lengths of this path
      *
      * @returns {number[]}
      */

package/lib/extras/paths/Path.js

@@ -1,5 +1,4 @@
-import { isCoincident } from '../../geometry';
-import Curve from '../curves/Curve';
+import { Curve, LineCurve, LineCurve3, PolylineCurve, PolylineCurve3, SplineCurve, SplineCurve3, EllipseCurve } from '../curves';
 /**
  * Utility class for manipulating connected curves
  *
@@ -11,27 +10,34 @@ export default class Path extends Curve {
     isPath = true;
     type = 'Path';
     /**
-     * Array of curves composing the path
+     * Array of curves composing this path
      */
-    curves = [];
+    subpaths = [];
     /**
-     * Array of points composing the path
+     * Array of points composing this path
      */
     points = [];
-    autoClose = false;
     /**
-     * Add a curve to this curve path
+     * Define if a last point should be automatically added to close this path
+     */
+    autoClose;
+    constructor({ autoClose = false } = {}) {
+        super();
+        this.autoClose = autoClose;
+    }
+    /**
+     * Add a curve to this path
      *
      * @param {Curve} curve Curve to add
      */
     add(curve) {
-        this.curves.push(curve);
+        this.subpaths.push(curve);
     }
     /**
-     * Interpolate a point on the curve path
+     * Interpolate a point on this path
      *
      * @param {number} t Normalized time value to interpolate
-     * @returns {Point|null} Interpolated coordinates on the curve
+     * @returns {Vector} Interpolated coordinates on the curve
      */
     getPoint(t) {
         const d = t * this.getLength();
@@ -40,7 +46,7 @@ export default class Path extends Curve {
         while (i < curveLengths.length) {
             if (curveLengths[i] >= d) {
                 const delta = curveLengths[i] - d;
-                const curve = this.curves[i];
+                const curve = this.subpaths[i];
                 const segmentLength = curve.getLength();
                 const u = segmentLength === 0 ? 0 : 1 - delta / segmentLength;
                 return curve.getPointAt(u);
@@ -48,37 +54,43 @@ export default class Path extends Curve {
             i++;
         }
         console.warn(`Path.getPoint()`, `No point found in curve.`, this);
-        return [0, 0];
+        return this.subpaths[0].getPoint(0);
     }
     /**
      * Compute the curve shape into an array of points
      *
      * @param {number} [divisions=40] Number of divisions
-     * @returns {Point[]}
+     * @returns {Vector[]}
      */
     getPoints(divisions = 40) {
-        const curves = this.curves;
         const points = [];
         let lastPoint = null;
-        for (let i = 0; i < curves.length; i++) {
-            const curve = curves[i];
-            const resolution = curve.type === 'EllipseCurve'
-                ? divisions * 2
-                : curve.type === 'LineCurve'
-                    ? 1
-                    : curve.type === 'SplineCurve'
-                        ? divisions * curve.points.length
-                        : divisions;
-            const points = curve.getPoints(resolution);
-            for (let j = 0; j < points.length; j++) {
-                const point = points[j];
-                if (lastPoint && isCoincident(...lastPoint, ...point))
+        for (let i = 0; i < this.subpaths.length; i++) {
+            const curve = this.subpaths[i];
+            let resolution = divisions;
+            if (curve instanceof LineCurve || curve instanceof LineCurve3) {
+                resolution = 1;
+            }
+            else if (curve instanceof PolylineCurve || curve instanceof PolylineCurve3) {
+                resolution = curve.points.length;
+            }
+            else if (curve instanceof SplineCurve || curve instanceof SplineCurve3) {
+                resolution *= curve.points.length;
+            }
+            else if (curve instanceof EllipseCurve) {
+                resolution *= 2;
+            }
+            const pts = this.subpaths[i].getPoints(resolution);
+            for (let j = 0; j < pts.length; j++) {
+                const point = pts[j];
+                if (point?.equals(lastPoint))
                     continue;
                 points.push(point);
                 lastPoint = point;
             }
         }
-        if (this.autoClose && !Curve.isClosed(points)) {
+        const isClosed = points.length > 1 && points[0].equals(points[points.length - 1]);
+        if (this.autoClose && !isClosed) {
             points.push(points[0]);
         }
         return points;
@@ -87,20 +99,21 @@ export default class Path extends Curve {
      * Compute the curve shape into an array of equi-spaced points across the entire curve path
      *
      * @param {number} [divisions=40] Number of divisions
-     * @returns {Point[]}
+     * @returns {Vector[]}
      */
     getSpacedPoints(divisions = 40) {
         const points = [];
         for (let i = 0; i <= divisions; i++) {
             points.push(this.getPoint(i / divisions));
         }
-        if (this.autoClose && !Curve.isClosed(points)) {
+        const isClosed = points.length > 1 && points[0].equals(points[points.length - 1]);
+        if (this.autoClose && !isClosed) {
             points.push(points[0]);
         }
         return points;
     }
     /**
-     * Compute the total arc length of the curve path
+     * Compute the total arc length of this path
      *
      * @returns {number}
      */
@@ -109,18 +122,18 @@ export default class Path extends Curve {
         return lengths[lengths.length - 1];
     }
     /**
-     * Compute the cumulative curve lengths of the curve path
+     * Compute the cumulative curve lengths of this path
      *
      * @returns {number[]}
      */
     getCurveLengths() {
-        if (this._cacheArcLengths.length === this.curves.length) {
+        if (this._cacheArcLengths.length === this.subpaths.length) {
             return this._cacheArcLengths;
         }
         const lengths = [];
         let sums = 0;
-        for (let i = 0, l = this.curves.length; i < l; i++) {
-            sums += this.curves[i].getLength();
+        for (let i = 0, j = this.subpaths.length; i < j; i++) {
+            sums += this.subpaths[i].getLength();
             lengths.push(sums);
         }
         this._cacheArcLengths = lengths;

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

@@ -1,4 +1,5 @@
-import type { Point } from '../../types';
+import type { Point2 } from '../../types';
+import { Vector2 } from '../geometry';
 import Path from './Path';
 /**
  * Utility class for manipulating connected curves providing methods similar to the 2D Canvas API
@@ -6,28 +7,36 @@ import Path from './Path';
  * @exports
  * @class PathContext
  * @extends Path
+ * @implements CanvasRenderingContext2D
  */
-export default class PathContext extends Path implements CanvasRenderingContext2D {
+export default class PathContext extends Path<Vector2> implements CanvasRenderingContext2D {
     /**
-     * Path current offset
+     * Path current position
      */
-    currentPosition: Point;
+    currentPosition: Vector2;
     /**
-     * Create a path from the given list of points
+     * Path current transformation matrix
+     */
+    currentTransform: DOMMatrix;
+    private _transformStack;
+    /**
+     * Create a path from a given list of points
      *
-     * @param {Point[]} points Array of points defining the path
-     * @param {Point[]} type   Type of curve used for creating the path
+     * @param {Point2[]} points Array of points defining the path
      * @return {this}
      */
-    setFromPoints(points: Point[], type?: 'lines' | 'polyline' | 'spline'): this;
+    setFromPoints(points: Point2[]): this;
     /**
-     * Begin the path
-     * Reset `currentPosition`
+     * Begin this path
+     *
+     * @return {this}
      */
-    beginPath(): void;
+    beginPath(): this;
     /**
-     * Draw a line from the ending position to the beginning position of the path
-     * Add an instance of {@link LineCurve} to the path
+     * Draw a line from the ending position to the beginning position of this path
+     * Add an instance of {@link LineCurve} to this path
+     *
+     * @return {this}
      */
     closePath(): this;
     /**
@@ -40,7 +49,7 @@ export default class PathContext extends Path implements CanvasRenderingContext2
     moveTo(x: number, y: number): this;
     /**
      * Draw a line from the current position to the position specified by `x` and `y`
-     * Add an instance of {@link LineCurve} to the path
+     * Add an instance of {@link LineCurve} to this path
      *
      * @param {number} x X-axis coordinate of the point
      * @param {number} y Y-axis coordinate of the point
@@ -48,28 +57,16 @@ export default class PathContext extends Path implements CanvasRenderingContext2
      */
     lineTo(x: number, y: number): this;
     /**
-     * Draw a Polyline curve from the current position through the given points
-     * Add an instance of {@link PolylineCurve} to the path
+     * Draw a Polyline curve from the current position through given points
+     * Add an instance of {@link PolylineCurve} to this path
      *
-     * @param {Point[]} points Array of points defining the curve
+     * @param {Point2[]} points Array of points defining the curve
      * @returns {this}
      */
-    polylineTo(points: Point[]): this;
-    /**
-     * Draw an Arc curve from the current position, tangential to the 2 segments created by both control points
-     * Add an instance of {@link ArcCurve} to the path
-     *
-     * @param {number} x1 X-axis coordinate of the first control point
-     * @param {number} y1 Y-axis coordinate of the first control point
-     * @param {number} x2 X-axis coordinate of the second control point
-     * @param {number} y2 Y-axis coordinate of the second control point
-     * @param {number} radius Arc radius (Must be non-negative)
-     * @returns {this}
-     */
-    arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): this;
+    polylineTo(points: Point2[]): this;
     /**
      * Draw a Quadratic Bézier curve from the current position to the end point specified by `x` and `y`, using the control point specified by `cpx` and `cpy`
-     * Add an instance of {@link QuadraticBezierCurve} to the path
+     * Add an instance of {@link QuadraticBezierCurve} to this path
      *
      * @param {number} cpx X-axis coordinate of the control point
      * @param {number} cpy Y-axis coordinate of the control point
@@ -80,7 +77,7 @@ export default class PathContext extends Path implements CanvasRenderingContext2
     quadraticCurveTo(cpx: number, cpy: number, x2: number, y2: number): this;
     /**
      * Draw a Cubic Bézier curve from the current position to the end point specified by `x` and `y`, using the control point specified by (`cp1x`, `cp1y`) and (`cp2x`, `cp2y`)
-     * Add an instance of {@link CubicBezierCurve} to the path
+     * Add an instance of {@link CubicBezierCurve} to this path
      *
      * @param {number} cp1x X-axis coordinate of the first control point
      * @param {number} cp1y Y-axis coordinate of the first control point
@@ -93,7 +90,7 @@ export default class PathContext extends Path implements CanvasRenderingContext2
     bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x2: number, y2: number): this;
     /**
      * Draw a Catmull-Rom curve from the current position to the end point specified by `x` and `y`, using the control points specified by (`cp1x`, `cp1y`) and (`cp2x`, `cp2y`)
-     * Add an instance of {@link CatmullRomCurve} to the path
+     * Add an instance of {@link CatmullRomCurve} to this path
      *
      * @param {number} cp1x X-axis coordinate of the first control point
      * @param {number} cp1y Y-axis coordinate of the first control point
@@ -105,44 +102,56 @@ export default class PathContext extends Path implements CanvasRenderingContext2
      */
     catmullRomCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x2: number, y2: number): this;
     /**
-     * Draw a Spline curve from the current position through the given points
-     * Add an instance of {@link SplineCurve} to the path
+     * Draw a Spline curve from the current position through given points
+     * Add an instance of {@link SplineCurve} to this path
      *
-     * @param {Point[]} points Array of points defining the curve
+     * @param {Point2[]} points Array of points defining the curve
      * @return {this}
      */
-    splineTo(points: Point[]): this;
+    splineTo(points: Point2[]): this;
     /**
      * Draw an Ellispe curve which is centered at (`cx`, `cy`) position
-     * Add an instance of {@link EllipseCurve} to the path
+     * Add an instance of {@link EllipseCurve} to this path
      *
      * @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} rx X-radius of the ellipse
      * @param {number} ry Y-radius of the ellipse
-     * @param {number} [rotation] 	Rotation angle of the ellipse (in radians), counterclockwise from the positive X-axis
-     * @param {number} [startAngle] Start angle of the arc (in radians)
-     * @param {number} [endAngle]   End angle of the arc (in radians)
+     * @param {number} rotation 	Rotation angle of the ellipse (in radians), counterclockwise from the positive X-axis
+     * @param {number} startAngle Start angle of the arc (in radians)
+     * @param {number} endAngle   End angle of the arc (in radians)
      * @param {boolean} [counterclockwise] Flag indicating the direction of the arc
      * @return {this}
      */
-    ellipse(cx: number, cy: number, rx: number, ry: number, rotation?: number, startAngle?: number, endAngle?: number, counterclockwise?: boolean): this;
+    ellipse(cx: number, cy: number, rx: number, ry: number, rotation: number, startAngle: number, endAngle: number, counterclockwise?: boolean): this;
     /**
      * Draw an Arc curve which is centered at (`cx`, `cy`) position
-     * Add an instance of {@link ArcCurve} to the path
+     * Add an instance of {@link ArcCurve} to this path
      *
      * @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 {number} startAngle Start angle of the arc (in radians)
+     * @param {number} endAngle   End angle of the arc (in radians)
      * @param {boolean} [counterclockwise] Flag indicating the direction of the arc
      * @return {this}
      */
-    arc(cx: number, cy: number, radius: number, startAngle?: number, endAngle?: number, counterclockwise?: boolean): this;
+    arc(cx: number, cy: number, radius: number, startAngle: number, endAngle: number, counterclockwise?: boolean): this;
+    /**
+     * Draw an Arc curve from the current position, tangential to the 2 segments created by both control points
+     * Add an instance of {@link ArcCurve} to this path
+     *
+     * @param {number} x1 X-axis coordinate of the first control point
+     * @param {number} y1 Y-axis coordinate of the first control point
+     * @param {number} x2 X-axis coordinate of the second control point
+     * @param {number} y2 Y-axis coordinate of the second control point
+     * @param {number} radius Arc radius (Must be non-negative)
+     * @returns {this}
+     */
+    arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): this;
     /**
      * Draw a rectangular path from the start position specified by `x` and `y` to the end position using `width` and `height`
-     * Add an instance of {@link PolylineCurve} to the path
+     * Add an instance of {@link PolylineCurve} to this path
      *
      * @param {number} x 		  X-axis coordinate of the rectangle starting point
      * @param {number} y      Y-axis coordinate of the rectangle starting point
@@ -153,6 +162,7 @@ export default class PathContext extends Path implements CanvasRenderingContext2
     rect(x: number, y: number, width: number, height: number): this;
     /**
      * Draw a rounded rectangular path from the start position specified by `x` and `y` to the end position using `width` and `height`
+     * Add an instance of {@link Path} to this path
      *
      * @param {number} x 		  X-axis coordinate of the rectangle starting point
      * @param {number} y      Y-axis coordinate of the rectangle starting point
@@ -162,7 +172,37 @@ export default class PathContext extends Path implements CanvasRenderingContext2
      * @return {this}
      */
     roundRect(x: number, y: number, width: number, height: number, radius: number | number[]): this;
-    protected _setCurrentPosition(x: number, y: number): void;
+    protected _hasCurrentPosition(): boolean;
+    protected _setCurrentPosition(x: number, y: number): this;
+    setTransform(a: number, b: number, c: number, d: number, e: number, f: number): void;
+    setTransform(matrix: DOMMatrix): void;
+    getTransform(): DOMMatrix;
+    resetTransform(): void;
+    transform(a: number, b: number, c: number, d: number, e: number, f: number): void;
+    translate(x: number, y: number): void;
+    rotate(angle: number): void;
+    scale(x: number, y: number): void;
+    save(): void;
+    restore(): void;
+    reset(): void;
+    protected _transformPoint(point: Point2, matrix?: DOMMatrix): Point2;
+    protected _transformPoints(points: Point2[], matrix?: DOMMatrix): Point2[];
+    protected _transformVector(vector: Point2, matrix?: DOMMatrix): Point2;
+    protected _transformEllipse(cx: number, cy: number, rx: number, ry: number, rotation: number, matrix?: DOMMatrix): [number, number, number, number, number];
+    protected _inversePoint(point: Point2): Point2;
+    protected get _translateX(): number;
+    protected get _translateY(): number;
+    protected get _scaleX(): number;
+    protected get _scaleY(): number;
+    protected get _rotation(): number;
+    protected get _skewX(): number;
+    protected get _skewY(): number;
+    protected get _isTranslated(): boolean;
+    protected get _isScaled(): boolean;
+    protected get _isRotated(): boolean;
+    protected get _isSkewed(): boolean;
+    protected get _isUniform(): boolean;
+    protected get _isIdentity(): boolean;
     canvas: CanvasRenderingContext2D['canvas'];
     fillStyle: CanvasRenderingContext2D['fillStyle'];
     strokeStyle: CanvasRenderingContext2D['strokeStyle'];
@@ -170,8 +210,11 @@ export default class PathContext extends Path implements CanvasRenderingContext2
     lineCap: CanvasRenderingContext2D['lineCap'];
     lineJoin: CanvasRenderingContext2D['lineJoin'];
     lineDashOffset: CanvasRenderingContext2D['lineDashOffset'];
+    setLineDash: CanvasRenderingContext2D['setLineDash'];
+    getLineDash: CanvasRenderingContext2D['getLineDash'];
     fillText: CanvasRenderingContext2D['fillText'];
     strokeText: CanvasRenderingContext2D['strokeText'];
+    miterLimit: CanvasRenderingContext2D['miterLimit'];
     fill: CanvasRenderingContext2D['fill'];
     stroke: CanvasRenderingContext2D['stroke'];
     clearRect: CanvasRenderingContext2D['clearRect'];
@@ -179,6 +222,9 @@ export default class PathContext extends Path implements CanvasRenderingContext2
     strokeRect: CanvasRenderingContext2D['strokeRect'];
     drawImage: CanvasRenderingContext2D['drawImage'];
     clip: CanvasRenderingContext2D['clip'];
+    filter: CanvasRenderingContext2D['filter'];
+    globalAlpha: CanvasRenderingContext2D['globalAlpha'];
+    globalCompositeOperation: CanvasRenderingContext2D['globalCompositeOperation'];
     createLinearGradient: CanvasRenderingContext2D['createLinearGradient'];
     createRadialGradient: CanvasRenderingContext2D['createRadialGradient'];
     createConicGradient: CanvasRenderingContext2D['createConicGradient'];
@@ -199,29 +245,13 @@ export default class PathContext extends Path implements CanvasRenderingContext2
     wordSpacing: CanvasRenderingContext2D['wordSpacing'];
     direction: CanvasRenderingContext2D['direction'];
     measureText: CanvasRenderingContext2D['measureText'];
-    filter: CanvasRenderingContext2D['filter'];
-    globalAlpha: CanvasRenderingContext2D['globalAlpha'];
-    globalCompositeOperation: CanvasRenderingContext2D['globalCompositeOperation'];
-    miterLimit: CanvasRenderingContext2D['miterLimit'];
-    save: CanvasRenderingContext2D['save'];
-    restore: CanvasRenderingContext2D['restore'];
-    reset: CanvasRenderingContext2D['reset'];
-    transform: CanvasRenderingContext2D['transform'];
-    translate: CanvasRenderingContext2D['translate'];
-    rotate: CanvasRenderingContext2D['rotate'];
-    scale: CanvasRenderingContext2D['scale'];
-    getTransform: CanvasRenderingContext2D['getTransform'];
-    setTransform: CanvasRenderingContext2D['setTransform'];
-    resetTransform: CanvasRenderingContext2D['resetTransform'];
-    getLineDash: CanvasRenderingContext2D['getLineDash'];
-    setLineDash: CanvasRenderingContext2D['setLineDash'];
-    shadowBlur: CanvasRenderingContext2D['shadowBlur'];
     shadowColor: CanvasRenderingContext2D['shadowColor'];
+    shadowBlur: CanvasRenderingContext2D['shadowBlur'];
     shadowOffsetX: CanvasRenderingContext2D['shadowOffsetX'];
     shadowOffsetY: CanvasRenderingContext2D['shadowOffsetY'];
     drawFocusIfNeeded: CanvasRenderingContext2D['drawFocusIfNeeded'];
     isPointInPath: CanvasRenderingContext2D['isPointInPath'];
     isPointInStroke: CanvasRenderingContext2D['isPointInStroke'];
-    getContextAttributes: CanvasRenderingContext2D['getContextAttributes'];
-    isContextLost: () => false;
+    getContextAttributes(): CanvasRenderingContext2DSettings;
+    isContextLost(): boolean;
 }