@design-core/core 0.0.6 → 0.0.7

package/core/lib/auxiliary/snapPoint.js

@@ -0,0 +1,113 @@
+import { DesignCore } from '../../designCore.js';
+import { Point } from '../../entities/point.js';
+
+/** SnapPoint Class */
+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, type = SnapPoint.Type.END) {
+    this.snapPoint = snapPoint;
+    this.type = type;
+  }
+
+  /**
+   * Draw the entity
+   * @param {Object} renderer
+   * @param {number} scale
+   */
+  draw(renderer, scale) {
+    const snapColour = DesignCore.Settings.accentcolour;
+    const size = 6 / scale;
+    const x = this.snapPoint.x;
+    const y = this.snapPoint.y;
+    const lineWidth = 2.5 / scale;
+
+    renderer.setColour(snapColour);
+    renderer.setLineWidth(lineWidth);
+    renderer.setDash([], 0);
+
+    // Full circle encoded as two bulge semi-arcs (same encoding as Circle entity)
+    const circlePoints = (cx, cy, r) => [
+      new Point(cx + r, cy, 1),
+      new Point(cx - r, cy, 1),
+      new Point(cx + r, cy),
+    ];
+
+    switch (this.type) {
+      case SnapPoint.Type.END: // square
+        renderer.drawShape([
+          new Point(x - size, y - size),
+          new Point(x + size, y - size),
+          new Point(x + size, y + size),
+          new Point(x - size, y + size),
+        ], { closed: true });
+        break;
+      case SnapPoint.Type.MID: // triangle
+        renderer.drawShape([
+          new Point(x, y + size),
+          new Point(x - size, y - size),
+          new Point(x + size, y - size),
+        ], { closed: true });
+        break;
+      case SnapPoint.Type.QUADRANT: // diamond
+        renderer.drawShape([
+          new Point(x, y - size),
+          new Point(x + size, y),
+          new Point(x, y + size),
+          new Point(x - size, y),
+        ], { closed: true });
+        break;
+      case SnapPoint.Type.NEAREST: // hourglass
+        renderer.drawShape([
+          new Point(x - size, y - size),
+          new Point(x + size, y - size),
+          new Point(x - size, y + size),
+          new Point(x + size, y + size),
+        ], { closed: true });
+        break;
+      case SnapPoint.Type.TANGENT: // circle + horizontal line above
+        renderer.drawShape(circlePoints(x, y, size));
+        renderer.drawShape([
+          new Point(x - size, y + size * 1.5),
+          new Point(x + size, y + size * 1.5),
+        ]);
+        break;
+      case SnapPoint.Type.NODE: // circle + X inside
+        renderer.drawShape(circlePoints(x, y, size));
+        renderer.drawShape([
+          new Point(x - size * 0.7, y - size * 0.7),
+          new Point(x + size * 0.7, y + size * 0.7),
+        ]);
+        renderer.drawShape([
+          new Point(x + size * 0.7, y - size * 0.7),
+          new Point(x - size * 0.7, y + size * 0.7),
+        ]);
+        break;
+      case SnapPoint.Type.PERPENDICULAR: // L-shape corner
+        renderer.drawShape([
+          new Point(x - size, y + size),
+          new Point(x - size, y - size),
+          new Point(x + size, y - size),
+        ]);
+        break;
+      default: // CENTRE - circle
+        renderer.drawShape(circlePoints(x, y, size));
+        break;
+    }
+  }
+}

package/core/lib/auxiliary/trackingLine.js

@@ -0,0 +1,76 @@
+import { Point } from '../../entities/point.js';
+
+import { DesignCore } from '../../designCore.js';
+
+/** TrackingLine Class - dotted tracking line for polar/ortho snap */
+export class TrackingLine {
+  /**
+   * Create TrackingLine
+   * @param {Point} inputPoint - the previous input point (defines direction)
+   * @param {Point} snapPoint - the current snapped mouse point (line starts here)
+   */
+  constructor(inputPoint, snapPoint) {
+    this.inputPoint = inputPoint;
+    this.snapPoint = snapPoint;
+  }
+
+  /**
+   * Draw the tracking line, extended to the visible canvas edges
+   * @param {Object} renderer
+   * @param {number} scale
+   */
+  draw(renderer, scale) {
+    const from = this.snapPoint;
+    const dir = this.snapPoint.subtract(this.inputPoint);
+    const lineWidth = 2 / scale;
+
+    if (dir.x === 0 && dir.y === 0) {
+      return;
+    }
+
+    // Compute visible canvas bounds in scene space
+    const w = DesignCore.Canvas.width;
+    const h = DesignCore.Canvas.height;
+    const corner0 = DesignCore.Mouse.transformToScene(new Point(0, 0));
+    const corner1 = DesignCore.Mouse.transformToScene(new Point(w, h));
+    const boundsMin = corner0.min(corner1);
+    const boundsMax = corner0.max(corner1);
+
+    // Clip the ray (from snapPoint outward, away from inputPoint) to canvas bounds
+    let tMin = 0;
+    let tMax = Infinity;
+
+    if (dir.x !== 0) {
+      const tx1 = (boundsMin.x - from.x) / dir.x;
+      const tx2 = (boundsMax.x - from.x) / dir.x;
+      tMin = Math.max(tMin, Math.min(tx1, tx2));
+      tMax = Math.min(tMax, Math.max(tx1, tx2));
+    } else if (from.x < boundsMin.x || from.x > boundsMax.x) {
+      return;
+    }
+
+    if (dir.y !== 0) {
+      const ty1 = (boundsMin.y - from.y) / dir.y;
+      const ty2 = (boundsMax.y - from.y) / dir.y;
+      tMin = Math.max(tMin, Math.min(ty1, ty2));
+      tMax = Math.min(tMax, Math.max(ty1, ty2));
+    } else if (from.y < boundsMin.y || from.y > boundsMax.y) {
+      return;
+    }
+
+    if (tMax < tMin) {
+      return;
+    }
+
+    const start = from.add(dir.scale(tMin));
+    const end = from.add(dir.scale(tMax));
+
+    const lineColour = DesignCore.Settings.accentcolour;
+    const dashSize = 4 / scale;
+
+    renderer.setColour(lineColour);
+    renderer.setLineWidth(lineWidth);
+    renderer.setDash([dashSize, dashSize], 0);
+    renderer.drawShape([start, end]);
+  }
+}