@design-core/core 0.0.4 → 0.0.5

package/core/lib/snapping.js

@@ -6,13 +6,27 @@ import { Utils } from './utils.js';
 import { DesignCore } from '../designCore.js';
 
 /** SnapPoint Class */
-class SnapPoint {
+export class SnapPoint {
+  static Type = Object.freeze({
+    NONE: 'none',
+    END: 'end',
+    MID: 'mid',
+    CENTRE: 'centre',
+    QUADRANT: 'quadrant',
+    NEAREST: 'nearest',
+    TANGENT: 'tangent',
+    NODE: 'node',
+    PERPENDICULAR: 'perpendicular',
+  });
+
   /**
    * Create SnapPoint
    * @param {Point} snapPoint
+   * @param {string} type - snap type from SnapPoint.Type
    */
-  constructor(snapPoint) {
+  constructor(snapPoint, type = SnapPoint.Type.END) {
     this.snapPoint = snapPoint;
+    this.type = type;
   }
 
   /**
@@ -21,19 +35,74 @@ class SnapPoint {
    * @param {number} scale
    */
   draw(ctx, scale) {
-    const snapColour = DesignCore.Settings.snapcolour;
-    const radius = 4;
+    const snapColour = DesignCore.Settings.snaptrackingcolour;
+    const size = 6 / scale;
+    const x = this.snapPoint.x;
+    const y = this.snapPoint.y;
+    const lineWidth = 2.5 / scale;
 
     try { // HTML Canvas
-      ctx.fillStyle = Colours.rgbToString(snapColour);
+      ctx.strokeStyle = Colours.rgbToString(snapColour);
+      ctx.lineWidth = lineWidth;
+      ctx.setLineDash([]);
       ctx.beginPath();
     } catch { // Cairo
       const rgbColour = Colours.rgbToScaledRGB(snapColour);
       ctx.setSourceRGB(rgbColour.r, rgbColour.g, rgbColour.b);
+      ctx.setLineWidth(lineWidth);
+    }
+
+    switch (this.type) {
+      case SnapPoint.Type.END: // square
+        ctx.moveTo(x - size, y - size);
+        ctx.lineTo(x + size, y - size);
+        ctx.lineTo(x + size, y + size);
+        ctx.lineTo(x - size, y + size);
+        ctx.closePath();
+        break;
+      case SnapPoint.Type.MID: // triangle
+        ctx.moveTo(x, y + size);
+        ctx.lineTo(x - size, y - size);
+        ctx.lineTo(x + size, y - size);
+        ctx.closePath();
+        break;
+      case SnapPoint.Type.QUADRANT: // diamond
+        ctx.moveTo(x, y - size);
+        ctx.lineTo(x + size, y);
+        ctx.lineTo(x, y + size);
+        ctx.lineTo(x - size, y);
+        ctx.closePath();
+        break;
+      case SnapPoint.Type.NEAREST: // hourglass (X with horizontal lines at top and bottom)
+        ctx.moveTo(x - size, y - size);
+        ctx.lineTo(x + size, y - size);
+        ctx.lineTo(x - size, y + size);
+        ctx.lineTo(x + size, y + size);
+        ctx.closePath();
+        break;
+      case SnapPoint.Type.TANGENT: // circle with a horizontal line over the top
+        ctx.arc(x, y, size, 0, 6.283);
+        ctx.moveTo(x - size, y + size * 1.5);
+        ctx.lineTo(x + size, y + size * 1.5);
+        break;
+      case SnapPoint.Type.NODE: // circle with an X inside
+        ctx.arc(x, y, size, 0, 6.283);
+        ctx.moveTo(x - size * 0.7, y - size * 0.7);
+        ctx.lineTo(x + size * 0.7, y + size * 0.7);
+        ctx.moveTo(x + size * 0.7, y - size * 0.7);
+        ctx.lineTo(x - size * 0.7, y + size * 0.7);
+        break;
+      case SnapPoint.Type.PERPENDICULAR: // right-angle corner (L-shape)
+        ctx.moveTo(x - size, y + size);
+        ctx.lineTo(x - size, y - size);
+        ctx.lineTo(x + size, y - size);
+        break;
+      default: // CENTRE - circle
+        ctx.arc(x, y, size, 0, 6.283);
+        break;
     }
 
-    ctx.arc(this.snapPoint.x, this.snapPoint.y, radius / scale, 0, 6.283);
-    ctx.fill();
+    ctx.stroke();
   }
 }
 
@@ -57,6 +126,7 @@ class TrackingLine {
   draw(ctx, scale) {
     const from = this.inputPoint;
     const dir = this.snapPoint.subtract(from);
+    const lineWidth = 2 / scale;
 
     if (dir.x === 0 && dir.y === 0) {
       return;
@@ -99,7 +169,7 @@ class TrackingLine {
     const start = from.add(dir.scale(tMin));
     const end = from.add(dir.scale(tMax));
 
-    const lineColour = DesignCore.Settings.polarsnapcolour;
+    const lineColour = DesignCore.Settings.snaptrackingcolour;
     const dashSize = 4 / scale;
 
     ctx.save();
@@ -107,12 +177,12 @@ class TrackingLine {
     try { // HTML Canvas
       ctx.beginPath();
       ctx.strokeStyle = Colours.rgbToString(lineColour);
-      ctx.lineWidth = 1 / scale;
+      ctx.lineWidth = lineWidth;
       ctx.setLineDash([dashSize, dashSize]);
     } catch { // Cairo
       const rgbColour = Colours.rgbToScaledRGB(lineColour);
       ctx.setSourceRGB(rgbColour.r, rgbColour.g, rgbColour.b);
-      ctx.setLineWidth(1 / scale);
+      ctx.setLineWidth(lineWidth);
       ctx.setDash([dashSize, dashSize], 0);
     }
 
@@ -128,9 +198,32 @@ class TrackingLine {
 export class Snapping {
   /** Create snapping */
   constructor() {
+    // active is true when snapping is active (e.g. during a command)
+    this.active = false;
+    // snapOverride: null = use settings; SnapPoint.Type.NONE = suppress all snaps; any other type = snap only to that type
+    this.snapOverride = null;
+  }
+
+  /**
+   * Reset snapping state
+   */
+  reset() {
     this.active = false;
+    this.snapOverride = null;
+  }
+
+  /**
+   * Set the snap override type
+   * @param {string|null} type - a SnapPoint.Type value, or null to clear the override
+   */
+  setSnapOverride(type) {
+    if (type !== null && !Object.values(SnapPoint.Type).includes(type)) {
+      throw new Error(`Invalid snap override type: ${type}`);
+    }
+    this.snapOverride = type;
   }
 
+
   /**
    * Get snap point and draw to the scene
    * @return {Point} or undefined
@@ -149,14 +242,14 @@ export class Snapping {
 
   /**
    * Draw the snap point
-   * @param {Point} snapPoint
+   * @param {SnapPoint} snapPoint
    */
   addSnapPoint(snapPoint) {
     // show the snap point
-    DesignCore.Scene.auxiliaryEntities.add(new SnapPoint(snapPoint));
+    DesignCore.Scene.auxiliaryEntities.add(snapPoint);
 
     // Move the mouse to the closest snap point so if the mouse if clicked the snap point is used.
-    DesignCore.Mouse.setPosFromScenePoint(snapPoint);
+    DesignCore.Mouse.setPosFromScenePoint(snapPoint.snapPoint);
   }
 
   /**
@@ -174,7 +267,8 @@ export class Snapping {
    */
   getSnapPoint() {
     let snapPoint;
-    let delta = 25 / DesignCore.Canvas.getScale(); // find a more suitable starting value
+    const snapAperture = 25; // capture radius in pixels (screen space)
+    let delta = snapAperture / DesignCore.Canvas.getScale(); // convert to scene space
 
     for (let i = 0; i < DesignCore.Scene.entities.count(); i++) {
       const layer = DesignCore.LayerManager.getItemByName(DesignCore.Scene.entities.get(i).layer);
@@ -185,11 +279,12 @@ export class Snapping {
 
       const itemSnaps = DesignCore.Scene.entities.get(i).snaps(DesignCore.Mouse.pointOnScene(), delta); // get an array of snap point from the item
       if (itemSnaps) {
-        for (let j = 0; j < itemSnaps.length; j++) {
-          const length = itemSnaps[j].distance(DesignCore.Mouse.pointOnScene());
+        const filteredSnaps = this.snapOverride !== null ? itemSnaps.filter((s) => s.type === this.snapOverride) : itemSnaps.filter((s) => DesignCore.Settings[`${s.type}snap`]);
+        for (let j = 0; j < filteredSnaps.length; j++) {
+          const length = filteredSnaps[j].snapPoint.distance(DesignCore.Mouse.pointOnScene());
           if (length < delta) {
             delta = length;
-            snapPoint = itemSnaps[j];
+            snapPoint = filteredSnaps[j];
           }
         }
       }

package/core/tables/block.js

@@ -17,6 +17,8 @@ import { Utils } from '../lib/utils.js';
  * @extends Entity
  */
 export class Block extends Entity {
+  static type = 'Block';
+
   /**
    * Create a Block Entity
    * @param {Array} data

package/core/tools/chamfer.js

@@ -15,6 +15,8 @@ import { DesignCore } from '../designCore.js';
  * @extends ChamferFilletBase
  */
 export class Chamfer extends ChamferFilletBase {
+  static type = 'Chamfer';
+
   /**
    * Register the command
    * @return {Object}

package/core/tools/chamferFilletBase.js

@@ -15,6 +15,8 @@ import { DesignCore } from '../designCore.js';
  * @extends Tool
  */
 export class ChamferFilletBase extends Tool {
+  static type = 'ChamferFilletBase';
+
   /** Create a ChamferFilletBase command */
   constructor() {
     super();

package/core/tools/copy.js

@@ -13,6 +13,8 @@ import { DesignCore } from '../designCore.js';
  * @extends Tool
  */
 export class Copy extends Tool {
+  static type = 'Copy';
+
   /** Create a Copy command */
   constructor() {
     super();

package/core/tools/copybase.js

@@ -10,6 +10,8 @@ import { DesignCore } from '../designCore.js';
  * @extends Tool
  */
 export class Copybase extends Tool {
+  static type = 'Copybase';
+
   /** Create a Copybase command */
   constructor() {
     super();

package/core/tools/copyclip.js

@@ -10,6 +10,8 @@ import { DesignCore } from '../designCore.js';
  * @extends Tool
  */
 export class Copyclip extends Tool {
+  static type = 'Copyclip';
+
   /** Create a Copyclip command */
   constructor() {
     super();

package/core/tools/cutclip.js

@@ -11,6 +11,8 @@ import { DesignCore } from '../designCore.js';
  * @extends Tool
  */
 export class Cutclip extends Tool {
+  static type = 'Cutclip';
+
   /** Create a Cutclip command */
   constructor() {
     super();

package/core/tools/distance.js

@@ -11,6 +11,8 @@ import { DesignCore } from '../designCore.js';
  * @extends Tool
  */
 export class Distance extends Tool {
+  static type = 'Distance';
+
   /** Create a Distance command */
   constructor() {
     super();

package/core/tools/erase.js

@@ -11,6 +11,8 @@ import { DesignCore } from '../designCore.js';
  * @extends Tool
  */
 export class Erase extends Tool {
+  static type = 'Erase';
+
   /** Create an Erase command */
   constructor() {
     super();

package/core/tools/explode.js

@@ -14,6 +14,8 @@ import { DesignCore } from '../designCore.js';
  * @extends Tool
  */
 export class Explode extends Tool {
+  static type = 'Explode';
+
   /** Create an Explode command */
   constructor() {
     super();

package/core/tools/extend.js

@@ -11,6 +11,8 @@ import { DesignCore } from '../designCore.js';
  * @extends Tool
  */
 export class Extend extends Tool {
+  static type = 'Extend';
+
   /** Create an Extend command */
   constructor() {
     super();

package/core/tools/fillet.js

@@ -14,6 +14,8 @@ import { DesignCore } from '../designCore.js';
  * @extends ChamferFilletBase
  */
 export class Fillet extends ChamferFilletBase {
+  static type = 'Fillet';
+
   /**
    * Register the command
    * @return {Object}

package/core/tools/identify.js

@@ -10,6 +10,8 @@ import { DesignCore } from '../designCore.js';
  * @extends Tool
  */
 export class Identify extends Tool {
+  static type = 'Identify';
+
   /** Create an Identify command */
   constructor() {
     super();

package/core/tools/matchProp.js

@@ -12,6 +12,8 @@ import { DesignCore } from '../designCore.js';
  * @extends Tool
  */
 export class MatchProp extends Tool {
+  static type = 'MatchProp';
+
   /** Create a MatchProp command */
   constructor() {
     super();

package/core/tools/mirror.js

@@ -13,6 +13,8 @@ import { DesignCore } from '../designCore.js';
  * @extends Tool
  */
 export class Mirror extends Tool {
+  static type = 'Mirror';
+
   /** Create a Mirror command */
   constructor() {
     super();

package/core/tools/move.js

@@ -12,6 +12,8 @@ import { UpdateState } from '../lib/stateManager.js';
  * @extends Tool
  */
 export class Move extends Tool {
+  static type = 'Move';
+
   /** Create a Move command */
   constructor() {
     super();

package/core/tools/offset.js

@@ -14,6 +14,8 @@ import { DesignCore } from '../designCore.js';
  * @extends Tool
  */
 export class Offset extends Tool {
+  static type = 'Offset';
+
   /** Create an Offset command */
   constructor() {
     super();

package/core/tools/pan.js

@@ -8,6 +8,8 @@ import { DesignCore } from '../designCore.js';
  * @extends Tool
  */
 export class Pan extends Tool {
+  static type = 'Pan';
+
   /** Create a Pan command */
   constructor() {
     super();

package/core/tools/pasteclip.js

@@ -13,6 +13,8 @@ import { DesignCore } from '../designCore.js';
  * @extends Tool
  */
 export class Pasteclip extends Tool {
+  static type = 'Pasteclip';
+
   /** Create a Pasteclip command */
   constructor() {
     super();

package/core/tools/purge.js

@@ -10,6 +10,8 @@ import { DesignCore } from '../designCore.js';
  * @extends Tool
  */
 export class Purge extends Tool {
+  static type = 'Purge';
+
   /** Create a Purge command */
   constructor() {
     super();

package/core/tools/rotate.js

@@ -13,6 +13,8 @@ import { DesignCore } from '../designCore.js';
  * @extends Tool
  */
 export class Rotate extends Tool {
+  static type = 'Rotate';
+
   /** Create a Rotate command */
   constructor() {
     super();

package/core/tools/scale.js

@@ -12,6 +12,8 @@ import { DesignCore } from '../designCore.js';
  * @extends Tool
  */
 export class Scale extends Tool {
+  static type = 'Scale';
+
   /** Create a Scale command */
   constructor() {
     super();

package/core/tools/tool.js

@@ -5,7 +5,7 @@ export class Tool {
   /** Create a Tool command */
   constructor() {
     Object.defineProperty(this, 'type', {
-      value: this.constructor.name,
+      value: this.constructor.type ?? this.constructor.name,
       writable: true,
     });
 

package/core/tools/trim.js

@@ -11,6 +11,8 @@ import { DesignCore } from '../designCore.js';
  * @extends Tool
  */
 export class Trim extends Tool {
+  static type = 'Trim';
+
   /** Create a Trim command */
   constructor() {
     super();

package/core/tools/zoom.js

@@ -12,6 +12,8 @@ import { DesignCore } from '../designCore.js';
  * @extends Tool
  */
 export class Zoom extends Tool {
+  static type = 'Zoom';
+
   /** Create a Zoom command */
   constructor() {
     super();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@design-core/core",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "type": "module",
   "scripts": {
     "test": "node --experimental-vm-modules node_modules/jest/bin/jest.js"

package/test/entities/arc.test.js

@@ -434,22 +434,16 @@ test('Arc.draw does not throw (ccw and cw)', () => {
   expect(() => arcCw.draw(ctx2, 1)).not.toThrow();
 });
 
-test('Arc.snaps returns end, centre and nearest snap points', () => {
+test('Arc.snaps returns end and centre snap points', () => {
   const arc = new Arc({ points: [new Point(0, 0), new Point(10, 0), new Point(0, 10)], direction: 1 });
 
-  DesignCore.Settings.endsnap = true;
-  DesignCore.Settings.centresnap = true;
-  DesignCore.Settings.nearestsnap = false;
   const snaps = arc.snaps(new Point(5, 5), 10);
-  expect(snaps.length).toBe(3); // start, end, centre
+  expect(snaps.filter((s) => s.type === 'end').length).toBe(2);
+  expect(snaps.filter((s) => s.type === 'centre').length).toBe(1);
 
-  // nearestsnap: closestPoint returns [pnt, distance] (no third element),
-  // so closest[2] === true is never satisfied and no snap is pushed
-  DesignCore.Settings.endsnap = false;
-  DesignCore.Settings.centresnap = false;
-  DesignCore.Settings.nearestsnap = true;
+  // Arc.snaps nearest fires when mouse is on the arc surface
   const nearSnaps = arc.snaps(new Point(10, 0), 100);
-  expect(nearSnaps.length).toBe(0);
+  expect(nearSnaps.filter((s) => s.type === 'nearest').length).toBe(1);
 });
 
 test('Arc.execute handles negative angle (clockwise)', async () => {
@@ -505,3 +499,58 @@ test('Arc.fromPolylinePoints precision drift is negligible', () => {
   expect(Math.abs(rebuilt.radius - arc.radius)).toBeLessThan(1e-10);
 });
 
+test('Arc.snaps nearest does not fire when mouse is too far from arc', () => {
+  const arc = new Arc({ points: [new Point(0, 0), new Point(10, 0), new Point(0, 10)], direction: 1 });
+  // Mouse far from arc surface; delta=1 so delta/10=0.1 — distance >> threshold
+  const snaps = arc.snaps(new Point(100, 100), 1);
+  expect(snaps.filter((s) => s.type === 'nearest').length).toBe(0);
+});
+
+test('Arc.snaps returns tangent snap when fromPoint is outside the arc', () => {
+  const arc = new Arc({ points: [new Point(0, 0), new Point(10, 0), new Point(0, 10)], direction: 1 });
+  const savedInputPoint = DesignCore.Scene.inputManager.inputPoint;
+  // fromPoint=(20,0): distanceToCenter=20 > radius=10
+  // tangentHalfAngle = acos(10/20) = π/3 (60°)
+  // tangentPoint at angle 0+60°=(5, 8.66) IS on CCW arc from 0° to 90°
+  // tangentPoint at angle 0-60°=(5,-8.66) is NOT on the arc
+  DesignCore.Scene.inputManager.inputPoint = new Point(20, 0);
+  const snaps = arc.snaps(new Point(5, 5), 100);
+  const tangentSnaps = snaps.filter((s) => s.type === 'tangent');
+  expect(tangentSnaps.length).toBe(1);
+  expect(tangentSnaps[0].snapPoint.x).toBeCloseTo(5);
+  expect(tangentSnaps[0].snapPoint.y).toBeCloseTo(8.6603, 3);
+  DesignCore.Scene.inputManager.inputPoint = savedInputPoint;
+});
+
+test('Arc.snaps returns no tangent when fromPoint is inside the arc radius', () => {
+  const arc = new Arc({ points: [new Point(0, 0), new Point(10, 0), new Point(0, 10)], direction: 1 });
+  const savedInputPoint = DesignCore.Scene.inputManager.inputPoint;
+  DesignCore.Scene.inputManager.inputPoint = new Point(1, 1); // distanceToCenter ≈ 1.41 < radius 10
+  const snaps = arc.snaps(new Point(5, 5), 100);
+  expect(snaps.filter((s) => s.type === 'tangent').length).toBe(0);
+  DesignCore.Scene.inputManager.inputPoint = savedInputPoint;
+});
+
+test('Arc.snaps returns perpendicular snap when radial point is on the arc', () => {
+  const arc = new Arc({ points: [new Point(0, 0), new Point(10, 0), new Point(0, 10)], direction: 1 });
+  const savedInputPoint = DesignCore.Scene.inputManager.inputPoint;
+  // fromPoint=(20,0): angleFromCentreToInput=0; perpendicularPoint=(10,0) IS on CCW arc
+  DesignCore.Scene.inputManager.inputPoint = new Point(20, 0);
+  const snaps = arc.snaps(new Point(5, 5), 100);
+  const perpSnaps = snaps.filter((s) => s.type === 'perpendicular');
+  expect(perpSnaps.length).toBe(1);
+  expect(perpSnaps[0].snapPoint.x).toBeCloseTo(10);
+  expect(perpSnaps[0].snapPoint.y).toBeCloseTo(0);
+  DesignCore.Scene.inputManager.inputPoint = savedInputPoint;
+});
+
+test('Arc.snaps returns no perpendicular when radial point is not on the arc', () => {
+  const arc = new Arc({ points: [new Point(0, 0), new Point(10, 0), new Point(0, 10)], direction: 1 });
+  const savedInputPoint = DesignCore.Scene.inputManager.inputPoint;
+  // fromPoint=(0,-20): angleFromCentreToInput=-π/2; perpendicularPoint=(0,-10) NOT on CCW arc from 0° to 90°
+  DesignCore.Scene.inputManager.inputPoint = new Point(0, -20);
+  const snaps = arc.snaps(new Point(5, 5), 100);
+  expect(snaps.filter((s) => s.type === 'perpendicular').length).toBe(0);
+  DesignCore.Scene.inputManager.inputPoint = savedInputPoint;
+});
+

package/test/entities/arctext.test.js

@@ -300,8 +300,9 @@ test('Test ArcText.snaps', () => {
   const arcText = new ArcAlignedText({ points: [new Point(0, 0)], string: 'Test', radius: 100 });
   const point = new Point(100, 100);
   const snaps = arcText.snaps(point, 1);
-  expect(snaps[0].x).toBeCloseTo(-2.39222);
-  expect(snaps[0].y).toBeCloseTo(101.22173);
+  const nodeSnaps = snaps.filter((s) => s.type === 'node');
+  expect(nodeSnaps[0].snapPoint.x).toBeCloseTo(-2.39222);
+  expect(nodeSnaps[0].snapPoint.y).toBeCloseTo(101.22173);
 });
 
 test('Test ArcText.closestPoint', () => {
@@ -327,3 +328,18 @@ test('Test ArcText.toPolylinePoints - returns correct points array', () => {
   expect(result[0].x).toBeCloseTo(-2.39222);
   expect(result[0].y).toBeCloseTo(101.22173);
 });
+
+test('ArcText.snaps returns a centre snap at points[0]', () => {
+  const arcText = new ArcAlignedText({ points: [new Point(3, 7)], string: 'Hi', radius: 50 });
+  const centreSnaps = arcText.snaps(new Point(0, 0), 100).filter((s) => s.type === 'centre');
+  expect(centreSnaps.length).toBe(1);
+  expect(centreSnaps[0].snapPoint.x).toBe(3);
+  expect(centreSnaps[0].snapPoint.y).toBe(7);
+});
+
+test('ArcText.snaps returns node snaps only for non-space characters', () => {
+  // 'A B' has 3 characters: 'A', ' ', 'B' — only 'A' and 'B' produce node snaps
+  const arcText = new ArcAlignedText({ points: [new Point(0, 0)], string: 'A B', radius: 100 });
+  const nodeSnaps = arcText.snaps(new Point(0, 0), 100).filter((s) => s.type === 'node');
+  expect(nodeSnaps.length).toBe(2);
+});