the-world-engine/dist/esm/engine/script/physics2d/collider/CircleCollider2D.js

three.js based, unity like game engine for browser

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

import { CircleShape } from "../../../../box2d.ts/build/index";

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

import { ObjectAttacher2D } from "../ObjectAttacher2D";

import { getOrCreatePhysicsDebugRenderObject } from "../PhysicsDebugRender";

import { Collider2D } from "./Collider2D";

export class CircleCollider2D extends Collider2D {
    Dl=1;
    gl=true;
    pl=null;
    ml() {
        if (this.gl) {
            let e = this.gameObject.getComponent(ObjectAttacher2D);
            if (!e) e = this.gameObject.addComponent(ObjectAttacher2D);
            if (this.pl) {
                const e = this.pl.getComponentInChildren(CssHtmlElementRenderer);
                e.elementWidth = this.Dl * 2;
                e.elementHeight = this.Dl * 2;
            } else {
                const t = getOrCreatePhysicsDebugRenderObject(this.engine);
                this.pl = t.addChildFromBuilder(this.engine.instantiater.buildGameObject(this.gameObject.name + "_debug_circle").withChild(this.engine.instantiater.buildGameObject("debug_circle", new Vector3(this.offset.x, this.offset.y, 200)).withComponent(CssHtmlElementRenderer, (e => {
                    const t = document.createElement("div");
                    t.style.border = "2px solid rgba(255, 255, 0, 0.3)";
                    t.style.borderRadius = "50%";
                    t.style.margin = "0";
                    t.style.padding = "0";
                    t.style.backgroundColor = "rgba(0, 0, 0, 0)";
                    e.element = t;
                    e.elementHeight = this.Dl * 2;
                    e.elementWidth = this.Dl * 2;
                    e.viewScale = .01;
                    e.pointerEvents = false;
                }))));
                e.target = this.pl;
            }
        }
    }
    onEnable() {
        super.onEnable();
        this.ml();
    }
    onDisable() {
        super.onDisable();
        if (this.pl) {
            this.pl.destroy();
            this.pl = null;
        }
    }
    _l=[ new CircleShape ];
    createShapes() {
        const e = this._l[0];
        e.Set(this.offset, this.Dl);
        return this._l;
    }
    get radius() {
        return this.Dl;
    }
    set radius(e) {
        this.Dl = e;
        this.updateFixture();
        this.ml();
    }
    get debugDraw() {
        return this.gl;
    }
    set debugDraw(e) {
        this.gl = e;
        if (this.enabled && this.gameObject.activeInHierarchy) {
            if (e) {
                this.ml();
            } else {
                if (this.pl) {
                    this.pl.destroy();
                    this.pl = null;
                }
            }
        }
    }
}