the-world-engine/dist/esm/engine/script/input/GridPointer.js

three.js based, unity like game engine for browser

import { Vector3 } from "three/src/Three";

import { EventContainer } from "../../collection/EventContainer";

import { Component } from "../../hierarchy_object/Component";

import { PrefabRef } from "../../hierarchy_object/PrefabRef";

import { CssHtmlElementRenderer } from "../render/CssHtmlElementRenderer";

import { PointerGridInputListener } from "./PointerGridInputListener";

export class GridPointer extends Component {
    disallowMultipleComponent=true;
    requiredComponents=[ PointerGridInputListener ];
    Pn=null;
    Cn=0;
    wn=null;
    En=null;
    Me=new EventContainer;
    ye=new EventContainer;
    Pe=new EventContainer;
    Dn=false;
    Nh=false;
    start() {
        this.Pn = this.gameObject.getComponent(PointerGridInputListener);
        this.Pn.onPointerEnter.addListener(this.Rn);
        this.Pn.onPointerLeave.addListener(this.bn);
        this.Pn.onPointerDown.addListener(this.Gn);
        this.Pn.onPointerUp.addListener(this.Ln);
        this.Pn.onPointerMove.addListener(this.Bn);
        const t = new PrefabRef;
        const e = new PrefabRef;
        this.gameObject.addChildFromBuilder(this.engine.instantiater.buildGameObject("pointer", new Vector3(0, 0, this.Cn)).active(false).withComponent(CssHtmlElementRenderer, (t => {
            t.pointerEvents = false;
            const e = document.createElement("div");
            e.style.backgroundColor = "white";
            e.style.opacity = "0.3";
            t.element = e;
        })).getComponent(CssHtmlElementRenderer, e).getGameObject(t));
        this.wn = t.ref;
        this.En = e.ref;
        this.Nh = true;
    }
    onDestroy() {
        if (!this.Nh) return;
        if (this.Pn) {
            this.Pn.onPointerEnter.removeListener(this.Rn);
            this.Pn.onPointerLeave.removeListener(this.bn);
            this.Pn.onPointerDown.removeListener(this.Gn);
            this.Pn.onPointerUp.removeListener(this.Ln);
            this.Pn.onPointerMove.removeListener(this.Bn);
        }
    }
    Rn=t => {
        this.wn.activeSelf = true;
        this.Bn(t);
    };
    bn=t => {
        if (this.Dn) this.Ln(t);
        this.wn.activeSelf = false;
    };
    Gn=t => {
        this.Dn = true;
        this.In(t);
        const e = this.En?.element;
        if (e) e.style.backgroundColor = "#DDDDDD";
        this.Me.invoke(t);
    };
    Ln=t => {
        this.Dn = false;
        this.In(t);
        const e = this.En?.element;
        if (e) e.style.backgroundColor = "white";
        this.ye.invoke(t);
    };
    Bn=t => {
        this.In(t);
        this.Pe.invoke(t);
    };
    In(t) {
        const e = this.Pn.gridCellWidth;
        const i = this.Pn.gridCellHeight;
        const n = this.Pn.gridCenter;
        const r = t.gridPosition.x * e + n.x;
        const s = t.gridPosition.y * i + n.y;
        this.wn.transform.localPosition.set(r, s, this.Cn);
    }
    get onPointerDown() {
        return this.Me;
    }
    get onPointerUp() {
        return this.ye;
    }
    get onPointerMove() {
        return this.Pe;
    }
    get pointerZoffset() {
        return this.Cn;
    }
    set pointerZoffset(t) {
        this.Cn = t;
    }
}