chore: refactor render system

src/lib/ecs/systems/RenderSystem/EntityRenders/DoorRender.ts

@@ -2,12 +2,11 @@ import { ComponentContainer } from "src/lib/ecs/Component.ts";
 import TextureComponent from "src/lib/ecs/components/TextureComponent.ts";
 import DoorComponent from "src/lib/ecs/components/DoorComponent.ts";
 import PositionComponent from "src/lib/ecs/components/PositionComponent.ts";
-import { EntityRender } from "src/lib/ecs/systems/RenderSystem/EntityRenders/IEntityRender.ts";
+import EntityRender from "src/lib/ecs/systems/RenderSystem/EntityRenders/EntityRender.ts";
 
 import { Vec2D } from "src/lib/utils.ts";
-import { drawTextureLine } from "./utils";
 
-export class DoorRender extends EntityRender {
+export default class DoorRender extends EntityRender {
     private doorWidth = 0.05;
 
     canRender(mapEntity: ComponentContainer): boolean {
@@ -43,7 +42,7 @@ export class DoorRender extends EntityRender {
             (texture.width * (rayX + textureOffset.x + rayY + textureOffset.y)) % texture.width
         );
 
-        drawTextureLine(
+        this.drawTextureLine(
             screenX,
             texturePositionX,
             texture,

src/lib/ecs/systems/RenderSystem/EntityRenders/EntityRender.ts

@@ -0,0 +1,41 @@
+import { ComponentContainer } from "src/lib/ecs/Component.ts";
+import Canvas from "src/lib/Canvas/BufferCanvas.ts";
+
+export default abstract class EntityRender {
+    readonly screenHeight: number;
+    readonly canvas: Canvas;
+
+    public constructor(screenHeight: number, canvas: Canvas) {
+        this.screenHeight = screenHeight;
+        this.canvas = canvas;
+    }
+
+    abstract canRender(mapEntity: ComponentContainer): boolean;
+    abstract isRayHit(mapEntity: ComponentContainer, rayX: number, rayY: number): boolean;
+    abstract render(screenX: number, mapEntity: ComponentContainer, rayX: number, rayY: number, wallHeight: number): void;
+
+    drawTextureLine(
+        screenX: number,
+        texturePositionX: number,
+        texture: TextureBitmap,
+        entityHeight: number,
+        screenHeight: number,
+        canvas: Canvas,
+    ) {
+        const yIncrementer = (entityHeight * 2) / texture.height;
+        let y = screenHeight / 2 - entityHeight;
+
+        for (let i = 0; i < texture.height; i++) {
+            if (y > -yIncrementer && y < screenHeight) {
+                canvas.drawVerticalLine({
+                    x: screenX,
+                    y1: y,
+                    y2: Math.floor(y + yIncrementer),
+                    color: texture.colors[i][texturePositionX],
+                });
+            }
+            y += yIncrementer;
+        }
+    }
+
+}

src/lib/ecs/systems/RenderSystem/EntityRenders/WallRender.ts

@@ -1,10 +1,8 @@
-import { EntityRender } from "src/lib/ecs/systems/RenderSystem/EntityRenders/IEntityRender.ts";
+import EntityRender from "src/lib/ecs/systems/RenderSystem/EntityRenders/EntityRender.ts";
 import { ComponentContainer } from "src/lib/ecs/Component.ts";
 import TextureComponent from "src/lib/ecs/components/TextureComponent.ts";
 
-import { drawTextureLine } from "./utils";
-
-export class WallRender extends EntityRender {
+export default class WallRender extends EntityRender {
     canRender(mapEntity: ComponentContainer): boolean {
         return mapEntity.has(TextureComponent);
     }
@@ -18,7 +16,8 @@ export class WallRender extends EntityRender {
         const texturePositionX = Math.floor(
             (texture.width * (rayX + rayY)) % texture.width
         );
-        drawTextureLine(
+
+        this.drawTextureLine(
             screenX,
             texturePositionX,
             texture,

src/lib/ecs/systems/RenderSystem/index.ts

@@ -15,9 +15,9 @@ import TextureManager from "src/managers/TextureManager";
 
 import { degreeToRadians, distance, normalizeAngle } from "src/lib/utils";
 
-import { EntityRender } from "src/lib/ecs/systems/RenderSystem/EntityRenders/IEntityRender.ts";
-import { WallRender } from "./EntityRenders/WallRender.ts";
-import { DoorRender } from "./EntityRenders/DoorRender.ts";
+import EntityRender from "src/lib/ecs/systems/RenderSystem/EntityRenders/EntityRender.ts";
+import WallRender from "./EntityRenders/WallRender.ts";
+import DoorRender from "./EntityRenders/DoorRender.ts";
 
 export default class RenderSystem extends System {
     public readonly componentsRequired = new Set([PositionComponent]);

src/lib/utils.ts

@@ -30,7 +30,6 @@ export function lerp(from: number, to: number, percent: number) {
     return from + (to - from) * val;
 }
 
-
 export class Vec2D implements Vector2D {
     private constructor(public x: number, public y: number) {}
 
@@ -59,9 +58,11 @@ export class Vec2D implements Vector2D {
     subtract(vec: Vector2D): Vec2D {
         return Vec2D.from(this.x - vec.x, this.y - vec.y);
     }
+
     subtractX(x: number): Vec2D {
         return Vec2D.from(this.x - x, this.y);
     }
+
     subtractY(y: number): Vec2D {
         return Vec2D.from(this.x, this.y - y);
     }