▱ SketchWave Trapezoid Class Reference

/*
File:    swTrapezoid.js
Date:    2026-05-18
Author:  klp
Workspace: SketchWaveTNT2026-05-01-Stg9
Purpose: SWTrapezoid class — a quadrilateral with one pair of parallel sides (the bases).

         Geometry (local coordinates, bounding-box centre at origin):
           Bottom base: from (–b/2, +h/2) to (+b/2, +h/2)   [visually lower in p5]
           Top    base: from (–a/2+off, –h/2) to (+a/2+off, –h/2)  [visually upper]
           off = offset shift of the top base (0 when regular / isosceles)

         When regular = true (default):
           The trapezoid is isosceles — both bases are centred on the same
           vertical axis and both non-parallel legs have equal length.

         Key formulas:
           Area      = (a + b) / 2 × h
           Left leg  = √((b/2 – a/2 + off)² + h²)
           Right leg = √((b/2 – a/2 – off)² + h²)
           Perimeter = a + b + leftLeg + rightLeg

Features:
  - Configurable fill colour, stroke colour, and stroke weight.
  - Regular (isosceles) or general trapezoid via options.regular and options.offset.
  - Rotation about the bounding-box centre.
  - Breathing: top base only, bottom base only, or all dimensions uniformly.
  - draw()           — pixel coordinates.
  - drawOnGrid(grid) — user coordinates mapped through SWGrid.

Dependencies: p5.js, swColor.js, swSinusoid.js, swGrid.js
Notes: assumes p5.js colorMode(HSB, 360, 100, 100, 100)
*/

console.log("[swTrapezoid.js] SWTrapezoid class loaded.");

class SWTrapezoid {

    constructor(cx, cy, topBase, bottomBase, height, fillColor, options = {}) {

        this.cx         = cx;
        this.cy         = cy;
        this.topBase    = max(1, topBase);
        this.bottomBase = max(this.topBase, bottomBase);
        this.height     = max(1, height);

        this.originalTopBase    = this.topBase;
        this.originalBottomBase = this.bottomBase;
        this.originalHeight     = this.height;

        this.fillColor    = fillColor           ? SWColor.copy(fillColor)           : null;
        this.strokeColor  = options.strokeColor ? SWColor.copy(options.strokeColor) : null;
        this.strokeWeight = options.strokeWeight ?? 2;
        this.regular      = options.regular !== false;
        this.offset       = this.regular ? 0 : (options.offset ?? 0);

        this._rotAngle      = 0;
        this._currentTop    = this.topBase;
        this._currentBottom = this.bottomBase;
        this._currentHeight = this.height;

    }//end constructor

    get leftLeg() {
        const off = this.regular ? 0 : this.offset;
        const dx  = this._currentBottom / 2 - this._currentTop / 2 + off;
        return Math.sqrt(dx * dx + this._currentHeight * this._currentHeight);
    }

    get rightLeg() {
        const off = this.regular ? 0 : this.offset;
        const dx  = this._currentBottom / 2 - this._currentTop / 2 - off;
        return Math.sqrt(dx * dx + this._currentHeight * this._currentHeight);
    }

    get area()      { return (this._currentTop + this._currentBottom) / 2 * this._currentHeight; }
    get perimeter() { return this._currentTop + this._currentBottom + this.leftLeg + this.rightLeg; }
    get isIsosceles() { return Math.abs(this.leftLeg - this.rightLeg) < 0.001; }

    draw() {
        this._drawAtPx(this.cx, this.cy,
                       this._currentTop, this._currentBottom, this._currentHeight);
    }

    drawOnGrid(grid) {
        const { x: sx, y: sy } = grid.userToScreen(this.cx, this.cy);
        const sTop    = this._currentTop    * grid.xScale;
        const sBottom = this._currentBottom * grid.xScale;
        const sHeight = this._currentHeight * Math.abs(grid.yScale);
        this._drawAtPx(sx, sy, sTop, sBottom, sHeight);
    }

    _drawAtPx(cx, cy, top, bottom, h) {
        const off = this.regular ? 0 : this.offset;
        push();
        if (this.fillColor)   { fill(this.fillColor.col); }
        else                  { noFill(); }
        if (this.strokeColor) {
            stroke(this.strokeColor.col);
            strokeWeight(this.strokeWeight);
            strokeJoin(ROUND);
        } else { noStroke(); }
        translate(cx, cy);
        rotate(radians(this._rotAngle));
        const hh = h      / 2;
        const hb = bottom / 2;
        const ht = top    / 2;
        quad(-hb, +hh, hb, +hh, ht + off, -hh, -ht + off, -hh);
        pop();
    }

    breathe(sinusoid, t) {
        const scale         = sinusoid.getValue(t);
        this._currentTop    = this.originalTopBase    * scale;
        this._currentBottom = this.originalBottomBase * scale;
        this._currentHeight = this.originalHeight     * scale;
    }

    breatheTop(sinusoid, t) {
        this._currentTop = this.originalTopBase * sinusoid.getValue(t);
    }

    breatheBottom(sinusoid, t) {
        this._currentBottom = this.originalBottomBase * sinusoid.getValue(t);
    }

    rotate(degPerSec, t) { this._rotAngle = degPerSec * t; }

    transform({ sinusoid = null, sinusoidTop = null, sinusoidBottom = null,
                t = 0, degPerSec = null } = {}) {
        if (sinusoid       !== null) this.breathe(sinusoid, t);
        if (sinusoidTop    !== null) this.breatheTop(sinusoidTop, t);
        if (sinusoidBottom !== null) this.breatheBottom(sinusoidBottom, t);
        if (degPerSec      !== null) this.rotate(degPerSec, t);
    }

    reset() {
        this._rotAngle      = 0;
        this._currentTop    = this.originalTopBase;
        this._currentBottom = this.originalBottomBase;
        this._currentHeight = this.originalHeight;
    }

    setCenter(cx, cy) { this.cx = cx; this.cy = cy; }

    setTopBase(a) {
        this.topBase = this.originalTopBase = this._currentTop = max(1, a);
    }
    setBottomBase(b) {
        this.bottomBase = this.originalBottomBase = this._currentBottom = max(this.topBase, b);
    }
    setHeight(h) {
        this.height = this.originalHeight = this._currentHeight = max(1, h);
    }
    setRegular(v) { this.regular = !!v; if (this.regular) this.offset = 0; }
    setOffset(off) { if (!this.regular) this.offset = off; }
    setFillColor(c)    { this.fillColor    = c ? SWColor.copy(c) : null; }
    setStrokeColor(c)  { this.strokeColor  = c ? SWColor.copy(c) : null; }
    setStrokeWeight(w) { this.strokeWeight = max(0, w); }

    toString() {
        return `SWTrapezoid(cx:${this.cx.toFixed(1)}, cy:${this.cy.toFixed(1)}, ` +
               `top:${this._currentTop.toFixed(1)}, bottom:${this._currentBottom.toFixed(1)}, ` +
               `h:${this._currentHeight.toFixed(1)}, regular:${this.regular})`;
    }

}//end class SWTrapezoid