matrix-engine-wgpu 1.3.3 → 1.3.6

package/index.js

@@ -6,7 +6,7 @@
 // import {degToRad, radToDeg} from "./utils";
 import {downloadMeshes} from "./src/engine/loader-obj.js";
 import MatrixEngineWGPU from "./src/world.js";
-import {addRaycastListener, getRayFromMouse, rayIntersectsSphere} from "./src/engine/raycast.js";
+import {addRaycastsAABBListener, addRaycastListener, getRayFromMouse, rayIntersectsSphere} from "./src/engine/raycast.js";
 
 var about = () => {
   console.log("Hi npm. matrix-engine for webgpu is ready...")
@@ -25,5 +25,6 @@ export {
 	rayIntersectsSphere,
 	getRayFromMouse,
 	addRaycastListener,
+  addRaycastsAABBListener,
   about
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "matrix-engine-wgpu",
-  "version": "1.3.3",
+  "version": "1.3.6",
   "description": "obj sequence anim +HOTFIX raycast, webGPU powered pwa application. Crazy fast rendering with AmmoJS physics support. Simple raycaster hit object added.",
   "main": "index.js",
   "files": [

package/src/engine/raycast.js

@@ -72,8 +72,8 @@ export function rayIntersectsSphere(rayOrigin, rayDirection, sphereCenter, spher
   return discriminant > 0;
 }
 
-export function addRaycastListener() {
-  let canvasDom = document.getElementById("canvas1");
+export function addRaycastListener(canvasId = "canvas1") {
+  let canvasDom = document.getElementById(canvasId);
   canvasDom.addEventListener('click', (event) => {
     let camera = app.cameras.WASD;
     const {rayOrigin, rayDirection} = getRayFromMouse(event, canvasDom, camera);
@@ -89,4 +89,129 @@ export function addRaycastListener() {
       }
     }
   });
-}
+}
+
+export function rayIntersectsAABB(
+  rayOrigin,
+  rayDirection,
+  boxMin,
+  boxMax
+) {
+  let tmin = (boxMin[0] - rayOrigin[0]) / rayDirection[0];
+  let tmax = (boxMax[0] - rayOrigin[0]) / rayDirection[0];
+  if(tmin > tmax) [tmin, tmax] = [tmax, tmin];
+
+  let tymin = (boxMin[1] - rayOrigin[1]) / rayDirection[1];
+  let tymax = (boxMax[1] - rayOrigin[1]) / rayDirection[1];
+  if(tymin > tymax) [tymin, tymax] = [tymax, tymin];
+
+  if(tmin > tymax || tymin > tmax) return false;
+  if(tymin > tmin) tmin = tymin;
+  if(tymax < tmax) tmax = tymax;
+
+  let tzmin = (boxMin[2] - rayOrigin[2]) / rayDirection[2];
+  let tzmax = (boxMax[2] - rayOrigin[2]) / rayDirection[2];
+  if(tzmin > tzmax) [tzmin, tzmax] = [tzmax, tzmin];
+
+  if(tmin > tzmax || tzmin > tmax) return false;
+
+  return true;
+}
+
+export function computeAABBFromVertices(vertices) {
+  const min = [Infinity, Infinity, Infinity];
+  const max = [-Infinity, -Infinity, -Infinity];
+
+  for(let i = 0;i < vertices.length;i += 3) {
+    const x = vertices[i];
+    const y = vertices[i + 1];
+    const z = vertices[i + 2];
+
+    min[0] = Math.min(min[0], x);
+    min[1] = Math.min(min[1], y);
+    min[2] = Math.min(min[2], z);
+
+    max[0] = Math.max(max[0], x);
+    max[1] = Math.max(max[1], y);
+    max[2] = Math.max(max[2], z);
+  }
+
+  return [min, max];
+}
+
+export function computeWorldAABB(vertices, modelMatrix) {
+  const min = [Infinity, Infinity, Infinity];
+  const max = [-Infinity, -Infinity, -Infinity];
+  const v = [0, 0, 0];
+
+  for (let i = 0; i < vertices.length; i += 3) {
+    v[0] = vertices[i];
+    v[1] = vertices[i + 1];
+    v[2] = vertices[i + 2];
+
+    const worldV = vec3.transformMat4([], v, modelMatrix);
+
+    min[0] = Math.min(min[0], worldV[0]);
+    min[1] = Math.min(min[1], worldV[1]);
+    min[2] = Math.min(min[2], worldV[2]);
+
+    max[0] = Math.max(max[0], worldV[0]);
+    max[1] = Math.max(max[1], worldV[1]);
+    max[2] = Math.max(max[2], worldV[2]);
+  }
+
+  return [min, max];
+}
+
+export function addRaycastsAABBListener(canvasId = "canvas1") {
+  const canvasDom = document.getElementById(canvasId);
+  if(!canvasDom) {
+    console.warn(`Canvas with id ${canvasId} not found`);
+    return;
+  }
+
+  canvasDom.addEventListener('click', (event) => {
+    const camera = app.cameras.WASD;
+    const {rayOrigin, rayDirection} = getRayFromMouse(event, canvasDom, camera);
+
+    for(const object of app.mainRenderBundle) {
+      // Compute AABB min/max from object position and size
+      const pos = [object.position.x,object.position.y,object.position.z]; // [x,y,z]
+      // Works only for 0,0,0 static object
+      // const [boxMinLocal, boxMaxLocal] = computeAABBFromVertices(object.mesh.vertices);
+      const [boxMin, boxMax] = computeWorldAABB(object.mesh.vertices, object.viewMatrix);
+      // Optionally transform to world space using object.position
+      // const pos = object.position;
+      // const boxMin = [
+      //   boxMinLocal[0] + pos[0],
+      //   boxMinLocal[1] + pos[1],
+      //   boxMinLocal[2] + pos[2]
+      // ];
+      // const boxMax = [
+      //   boxMaxLocal[0] + pos[0],
+      //   boxMaxLocal[1] + pos[1],
+      //   boxMaxLocal[2] + pos[2]
+      // ];
+      //////////////
+      // const size = object.size || [1, 1, 1]; // Replace with actual object size or default 1x1x1
+      // const boxMin = [
+      //   pos[0] - size[0] / 2,
+      //   pos[1] - size[1] / 2,
+      //   pos[2] - size[2] / 2
+      // ];
+      // const boxMax = [
+      //   pos[0] + size[0] / 2,
+      //   pos[1] + size[1] / 2,
+      //   pos[2] + size[2] / 2
+      // ];
+
+      if(rayIntersectsAABB(rayOrigin, rayDirection, boxMin, boxMax)) {
+        console.log('AABB hit:', object.name);
+
+        canvasDom.dispatchEvent(new CustomEvent('ray.hit.event', {
+          detail: {hitObject: object}
+        }));
+      }
+    }
+  });
+}