@jgengine/shell 0.7.0 → 0.9.0

package/dist/devtools/CollisionDebugWorld.js

@@ -0,0 +1,180 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Html, Line } from "@react-three/drei";
+import { useFrame } from "@react-three/fiber";
+import { useEffect, useMemo, useRef, useState, useSyncExternalStore } from "react";
+import * as THREE from "three";
+import { useGameContext } from "@jgengine/react/provider";
+import { aimProbeNeeded, anyCollisionLayerOn, colliderScanNeeded, collisionDebug, projectileListenNeeded, } from "./collisionDebug.js";
+import { AIM_DAMAGE_COLOR, AIM_LASER_COLOR, AIM_MISS_COLOR, AIM_SOLID_COLOR, BODY_WIRE_COLOR, collectDebugShapes, computeAimLaser, HITBOX_WIRE_COLOR, muzzleMarkerFromOrigin, PROJECTILE_PATH_COLOR, } from "./collisionDebugMath.js";
+function useCollisionDebugState() {
+    return useSyncExternalStore(collisionDebug.subscribe, () => collisionDebug.getState(), () => collisionDebug.getState());
+}
+function WireSphere({ center, radius, color, label, }) {
+    return (_jsxs("group", { position: [center[0], center[1], center[2]], children: [_jsxs("mesh", { children: [_jsx("sphereGeometry", { args: [radius, 16, 12] }), _jsx("meshBasicMaterial", { color: color, wireframe: true, transparent: true, opacity: 0.85, depthTest: false })] }), _jsx(Html, { center: true, distanceFactor: 14, zIndexRange: [25, 0], style: { pointerEvents: "none" }, children: _jsx("span", { className: "rounded bg-black/70 px-1 text-[9px] font-medium text-white/90", children: label }) })] }));
+}
+function WireAabb({ center, halfExtents, rotationY, color, label, }) {
+    return (_jsxs("group", { position: [center[0], center[1], center[2]], rotation: [0, rotationY, 0], children: [_jsxs("mesh", { children: [_jsx("boxGeometry", { args: [halfExtents[0] * 2, halfExtents[1] * 2, halfExtents[2] * 2] }), _jsx("meshBasicMaterial", { color: color, wireframe: true, transparent: true, opacity: 0.85, depthTest: false })] }), _jsx(Html, { position: [0, halfExtents[1] + 0.15, 0], center: true, distanceFactor: 14, zIndexRange: [25, 0], style: { pointerEvents: "none" }, children: _jsx("span", { className: "rounded bg-black/70 px-1 text-[9px] font-medium text-white/90", children: label }) })] }));
+}
+function ColliderShapeMesh({ entry }) {
+    const color = entry.style === "hitbox" ? HITBOX_WIRE_COLOR : BODY_WIRE_COLOR;
+    if (entry.shape.kind === "sphere") {
+        return (_jsx(WireSphere, { center: entry.shape.center, radius: entry.shape.radius, color: color, label: entry.label }));
+    }
+    return (_jsx(WireAabb, { center: entry.shape.center, halfExtents: entry.shape.halfExtents, rotationY: entry.rotationY, color: color, label: entry.label }));
+}
+function endpointColor(kind) {
+    if (kind === "damage")
+        return AIM_DAMAGE_COLOR;
+    if (kind === "solid")
+        return AIM_SOLID_COLOR;
+    return AIM_MISS_COLOR;
+}
+function AimEndpointMark({ point, kind, }) {
+    const color = endpointColor(kind);
+    if (kind === "damage") {
+        const s = 0.14;
+        return (_jsxs("group", { position: [point[0], point[1], point[2]], children: [_jsx(Line, { points: [
+                        new THREE.Vector3(-s, -s, 0),
+                        new THREE.Vector3(s, s, 0),
+                    ], color: color, lineWidth: 2, depthTest: false }), _jsx(Line, { points: [
+                        new THREE.Vector3(-s, s, 0),
+                        new THREE.Vector3(s, -s, 0),
+                    ], color: color, lineWidth: 2, depthTest: false })] }));
+    }
+    if (kind === "solid") {
+        return (_jsxs("mesh", { position: [point[0], point[1], point[2]], children: [_jsx("sphereGeometry", { args: [0.1, 12, 10] }), _jsx("meshBasicMaterial", { color: color, wireframe: true, depthTest: false })] }));
+    }
+    return (_jsxs("mesh", { position: [point[0], point[1], point[2]], children: [_jsx("sphereGeometry", { args: [0.06, 8, 8] }), _jsx("meshBasicMaterial", { color: color, transparent: true, opacity: 0.55, depthTest: false })] }));
+}
+function MuzzleMark({ origin }) {
+    const mark = muzzleMarkerFromOrigin([origin[0], origin[1], origin[2]]);
+    return (_jsxs("mesh", { position: [mark.center[0], mark.center[1], mark.center[2]], children: [_jsx("sphereGeometry", { args: [mark.radius, 12, 10] }), _jsx("meshBasicMaterial", { color: mark.color, depthTest: false })] }));
+}
+function collectFromContext(ctx, layers) {
+    return collectDebugShapes({
+        layers,
+        entities: ctx.scene.entity.list().map((entity) => ({
+            id: entity.id,
+            position: entity.position,
+            rotationY: entity.rotationY,
+            name: entity.name,
+        })),
+        objects: ctx.scene.object.list().map((object) => ({
+            instanceId: object.instanceId,
+            catalogId: object.catalogId,
+            position: object.position,
+            rotationY: object.rotationY,
+        })),
+        entityCollidersOf: (id) => ctx.scene.entity.collidersOf(id),
+        objectCollidersOf: (id) => ctx.scene.object.collidersOf(id),
+        objectHalfExtentsOf: (catalogId) => {
+            for (const object of ctx.scene.object.list()) {
+                if (object.catalogId !== catalogId)
+                    continue;
+                const half = ctx.scene.object.catalog(object.instanceId)?.halfExtents;
+                if (half === undefined)
+                    return null;
+                return [half[0], half[1], half[2]];
+            }
+            return null;
+        },
+    });
+}
+/**
+ * World-space collision debugger. Performs zero scene scans and zero raycasts
+ * when every layer is off. Mount only when shell devtools are enabled.
+ */
+export function CollisionDebugWorld() {
+    const ctx = useGameContext();
+    const state = useCollisionDebugState();
+    const [shapes, setShapes] = useState([]);
+    const [laser, setLaser] = useState(null);
+    const frameCounter = useRef(0);
+    useEffect(() => {
+        if (!projectileListenNeeded(state.layers))
+            return;
+        return ctx.game.events.on("projectile.settled", (event) => {
+            collisionDebug.pushProjectileTrace({
+                origin: event.origin,
+                at: event.at,
+                hit: event.hit,
+                nowMs: performance.now(),
+            });
+        });
+    }, [ctx, state.layers.projectiles, state.layers.muzzles]);
+    useFrame(() => {
+        if (!anyCollisionLayerOn(state.layers)) {
+            if (shapes.length > 0)
+                setShapes([]);
+            if (laser !== null)
+                setLaser(null);
+            return;
+        }
+        frameCounter.current += 1;
+        const now = performance.now();
+        if (projectileListenNeeded(state.layers)) {
+            collisionDebug.pruneProjectileTraces(now);
+        }
+        if (colliderScanNeeded(state.layers) && frameCounter.current % 2 === 0) {
+            setShapes(collectFromContext(ctx, state.layers));
+        }
+        else if (!colliderScanNeeded(state.layers) && shapes.length > 0) {
+            setShapes([]);
+        }
+        if (aimProbeNeeded(state.layers)) {
+            const probe = collisionDebug.getAimProbe();
+            if (probe === null) {
+                if (laser !== null)
+                    setLaser(null);
+            }
+            else {
+                const next = computeAimLaser({
+                    layers: state.layers,
+                    sceneRaycast: {
+                        raycast: (input) => ctx.scene.raycast(input),
+                        raycastAll: (input) => [...ctx.scene.raycastAll(input)],
+                    },
+                    positionOf: (id) => ctx.scene.entity.get(id)?.position,
+                    rotationYOf: (id) => ctx.scene.entity.get(id)?.rotationY,
+                    from: probe.from,
+                    aim: probe.aim,
+                    originPolicy: probe.originPolicy,
+                    maxDistance: probe.maxDistance ?? 100,
+                });
+                setLaser(next);
+            }
+        }
+        else if (laser !== null) {
+            setLaser(null);
+        }
+    });
+    const projectilePoints = useMemo(() => {
+        if (!state.layers.projectiles)
+            return [];
+        return state.projectileTraces.map((trace) => ({
+            id: trace.id,
+            points: [
+                new THREE.Vector3(trace.origin[0], trace.origin[1], trace.origin[2]),
+                new THREE.Vector3(trace.at[0], trace.at[1], trace.at[2]),
+            ],
+        }));
+    }, [state.layers.projectiles, state.projectileTraces]);
+    const muzzleOrigins = useMemo(() => {
+        if (!state.layers.muzzles)
+            return [];
+        const origins = state.projectileTraces.map((trace) => ({
+            id: trace.id,
+            origin: trace.origin,
+        }));
+        if (laser !== null && state.layers.aimLaser) {
+            origins.push({ id: -1, origin: laser.origin });
+        }
+        return origins;
+    }, [state.layers.muzzles, state.layers.aimLaser, state.projectileTraces, laser]);
+    if (!anyCollisionLayerOn(state.layers))
+        return null;
+    return (_jsxs("group", { children: [shapes.map((entry) => (_jsx(ColliderShapeMesh, { entry: entry }, entry.key))), projectilePoints.map((path) => (_jsx(Line, { points: path.points, color: PROJECTILE_PATH_COLOR, lineWidth: 2, transparent: true, opacity: 0.9, depthTest: false }, path.id))), muzzleOrigins.map((entry) => (_jsx(MuzzleMark, { origin: entry.origin }, `muzzle-${entry.id}`))), laser !== null ? (_jsxs(_Fragment, { children: [_jsx(Line, { points: [
+                            new THREE.Vector3(laser.origin[0], laser.origin[1], laser.origin[2]),
+                            new THREE.Vector3(laser.end[0], laser.end[1], laser.end[2]),
+                        ], color: AIM_LASER_COLOR, lineWidth: 1.5, transparent: true, opacity: 0.95, depthTest: false }), _jsx(AimEndpointMark, { point: laser.end, kind: laser.kind })] })) : null] }));
+}

package/dist/devtools/DevtoolsOverlay.d.ts

@@ -0,0 +1,78 @@
+import { type DevtoolsOverrides, type DevtoolsSnapshot } from "@jgengine/core/devtools/devtools";
+import type { GameContext } from "@jgengine/core/runtime/gameContext";
+import type { ShellMultiplayer } from "../multiplayer.js";
+import type { PlayableGame } from "../registry.js";
+export declare function persistDevtoolsOverrides(gameName: string): DevtoolsOverrides;
+export declare function applyStoredDevtoolsOverrides(gameName: string): void;
+export declare function withDevtoolsLatency(multiplayer: ShellMultiplayer): ShellMultiplayer;
+export declare function DevtoolsRendererProbe(): null;
+export declare function buildLeanReport(playable: PlayableGame): {
+    game: string;
+    at: number;
+    why: string | null;
+    frame: {
+        fps: number;
+        avgFrameMs: number;
+        p95FrameMs: number;
+        maxFrameMs: number;
+        avgSimMs: number;
+        maxSimMs: number;
+        avgOutsideMs: number;
+        maxOutsideMs: number;
+        longFrames: number;
+        samples: number;
+        phases: {
+            name: string;
+            avgMs: number;
+            maxMs: number;
+            pctOfSim: number;
+        }[];
+    } | null;
+    render: import("@jgengine/core/devtools/devtools").RenderSample | null;
+    latency: import("@jgengine/core/devtools/devtools").LatencyStats | null;
+    longFrameSummary: {
+        count: number;
+        culprits: {
+            culprit: string;
+            count: number;
+        }[];
+        maxFrameMs: number;
+        maxDrawCalls: number | undefined;
+        maxGeometries: number | undefined;
+    } | null;
+    longFrames: {
+        at: number;
+        frameMs: number;
+        simMs: number;
+        outsideMs: number;
+        culprit: string;
+        reason: string;
+        phases: {
+            name: string;
+            ms: number;
+        }[];
+        probes: Record<string, unknown>;
+        render: import("@jgengine/core/devtools/devtools").RenderSample | null;
+    }[];
+    probes: Record<string, unknown>;
+    logs: import("@jgengine/core/devtools/devtools").DevtoolsLogEntry[] | undefined;
+    controls: {
+        name: string;
+        value: unknown;
+        initial: unknown;
+    }[] | undefined;
+    discovered: {
+        id: string;
+        value: unknown;
+    }[] | undefined;
+    discoveredCount: number;
+};
+export declare function buildFullReport(playable: PlayableGame): DevtoolsSnapshot & {
+    game: string;
+};
+export declare function DevtoolsOverlay({ open, ctx, playable, multiplayer, }: {
+    open: boolean;
+    ctx: GameContext;
+    playable: PlayableGame;
+    multiplayer: ShellMultiplayer | null;
+}): import("react").JSX.Element | null;