Start using the sdf-2d library

frontend/src/scripts/objects/types/camera.ts

@@ -1,5 +1,5 @@
 import { vec2 } from 'gl-matrix';
-import { BeforeRenderCommand } from '../../graphics/commands/before-render';
+import { RenderCommand } from '../../graphics/commands/render';
 import { CursorMoveCommand } from '../../input/commands/cursor-move-command';
 import { ZoomCommand } from '../../input/commands/zoom';
 import { MoveToCommand } from '../../physics/commands/move-to';
@@ -17,7 +17,7 @@ export class Camera extends GameObject {
 
     this._viewArea = new BoundingBox(null);
 
-    this.addCommandExecutor(BeforeRenderCommand, this.draw.bind(this));
+    this.addCommandExecutor(RenderCommand, this.draw.bind(this));
     this.addCommandExecutor(MoveToCommand, this.moveTo.bind(this));
     this.addCommandExecutor(CursorMoveCommand, this.setCursorPosition.bind(this));
     this.addCommandExecutor(ZoomCommand, this.zoom.bind(this));
@@ -27,7 +27,7 @@ export class Camera extends GameObject {
     return this._viewArea;
   }
 
-  private draw(c: BeforeRenderCommand) {
+  private draw(c: RenderCommand) {
     const canvasAspectRatio = c.renderer.canvasSize.x / c.renderer.canvasSize.y;
 
     this.viewArea.size = vec2.fromValues(
@@ -35,8 +35,8 @@ export class Camera extends GameObject {
       Math.sqrt(this.inViewAreaSize / canvasAspectRatio)
     );
 
-    c.renderer.setViewArea(this._viewArea);
-    c.renderer.setCursorPosition(this.cursorPosition);
+    c.renderer.setViewArea(this._viewArea.topLeft, this.viewArea.size);
+    //c.renderer.setCursorPosition(this.cursorPosition);
   }
 
   private moveTo(c: MoveToCommand) {

frontend/src/scripts/objects/types/character.ts

@@ -1,7 +1,6 @@
 import { vec2, vec3 } from 'gl-matrix';
+import { Flashlight } from 'sdf-2d';
 import { RenderCommand } from '../../graphics/commands/render';
-import { DrawableBlob } from '../../graphics/drawables/drawable-blob';
-import { Flashlight } from '../../graphics/drawables/lights/flashlight';
 import { IGame } from '../../i-game';
 import { KeyDownCommand } from '../../input/commands/key-down';
 import { KeyUpCommand } from '../../input/commands/key-up';
@@ -9,19 +8,18 @@ import { SwipeCommand } from '../../input/commands/swipe';
 import { StepCommand } from '../../physics/commands/step';
 import { TeleportToCommand } from '../../physics/commands/teleport-to';
 import { IShape } from '../../shapes/i-shape';
-import { Blob } from '../../shapes/types/blob';
+import { BlobShape } from '../../shapes/types/blob-shape';
 import { GameObject } from '../game-object';
 
 export class Character extends GameObject {
   private keysDown: Set<string> = new Set();
   private light = new Flashlight(
     vec2.create(),
-    vec2.fromValues(-1, 0),
-    0.7,
     vec3.fromValues(1, 0.6, 0.45),
-    1.5
+    1.5,
+    vec2.fromValues(-1, 0)
   );
-  private shape = new DrawableBlob(vec2.create());
+  private shape = new BlobShape(vec2.create());
   private static speed = 1.5;
 
   constructor(private game: IGame) {
@@ -41,8 +39,8 @@ export class Character extends GameObject {
   }
 
   private draw(c: RenderCommand) {
-    c.renderer.drawShape(this.shape);
-    c.renderer.drawLight(this.light);
+    c.renderer.addDrawable(this.shape);
+    c.renderer.addDrawable(this.light);
   }
 
   private tryMoving(delta: vec2, isFirstIteration = true) {
@@ -98,14 +96,14 @@ export class Character extends GameObject {
     }
   }
 
-  private getNearShapesTo(shape: Blob): Array<{ shape: IShape; distance: number }> {
+  private getNearShapesTo(shape: BlobShape): Array<{ shape: IShape; distance: number }> {
     return this.game
       .findIntersecting(shape.boundingBox)
       .filter((b) => b.shape)
       .map((b) => ({
         shape: b.shape,
         // TODO: fix this
-        distance: b.shape.distance(shape.center) + shape.radius - 20,
+        distance: b.shape.minDistance(shape.center) + shape.radius - 20,
       }))
       .sort((e) => e.distance);
   }

frontend/src/scripts/objects/types/info-text.ts

@@ -1,36 +0,0 @@
-import { RenderCommand } from '../../graphics/commands/render';
-import { GameObject } from '../game-object';
-
-export class InfoText extends GameObject {
-  private static MinRowLength = 60;
-
-  constructor() {
-    super();
-
-    this.addCommandExecutor(RenderCommand, this.draw.bind(this));
-  }
-
-  private static records: Map<string, string> = new Map();
-
-  public static modifyRecord(key: string, value: string | any) {
-    if (typeof value == 'string') {
-      value = '  ' + value;
-    } else {
-      value = JSON.stringify(
-        value,
-        (_, v) => (v.toFixed ? Number(v.toFixed(2)) : v),
-        '  '
-      );
-    }
-
-    InfoText.records.set(key, value);
-  }
-
-  private draw(e: RenderCommand) {
-    let text = '';
-    InfoText.records.forEach(
-      (v, k) => (text += `${k}\n${v.padEnd(InfoText.MinRowLength)}\n`)
-    );
-    e.renderer.drawInfoText(text);
-  }
-}

frontend/src/scripts/objects/types/lamp.ts

@@ -1,23 +1,23 @@
 import { vec2, vec3 } from 'gl-matrix';
+import { CircleLight } from 'sdf-2d';
 import { RenderCommand } from '../../graphics/commands/render';
-import { CircleLight } from '../../graphics/drawables/lights/circle-light';
 import { MoveToCommand } from '../../physics/commands/move-to';
 import { GameObject } from '../game-object';
 
 export class Lamp extends GameObject {
   private light: CircleLight;
 
-  constructor(center: vec2, radius: number, color: vec3, lightness: number) {
+  constructor(center: vec2, color: vec3, lightness: number) {
     super();
 
-    this.light = new CircleLight(center, radius, color, lightness);
+    this.light = new CircleLight(center, color, lightness);
 
     this.addCommandExecutor(RenderCommand, this.draw.bind(this));
     this.addCommandExecutor(MoveToCommand, this.moveTo.bind(this));
   }
 
   private draw(c: RenderCommand) {
-    c.renderer.drawLight(this.light);
+    c.renderer.addDrawable(this.light);
   }
 
   private moveTo(c: MoveToCommand) {

frontend/src/scripts/objects/types/tunnel.ts

@@ -1,11 +1,11 @@
 import { vec2 } from 'gl-matrix';
 import { RenderCommand } from '../../graphics/commands/render';
-import { DrawableTunnel } from '../../graphics/drawables/drawable-tunnel';
 import { Physics } from '../../physics/physics';
+import { TunnelShape } from '../../shapes/types/tunnel-shape';
 import { GameObject } from '../game-object';
 
 export class Tunnel extends GameObject {
-  private shape: DrawableTunnel;
+  private shape: TunnelShape;
 
   constructor(
     physics: Physics,
@@ -16,12 +16,12 @@ export class Tunnel extends GameObject {
   ) {
     super();
 
-    this.shape = new DrawableTunnel(from, to, fromRadius, toRadius, this);
+    this.shape = new TunnelShape(from, to, fromRadius, toRadius, this);
     physics.addStaticBoundingBox(this.shape.boundingBox);
     this.addCommandExecutor(RenderCommand, this.draw.bind(this));
   }
 
   private draw(c: RenderCommand) {
-    c.renderer.drawShape(this.shape);
+    c.renderer.addDrawable(this.shape);
   }
 }