added a shitty ecs that I'm confident is way worse than just looping … (#4)

* added a shitty ecs that I'm confident is way worse than just looping objects lol

* mader a rendering system based on ecs

core/connection/mainThread.ts

@@ -58,11 +58,11 @@ const connectWorker = (worker: Worker) => {
 
   document.addEventListener(
     "pointermove",
-    eventPassers[EventTypes.pointermove]
+    eventPassers[EventTypes.pointermove],
   );
   document.addEventListener(
     "pointerdown",
-    eventPassers[EventTypes.pointerdown]
+    eventPassers[EventTypes.pointerdown],
   );
   document.addEventListener("pointerup", eventPassers[EventTypes.pointerup]);
   //
@@ -72,15 +72,15 @@ const connectWorker = (worker: Worker) => {
   const disconnectWorker = () => {
     document.removeEventListener(
       "pointermove",
-      eventPassers[EventTypes.pointermove]
+      eventPassers[EventTypes.pointermove],
     );
     document.removeEventListener(
       "pointerdown",
-      eventPassers[EventTypes.pointerdown]
+      eventPassers[EventTypes.pointerdown],
     );
     document.removeEventListener(
       "pointerup",
-      eventPassers[EventTypes.pointerup]
+      eventPassers[EventTypes.pointerup],
     );
     //
     document.removeEventListener("keydown", eventPassers[EventTypes.keydown]);
@@ -97,11 +97,6 @@ const attachCanvas = (worker: Worker, canvas: HTMLCanvasElement | string) => {
     throw new Error("Fatal: Canvas Not Found!");
   }
 
-  // set canvas dimensions
-  // if this is not done, the canvas passed to the web worker
-  // will have the default size of 300x150
-  // this will cause the viewport to be set to the default size
-  // and eveything will be messed up
   canvas.width = canvas.clientWidth;
   canvas.height = canvas.clientHeight;
 

core/connection/workerThread.ts

@@ -1,7 +1,14 @@
-import { Attribute, draw, ProgramData } from "../gl";
-import { cubeVertices } from "../gl/vertices";
+import { Engine } from "../renderer/engine";
 import { MessageType } from "./mainThread";
 
+const cubeVertices = [
+  1, -1, 1, -1, -1, 1, -1, 1, 1, 1, -1, 1, -1, 1, 1, 1, 1, 1, 1, 1, -1, -1, 1,
+  -1, -1, -1, -1, 1, 1, -1, -1, -1, -1, 1, -1, -1, 1, 1, -1, 1, -1, -1, 1, -1,
+  1, 1, 1, -1, 1, -1, 1, 1, 1, 1, -1, 1, 1, -1, -1, 1, -1, -1, -1, -1, 1, 1, -1,
+  -1, -1, -1, 1, -1, -1, 1, 1, -1, 1, -1, 1, 1, -1, -1, 1, 1, 1, 1, -1, 1, 1, 1,
+  1, -1, 1, 1, -1, -1, -1, -1, -1, 1, -1, 1, -1, -1, -1, -1, -1, 1,
+];
+
 const handleConnection = (msg: MessageEvent<any>) => {
   const { data } = msg;
 
@@ -12,19 +19,19 @@ const handleConnection = (msg: MessageEvent<any>) => {
     case MessageType.attachCanvas:
       const canvas = data[1];
 
-      const ctxWorker = canvas.getContext("webgl2");
-      var p: ProgramData<Attribute<Float32Array>> = {
-        vertexShaderSource: "/shaders/triangle/vertex.glsl",
-        fragmentShaderSource: "/shaders/triangle/frag.glsl",
-        attributes: [
-          {
-            name: "position",
-            data: new Float32Array(cubeVertices),
-          },
-        ],
+      const engine = new Engine(canvas);
+      const scene = engine.createScene();
+      scene.addMesh("box", cubeVertices);
+      scene.addCamera("cam", true);
+
+      const raf = () => {
+        requestAnimationFrame(() => {
+          scene.runSystems();
+          raf();
+        });
       };
 
-      requestAnimationFrame(() => draw(ctxWorker, p));
+      raf();
 
       break;
   }