Start refactoring

frontend/src/scripts/commands/types/before-render.ts

@@ -1,8 +1,12 @@
-import { IRenderer } from '../../drawing/i-renderer';
 import { Command } from '../command';
+import { IRenderer } from '../../drawing/rendering/i-renderer';
 
 export class BeforeRenderCommand extends Command {
   public constructor(public readonly renderer?: IRenderer) {
     super();
   }
+
+  public get type(): string {
+    return 'BeforeRenderCommand';
+  }
 }

frontend/src/scripts/commands/types/cursor-move-command.ts

@@ -5,4 +5,8 @@ export class CursorMoveCommand extends Command {
   public constructor(public readonly position?: vec2) {
     super();
   }
+
+  public get type(): string {
+    return 'CursorMoveCommand';
+  }
 }

frontend/src/scripts/commands/types/draw.ts

@@ -1,8 +1,12 @@
-import { IRenderer } from '../../drawing/i-renderer';
 import { Command } from '../command';
+import { IRenderer } from '../../drawing/rendering/i-renderer';
 
 export class RenderCommand extends Command {
   public constructor(public readonly renderer?: IRenderer) {
     super();
   }
+
+  public get type(): string {
+    return 'RenderCommand';
+  }
 }

frontend/src/scripts/commands/types/key-down.ts

@@ -4,4 +4,8 @@ export class KeyDownCommand extends Command {
   public constructor(public readonly key?: string) {
     super();
   }
+
+  public get type(): string {
+    return 'KeyDownCommand';
+  }
 }

frontend/src/scripts/commands/types/key-up.ts

@@ -4,4 +4,8 @@ export class KeyUpCommand extends Command {
   public constructor(public readonly key?: string) {
     super();
   }
+
+  public get type(): string {
+    return 'KeyUpCommand';
+  }
 }

frontend/src/scripts/commands/types/move-to.ts

@@ -5,4 +5,8 @@ export class MoveToCommand extends Command {
   public constructor(public readonly position?: vec2) {
     super();
   }
+
+  public get type(): string {
+    return 'MoveToCommand';
+  }
 }

frontend/src/scripts/commands/types/primary-action.ts

@@ -5,4 +5,8 @@ export class PrimaryActionCommand extends Command {
   public constructor(public readonly position?: vec2) {
     super();
   }
+
+  public get type(): string {
+    return 'PrimaryActionCommand';
+  }
 }

frontend/src/scripts/commands/types/secondary-action.ts

@@ -5,4 +5,8 @@ export class SecondaryActionCommand extends Command {
   public constructor(public readonly position?: vec2) {
     super();
   }
+
+  public get type(): string {
+    return 'SecondaryActionCommand';
+  }
 }

frontend/src/scripts/commands/types/step.ts

@@ -6,4 +6,8 @@ export class StepCommand extends Command {
   ) {
     super();
   }
+
+  public get type(): string {
+    return 'StepCommand';
+  }
 }

frontend/src/scripts/commands/types/swipe.ts

@@ -5,4 +5,8 @@ export class SwipeCommand extends Command {
   public constructor(public readonly delta?: vec2) {
     super();
   }
+
+  public get type(): string {
+    return 'SwipeCommand';
+  }
 }

frontend/src/scripts/commands/types/zoom.ts

@@ -4,4 +4,8 @@ export class ZoomCommand extends Command {
   public constructor(public readonly factor?: number) {
     super();
   }
+
+  public get type(): string {
+    return 'ZoomCommand';
+  }
 }

frontend/src/scripts/drawing/i-renderer.ts

@@ -1,22 +0,0 @@
-import { vec2 } from 'gl-matrix';
-import { Circle } from './primitives/circle';
-import { IPrimitive } from './primitives/i-primitive';
-
-export interface IRenderer {
-  startFrame(deltaTime: DOMHighResTimeStamp): void;
-  finishFrame(): void;
-
-  drawPrimitive(primitive: IPrimitive): void;
-
-  setCameraPosition(position: vec2): void;
-  setCursorPosition(position: vec2): void;
-  setInViewArea(size: number): vec2;
-
-  giveUniforms(uniforms: any): void;
-  appendToUniformList(listName: string, ...values: Array<any>): void;
-
-  screenUvToWorldCoordinate(mousePosition: vec2): vec2;
-  drawInfoText(text: string): void;
-  isOnScreen(boundingCircle: Circle): boolean;
-  isPositionOnScreen(position: vec2): boolean;
-}

frontend/src/scripts/drawing/lights/circle-light.ts

@@ -0,0 +1,35 @@
+import { ILight } from './i-light';
+import { vec2, vec3 } from 'gl-matrix';
+
+export class CircleLight implements ILight {
+  public static uniformName = 'lights';
+
+  constructor(
+    public center: vec2,
+    public radius: number,
+    public color: vec3,
+    public lightness: number
+  ) {}
+
+  serializeToUniforms(uniforms: any): void {
+    const listName = CircleLight.uniformName;
+
+    if (!uniforms.hasOwnProperty(listName)) {
+      uniforms[listName] = [];
+    }
+
+    uniforms[listName].push({
+      center: this.center,
+      radius: this.radius,
+      value: this.value,
+    });
+  }
+
+  get value(): vec3 {
+    return vec3.scale(
+      vec3.create(),
+      vec3.normalize(this.color, this.color),
+      this.lightness
+    );
+  }
+}

frontend/src/scripts/drawing/lights/i-light.ts

@@ -0,0 +1,3 @@
+export interface ILight {
+  serializeToUniforms(uniforms: any): void;
+}

frontend/src/scripts/drawing/lights/point-light.ts

@@ -0,0 +1,30 @@
+import { ILight } from './i-light';
+import { vec2, vec3 } from 'gl-matrix';
+
+export class PointLight implements ILight {
+  public static uniformName = 'lights';
+
+  constructor(
+    public center: vec2,
+    public color: vec3,
+    public lightness: number
+  ) {}
+
+  serializeToUniforms(uniforms: any): void {
+    const listName = PointLight.uniformName;
+
+    if (!uniforms.hasOwnProperty(listName)) {
+      uniforms[listName] = [];
+    }
+
+    uniforms[listName].push({
+      center: this.center,
+      radius: 0,
+      value: this.value,
+    });
+  }
+
+  get value(): vec3 {
+    return vec3.scale(vec3.create(), this.color, this.lightness);
+  }
+}

frontend/src/scripts/drawing/primitives/circle.ts

@@ -2,7 +2,11 @@ import { vec2 } from 'gl-matrix';
 import { IPrimitive } from './i-primitive';
 
 export class Circle implements IPrimitive {
-  public constructor(public center: vec2, public radius: number) {}
+  public constructor(public center = vec2.create(), public radius = 0) {}
+
+  public serializeToUniforms(uniforms: any): void {
+    throw new Error('Method not implemented.');
+  }
 
   public distance(target: vec2): number {
     return vec2.distance(this.center, target) - this.radius;

frontend/src/scripts/drawing/primitives/i-primitive.ts

@@ -1,6 +1,7 @@
 import { vec2 } from 'gl-matrix';
 
 export interface IPrimitive {
+  serializeToUniforms(uniforms: any): void;
   distance(target: vec2): number;
   minimumDistance(target: vec2): number;
 }

frontend/src/scripts/drawing/primitives/tunnel-shape.ts

@@ -5,6 +5,9 @@ import { Circle } from './circle';
 import { IPrimitive } from './i-primitive';
 
 export class TunnelShape implements IPrimitive {
+  public static uniformNameLines = 'lines';
+  public static uniformNameRadii = 'radii';
+
   public readonly toFromDelta: vec2;
   private toFromDeltaLength: number;
 
@@ -25,6 +28,21 @@ export class TunnelShape implements IPrimitive {
     );
   }
 
+  serializeToUniforms(uniforms: any): void {
+    if (!uniforms.hasOwnProperty(TunnelShape.uniformNameLines)) {
+      uniforms[TunnelShape.uniformNameLines] = [];
+    }
+
+    if (!uniforms.hasOwnProperty(TunnelShape.uniformNameRadii)) {
+      uniforms[TunnelShape.uniformNameRadii] = [];
+    }
+
+    uniforms[TunnelShape.uniformNameLines].push(this.from);
+    uniforms[TunnelShape.uniformNameLines].push(this.toFromDelta);
+    uniforms[TunnelShape.uniformNameRadii].push(this.fromRadius);
+    uniforms[TunnelShape.uniformNameRadii].push(this.toRadius);
+  }
+
   public distance(target: vec2): number {
     const targetFromDelta = vec2.subtract(vec2.create(), target, this.from);
     const h = clamp01(

frontend/src/scripts/drawing/rendering/autoscaler.ts

@@ -0,0 +1,47 @@
+import { mix } from '../../helper/mix';
+import { clamp } from '../../helper/clamp';
+
+export class Autoscaler {
+  // can have fractions
+  private index: number;
+
+  constructor(
+    private setters: Array<(value: number) => void>,
+    private targets: Array<Array<number>>,
+    startingIndex: number,
+    private scalingOptions: {
+      additiveIncrease: number;
+      multiplicativeDecrease: number;
+    }
+  ) {
+    this.index = startingIndex;
+    this.applyScaling();
+  }
+
+  public increase() {
+    this.index += this.scalingOptions.additiveIncrease;
+    this.applyScaling();
+  }
+
+  public decrease() {
+    this.index /= this.scalingOptions.multiplicativeDecrease;
+    this.applyScaling();
+  }
+
+  private applyScaling() {
+    this.index = clamp(this.index, 0, this.targets.length - 1);
+
+    const floor = Math.floor(this.index);
+    const fract = this.index - floor;
+
+    const previousTarget = this.targets[floor];
+    const nextTarget =
+      floor + 1 == this.targets.length
+        ? previousTarget
+        : this.targets[floor + 1];
+
+    this.setters.forEach((setter, i) =>
+      setter(mix(previousTarget[i], nextTarget[i], fract))
+    );
+  }
+}

frontend/src/scripts/drawing/rendering/i-renderer.ts

@@ -0,0 +1,16 @@
+import { vec2 } from 'gl-matrix';
+import { IPrimitive } from '../primitives/i-primitive';
+import { ILight } from '../lights/i-light';
+
+export interface IRenderer {
+  startFrame(deltaTime: DOMHighResTimeStamp): void;
+  finishFrame(): void;
+
+  drawPrimitive(primitive: IPrimitive): void;
+  drawLight(light: ILight): void;
+  drawInfoText(text: string): void;
+
+  setCameraPosition(position: vec2): void;
+  setCursorPosition(position: vec2): void;
+  setInViewArea(size: number): vec2;
+}