@threlte/xr
Version:
Tools to more easily create VR and AR experiences with Threlte
74 lines (73 loc) • 2.32 kB
JavaScript
import { injectPlugin, isInstanceOf } from '@threlte/core';
import { useTeleportControls } from './context';
/**
* Registers T components with "teleportSurface" or "teleportBlocker" attributes.
*/
export const injectTeleportControlsPlugin = () => {
injectPlugin('threlte-teleport-controls-surfaces', (args) => {
if (!isInstanceOf(args.ref, 'Mesh'))
return;
if (!('teleportSurface' in args.props))
return;
let ref = $state(args.ref);
let isSurface = $state(args.props.teleportSurface);
const { addSurface, removeSurface } = useTeleportControls();
$effect(() => {
if (!ref)
return;
let mesh = ref;
if (isSurface) {
addSurface(mesh, args.props);
}
else {
removeSurface(mesh);
}
return () => removeSurface(mesh);
});
return {
pluginProps: ['teleportSurface'],
onRefChange: (nextRef) => {
ref = nextRef;
return () => {
ref = undefined;
};
},
onPropsChange: (props) => {
isSurface = props.teleportSurface;
}
};
});
injectPlugin('threlte-teleport-controls-blockers', (args) => {
if (!isInstanceOf(args.ref, 'Mesh'))
return;
if (!('teleportBlocker' in args.props))
return;
let ref = $state(args.ref);
let isBlocker = $state(args.props.teleportBlocker);
const { addBlocker, removeBlocker } = useTeleportControls();
$effect(() => {
if (!ref)
return;
let mesh = ref;
if (isBlocker) {
addBlocker(mesh);
}
else {
removeBlocker(mesh);
}
return () => removeBlocker(mesh);
});
return {
pluginProps: ['teleportBlocker'],
onRefChange: (nextRef) => {
ref = nextRef;
return () => {
ref = undefined;
};
},
onPropsChange: (props) => {
isBlocker = props.teleportBlocker;
}
};
});
};