Add basic multiplayer

shared/src/helper/array.ts

@@ -0,0 +1,31 @@
+declare global {
+  interface Array<T> {
+    x: number;
+    y: number;
+  }
+
+  interface Float32Array {
+    x: number;
+    y: number;
+  }
+}
+
+const setIndexAlias = (name: string, index: number, type: any) => {
+  if (!Object.prototype.hasOwnProperty.call(type.prototype, name)) {
+    Object.defineProperty(type.prototype, name, {
+      get() {
+        return this[index];
+      },
+      set(value) {
+        this[index] = value;
+      },
+    });
+  }
+};
+
+export const applyArrayPlugins = () => {
+  setIndexAlias('x', 0, Array);
+  setIndexAlias('y', 1, Array);
+  setIndexAlias('x', 0, Float32Array);
+  setIndexAlias('y', 1, Float32Array);
+};

shared/src/helper/circle.ts

@@ -0,0 +1,5 @@
+import { vec2 } from 'gl-matrix';
+
+export class Circle {
+  constructor(public center: vec2, public radius: number) {}
+}

shared/src/helper/clamp.ts

@@ -0,0 +1,4 @@
+export const clamp = (value: number, min: number, max: number): number =>
+  Math.min(max, Math.max(min, value));
+
+export const clamp01 = (value: number): number => Math.min(1, Math.max(0, value));

shared/src/helper/delta-time-calculator.ts

@@ -0,0 +1,23 @@
+export class DeltaTimeCalculator {
+  private previousTime: DOMHighResTimeStamp | null = null;
+
+  constructor() {
+    document.addEventListener('visibilitychange', this.handleVisibilityChange.bind(this));
+  }
+
+  public getNextDeltaTime(currentTime: DOMHighResTimeStamp): DOMHighResTimeStamp {
+    if (this.previousTime === null) {
+      this.previousTime = currentTime;
+    }
+
+    const delta = currentTime - this.previousTime;
+    this.previousTime = currentTime;
+    return delta;
+  }
+
+  private handleVisibilityChange() {
+    if (!document.hidden) {
+      this.previousTime = null;
+    }
+  }
+}

shared/src/helper/last.ts

@@ -0,0 +1,3 @@
+export function last<T>(a: Array<T>): T | null {
+  return a.length > 0 ? a[a.length - 1] : null;
+}

shared/src/helper/mix.ts

@@ -0,0 +1 @@
+export const mix = (from: number, to: number, q: number) => from + (to - from) * q;

shared/src/helper/pretty-print.ts

@@ -0,0 +1,4 @@
+export const prettyPrint = (o: any): string =>
+  JSON.stringify(o, (_, v) => (v.toFixed ? Number(v.toFixed(3)) : v), '  ')
+    .replace(/("|,|{|^\n)/g, '')
+    .replace(/(\W*}\n?)+/g, '\n\n');

shared/src/helper/random.ts

@@ -0,0 +1,18 @@
+// src
+// https://stackoverflow.com/questions/521295/seeding-the-random-number-generator-in-javascript
+// Mulberry32
+
+export abstract class Random {
+  private static _seed = Math.random();
+
+  public static set seed(value: number) {
+    Random._seed = value;
+  }
+
+  public static getRandom(): number {
+    let t = (Random._seed += 0x6d2b79f5);
+    t = Math.imul(t ^ (t >>> 15), t | 1);
+    t ^= t + Math.imul(t ^ (t >>> 7), t | 61);
+    return ((t ^ (t >>> 14)) >>> 0) / 4294967296;
+  }
+}

shared/src/helper/rectangle.ts

@@ -0,0 +1,5 @@
+import { vec2 } from 'gl-matrix';
+
+export class Rectangle {
+  constructor(public topLeft = vec2.create(), public size = vec2.create()) {}
+}

shared/src/helper/rgb.ts

@@ -0,0 +1,3 @@
+import { vec3 } from 'gl-matrix';
+
+export const rgb = (r: number, g: number, b: number): vec3 => vec3.fromValues(r, g, b);

shared/src/helper/rgb255.ts

@@ -0,0 +1,4 @@
+import { vec3 } from 'gl-matrix';
+
+export const rgb255 = (r: number, g: number, b: number): vec3 =>
+  vec3.fromValues(r / 255, g / 255, b / 255);

shared/src/helper/rotate-90-deg.ts

@@ -0,0 +1,3 @@
+import { vec2 } from 'gl-matrix';
+
+export const rotate90Deg = (vec: vec2): vec2 => vec2.fromValues(-vec.y, vec.x);

shared/src/helper/to-percent.ts

@@ -0,0 +1 @@
+export const toPercent = (value: number) => `${Math.round(value * 100)}%`;

shared/src/helper/unique.ts

@@ -0,0 +1,5 @@
+let currentId = 0;
+
+export const id = (): number => {
+  return currentId++;
+};

shared/src/helper/wait.ts

@@ -0,0 +1,3 @@
+export const wait = (ms: number): Promise<void> => {
+  return new Promise<void>((resolve, _) => setTimeout(resolve, ms));
+};