matrix-engine-wgpu 1.3.13 → 1.3.17

package/src/engine/engine.js

@@ -1,476 +0,0 @@
-// Note: The code in this file does not use the 'dst' output parameter of functions in the
-// 'wgpu-matrix' library, so produces many temporary vectors and matrices.
-// This is intentional, as this sample prefers readability over performance.
-import { mat4, vec3 } from 'wgpu-matrix';
-import {LOG_INFO} from './utils';
-// import Input from './input';
-
-// // Common interface for camera implementations
-// export default interface Camera {
-//   // update updates the camera using the user-input and returns the view matrix.
-//   update(delta_time: number, input: Input): Mat4;
-
-//   // The camera matrix.
-//   // This is the inverse of the view matrix.
-//   matrix: Mat4;
-//   // Alias to column vector 0 of the camera matrix.
-//   right: Vec4;
-//   // Alias to column vector 1 of the camera matrix.
-//   up: Vec4;
-//   // Alias to column vector 2 of the camera matrix.
-//   back: Vec4;
-//   // Alias to column vector 3 of the camera matrix.
-//   position: Vec4;
-// }
-
-// The common functionality between camera implementations
-class CameraBase {
-  // The camera matrix
-  matrix_ = new Float32Array([
-    1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1,
-  ]);
-
-  // The calculated view matrix readonly
-  view_ = mat4.create();
-
-  // Aliases to column vectors of the matrix
-   right_ = new Float32Array(this.matrix_.buffer, 4 * 0, 4);
-   up_ = new Float32Array(this.matrix_.buffer, 4 * 4, 4);
-   back_ = new Float32Array(this.matrix_.buffer, 4 * 8, 4);
-   position_ = new Float32Array(this.matrix_.buffer, 4 * 12, 4);
-
-  // Returns the camera matrix
-  get matrix() {
-    return this.matrix_;
-  }
-  // Assigns `mat` to the camera matrix
-  set matrix(mat) {
-    mat4.copy(mat, this.matrix_);
-  }
-
-  setProjection(fov = (2 * Math.PI) / 5, aspect = 1, near = 1, far = 1000) {
-    this.projectionMatrix = mat4.perspective(fov, aspect, near, far);
-  }
-
-  // Returns the camera view matrix
-  get view() {
-    return this.view_;
-  }
-  // Assigns `mat` to the camera view
-  set view(mat) {
-    mat4.copy(mat, this.view_);
-  }
-
-  // Returns column vector 0 of the camera matrix
-  get right() {
-    return this.right_;
-  }
-
-  // Assigns `vec` to the first 3 elements of column vector 0 of the camera matrix
-  set right(vec) {
-    vec3.copy(vec, this.right_);
-  }
-
-  // Returns column vector 1 of the camera matrix
-  get up() {
-    return this.up_;
-  }
-
-  // Assigns `vec` to the first 3 elements of column vector 1 of the camera matrix \ Vec3
-  set up(vec) {
-    vec3.copy(vec, this.up_);
-  }
-
-  // Returns column vector 2 of the camera matrix
-  get back() {
-    return this.back_;
-  }
-
-  // Assigns `vec` to the first 3 elements of column vector 2 of the camera matrix
-  set back(vec) {
-    vec3.copy(vec, this.back_);
-  }
-
-  // Returns column vector 3 of the camera matrix
-  get position() {
-    return this.position_;
-  }
-
-  // Assigns `vec` to the first 3 elements of column vector 3 of the camera matrix
-  set position(vec) {
-    vec3.copy(vec, this.position_);
-  }
-}
-
-// WASDCamera is a camera implementation that behaves similar to first-person-shooter PC games.
-export class WASDCamera extends CameraBase {
-  // The camera absolute pitch angle
-   pitch = 0;
-  // The camera absolute yaw angle
-   yaw = 0;
-
-  // The movement veloicty readonly
-  velocity_ = vec3.create();
-
-  // Speed multiplier for camera movement
-  movementSpeed = 10;
-
-  // Speed multiplier for camera rotation
-  rotationSpeed = 1;
-
-  // Movement velocity drag coeffient [0 .. 1]
-  // 0: Continues forever
-  // 1: Instantly stops moving
-  frictionCoefficient = 0.99;
-
-  // Returns velocity vector
-  get velocity() {
-    return this.velocity_;
-  }
-  // Assigns `vec` to the velocity vector
-  set velocity(vec) {
-    vec3.copy(vec, this.velocity_);
-  }
-
-  constructor(options) {
-    super();
-    if (options && (options.position || options.target)) {
-      const position = options.position ?? vec3.create(0, 0, 0);
-      const target = options.target ?? vec3.create(0, 0, 0);
-      const forward = vec3.normalize(vec3.sub(target, position));
-      this.recalculateAngles(forward);
-      this.position = position;
-
-      this.setProjection()
-      console.log(`%cCamera constructor : ${position}`, LOG_INFO);
-    }
-  }
-
-  // Returns the camera matrix
-  get matrix() {
-    return super.matrix;
-  }
-
-  // Assigns `mat` to the camera matrix, and recalcuates the camera angles
-  set matrix(mat) {
-    super.matrix = mat;
-    this.recalculateAngles(this.back);
-  }
-
-  update(deltaTime, input) {
-    const sign = (positive, negative) =>
-      (positive ? 1 : 0) - (negative ? 1 : 0);
-
-    // Apply the delta rotation to the pitch and yaw angles
-    this.yaw -= input.analog.x * deltaTime * this.rotationSpeed;
-    this.pitch -= input.analog.y * deltaTime * this.rotationSpeed;
-
-    // Wrap yaw between [0° .. 360°], just to prevent large accumulation.
-    this.yaw = mod(this.yaw, Math.PI * 2);
-    // Clamp pitch between [-90° .. +90°] to prevent somersaults.
-    this.pitch = clamp(this.pitch, -Math.PI / 2, Math.PI / 2);
-
-    // Save the current position, as we're about to rebuild the camera matrix.
-    const position = vec3.copy(this.position);
-
-    // Reconstruct the camera's rotation, and store into the camera matrix.
-    super.matrix = mat4.rotateX(mat4.rotationY(this.yaw), this.pitch); 
-		// super.matrix = mat4.rotateX(mat4.rotationY(this.yaw), -this.pitch);
-		// super.matrix = mat4.rotateY(mat4.rotateX(this.pitch), this.yaw);
-
-    // Calculate the new target velocity
-    const digital = input.digital;
-    const deltaRight = sign(digital.right, digital.left);
-    const deltaUp = sign(digital.up, digital.down);
-    const targetVelocity = vec3.create();
-    const deltaBack = sign(digital.backward, digital.forward);
-    vec3.addScaled(targetVelocity, this.right, deltaRight, targetVelocity);
-    vec3.addScaled(targetVelocity, this.up, deltaUp, targetVelocity);
-    vec3.addScaled(targetVelocity, this.back, deltaBack, targetVelocity);
-    vec3.normalize(targetVelocity, targetVelocity);
-    vec3.mulScalar(targetVelocity, this.movementSpeed, targetVelocity);
-
-    // Mix new target velocity
-    this.velocity = lerp(
-      targetVelocity,
-      this.velocity,
-      Math.pow(1 - this.frictionCoefficient, deltaTime)
-    );
-
-    // Integrate velocity to calculate new position
-    this.position = vec3.addScaled(position, this.velocity, deltaTime);
-
-    // Invert the camera matrix to build the view matrix
-    this.view = mat4.invert(this.matrix);
-    return this.view;
-  }
-
-  // Recalculates the yaw and pitch values from a directional vector
-  recalculateAngles(dir) {
-    this.yaw = Math.atan2(dir[0], dir[2]);
-    this.pitch = -Math.asin(dir[1]);
-  }
-}
-
-// ArcballCamera implements a basic orbiting camera around the world origin
-export class ArcballCamera extends CameraBase {
-  // The camera distance from the target
-   distance = 0;
-
-  // The current angular velocity
-   angularVelocity = 0;
-
-  // The current rotation axis
-   axis_ = vec3.create();
-
-  // Returns the rotation axis
-  get axis() {
-    return this.axis_;
-  }
-  // Assigns `vec` to the rotation axis
-  set axis(vec) {
-    vec3.copy(vec, this.axis_);
-  }
-
-  // Speed multiplier for camera rotation
-  rotationSpeed = 1;
-
-  // Speed multiplier for camera zoom
-  zoomSpeed = 0.1;
-
-  // Rotation velocity drag coeffient [0 .. 1]
-  // 0: Spins forever
-  // 1: Instantly stops spinning
-  frictionCoefficient = 0.999;
-
-  // Construtor
-  constructor(options) {
-    super();
-    if (options && options.position) {
-      this.position = options.position;
-      this.distance = vec3.len(this.position);
-      this.back = vec3.normalize(this.position);
-      this.recalcuateRight();
-      this.recalcuateUp();
-    }
-  }
-
-  // Returns the camera matrix
-  get matrix() {
-    return super.matrix;
-  }
-
-  // Assigns `mat` to the camera matrix, and recalcuates the distance
-  set matrix(mat) {
-    super.matrix = mat;
-    this.distance = vec3.len(this.position);
-  }
-
-  update(deltaTime, input) {
-    const epsilon = 0.0000001;
-
-    if (input.analog.touching) {
-      // Currently being dragged.
-      this.angularVelocity = 0;
-    } else {
-      // Dampen any existing angular velocity
-      this.angularVelocity *= Math.pow(1 - this.frictionCoefficient, deltaTime);
-    }
-
-    // Calculate the movement vector
-    const movement = vec3.create();
-    vec3.addScaled(movement, this.right, input.analog.x, movement);
-    vec3.addScaled(movement, this.up, -input.analog.y, movement);
-
-    // Cross the movement vector with the view direction to calculate the rotation axis x magnitude
-    const crossProduct = vec3.cross(movement, this.back);
-
-    // Calculate the magnitude of the drag
-    const magnitude = vec3.len(crossProduct);
-
-    if (magnitude > epsilon) {
-      // Normalize the crossProduct to get the rotation axis
-      this.axis = vec3.scale(crossProduct, 1 / magnitude);
-
-      // Remember the current angular velocity. This is used when the touch is released for a fling.
-      this.angularVelocity = magnitude * this.rotationSpeed;
-    }
-
-    // The rotation around this.axis to apply to the camera matrix this update
-    const rotationAngle = this.angularVelocity * deltaTime;
-    if (rotationAngle > epsilon) {
-      // Rotate the matrix around axis
-      // Note: The rotation is not done as a matrix-matrix multiply as the repeated multiplications
-      // will quickly introduce substantial error into the matrix.
-      this.back = vec3.normalize(rotate(this.back, this.axis, rotationAngle));
-      this.recalcuateRight();
-      this.recalcuateUp();
-    }
-
-    // recalculate `this.position` from `this.back` considering zoom
-    if (input.analog.zoom !== 0) {
-      this.distance *= 1 + input.analog.zoom * this.zoomSpeed;
-    }
-    this.position = vec3.scale(this.back, this.distance);
-
-    // Invert the camera matrix to build the view matrix
-    this.view = mat4.invert(this.matrix);
-    return this.view;
-  }
-
-  // Assigns `this.right` with the cross product of `this.up` and `this.back`
-  recalcuateRight() {
-    this.right = vec3.normalize(vec3.cross(this.up, this.back));
-  }
-
-  // Assigns `this.up` with the cross product of `this.back` and `this.right`
-  recalcuateUp() {
-    this.up = vec3.normalize(vec3.cross(this.back, this.right));
-  }
-}
-
-// Returns `x` clamped between [`min` .. `max`]
-function clamp(x, min, max) {
-  return Math.min(Math.max(x, min), max);
-}
-
-// Returns `x` float-modulo `div`
-function mod(x, div) {
-  return x - Math.floor(Math.abs(x) / div) * div * Math.sign(x);
-}
-
-// Returns `vec` rotated `angle` radians around `axis`
-function rotate(vec, axis, angle) {
-  return vec3.transformMat4Upper3x3(vec, mat4.rotation(axis, angle));
-}
-
-// Returns the linear interpolation between 'a' and 'b' using 's'
-function lerp(a, b, s) {
-  return vec3.addScaled(a, vec3.sub(b, a), s);
-}
-
-// Input holds as snapshot of input state
-// export default interface Input {
-//   // Digital input (e.g keyboard state)
-//   readonly digital: {
-//     readonly forward: boolean;
-//     readonly backward: boolean;
-//     readonly left: boolean;
-//     readonly right: boolean;
-//     readonly up: boolean;
-//     readonly down: boolean;
-//   };
-//   // Analog input (e.g mouse, touchscreen)
-//   readonly analog: {
-//     readonly x: number;
-//     readonly y: number;
-//     readonly zoom: number;
-//     readonly touching: boolean;
-//   };
-// }
-// InputHandler is a function that when called, returns the current Input state.
-// export type InputHandler = () => Input;
-// createInputHandler returns an InputHandler by attaching event handlers to the window and canvas.
-export function createInputHandler(window, canvas) {
-  let digital = {
-    forward: false,
-    backward: false,
-    left: false,
-    right: false,
-    up: false,
-    down: false,
-  };
-  let analog = {
-    x: 0,
-    y: 0,
-    zoom: 0,
-  };
-  let mouseDown = false;
-
-  const setDigital = (e, value) => {
-    switch (e.code) {
-      case 'KeyW':
-        digital.forward = value;
-        e.preventDefault();
-        e.stopPropagation();
-        break;
-      case 'KeyS':
-        digital.backward = value;
-        e.preventDefault();
-        e.stopPropagation();
-        break;
-      case 'KeyA':
-        digital.left = value;
-        e.preventDefault();
-        e.stopPropagation();
-        break;
-      case 'KeyD':
-        digital.right = value;
-        e.preventDefault();
-        e.stopPropagation();
-        break;
-      case 'Space':
-        digital.up = value;
-        e.preventDefault();
-        e.stopPropagation();
-        break;
-      case 'ShiftLeft':
-      case 'ControlLeft':
-      case 'KeyC':
-        digital.down = value;
-        e.preventDefault();
-        e.stopPropagation();
-        break;
-    }
-  };
-
-  window.addEventListener('keydown', (e) => setDigital(e, true));
-  window.addEventListener('keyup', (e) => setDigital(e, false));
-
-  canvas.style.touchAction = 'pinch-zoom';
-  canvas.addEventListener('pointerdown', () => {
-    mouseDown = true;
-  });
-  canvas.addEventListener('pointerup', () => {
-    mouseDown = false;
-  });
-  canvas.addEventListener('pointermove', (e) => {
-    mouseDown = e.pointerType == 'mouse' ? (e.buttons & 1) !== 0 : true;
-    if (mouseDown) {
-      // console.log('TEST ', analog)
-      analog.x += e.movementX / 10;
-      analog.y += e.movementY / 10;
-    }
-  });
-  canvas.addEventListener(
-    'wheel',
-    (e) => {
-      mouseDown = (e.buttons & 1) !== 0;
-      if (mouseDown) {
-        // The scroll value varies substantially between user agents / browsers.
-        // Just use the sign.
-        analog.zoom += Math.sign(e.deltaY);
-        e.preventDefault();
-        e.stopPropagation();
-      }
-    },
-    { passive: false }
-  );
-
-  return () => {
-    const out = {
-      digital,
-      analog: {
-        x: analog.x,
-        y: analog.y,
-        zoom: analog.zoom,
-        touching: mouseDown,
-      },
-    };
-    // Clear the analog values, as these accumulate.
-    analog.x = 0;
-    analog.y = 0;
-    analog.zoom = 0;
-    return out;
-  };
-}

package/src/engine/final/adaptJSON1.js

@@ -1,53 +0,0 @@
-import {computeSurfaceNormals, computeProjectedPlaneUVs} from './utils2.js';
-
-export function adaptJSON1(dragonRawData) {
-
-  let mesh = {
-    positions: dragonRawData.positions,
-    triangles: dragonRawData.cells,
-    normals: [],
-    uvs: []
-  };
-
-  // Compute surface normals
-  mesh.normals = computeSurfaceNormals(mesh.positions, mesh.triangles);
-
-  // Compute some easy uvs for testing
-  mesh.uvs = computeProjectedPlaneUVs(mesh.positions, 'xy');
-
-  return mesh;
-}
-
-export function addVerticesNormalUvs(mesh) {
-
-  var meshAdapted = {
-    positions: [],
-    cells: [],
-    uvs: mesh.textures,
-    vertices: mesh.vertices
-    // normals: mesh.vertexNormals
-  };
-  // force syntese 
-  for (var x = 0; x < mesh.vertices.length; x=x+3) {
-    var sub = [];
-    sub.push(mesh.vertices[x])
-    sub.push(mesh.vertices[x+1])
-    sub.push(mesh.vertices[x+2])
-    meshAdapted.positions.push(sub)
-    sub = [];
-    sub.push(mesh.indices[x])
-    sub.push(mesh.indices[x+1])
-    sub.push(mesh.indices[x+2])
-    meshAdapted.cells.push(sub)
-  }
-
-    // Compute surface normals
-    meshAdapted.normals = computeSurfaceNormals(meshAdapted.positions, meshAdapted.cells);
-    // Compute some easy uvs for testing
-    meshAdapted.uvs = computeProjectedPlaneUVs(meshAdapted.positions, 'xy');
-     
-    meshAdapted.triangles = meshAdapted.cells
-  return meshAdapted;
-}
-
- 

package/src/engine/final/utils2.js

@@ -1,63 +0,0 @@
-import { vec3 } from 'wgpu-matrix';
-
-export function computeSurfaceNormals(positions,triangles){
-  const normals = positions.map(() => {
-    // Initialize to zero.
-    return [0, 0, 0];
-  });
-  triangles.forEach(([i0, i1, i2]) => {
-    const p0 = positions[i0];
-    const p1 = positions[i1];
-    const p2 = positions[i2];
-
-    const v0 = vec3.subtract(p1, p0);
-    const v1 = vec3.subtract(p2, p0);
-
-    vec3.normalize(v0, v0);
-    vec3.normalize(v1, v1);
-    const norm = vec3.cross(v0, v1);
-
-    // Accumulate the normals.
-    vec3.add(normals[i0], norm, normals[i0]);
-    vec3.add(normals[i1], norm, normals[i1]);
-    vec3.add(normals[i2], norm, normals[i2]);
-  });
-  normals.forEach((n) => {
-    // Normalize accumulated normals.
-    vec3.normalize(n, n);
-  });
-
-  return normals;
-}
-
-// type ProjectedPlane = 'xy' | 'xz' | 'yz';
-const projectedPlane2Ids = {
-  xy: [0, 1],
-  xz: [0, 2],
-  yz: [1, 2],
-};
-
-export function computeProjectedPlaneUVs(positions, projectedPlane) {
-  const idxs = projectedPlane2Ids[projectedPlane];
-  const uvs = positions.map(() => {
-    // Initialize to zero.
-    return [0, 0];
-  });
-  const extentMin = [Infinity, Infinity];
-  const extentMax = [-Infinity, -Infinity];
-  positions.forEach((pos, i) => {
-    // Simply project to the selected plane
-    uvs[i][0] = pos[idxs[0]];
-    uvs[i][1] = pos[idxs[1]];
-
-    extentMin[0] = Math.min(pos[idxs[0]], extentMin[0]);
-    extentMin[1] = Math.min(pos[idxs[1]], extentMin[1]);
-    extentMax[0] = Math.max(pos[idxs[0]], extentMax[0]);
-    extentMax[1] = Math.max(pos[idxs[1]], extentMax[1]);
-  });
-  uvs.forEach((uv) => {
-    uv[0] = (uv[0] - extentMin[0]) / (extentMax[0] - extentMin[0]);
-    uv[1] = (uv[1] - extentMin[1]) / (extentMax[1] - extentMin[1]);
-  });
-  return uvs;
-}

package/src/engine/lights.js

@@ -1,126 +0,0 @@
-import {mat4, vec3} from 'wgpu-matrix';
-
-export class SpotLight {
-  position;
-  target;
-  up;
-  direction;
-
-  viewMatrix;
-  projectionMatrix;
-  viewProjMatrix;
-
-  fov;
-  aspect;
-  near;
-  far;
-
-  innerCutoff;
-  outerCutoff;
-
-  spotlightUniformBuffer;
-
-  constructor(
-    position = vec3.create(0, 5, 10),
-    target = vec3.create(0, 0, 0),
-    fov = 45,
-    aspect = 1.0,
-    near = 0.1,
-    far = 100
-  ) {
-    this.position = position;
-    this.target = target;
-    this.up = vec3.create(0, 1, 0);
-    this.direction = vec3.normalize(vec3.subtract(target, position));
-
-    this.viewMatrix = mat4.lookAt(position, target, this.up);
-    this.projectionMatrix = mat4.perspective(
-      (fov * Math.PI) / 180,
-      aspect,
-      near,
-      far
-    );
-    this.viewProjMatrix = mat4.multiply(this.projectionMatrix, this.viewMatrix);
-
-    this.fov = fov;
-    this.aspect = aspect;
-    this.near = near;
-    this.far = far;
-
-    this.innerCutoff = Math.cos((Math.PI / 180) * 12.5);
-    this.outerCutoff = Math.cos((Math.PI / 180) * 17.5);
-  }
-
-  update() {
-    this.direction = vec3.normalize(vec3.subtract(this.target, this.position));
-    this.viewMatrix = mat4.lookAt(this.position, this.target, this.up);
-    this.viewProjMatrix = mat4.multiply(this.projectionMatrix, this.viewMatrix);
-    console.log('test light update this.position : ', this.position)
-  }
-
-  updateSceneUniforms = (sceneUniformBuffer, camera, inputHandler) => {
-
-    console.log('test camera.view ', camera.view)
-    // Update spotlight matrices
-    this.update();
-
-    const now = Date.now();
-
-    // Get camera matrices
-    camera.update(now, inputHandler()); // Your camera class should also update view/projection
-    const camVP = mat4.multiply(camera.projectionMatrix, camera.view);
-
-    // Prepare float data
-    const sceneData = new Float32Array(16 + 16 + 4); // 2 matrices + vec3
-
-    // Light view-proj matrix
-    sceneData.set(this.viewProjMatrix, 0);
-
-    // Camera view-proj matrix
-    sceneData.set(camVP, 16);
-
-    // Light position (vec3f + padding)
-    sceneData.set(this.position, 32);
-
-    // Write to GPU
-    this.device.queue.writeBuffer(
-      sceneUniformBuffer,
-      0,
-      sceneData.buffer,
-      sceneData.byteOffset,
-      sceneData.byteLength
-    );
-
-    console.log('light.viewProj[0..3]', this.viewProjMatrix.slice(0, 4));
-    console.log('camera.vp[0..3]', camVP.slice(0, 4));
-  }
-
-  prepareBuffer(device) {
-    this.device = device;
-    this.spotlightUniformBuffer = device.createBuffer({
-      size: 16 * 4, // 64 bytes
-      usage: GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST,
-    });
-
-    const spotlightData = this.getLightDataBuffer();
-
-    device.queue.writeBuffer(
-      this.spotlightUniformBuffer,
-      0,
-      spotlightData.buffer,
-      spotlightData.byteOffset,
-      spotlightData.byteLength
-    );
-  }
-
-  getLightDataBuffer() {
-    return new Float32Array([
-      ...this.position, 0.0,
-      ...this.direction, 0.0,
-      this.innerCutoff,
-      this.outerCutoff,
-      0.0,
-      0.0,
-    ]);
-  }
-}