Download Game! Currently 92 players and visitors. Last logged in:CovidDesertCaitlineDiv

Blitzer's Blog >> 72156

Back to blogs index
Posted: 06 Sep 2026 14:36 [ permalink ]
Added: 

==

 // Plant a seed block at (4, 4, 4) so we have something to click on!
ringBuffer.push([1, 0, 4 + 4 * CHUNK_SIZE + 4 * CHUNK_SIZE * CHUNK_SIZE, 1]); 

==

** RESTART VITE **

==[ Chrome ]==
** RELOAD **

[Green cube visible]

** CLICK: top face of green cube **

>> console <<
renderer.ts:71 BJS - [11:34:43]: Babylon.js v9.25.0 - WebGL2
mesh_worker.ts:4 [Worker] Loaded
mesh_worker.ts:73 [Worker] Entering main loop
mesh_worker.ts:62 [Worker] Generated mesh with 36 vertices
renderer.ts:65 [Renderer] Rendered chunk 0 with 36 vertices.
renderer.ts:140 Uncaught TypeError: Cannot read properties of undefined
(reading 'shiftKey')
B B at scene.onPointerDown (renderer.ts:140:63
B B at InputManager._processPointerDown (scene.pure-DUZIp8yY.js?v=1425c307:5085
:35)
B B at InputManager._onPointerDown (scene.pure-DUZIp8yY.js?v=1425c307:5337:9)
B B at Observer.callback (scene.pure-DUZIp8yY.js?v=1425c307:5425:80)
B B at Observable.notifyObservers (observable.pure-_bZJYgan.js?v=1425c307:230:3
8)
B B at DeviceSourceManager._onInputChanged (scene.pure-DUZIp8yY.js?v=1425c307:4
786:69)
B B at WebDeviceInputSystem.onInputChanged [as _onInputChanged]
(scene.pure-DUZIp8yY.js?v=1425c307:4679:75)
B B at HTMLCanvasElement._pointerDownEvent (scene.pure-DUZIp8yY.js?v=1425c307:4
408:10)
(anonymous) @ renderer.ts:140
_processPointerDown @ scene.pure-DUZIp8yY.js?v=1425c307:5085
_onPointerDown @ scene.pure-DUZIp8yY.js?v=1425c307:5337
(anonymous) @ scene.pure-DUZIp8yY.js?v=1425c307:5425
notifyObservers @ observable.pure-_bZJYgan.js?v=1425c307:230
_onInputChanged @ scene.pure-DUZIp8yY.js?v=1425c307:4786
onInputChanged @ scene.pure-DUZIp8yY.js?v=1425c307:4679
_pointerDownEvent @ scene.pure-DUZIp8yY.js?v=1425c307:4408

==

The seed block worked perfectly, but the developer chat made a slight error
with the Babylon.js API!

They confused `scene.onPointerObservable` (which wraps events in a special
`PointerInfo` object) with `scene.onPointerDown` (which just passes the raw
DOM `PointerEvent` directly).

Because it passes the raw event, `pointerInfo.event` is undefined, causing the
crash when it tries to read `.shiftKey`. The properties `clientX`, `clientY`,
`button`, and `shiftKey` actually live directly on the first argument!

Here is the corrected raycasting block for `web/src/renderer.ts`. Replace your
current `scene.onPointerDown` block with this:

```typescript
scene.onPointerDown = (evt) => {
    // evt is the raw PointerEvent, so we read properties directly from it
    const pickResult = scene.pick(evt.clientX, evt.clientY);
    if (!pickResult.hit || !pickResult.pickedMesh) return;

    const normal = pickResult.getNormal(true);
    const pickedPoint = pickResult.pickedPoint;

    if (!normal || !pickedPoint) return;

    const isLeftClick = evt.button === 0;
    const isRightClick = evt.button === 2;
    const isShiftLeftClick = isLeftClick && evt.shiftKey;

    let targetPoint: Vector3 | null = null;
    let voxelData: number | null = null;

    if (isLeftClick && !isShiftLeftClick) {
        // Place block: move outward from the face
        targetPoint = pickedPoint.add(normal.scale(0.5));
        voxelData = 1;
    } else if (isRightClick || isShiftLeftClick) {
        // Remove block: move inward from the face
        targetPoint = pickedPoint.subtract(normal.scale(0.5));
        voxelData = 0;
    }

    if (targetPoint && voxelData !== null) {
        const x = Math.floor(targetPoint.x);
        const y = Math.floor(targetPoint.y);
        const z = Math.floor(targetPoint.z);

        if (isWithinBounds(x, y, z)) {
            const voxelIndex = x + y * CHUNK_SIZE + z * CHUNK_SIZE *
CHUNK_SIZE;
            const cmdId = 1; // CMD_SET_VOXEL
            const chunkCoords = 0; // single chunk for now
            const pushed = ringBuffer.push([cmdId, chunkCoords, voxelIndex,
voxelData]);
            console.log(`[Main] Pushed edit (${x}, ${y}, ${z}) -> ${voxelData}
(pushed: ${pushed})`);
        } else {
            console.warn('Edit position out of bounds', x, y, z);
        }
    }
};

```

Save that, let Vite reload the page, and try clicking the green seed block
again! You should now be able to stack blocks on top of it and carve them away
with right-click. Let me know if the snapping feels accurate!