@aurigma/design-atoms-model/Math/Transform.js

Design Atoms is a part of Customer's Canvas SDK which allows for manipulating individual design elements through your code.

import { EventObject } from "../EventObject";
import { EqualsOfFloatNumbers, ConvertDegreeToRadian } from "./Common";
import { Matrix } from "./Matrix";
export class Transform {
    constructor(scaleX, scaleY, translateX, translateY, angle) {
        this._angle = 0;
        this._scaleX = 0;
        this._scaleY = 0;
        this._translateX = 0;
        this._translateY = 0;
        this._transformChangedEvent = new EventObject();
        this._angle = (angle) ? angle : 0;
        this._scaleX = (scaleX || scaleX === 0) ? scaleX : 1;
        this._scaleY = (scaleY || scaleX === 0) ? scaleY : 1;
        this._translateX = (translateX) ? translateX : 0;
        this._translateY = (translateY) ? translateY : 0;
    }
    addTransformChanged(handler) {
        this._transformChangedEvent.add(handler);
    }
    removeTransformChanged(handler) {
        this._transformChangedEvent.remove(handler);
    }
    _setProperty(propName, value, supressOnChanged = false) {
        const fieldName = `_${propName}`;
        if (this[fieldName] !== value) {
            this[fieldName] = value;
            if (!supressOnChanged)
                this._transformChangedEvent.notify();
        }
    }
    get angle() { return this._angle; }
    setAngle(value, supressOnChanged) { this._setProperty("angle", value, supressOnChanged); }
    get scaleX() { return this._scaleX; }
    setScaleX(value, supressOnChanged) { this._setProperty("scaleX", value, supressOnChanged); }
    get scaleY() { return this._scaleY; }
    setScaleY(value, supressOnChanged) { this._setProperty("scaleY", value, supressOnChanged); }
    get translateX() { return this._translateX; }
    setTranslateX(value, supressOnChanged) { this._setProperty("translateX", value, supressOnChanged); }
    get translateY() { return this._translateY; }
    setTranslateY(value, supressOnChanged) { this._setProperty("translateY", value, supressOnChanged); }
    move(x, y) {
        const t = this.clone();
        if (x != null)
            this.setTranslateX(this._translateX + x, true);
        if (y != null)
            this.setTranslateY(this._translateY + y, true);
        if (!t.equals(this))
            this._transformChangedEvent.notify();
    }
    rotate(angle) {
        if (angle == null || EqualsOfFloatNumbers(angle, 0))
            return;
        this._angle += angle;
        this._transformChangedEvent.notify();
    }
    clone() {
        return new Transform(this._scaleX, this._scaleY, this._translateX, this._translateY, this._angle);
    }
    equals(transform, tolerance) {
        return transform != null &&
            EqualsOfFloatNumbers(this._scaleX, transform._scaleX, tolerance) &&
            EqualsOfFloatNumbers(this._scaleY, transform._scaleY, tolerance) &&
            EqualsOfFloatNumbers(this._translateX, transform._translateX, tolerance) &&
            EqualsOfFloatNumbers(this._translateY, transform._translateY, tolerance) &&
            EqualsOfFloatNumbers(this._angle, transform._angle, tolerance);
    }
    static isEqual(a, b, tolerance = 0.0001) {
        if (a == null && b == null)
            return true;
        if (a == null || b == null)
            return false;
        return a.equals(b, tolerance);
    }
    toMatrix() {
        const angle = this._angle;
        const sin = Math.sin(ConvertDegreeToRadian(angle));
        const cos = Math.cos(ConvertDegreeToRadian(angle));
        return new Matrix(cos * this._scaleX, sin * this._scaleX, -sin * this._scaleY, cos * this._scaleY, this._translateX, this._translateY);
    }
    clear({ keepAngle = false, supressOnChanged = false } = {}) {
        this._scaleX = 1;
        this._scaleY = 1;
        this._translateX = 0;
        this._translateY = 0;
        if (!keepAngle)
            this._angle = 0;
        if (!supressOnChanged)
            this._transformChangedEvent.notify();
    }
    applyMatrix(matrix, supressOnChanged = false) {
        if (matrix.isIdentity)
            return;
        const targetMatrix = this.toMatrix().concatenate(matrix);
        this._angle = targetMatrix.angle;
        this._scaleX = targetMatrix.scaleX;
        this._scaleY = targetMatrix.scaleY;
        this._translateX = targetMatrix.translateX;
        this._translateY = targetMatrix.translateY;
        if (!supressOnChanged)
            this._transformChangedEvent.notify();
    }
    get isEmpty() {
        return EqualsOfFloatNumbers(this._scaleX, 1) && EqualsOfFloatNumbers(this._scaleY, 1) &&
            EqualsOfFloatNumbers(this._translateX, 0) && EqualsOfFloatNumbers(this._translateY, 0) &&
            EqualsOfFloatNumbers(this._angle, 0);
    }
    toString() {
        let r = [this.translateX, this.translateY, this.scaleX, this.scaleY, this.angle].map(x => x.toFixed(2));
        return `{ tx: ${r[0]}, ty: ${r[1]}, sx: ${r[2]}, sy: ${r[3]}, a: ${r[4]}}`;
    }
}
//# sourceMappingURL=Transform.js.map