percengine v1.2.3

Perc engine

This is a WebGL engine module writen in Typescript. All commentary are welcome, issues are open on GitHub.

How to install

npm i percengine 

First Scene

Your main class must extends from Scene class of the engine. In your constructor you must instance Engine class as first argument the reference of your main scene and as second argument the id of your canvas to initialize WebGL 2.

Exemple :

class MyGame extends Scene{
    private engine: Engine;
    constructor(){
        this.engine = new Engine(this,'canvasId');
    }

    OnInit(){
        // Scene's init, loading mesh, GameObject, etc...
    }

    MouseMove(e: MouseEvent) {
        // Fired when mouse move
    }

    MouseWheel(e: MouseWheelEvent) {
        // Fired when mouse scrolling
    }

    BeforeRendering(timelapse:number){
        // Loop Game
    }
}

Object instanciable

1. GameObject

   GameObject is the right place to create custom objects, this class know a possible mesh instance and with it you can display some 3D objects.

   const object = new GameObject();
   const mesh = new Mesh();
   // here provide vertex data to your mesh instance.
   object.SetMesh(mesh);
   object.SetParent(this); // this refere to my scene

2. Lights

   1. Ambiant

   const light = new Light(LIGHT_TYPE.AMBIANT);

   2. Directionnal

   const light = new Light(LIGHT_TYPE.DIRECTIONNAL);

   3. Point

   const light = new Light(LIGHT_TYPE.POINT);

   4. Spot

   const light = new Light(LIGHT_TYPE.SPOT);

3. Camera

   const camera1 = new Camera();
   camera1.SetPosition(0,2,0);
   camera1.SetLookAt(0,0,0);
   camera1.SetParent(this);
   
   const camera2 = new Camera();
   camera2.SetPosition(0,0,2);
   camera2.SetLookAt(0,0,0);
   camera2.SetParent(this);
   
   // event wherever you want
   buttonCamera1.onclick = () => {
       this.SetCamera(camera1);
   };
   
   buttonCamera2.onclick = () => {
       this.SetCamera(camera2);
   };

   In this example, I create 2 camera in my scene (this refered my scene). I have 2 buttons each button allow me to switch camera.

4. Particles

// TODO

Manipulate objects

1. Simple

   1. Translation

   objet.SetPosition(x,y,z); // Default value (0,0,0)

   2. Rotation

   objet.SetQuaternion(x,y,z,w);

   or

   objet.SetRotation(x,y,z, angle);

   3. Scale

   objet.SetScale(x,y,z); // Default value (1,1,1)

2. Animations

// TODO

Demo

// TODO