@needle-tools/engine/src/engine-components/EventTrigger.ts

Needle Engine is a web-based runtime for 3D apps. It runs on your machine for development with great integrations into editors like Unity or Blender - and can be deployed onto any device! It is flexible, extensible and networking and XR are built-in.

import { serializable } from "../engine/engine_serialization.js";
import { EventSystem } from "./api.js";
import { Behaviour } from "./Component.js"
import { EventList } from "./EventList.js";
import { EventType } from "./EventType.js"
import type { IPointerEventHandler, PointerEventData } from "./ui/PointerEvents.js"

class TriggerEvent {
    @serializable()
    eventID!: EventType;
    @serializable(EventList)
    callback: EventList<any> = new EventList();
}

/**
 * The EventTrigger component is used to trigger events when certain pointer events occur on the GameObject.
 * It implements the {@link IPointerEventHandler} interface and can be used to expose events to the user in the editor without writing code.
 * @category Interactivity
 * @group Components
 */
export class EventTrigger extends Behaviour implements IPointerEventHandler {

    /** A list of events that should be triggered when a pointer event occurs on the GameObject. */
    @serializable(TriggerEvent)
    triggers?: Array<TriggerEvent> = [];

    /** @internal */
    invoke(type: EventType) {
        if (!this.triggers) return;
        for (const trigger of this.triggers) {
            if (trigger.eventID === type) {
                trigger.callback?.invoke();
            }
        }
    }

    private hasTrigger(type: EventType) {
        return this.triggers?.some(t => t.eventID === type) ?? false;
    }
    private shouldChangeCursor() {
        return this.hasTrigger(EventType.PointerClick) || this.hasTrigger(EventType.PointerDown) || this.hasTrigger(EventType.PointerUp);
    }

    /** @internal */
    onPointerClick(_: PointerEventData) {
        this.invoke(EventType.PointerClick);
    }

    /** @internal */
    onPointerEnter(_: PointerEventData) {
        if (this.shouldChangeCursor()) {
            this.context.input.setCursor("pointer");
        }
        this.invoke(EventType.PointerEnter);
    }

    /** @internal */
    onPointerExit(_: PointerEventData) {
        if (this.shouldChangeCursor()) {
            this.context.input.unsetCursor("pointer");
        }
        this.invoke(EventType.PointerExit);
    }

    /** @internal */
    onPointerDown(_: PointerEventData) {
        this.invoke(EventType.PointerDown);
    }

    /** @internal */
    onPointerUp(_: PointerEventData) {
        this.invoke(EventType.PointerUp);
    }

}