js-draw 0.23.1 → 0.24.0

package/dist/mjs/src/components/UnknownSVGObject.mjs

@@ -1,44 +0,0 @@
-//
-// Stores objects loaded from an SVG that aren't recognised by the editor.
-// @internal
-// @packageDocumentation
-//
-import  Rect2  from '../math/Rect2.mjs';
-import  SVGRenderer  from '../rendering/renderers/SVGRenderer.mjs';
-import  AbstractComponent  from './AbstractComponent.mjs';
-const componentId = 'unknown-svg-object';
-export default class UnknownSVGObject extends AbstractComponent {
-    constructor(svgObject) {
-        super(componentId);
-        this.svgObject = svgObject;
-        this.contentBBox = Rect2.of(svgObject.getBoundingClientRect());
-    }
-    render(canvas, _visibleRect) {
-        if (!(canvas instanceof SVGRenderer)) {
-            // Don't draw unrenderable objects if we can't
-            return;
-        }
-        canvas.drawSVGElem(this.svgObject);
-    }
-    intersects(lineSegment) {
-        return this.contentBBox.getEdges().some(edge => edge.intersection(lineSegment) !== null);
-    }
-    applyTransformation(_affineTransfm) {
-    }
-    isSelectable() {
-        return false;
-    }
-    createClone() {
-        return new UnknownSVGObject(this.svgObject.cloneNode(true));
-    }
-    description(localization) {
-        return localization.svgObject;
-    }
-    serializeToJSON() {
-        return JSON.stringify({
-            html: this.svgObject.outerHTML,
-        });
-    }
-}
-// null: Do not deserialize UnknownSVGObjects.
-AbstractComponent.registerComponent(componentId, null);

package/dist/mjs/src/components/builders/ArrowBuilder.d.ts

@@ -1,19 +0,0 @@
-import Rect2 from '../../math/Rect2';
-import AbstractRenderer from '../../rendering/renderers/AbstractRenderer';
-import { StrokeDataPoint } from '../../types';
-import Viewport from '../../Viewport';
-import AbstractComponent from '../AbstractComponent';
-import { ComponentBuilder, ComponentBuilderFactory } from './types';
-export declare const makeArrowBuilder: ComponentBuilderFactory;
-export default class ArrowBuilder implements ComponentBuilder {
-    private readonly startPoint;
-    private readonly viewport;
-    private endPoint;
-    constructor(startPoint: StrokeDataPoint, viewport: Viewport);
-    private getLineWidth;
-    getBBox(): Rect2;
-    private buildPreview;
-    build(): AbstractComponent;
-    preview(renderer: AbstractRenderer): void;
-    addPoint(point: StrokeDataPoint): void;
-}

package/dist/mjs/src/components/builders/ArrowBuilder.mjs

@@ -1,86 +0,0 @@
-import  Path, { PathCommandType }  from '../../math/Path.mjs';
-import  Stroke  from '../Stroke.mjs';
-export const makeArrowBuilder = (initialPoint, viewport) => {
-    return new ArrowBuilder(initialPoint, viewport);
-};
-export default class ArrowBuilder {
-    constructor(startPoint, viewport) {
-        this.startPoint = startPoint;
-        this.viewport = viewport;
-        this.endPoint = startPoint;
-    }
-    getLineWidth() {
-        return Math.max(this.endPoint.width, this.startPoint.width);
-    }
-    getBBox() {
-        const preview = this.buildPreview();
-        return preview.getBBox();
-    }
-    buildPreview() {
-        const lineStartPoint = this.startPoint.pos;
-        const endPoint = this.endPoint.pos;
-        const toEnd = endPoint.minus(lineStartPoint).normalized();
-        const arrowLength = endPoint.minus(lineStartPoint).length();
-        // Ensure that the arrow tip is smaller than the arrow.
-        const arrowTipSize = Math.min(this.getLineWidth(), arrowLength / 2);
-        const startSize = this.startPoint.width / 2;
-        const endSize = this.endPoint.width / 2;
-        const arrowTipBase = endPoint.minus(toEnd.times(arrowTipSize));
-        // Scaled normal vectors.
-        const lineNormal = toEnd.orthog();
-        const scaledStartNormal = lineNormal.times(startSize);
-        const scaledBaseNormal = lineNormal.times(endSize);
-        const path = new Path(arrowTipBase.minus(scaledBaseNormal), [
-            // Stem
-            {
-                kind: PathCommandType.LineTo,
-                point: lineStartPoint.minus(scaledStartNormal),
-            },
-            {
-                kind: PathCommandType.LineTo,
-                point: lineStartPoint.plus(scaledStartNormal),
-            },
-            {
-                kind: PathCommandType.LineTo,
-                point: arrowTipBase.plus(scaledBaseNormal),
-            },
-            // Head
-            {
-                kind: PathCommandType.LineTo,
-                point: arrowTipBase.plus(lineNormal.times(arrowTipSize).plus(scaledBaseNormal)),
-            },
-            {
-                kind: PathCommandType.LineTo,
-                point: endPoint.plus(toEnd.times(endSize)),
-            },
-            {
-                kind: PathCommandType.LineTo,
-                point: arrowTipBase.plus(lineNormal.times(-arrowTipSize).minus(scaledBaseNormal)),
-            },
-            {
-                kind: PathCommandType.LineTo,
-                point: arrowTipBase.minus(scaledBaseNormal),
-            },
-            // Round all points in the arrow (to remove unnecessary decimal places)
-        ]).mapPoints(point => this.viewport.roundPoint(point));
-        const preview = new Stroke([
-            {
-                startPoint: path.startPoint,
-                commands: path.parts,
-                style: {
-                    fill: this.startPoint.color,
-                }
-            }
-        ]);
-        return preview;
-    }
-    build() {
-        return this.buildPreview();
-    }
-    preview(renderer) {
-        this.buildPreview().render(renderer);
-    }
-    addPoint(point) {
-        this.endPoint = point;
-    }
-}

package/dist/mjs/src/components/builders/FreehandLineBuilder.d.ts

@@ -1,33 +0,0 @@
-import AbstractRenderer, { RenderablePathSpec } from '../../rendering/renderers/AbstractRenderer';
-import Rect2 from '../../math/Rect2';
-import Stroke from '../Stroke';
-import Viewport from '../../Viewport';
-import { StrokeDataPoint } from '../../types';
-import { ComponentBuilder, ComponentBuilderFactory } from './types';
-import RenderingStyle from '../../rendering/RenderingStyle';
-export declare const makeFreehandLineBuilder: ComponentBuilderFactory;
-export default class FreehandLineBuilder implements ComponentBuilder {
-    private startPoint;
-    private minFitAllowed;
-    private viewport;
-    private isFirstSegment;
-    private parts;
-    private curveFitter;
-    private bbox;
-    private averageWidth;
-    private widthAverageNumSamples;
-    constructor(startPoint: StrokeDataPoint, minFitAllowed: number, maxFitAllowed: number, viewport: Viewport);
-    getBBox(): Rect2;
-    protected getRenderingStyle(): RenderingStyle;
-    protected previewCurrentPath(): RenderablePathSpec | null;
-    protected previewFullPath(): RenderablePathSpec[] | null;
-    private previewStroke;
-    preview(renderer: AbstractRenderer): void;
-    build(): Stroke;
-    private getMinFit;
-    private roundPoint;
-    private roundDistance;
-    private curveToPathCommands;
-    private addCurve;
-    addPoint(newPoint: StrokeDataPoint): void;
-}

package/dist/mjs/src/components/builders/FreehandLineBuilder.mjs

@@ -1,165 +0,0 @@
-import  { Vec2 }  from '../../math/Vec2.mjs';
-import  Rect2  from '../../math/Rect2.mjs';
-import  { PathCommandType }  from '../../math/Path.mjs';
-import  Stroke  from '../Stroke.mjs';
-import  Viewport  from '../../Viewport.mjs';
-import  { StrokeSmoother }  from '../util/StrokeSmoother.mjs';
-import  Color4  from '../../Color4.mjs';
-export const makeFreehandLineBuilder = (initialPoint, viewport) => {
-    // Don't smooth if input is more than ± 3 pixels from the true curve, do smooth if
-    // less than ±1 px from the curve.
-    const maxSmoothingDist = viewport.getSizeOfPixelOnCanvas() * 3;
-    const minSmoothingDist = viewport.getSizeOfPixelOnCanvas();
-    return new FreehandLineBuilder(initialPoint, minSmoothingDist, maxSmoothingDist, viewport);
-};
-// Handles stroke smoothing and creates Strokes from user/stylus input.
-export default class FreehandLineBuilder {
-    constructor(startPoint, minFitAllowed, maxFitAllowed, viewport) {
-        this.startPoint = startPoint;
-        this.minFitAllowed = minFitAllowed;
-        this.viewport = viewport;
-        this.isFirstSegment = true;
-        this.parts = [];
-        this.widthAverageNumSamples = 1;
-        this.curveFitter = new StrokeSmoother(startPoint, minFitAllowed, maxFitAllowed, (curve) => this.addCurve(curve));
-        this.averageWidth = startPoint.width;
-        this.bbox = new Rect2(this.startPoint.pos.x, this.startPoint.pos.y, 0, 0);
-    }
-    getBBox() {
-        return this.bbox;
-    }
-    getRenderingStyle() {
-        return {
-            fill: Color4.transparent,
-            stroke: {
-                color: this.startPoint.color,
-                width: this.roundDistance(this.averageWidth),
-            }
-        };
-    }
-    previewCurrentPath() {
-        const path = this.parts.slice();
-        const commands = [...path, ...this.curveToPathCommands(this.curveFitter.preview())];
-        const startPoint = this.startPoint.pos;
-        return {
-            startPoint,
-            commands,
-            style: this.getRenderingStyle(),
-        };
-    }
-    previewFullPath() {
-        const preview = this.previewCurrentPath();
-        if (preview) {
-            return [preview];
-        }
-        return null;
-    }
-    previewStroke() {
-        const pathPreview = this.previewFullPath();
-        if (pathPreview) {
-            return new Stroke(pathPreview);
-        }
-        return null;
-    }
-    preview(renderer) {
-        const paths = this.previewFullPath();
-        if (paths) {
-            const approxBBox = this.viewport.visibleRect;
-            renderer.startObject(approxBBox);
-            for (const path of paths) {
-                renderer.drawPath(path);
-            }
-            renderer.endObject();
-        }
-    }
-    build() {
-        this.curveFitter.finalizeCurrentCurve();
-        return this.previewStroke();
-    }
-    getMinFit() {
-        let minFit = Math.min(this.minFitAllowed, this.averageWidth / 3);
-        if (minFit < 1e-10) {
-            minFit = this.minFitAllowed;
-        }
-        return minFit;
-    }
-    roundPoint(point) {
-        const minFit = this.getMinFit();
-        return Viewport.roundPoint(point, minFit);
-    }
-    roundDistance(dist) {
-        const minFit = this.getMinFit();
-        return Viewport.roundPoint(dist, minFit);
-    }
-    curveToPathCommands(curve) {
-        // Case where no points have been added
-        if (!curve) {
-            // Don't create a circle around the initial point if the stroke has more than one point.
-            if (!this.isFirstSegment) {
-                return [];
-            }
-            // Make the circle small -- because of the stroke style, we'll be drawing a stroke around it.
-            const width = Viewport.roundPoint(this.averageWidth / 10, Math.min(this.minFitAllowed, this.averageWidth / 10));
-            const center = this.roundPoint(this.startPoint.pos);
-            // Start on the right, cycle clockwise:
-            //    |
-            //  ----- ←
-            //    |
-            // Draw a circle-ish shape around the start point
-            return [
-                {
-                    kind: PathCommandType.QuadraticBezierTo,
-                    controlPoint: center.plus(Vec2.of(width, width)),
-                    // Bottom of the circle
-                    //    |
-                    //  -----
-                    //    |
-                    //    ↑
-                    endPoint: center.plus(Vec2.of(0, width)),
-                },
-                {
-                    kind: PathCommandType.QuadraticBezierTo,
-                    controlPoint: center.plus(Vec2.of(-width, width)),
-                    endPoint: center.plus(Vec2.of(-width, 0)),
-                },
-                {
-                    kind: PathCommandType.QuadraticBezierTo,
-                    controlPoint: center.plus(Vec2.of(-width, -width)),
-                    endPoint: center.plus(Vec2.of(0, -width)),
-                },
-                {
-                    kind: PathCommandType.QuadraticBezierTo,
-                    controlPoint: center.plus(Vec2.of(width, -width)),
-                    endPoint: center.plus(Vec2.of(width, 0)),
-                }
-            ];
-        }
-        const result = [];
-        if (this.isFirstSegment) {
-            result.push({
-                kind: PathCommandType.MoveTo,
-                point: this.roundPoint(curve.startPoint),
-            });
-        }
-        result.push({
-            kind: PathCommandType.QuadraticBezierTo,
-            controlPoint: this.roundPoint(curve.controlPoint),
-            endPoint: this.roundPoint(curve.endPoint),
-        });
-        return result;
-    }
-    addCurve(curve) {
-        const parts = this.curveToPathCommands(curve);
-        this.parts.push(...parts);
-        if (this.isFirstSegment) {
-            this.isFirstSegment = false;
-        }
-    }
-    addPoint(newPoint) {
-        this.curveFitter.addPoint(newPoint);
-        this.widthAverageNumSamples++;
-        this.averageWidth =
-            this.averageWidth * (this.widthAverageNumSamples - 1) / this.widthAverageNumSamples
-                + newPoint.width / this.widthAverageNumSamples;
-    }
-}

package/dist/mjs/src/components/builders/LineBuilder.d.ts

@@ -1,18 +0,0 @@
-import Rect2 from '../../math/Rect2';
-import AbstractRenderer from '../../rendering/renderers/AbstractRenderer';
-import { StrokeDataPoint } from '../../types';
-import Viewport from '../../Viewport';
-import AbstractComponent from '../AbstractComponent';
-import { ComponentBuilder, ComponentBuilderFactory } from './types';
-export declare const makeLineBuilder: ComponentBuilderFactory;
-export default class LineBuilder implements ComponentBuilder {
-    private readonly startPoint;
-    private readonly viewport;
-    private endPoint;
-    constructor(startPoint: StrokeDataPoint, viewport: Viewport);
-    getBBox(): Rect2;
-    private buildPreview;
-    build(): AbstractComponent;
-    preview(renderer: AbstractRenderer): void;
-    addPoint(point: StrokeDataPoint): void;
-}

package/dist/mjs/src/components/builders/LineBuilder.mjs

@@ -1,58 +0,0 @@
-import  Path, { PathCommandType }  from '../../math/Path.mjs';
-import  Stroke  from '../Stroke.mjs';
-export const makeLineBuilder = (initialPoint, viewport) => {
-    return new LineBuilder(initialPoint, viewport);
-};
-export default class LineBuilder {
-    constructor(startPoint, viewport) {
-        this.startPoint = startPoint;
-        this.viewport = viewport;
-        this.endPoint = startPoint;
-    }
-    getBBox() {
-        const preview = this.buildPreview();
-        return preview.getBBox();
-    }
-    buildPreview() {
-        const startPoint = this.startPoint.pos;
-        const endPoint = this.endPoint.pos;
-        const toEnd = endPoint.minus(startPoint).normalized();
-        const startSize = this.startPoint.width / 2;
-        const endSize = this.endPoint.width / 2;
-        const lineNormal = toEnd.orthog();
-        const scaledStartNormal = lineNormal.times(startSize);
-        const scaledEndNormal = lineNormal.times(endSize);
-        const strokeStartPoint = startPoint.minus(scaledStartNormal);
-        const path = new Path(strokeStartPoint, [
-            {
-                kind: PathCommandType.LineTo,
-                point: startPoint.plus(scaledStartNormal),
-            },
-            {
-                kind: PathCommandType.LineTo,
-                point: endPoint.plus(scaledEndNormal),
-            },
-            {
-                kind: PathCommandType.LineTo,
-                point: endPoint.minus(scaledEndNormal),
-            },
-            {
-                kind: PathCommandType.LineTo,
-                point: startPoint.minus(scaledStartNormal),
-            },
-        ]).mapPoints(point => this.viewport.roundPoint(point));
-        const preview = new Stroke([
-            path.toRenderable({ fill: this.startPoint.color })
-        ]);
-        return preview;
-    }
-    build() {
-        return this.buildPreview();
-    }
-    preview(renderer) {
-        this.buildPreview().render(renderer);
-    }
-    addPoint(point) {
-        this.endPoint = point;
-    }
-}

package/dist/mjs/src/components/builders/PressureSensitiveFreehandLineBuilder.d.ts

@@ -1,36 +0,0 @@
-import AbstractRenderer from '../../rendering/renderers/AbstractRenderer';
-import Rect2 from '../../math/Rect2';
-import Stroke from '../Stroke';
-import Viewport from '../../Viewport';
-import { StrokeDataPoint } from '../../types';
-import { ComponentBuilder, ComponentBuilderFactory } from './types';
-export declare const makePressureSensitiveFreehandLineBuilder: ComponentBuilderFactory;
-export default class PressureSensitiveFreehandLineBuilder implements ComponentBuilder {
-    private startPoint;
-    private minFitAllowed;
-    private viewport;
-    private isFirstSegment;
-    private pathStartConnector;
-    private mostRecentConnector;
-    private upperSegments;
-    private lowerSegments;
-    private lastUpperBezier;
-    private lastLowerBezier;
-    private parts;
-    private curveFitter;
-    private curveStartWidth;
-    private bbox;
-    constructor(startPoint: StrokeDataPoint, minFitAllowed: number, maxFitAllowed: number, viewport: Viewport);
-    getBBox(): Rect2;
-    private getRenderingStyle;
-    private previewCurrentPath;
-    private previewFullPath;
-    private previewStroke;
-    preview(renderer: AbstractRenderer): void;
-    build(): Stroke;
-    private roundPoint;
-    private shouldStartNewSegment;
-    private addCurve;
-    private segmentToPath;
-    addPoint(newPoint: StrokeDataPoint): void;
-}