giers10/webeditor3d
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Enable WebGL rendering unconditionally and update telemetry handling in RunnerCanvas.js

Browse Source
This commit is contained in:
Victor Giers
2026-04-06 20:54:24 +02:00
parent a46640bfb6
commit 0e86dd3d07
1 changed files with 9 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/runner-web/RunnerCanvas.js
View File

@@ -7,30 +7,31 @@ export function RunnerCanvas({ runtimeScene, projectAssets, loadedModelAssets, l
const hostRef = useRef(null); const hostRef = useRef(null);
const [runnerMessage, setRunnerMessage] = useState(null); const [runnerMessage, setRunnerMessage] = useState(null);
const [interactionPrompt, setInteractionPrompt] = useState(null); const [interactionPrompt, setInteractionPrompt] = useState(null);
const [firstPersonTelemetry, setFirstPersonTelemetry] = useState(null);
useEffect(() => { useEffect(() => {
const container = containerRef.current; const container = containerRef.current;
if (container === null) { if (container === null) {
return; return;
} }
const testCanvas = document.createElement("canvas");
const hasWebGl = testCanvas.getContext("webgl2") !== null ||
testCanvas.getContext("webgl") !== null ||
testCanvas.getContext("experimental-webgl") !== null;
try { try {
const runtimeHost = new RuntimeHost({ const runtimeHost = new RuntimeHost({
enableRendering: hasWebGl enableRendering: true
}); });
hostRef.current = runtimeHost; hostRef.current = runtimeHost;
runtimeHost.mount(container); runtimeHost.mount(container);
runtimeHost.setRuntimeMessageHandler(onRuntimeMessageChange); runtimeHost.setRuntimeMessageHandler(onRuntimeMessageChange);
runtimeHost.setFirstPersonTelemetryHandler(onFirstPersonTelemetryChange); runtimeHost.setFirstPersonTelemetryHandler((telemetry) => {
setFirstPersonTelemetry(telemetry);
onFirstPersonTelemetryChange(telemetry);
});
runtimeHost.setInteractionPromptHandler((prompt) => { runtimeHost.setInteractionPromptHandler((prompt) => {
setInteractionPrompt(prompt); setInteractionPrompt(prompt);
onInteractionPromptChange(prompt); onInteractionPromptChange(prompt);
}); });
setRunnerMessage(hasWebGl ? null : "WebGL is unavailable in this browser environment. The runner shell is visible, but runtime rendering is disabled."); setRunnerMessage(null);
return () => { return () => {
onInteractionPromptChange(null); onInteractionPromptChange(null);
setFirstPersonTelemetry(null);
runtimeHost.dispose(); runtimeHost.dispose();
hostRef.current = null; hostRef.current = null;
}; };
@@ -51,5 +52,5 @@ export function RunnerCanvas({ runtimeScene, projectAssets, loadedModelAssets, l
useEffect(() => { useEffect(() => {
hostRef.current?.setNavigationMode(navigationMode); hostRef.current?.setNavigationMode(navigationMode);
}, [navigationMode]); }, [navigationMode]);
return (_jsxs("div", { ref: containerRef, className: "runner-canvas", "data-testid": "runner-shell", "aria-label": "Built-in scene runner", style: createWorldBackgroundStyle(runtimeScene.world.background, runtimeScene.world.background.mode === "image" ? loadedImageAssets[runtimeScene.world.background.assetId]?.sourceUrl ?? null : null), children: [navigationMode === "firstPerson" ? _jsx("div", { className: "runner-canvas__crosshair", "aria-hidden": "true" }) : null, navigationMode === "firstPerson" && interactionPrompt !== null ? (_jsxs("div", { className: "runner-canvas__prompt", "data-testid": "runner-interaction-prompt", role: "status", "aria-live": "polite", children: [_jsx("div", { className: "runner-canvas__prompt-badge", children: "Click" }), _jsx("div", { className: "runner-canvas__prompt-text", "data-testid": "runner-interaction-prompt-text", children: interactionPrompt.prompt }), _jsxs("div", { className: "runner-canvas__prompt-meta", "data-testid": "runner-interaction-prompt-meta", children: [interactionPrompt.distance.toFixed(1), "m away \u00B7 ", interactionPrompt.range.toFixed(1), "m range"] })] })) : null, runnerMessage === null ? null : (_jsxs("div", { className: "runner-canvas__fallback", role: "status", children: [_jsx("div", { className: "runner-canvas__fallback-title", children: "Runner Unavailable" }), _jsx("div", { children: runnerMessage })] }))] })); return (_jsxs("div", { ref: containerRef, className: `runner-canvas ${navigationMode === "firstPerson" && firstPersonTelemetry?.inWaterVolume ? "runner-canvas--underwater" : ""}`, "data-testid": "runner-shell", "aria-label": "Built-in scene runner", style: createWorldBackgroundStyle(runtimeScene.world.background, runtimeScene.world.background.mode === "image" ? loadedImageAssets[runtimeScene.world.background.assetId]?.sourceUrl ?? null : null), children: [navigationMode === "firstPerson" && firstPersonTelemetry?.inWaterVolume ? _jsx("div", { className: "runner-canvas__underwater", "aria-hidden": "true" }) : null, navigationMode === "firstPerson" ? _jsx("div", { className: "runner-canvas__crosshair", "aria-hidden": "true" }) : null, navigationMode === "firstPerson" && interactionPrompt !== null ? (_jsxs("div", { className: "runner-canvas__prompt", "data-testid": "runner-interaction-prompt", role: "status", "aria-live": "polite", children: [_jsx("div", { className: "runner-canvas__prompt-badge", children: "Click" }), _jsx("div", { className: "runner-canvas__prompt-text", "data-testid": "runner-interaction-prompt-text", children: interactionPrompt.prompt }), _jsxs("div", { className: "runner-canvas__prompt-meta", "data-testid": "runner-interaction-prompt-meta", children: [interactionPrompt.distance.toFixed(1), "m away \u00B7 ", interactionPrompt.range.toFixed(1), "m range"] })] })) : null, runnerMessage === null ? null : (_jsxs("div", { className: "runner-canvas__fallback", role: "status", children: [_jsx("div", { className: "runner-canvas__fallback-title", children: "Runner Unavailable" }), _jsx("div", { children: runnerMessage })] }))] }));
} }