WebMarine Core
Core utils for WebMarine game engine.
IMPORTANT NOTE
WebMarine Core is designed for game development only, so it is not at all suitable for embedding the canvas in an existing web page.
Installation
First you need to install the package:
npm i @7y1o/webmarine-core
Next, in the main script (index.js or main.js, for example) write the following lines:
import {WMGameEngine} from "@7y1o/webmarine-core";
// ^ - import, initialize - v
const engine = new WMGameEngine();
Game engine will clear document and place canvas automatically. Now you can use our documentation for the next steps. Good luck! :)
Examples
Simple white cube with rotating animation:
import {WMRenderEngine, WMEntityUtils} from "@7y1o/webmarine-core";
// Creating game engine instance
const engine = new WMRenderEngine();
// Creating the cube and add it to the scene
const cube = WMEntityUtils.mesh.cube();
engine.scene.add(cube);
// Configuring camera parameters
engine.camera.position.set(5, 5, 5);
engine.camera.lookAt(0, 0, 0);
// Set cube rotation
engine.addUpdate(dt => {
cube.rotation.x += .1 * dt;
cube.rotation.z += .1 * dt;
});
// Starting render
engine.prepareAndStart();
Loading 3d model
import {WMRenderEngine, WMEntityUtils} from "@7y1o/webmarine-core";
// Do actions from previous example with init, camera and render start
const engine = new WMRenderEngine();
engine.currentCamera.position.set(5, 5, 5);
engine.currentCamera.lookAt(0, 0, 0);
engine.prepareAndStart();
// Loading glTF model and place it on the scene
let model = null;
WMEntityUtils.mesh.gltf('sample-model.gltf').then(entity => {
model = entity;
engine.currentScene.add(model);
});
Creating PBR material
import {WMRenderEngine, WMEntityUtils} from '@7y1o/webmarine-core';
// Do action from previous example again
const engine = new WMRenderEngine();
engine.currentCamera.position.set(5, 5, 5);
engine.currentCamera.lookAt(0, 0, 0);
engine.prepareAndStart();
// Creating mesh and PBR material for it with default parameters
const mesh = WMEntityUtils.mesh.sphere();
mesh.material = WMEntityUtils.material.pbr();
engine.currentScene.add(mesh);
// Adding light
const light = WMEntityUtils.light.directional();
light.position.add(0, 5, 0);
engine.currentScene.add(light);
Version list
-
0.1.4:
- Added OOT function (out of time breaking)
- Optimized instance checking for PerspectiveCamera
- Fixed bug with missing TypeScript files (I just forgot to add them to the package)
- Added postprocessing passes support
-
0.1.3:
- Guys, I don't remember what was there. Okay, let it be that the history of WebMarine began with her...