Getting Started

import { initEngine, tick } from '@vulfram/engine/core';
import { createWindow } from '@vulfram/engine/window';
import { mountWorldToWindow } from '@vulfram/engine/mount';
import * as World3D from '@vulfram/engine/world3d';
import { transportWasm } from '@vulfram/transport-browser';

initEngine({ transport: transportWasm });

const worldId = World3D.create3DWorld();
const { windowId } = createWindow({
  title: 'Hello Vulfram',
  size: [1024, 640],
  position: [0, 0],
  initialState: 'windowed',
});

mountWorldToWindow(worldId, windowId);

const camera = World3D.create3DEntity(worldId);
World3D.update3DTransform(worldId, camera, {
  position: [0, 1.2, 4],
  rotation: [0, 0, 0, 1],
  scale: [1, 1, 1],
});
World3D.create3DCamera(worldId, camera, {
  kind: 'perspective',
  near: 0.1,
  far: 100,
  order: 0,
});

const light = World3D.create3DEntity(worldId);
World3D.create3DLight(worldId, light, {
  kind: 'point',
  color: [1, 1, 1],
  intensity: 8,
  range: 20,
});
World3D.update3DTransform(worldId, light, {
  position: [2, 4, 2],
  rotation: [0, 0, 0, 1],
  scale: [1, 1, 1],
});

const geometryId = World3D.create3DGeometry(worldId, {
  type: 'primitive',
  shape: 'cube',
});
const materialId = World3D.create3DMaterial(worldId, {
  kind: 'standard',
  options: {
    type: 'standard',
    content: {
      baseColor: [1, 1, 1, 1],
      surfaceType: 'opaque',
      flags: 0,
    },
  },
});

const cube = World3D.create3DEntity(worldId);
World3D.create3DModel(worldId, cube, {
  geometryId,
  materialId,
});

let last = performance.now();
function frame(now: number) {
  const delta = now - last;
  last = now;
  tick(now, delta);
  requestAnimationFrame(frame);
}
requestAnimationFrame(frame);