@design-core/core 0.0.6 → 50.1.0

package/core/lib/auxiliary/selectionWindow.js

@@ -0,0 +1,63 @@
+import { DesignCore } from '../../designCore.js';
+import { Point } from '../../entities/point.js';
+
+/** SelectionWindow Class */
+export class SelectionWindow {
+  /**
+   * Create a SelectionWindow
+   * @param {Object} data
+   */
+  constructor(data) {
+    this.colour = DesignCore.Settings.selectionWindow;
+    this.lineWidth = 1;
+    this.dashPattern = [];
+
+    if (data) {
+      if (data.hasOwnProperty('points')) {
+        if (data.points[1].y > data.points[0].y) {
+          this.colour = DesignCore.Settings.selectionWindow;
+          this.dashPattern = [5];
+        } else {
+          this.colour = DesignCore.Settings.crossingWindow;
+        }
+
+        this.points = [];
+        const point1 = new Point(data.points[0].x, data.points[0].y);
+        const point2 = new Point(data.points[1].x, data.points[1].y);
+
+        this.points.push(point1);
+        this.points.push(point2);
+      }
+    }
+  }
+
+  /**
+   * Draw the entity
+   * @param {Object} renderer
+   * @param {number} scale
+   */
+  draw(renderer, scale) {
+    const colour = this.colour;
+    const scaledPattern = this.dashPattern.map((x) => x / scale);
+
+    const p0 = this.points[0];
+    const p1 = this.points[1];
+    const rectPoints = [
+      new Point(p0.x, p0.y),
+      new Point(p1.x, p0.y),
+      new Point(p1.x, p1.y),
+      new Point(p0.x, p1.y),
+    ];
+
+    renderer.setColour(colour);
+    renderer.setLineWidth(this.lineWidth / scale);
+
+    // Semi-transparent fill
+    renderer.setDash([], 0);
+    renderer.drawShape(rectPoints, { closed: true, fill: true, stroke: false, alpha: 0.2 });
+
+    // Dashed outline
+    renderer.setDash(scaledPattern, 0);
+    renderer.drawShape(rectPoints, { closed: true, fill: false, stroke: true });
+  }
+}

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]);
+  }
+}

package/core/lib/boundingBox.js

@@ -55,9 +55,9 @@ export class BoundingBox {
   }
 
   /**
-   * return bounding box center point
+   * return bounding box centre point
    */
-  get centerPoint() {
+  get centrePoint() {
     return new Point(this.xMin + this.xLength / 2, this.yMin + this.yLength / 2);
   }
 
@@ -136,16 +136,16 @@ export class BoundingBox {
 
   /**
    * Calculate the boundingbox for an arc
-   * @param {Point} centerPoint
+   * @param {Point} centrePoint
    * @param {Point} startPoint
    * @param {Point} endPoint
    * @param {number} direction - ccw > 0, cw < 0
    * @return {BoundingBox}
    */
-  static arcBoundingBox(centerPoint, startPoint, endPoint, direction = 1) {
-    const startAngle = centerPoint.angle(startPoint);
-    const endAngle = centerPoint.angle(endPoint);
-    const radius = centerPoint.distance(startPoint);
+  static arcBoundingBox(centrePoint, startPoint, endPoint, direction = 1) {
+    const startAngle = centrePoint.angle(startPoint);
+    const endAngle = centrePoint.angle(endPoint);
+    const radius = centrePoint.distance(startPoint);
 
     const cross0 = this.crossesAxis(startAngle, endAngle, 0, direction);
     const cross90 = this.crossesAxis(startAngle, endAngle, Math.PI * 0.5, direction);
@@ -154,10 +154,10 @@ export class BoundingBox {
 
     // if the arc crosses the axis the min or max is where the arc intersects the axis
     // otherwise max/min is the arc endpoint
-    const xmin = cross180 ? centerPoint.x - radius : Math.min(startPoint.x, endPoint.x);
-    const xmax = cross0 ? centerPoint.x + radius : Math.max(startPoint.x, endPoint.x);
-    const ymin = cross270 ? centerPoint.y - radius : Math.min(startPoint.y, endPoint.y);
-    const ymax = cross90 ? centerPoint.y + radius : Math.max(startPoint.y, endPoint.y);
+    const xmin = cross180 ? centrePoint.x - radius : Math.min(startPoint.x, endPoint.x);
+    const xmax = cross0 ? centrePoint.x + radius : Math.max(startPoint.x, endPoint.x);
+    const ymin = cross270 ? centrePoint.y - radius : Math.min(startPoint.y, endPoint.y);
+    const ymax = cross90 ? centrePoint.y + radius : Math.max(startPoint.y, endPoint.y);
 
     const topLeft = new Point(xmin, ymax);
     const bottomRight = new Point(xmax, ymin);