Scan the code and take a shape. Drag, pinch or twist it; turn the gyro on and it turns with your phone. This page is plain three.js and one element.
Your page
<script type="module"
src="https://obpal.blackboxes.net/embed.js"></script>
<obpal-remote app="My scene" seats="4"
modes="face.trackpad face.wii"></obpal-remote>
<script type="module">
const pal = document.querySelector('obpal-remote')
pal.setScene({ nodes: [
{ id: 'cube', name: 'Cube', kind: 'object' },
] })
requestAnimationFrame(function loop(now) {
for (const p of pal.participants) {
const f = pal.frame(now, p.id)
if (pal.holding(p.id) === 'cube')
cube.position.x += f.pad1[0] * 0.01
}
requestAnimationFrame(loop)
})
</script>