standardize shared coord type

Author: g-harel

index.ts

@@ -1,7 +1,7 @@
 // https://www.blobmaker.app/
 
 import {rand} from "./internal/math/rand";
-import {Point} from "./internal/math/geometry";
+import {Coord} from "./internal/types";
 import {rad} from "./internal/math/unit";
 import {smooth} from "./internal/svg/smooth";
 import {renderEditable} from "./internal/svg/render";
@@ -72,7 +72,7 @@ blobs.editable = (opt: BlobOptions): XmlElement => {
     const angle = 360 / count;
     const radius = opt.size / Math.E;
 
-    const points: Point[] = [];
+    const points: Coord[] = [];
     for (let i = 0; i < count; i++) {
         const rand = 1 - 0.8 * opt.contrast * rgen();
 
@@ -82,9 +82,11 @@ blobs.editable = (opt: BlobOptions): XmlElement => {
         });
     }
 
+    // https://math.stackexchange.com/a/873589/235756
+    const smoothingStrength = ((4 / 3) * Math.tan(rad(angle / 4))) / Math.sin(rad(angle / 2));
     const smoothed = smooth(points, {
         closed: true,
-        strength: ((4 / 3) * Math.tan(rad(angle / 4))) / Math.sin(rad(angle / 2)),
+        strength: smoothingStrength,
     });
 
     return renderEditable(smoothed, {
@@ -123,7 +125,7 @@ blobs.path = (opt: PathOptions) => {
     const angle = 360 / count;
     const radius = opt.size / Math.E;
 
-    const points: Point[] = [];
+    const points: Coord[] = [];
     for (let i = 0; i < count; i++) {
         const rand = 1 - 0.8 * opt.contrast * rgen();
 

internal/animate/types.ts

@@ -1,4 +1,4 @@
-import {Shape} from "../shape/types";
+import {Shape} from "../types";
 
 export interface EasingFunc {
     (progress: number): number;

internal/canvas/draw.ts

@@ -1,4 +1,4 @@
-import {Coord, Shape} from "../shape/types";
+import {Coord, Shape} from "../types";
 import {expandHandle} from "../shape/util";
 
 const pointSize = 2;

internal/math/geometry.ts

@@ -1,18 +1,13 @@
 import {deg} from "./unit";
-import {Coord} from "../shape/types";
-
-export interface Point {
-    x: number;
-    y: number;
-}
+import {Coord} from "../types";
 
 // Calculates distance between two points.
-export const distance = (a: Point, b: Point): number => {
+export const distance = (a: Coord, b: Coord): number => {
     return Math.sqrt((a.x - b.x) ** 2 + (a.y - b.y) ** 2);
 };
 
 // Calculates the angle of the line from a to b in degrees.
-export const angle = (a: Point, b: Point): number => {
+export const angle = (a: Coord, b: Coord): number => {
     return deg(Math.atan2(b.y - a.y, b.x - a.x));
 };
 

internal/shape/interpolate.ts

@@ -1,4 +1,4 @@
-import {Shape} from "./types";
+import {Shape} from "../types";
 import {split, splitLine} from "../math/geometry";
 
 const interpolateAngle = (percentage: number, a: number, b: number): number => {

internal/shape/prepare.ts

@@ -1,5 +1,5 @@
 import {copyPoint, length, reverse, shift, split} from "./util";
-import {Point, Shape} from "./types";
+import {Point, Shape} from "../types";
 import {distance} from "../math/geometry";
 
 const optimizeOrder = (a: Shape, b: Shape): Shape => {

internal/shape/util.ts

@@ -1,4 +1,4 @@
-import {Coord, Handle, Point, Shape} from "./types";
+import {Coord, Handle, Point, Shape} from "../types";
 import {distance, splitLine} from "../math/geometry";
 
 export const copyPoint = (p: Point): Point => ({

internal/svg/smooth.ts

@@ -7,29 +7,29 @@ export interface SmoothingOptions {
     // This option is currently always true.
     closed: true;
 
-    // Smoothing strength as ration [0,1].
+    // Smoothing strength as ratio [0,1].
     strength: number;
 }
 
-// Smooths out the path made up of the given points. This will override the existing handles.
-// https://math.stackexchange.com/questions/873224/calculate-control-points-of-cubic-bezier-curve-approximating-a-part-of-a-circle
+// Smooths out the path made up of the given points.
+// Existing handles are ignored.
 export const smooth = (points: Point[], opt: SmoothingOptions): Point[] => {
-    if (points.length === 2) return points;
+    if (points.length < 3) throw new Error("not enough points to smooth shape");
 
     const out: Point[] = [];
 
     for (let i = 0; i < points.length; i++) {
-        const point = loopAccess(points)(i);
+        const curr = loopAccess(points)(i);
         const before = loopAccess(points)(i - 1);
         const after = loopAccess(points)(i + 1);
 
         out.push({
-            x: point.x,
-            y: point.y,
+            x: curr.x,
+            y: curr.y,
             handles: {
                 angle: angle(before, after),
-                in: opt.strength * (1 / 2) * distance(point, before),
-                out: opt.strength * (1 / 2) * distance(point, after),
+                in: opt.strength * (1 / 2) * distance(curr, before),
+                out: opt.strength * (1 / 2) * distance(curr, after),
             },
         });
     }

internal/shape/types.ts renamed to internal/types.ts

@@ -1,7 +1,6 @@
+// Position in a coordinate system with an origin in the top left corner.
 export interface Coord {
-    // Horizontal distance towards the right from the left edge of the canvas.
     x: number;
-    // Vertical distance downwards from the top of the canvas.
     y: number;
 }
 

testing/animate.ts

@@ -2,7 +2,7 @@ import blobs from "..";
 
 import {interpolateBetweenLoop} from "../internal/shape/interpolate";
 import {divideShape, prepShapes, splitCurveBy} from "../internal/shape/prepare";
-import {Coord, Point, Shape} from "../internal/shape/types";
+import {Coord, Point, Shape} from "../internal/types";
 import {length, split} from "../internal/shape/util";
 import {clear, drawInfo, drawShape} from "../internal/canvas/draw";