@aurigma/design-atoms/Viewer/InteractiveZonesHandler.js

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

import { PointF, assign, RectangleF, EventObject } from "@aurigma/design-atoms-model";
import { toTextWhizzPath } from "@aurigma/design-atoms-text";
import { Button, InputType } from "../Input/InputManager/IInputManager";
export class InteractiveZonesHandler {
    constructor(_styles, _eventManagerEvent) {
        this._styles = _styles;
        this._eventManagerEvent = _eventManagerEvent;
        this._onSurfacePropertyChanged = (sender, property) => {
            if (property == "interactiveZones") {
                this._activeZone = null;
                this._highlightZone = null;
                this._notifyStateChanged();
            }
        };
        this._onInput = (params) => {
            var _a, _b;
            const isRotating = (_b = (_a = this._selectionHandler) === null || _a === void 0 ? void 0 : _a.isRotating) !== null && _b !== void 0 ? _b : false;
            if (params.type == InputType.Hover) {
                const pointerParams = params;
                const zone = this._getZoneByPoint(pointerParams.workspace);
                this.highlightZone = zone;
                if (pointerParams.button == Button.Primary && !isRotating)
                    this.activeZone = zone;
            }
            else if (params.type == InputType.PointerDown) {
                const pointerParams = params;
                if (pointerParams.button == Button.Primary && !isRotating) {
                    const zone = this._getZoneByPoint(pointerParams.workspace);
                    this.activeZone = zone;
                }
            }
        };
        this._stateChangedEvent = new EventObject();
        this._offset = new PointF();
    }
    isReady() {
        return this._textWhizz != null;
    }
    getZoneStyle(zone, isActive, isHover) {
        var _a;
        const style = (_a = this._styles[zone.styleKey]) !== null && _a !== void 0 ? _a : this._styles.default;
        const resultStyle = {};
        const stylesArray = [];
        if (style.common)
            stylesArray.push(style.common);
        if (isActive && isHover && style.activeHighlighted)
            stylesArray.push(style.activeHighlighted);
        else if (isActive && style.active)
            stylesArray.push(style.active);
        else if (isHover && style.highlighted)
            stylesArray.push(style.highlighted);
        assign(resultStyle, stylesArray);
        return resultStyle;
    }
    setOffset(offset) {
        this._offset = offset;
    }
    setInputManager(inputManager) {
        if (this._inputManager != null)
            this._inputManager.removeOnInput(this._onInput);
        this._inputManager = inputManager;
        if (inputManager != null)
            this._inputManager.addOnInput(this._onInput);
    }
    setSelectionHandler(selection) {
        this._selectionHandler = selection;
    }
    setTextWhizz(textWhizz) {
        this._textWhizz = textWhizz;
    }
    setStyles(styles) {
        this._styles = styles;
    }
    getZoneBounds(zone) {
        const twPath = toTextWhizzPath(this._textWhizz, zone.path);
        const twRect = twPath.getBounds();
        return new RectangleF(twRect.x, twRect.y, twRect.width, twRect.height);
    }
    getSnapLines() {
        const result = [];
        this.interactiveZones.forEach(x => {
            if (!x.snappingEnabled)
                return;
            const bounds = this.getZoneBounds(x);
            result.push(bounds);
        });
        return result;
    }
    get stateChangedEvent() {
        return this._stateChangedEvent;
    }
    get currentSurface() {
        return this._currentSurface;
    }
    set currentSurface(value) {
        if (value === this._currentSurface)
            return;
        this._unsubscribeSurfaceEvents();
        this._currentSurface = value;
        this._subscribeSurfaceEvents();
    }
    get interactiveZones() {
        var _a, _b;
        return (_b = (_a = this._currentSurface) === null || _a === void 0 ? void 0 : _a.interactiveZones) === null || _b === void 0 ? void 0 : _b.toArray();
    }
    get activeZone() {
        return this._activeZone;
    }
    set activeZone(value) {
        if (this._activeZone === value)
            return;
        this._activeZone = value;
        this._notifyStateChanged();
    }
    get highlightZone() {
        return this._highlightZone;
    }
    set highlightZone(value) {
        if (this._highlightZone === value)
            return;
        this._highlightZone = value;
        this._notifyStateChanged();
    }
    _notifyStateChanged() {
        const args = { active: this.activeZone, highlighted: this.highlightZone };
        this._stateChangedEvent.notify(args);
        this._eventManagerEvent.fire(args);
    }
    _getZoneByPoint(point) {
        if (this._textWhizz == null)
            return null;
        const zones = this.interactiveZones;
        if (zones == null || zones.length == 0)
            return null;
        for (let zone of zones) {
            const twPath = toTextWhizzPath(this._textWhizz, zone.path);
            const pt = point.clone().translate(-this._offset.x, -this._offset.y);
            if (twPath.isInside(pt.x, pt.y))
                return zone;
        }
        return null;
    }
    _unsubscribeSurfaceEvents() {
        if (this._currentSurface == null)
            return;
        this._currentSurface.removePropertyChanged(this._onSurfacePropertyChanged);
    }
    _subscribeSurfaceEvents() {
        if (this._currentSurface == null)
            return;
        this._currentSurface.addPropertyChanged(this._onSurfacePropertyChanged);
    }
    propertyOf(name) {
        return name;
    }
}
//# sourceMappingURL=InteractiveZonesHandler.js.map