Add better object updates

backend/src/game-server.ts

@@ -1,7 +1,13 @@
 import { PhysicalContainer } from './physics/containers/physical-container';
 import { Player } from './players/player';
 import ioserver from 'socket.io';
-import { TransportEvents, deserialize, settings, ServerInformation } from 'shared';
+import {
+  TransportEvents,
+  deserialize,
+  settings,
+  ServerInformation,
+  PlayerInformation,
+} from 'shared';
 import { createWorld } from './map/create-world';
 import { DeltaTimeCalculator } from './helper/delta-time-calculator';
 import { Options } from './options';
@@ -22,8 +28,8 @@ export class GameServer {
     this.objects.initialize();
 
     io.on('connection', (socket: SocketIO.Socket) => {
-      socket.on(TransportEvents.PlayerJoining, () => {
-        const player = new Player(this.objects, socket);
+      socket.on(TransportEvents.PlayerJoining, (playerInfo: PlayerInformation) => {
+        const player = new Player(playerInfo, this.objects, socket);
         this.players.push(player);
         socket.on(TransportEvents.PlayerToServer, (json: string) => {
           const command = deserialize(json);

backend/src/objects/circle-physical.ts

@@ -1,5 +1,5 @@
 import { vec2 } from 'gl-matrix';
-import { Circle, GameObject, serializesTo, settings } from 'shared';
+import { Circle, GameObject, serializesTo, settings, UpdateObjectMessage } from 'shared';
 import { PhysicalBase } from '../physics/physicals/physical-base';
 import { BoundingBox } from '../physics/bounding-boxes/bounding-box';
 import { BoundingBoxBase } from '../physics/bounding-boxes/bounding-box-base';
@@ -30,6 +30,10 @@ export class CirclePhysical implements Circle, DynamicPhysical, ReactsToCollisio
     this.recalculateBoundingBox();
   }
 
+  public calculateUpdates(): UpdateObjectMessage | null {
+    return null;
+  }
+
   public get boundingBox(): BoundingBoxBase {
     return this._boundingBox;
   }

backend/src/objects/player-character-physical.ts

@@ -1,7 +1,6 @@
 import { vec2 } from 'gl-matrix';
 import {
   id,
-  CharacterBase,
   settings,
   MoveActionCommand,
   serializesTo,
@@ -9,6 +8,7 @@ import {
   last,
   GameObject,
   Circle,
+  PlayerCharacterBase,
 } from 'shared';
 import { DynamicPhysical } from '../physics/physicals/dynamic-physical';
 import { CirclePhysical } from './circle-physical';
@@ -20,10 +20,12 @@ import { forceAtPosition } from '../physics/functions/force-at-position';
 import { getBoundingBoxOfCircle } from '../physics/functions/get-bounding-box-of-circle';
 import { PlanetPhysical } from './planet-physical';
 import { ReactsToCollision } from '../physics/physicals/reacts-to-collision';
+import { UpdateObjectMessage } from 'shared/lib/src/objects/update-object-message';
+import { UpdateGameObjectMessage } from '../update-game-object-message';
 
-@serializesTo(CharacterBase)
-export class CharacterPhysical
-  extends CharacterBase
+@serializesTo(PlayerCharacterBase)
+export class PlayerCharacterPhysical
+  extends PlayerCharacterBase
   implements DynamicPhysical, ReactsToCollision {
   public readonly canCollide = true;
   public readonly canMove = true;
@@ -40,32 +42,32 @@ export class CharacterPhysical
       vec2.create(),
       vec2.add(
         vec2.create(),
-        CharacterPhysical.desiredHeadOffset,
-        CharacterPhysical.desiredLeftFootOffset,
+        PlayerCharacterPhysical.desiredHeadOffset,
+        PlayerCharacterPhysical.desiredLeftFootOffset,
       ),
-      CharacterPhysical.desiredRightFootOffset,
+      PlayerCharacterPhysical.desiredRightFootOffset,
     ),
     1 / 3,
   );
 
   private static readonly headOffset = vec2.subtract(
     vec2.create(),
-    CharacterPhysical.desiredHeadOffset,
-    CharacterPhysical.centerOfMass,
+    PlayerCharacterPhysical.desiredHeadOffset,
+    PlayerCharacterPhysical.centerOfMass,
   );
   private static readonly leftFootOffset = vec2.subtract(
     vec2.create(),
-    CharacterPhysical.desiredLeftFootOffset,
-    CharacterPhysical.centerOfMass,
+    PlayerCharacterPhysical.desiredLeftFootOffset,
+    PlayerCharacterPhysical.centerOfMass,
   );
   private static readonly rightFootOffset = vec2.subtract(
     vec2.create(),
-    CharacterPhysical.desiredRightFootOffset,
-    CharacterPhysical.centerOfMass,
+    PlayerCharacterPhysical.desiredRightFootOffset,
+    PlayerCharacterPhysical.centerOfMass,
   );
 
   public static readonly boundRadius =
-    (CharacterPhysical.headRadius + CharacterPhysical.feetRadius * 2) * 2;
+    (PlayerCharacterPhysical.headRadius + PlayerCharacterPhysical.feetRadius * 2) * 2;
 
   private isDestroyed = false;
   private direction = 0;
@@ -78,6 +80,10 @@ export class CharacterPhysical
   public rightFoot: CirclePhysical;
   public bound: CirclePhysical;
 
+  public get isAlive(): boolean {
+    return !this.isDestroyed;
+  }
+
   private movementActions: Array<MoveActionCommand> = [];
   private lastMovementAction: MoveActionCommand = new MoveActionCommand(
     vec2.create(),
@@ -85,26 +91,28 @@ export class CharacterPhysical
   );
 
   constructor(
+    name: string,
     public readonly colorIndex: number,
     private readonly container: PhysicalContainer,
     startPosition: vec2,
   ) {
-    super(id(), colorIndex);
+    super(id(), name, colorIndex);
+
     this.head = new CirclePhysical(
-      vec2.add(vec2.create(), startPosition, CharacterPhysical.headOffset),
-      CharacterPhysical.headRadius,
+      vec2.add(vec2.create(), startPosition, PlayerCharacterPhysical.headOffset),
+      PlayerCharacterPhysical.headRadius,
       this,
       container,
     );
     this.leftFoot = new CirclePhysical(
-      vec2.add(vec2.create(), startPosition, CharacterPhysical.leftFootOffset),
-      CharacterPhysical.feetRadius,
+      vec2.add(vec2.create(), startPosition, PlayerCharacterPhysical.leftFootOffset),
+      PlayerCharacterPhysical.feetRadius,
       this,
       container,
     );
     this.rightFoot = new CirclePhysical(
-      vec2.add(vec2.create(), startPosition, CharacterPhysical.rightFootOffset),
-      CharacterPhysical.feetRadius,
+      vec2.add(vec2.create(), startPosition, PlayerCharacterPhysical.rightFootOffset),
+      PlayerCharacterPhysical.feetRadius,
       this,
       container,
     );
@@ -114,12 +122,16 @@ export class CharacterPhysical
 
     this.bound = new CirclePhysical(
       vec2.create(),
-      CharacterPhysical.boundRadius,
+      PlayerCharacterPhysical.boundRadius,
       this,
       container,
     );
   }
 
+  public calculateUpdates(): UpdateObjectMessage {
+    return new UpdateGameObjectMessage(this, ['head', 'leftFoot', 'rightFoot']);
+  }
+
   public handleMovementAction(c: MoveActionCommand) {
     this.movementActions.push(c);
   }
@@ -189,7 +201,7 @@ export class CharacterPhysical
       getBoundingBoxOfCircle(
         new Circle(
           this.center,
-          CharacterPhysical.boundRadius + settings.maxGravityDistance,
+          PlayerCharacterPhysical.boundRadius + settings.maxGravityDistance,
         ),
       ),
     );
@@ -250,9 +262,9 @@ export class CharacterPhysical
     const bodyCenter = vec2.add(vec2.create(), this.head.center, this.leftFoot.center);
     vec2.add(bodyCenter, bodyCenter, this.rightFoot.center);
     vec2.scale(bodyCenter, bodyCenter, 1 / 3);
-    this.springMove(this.leftFoot, bodyCenter, CharacterPhysical.leftFootOffset);
-    this.springMove(this.rightFoot, bodyCenter, CharacterPhysical.rightFootOffset);
-    this.springMove(this.head, bodyCenter, CharacterPhysical.headOffset);
+    this.springMove(this.leftFoot, bodyCenter, PlayerCharacterPhysical.leftFootOffset);
+    this.springMove(this.rightFoot, bodyCenter, PlayerCharacterPhysical.rightFootOffset);
+    this.springMove(this.head, bodyCenter, PlayerCharacterPhysical.headOffset);
   }
 
   private springMove(object: CirclePhysical, center: vec2, offset: vec2) {

backend/src/objects/projectile-physical.ts

@@ -6,6 +6,8 @@ import { DynamicPhysical } from '../physics/physicals/dynamic-physical';
 import { PhysicalContainer } from '../physics/containers/physical-container';
 import { PlanetPhysical } from './planet-physical';
 import { ReactsToCollision } from '../physics/physicals/reacts-to-collision';
+import { UpdateObjectMessage } from 'shared/lib/src/objects/update-object-message';
+import { UpdateGameObjectMessage } from '../update-game-object-message';
 
 @serializesTo(ProjectileBase)
 export class ProjectilePhysical
@@ -15,6 +17,7 @@ export class ProjectilePhysical
   public readonly canMove = true;
   private isDestroyed = false;
   private bounceCount = 0;
+  private _boundingBox?: ImmutableBoundingBox;
 
   public object: CirclePhysical;
 
@@ -28,7 +31,9 @@ export class ProjectilePhysical
     this.object = new CirclePhysical(center, radius, this, container, 0.9);
   }
 
-  private _boundingBox?: ImmutableBoundingBox;
+  public calculateUpdates(): UpdateObjectMessage {
+    return new UpdateGameObjectMessage(this, ['center']);
+  }
 
   public get boundingBox(): ImmutableBoundingBox {
     if (!this._boundingBox) {

backend/src/physics/containers/bounding-box-list.ts

@@ -1,4 +1,4 @@
-import { DynamicPhysical } from '../dynamic-physical';
+import { DynamicPhysical } from '../physicals/dynamic-physical';
 import { BoundingBoxBase } from '../bounding-boxes/bounding-box-base';
 
 export class BoundingBoxList {

backend/src/physics/containers/bounding-box-tree.ts

@@ -1,5 +1,5 @@
 import { BoundingBoxBase } from '../bounding-boxes/bounding-box-base';
-import { StaticPhysical } from './static-physical';
+import { StaticPhysical } from '../physicals/static-physical';
 // source: https://github.com/ubilabs/kd-tree-javascript/blob/master/kdTree.js
 
 class Node {

backend/src/physics/physicals/dynamic-physical.ts

@@ -1,6 +1,9 @@
+import { UpdateObjectMessage } from 'shared/lib/src/objects/update-object-message';
 import { PhysicalBase } from './physical-base';
 
 export interface DynamicPhysical extends PhysicalBase {
   readonly canMove: true;
   step(deltaTimeInMilliseconds: number): void;
+
+  calculateUpdates(): UpdateObjectMessage | null;
 }

backend/src/players/player.ts

@@ -14,27 +14,28 @@ import {
   SecondaryActionCommand,
   settings,
   Circle,
+  PlayerInformation,
 } from 'shared';
 import { getTimeInMilliseconds } from '../helper/get-time-in-milliseconds';
-import { CharacterPhysical } from '../objects/character-physical';
 import { ProjectilePhysical } from '../objects/projectile-physical';
-
 import { BoundingBox } from '../physics/bounding-boxes/bounding-box';
 import { PhysicalContainer } from '../physics/containers/physical-container';
-import { PhysicalBase } from '../physics/physicals/physical-base';
 import { getBoundingBoxOfCircle } from '../physics/functions/get-bounding-box-of-circle';
 import { isCircleIntersecting } from '../physics/functions/is-circle-intersecting';
 import { requestColor, freeColor } from './player-color-service';
+import { PlayerCharacterPhysical } from '../objects/player-character-physical';
+import { DynamicPhysical } from '../physics/physicals/dynamic-physical';
+import { Physical } from '../physics/physicals/physical';
 
 export class Player extends CommandReceiver {
-  private character: CharacterPhysical;
+  private character: PlayerCharacterPhysical;
   private aspectRatio: number = 16 / 9;
   private isActive = true;
 
   private timeSinceLastProjectile = 0;
 
-  private objectsPreviouslyInViewArea: Array<PhysicalBase> = [];
-  private objectsInViewArea: Array<PhysicalBase> = [];
+  private objectsPreviouslyInViewArea: Array<Physical> = [];
+  private objectsInViewArea: Array<Physical> = [];
 
   private pingTime?: number;
   private _latency?: number;
@@ -56,7 +57,10 @@ export class Player extends CommandReceiver {
     [MoveActionCommand.type]: (c: MoveActionCommand) =>
       this.character.handleMovementAction(c),
     [SecondaryActionCommand.type]: (c: SecondaryActionCommand) => {
-      if (this.timeSinceLastProjectile < settings.projectileCreationInterval) {
+      if (
+        !this.character.isAlive ||
+        this.timeSinceLastProjectile < settings.projectileCreationInterval
+      ) {
         return;
       }
 
@@ -88,7 +92,7 @@ export class Player extends CommandReceiver {
 
       const playerBoundingCircle = new Circle(
         playerPosition,
-        CharacterPhysical.boundRadius,
+        PlayerCharacterPhysical.boundRadius,
       );
 
       const playerBoundingBox = getBoundingBoxOfCircle(playerBoundingCircle);
@@ -97,27 +101,26 @@ export class Player extends CommandReceiver {
         return playerPosition;
       }
 
-      rotation += Math.PI / 12;
-      radius += 10;
+      rotation += Math.PI / 8;
+      radius += 30;
     }
   }
 
   constructor(
+    playerInfo: PlayerInformation,
     private readonly objects: PhysicalContainer,
     private readonly socket: SocketIO.Socket,
   ) {
     super();
     const colorIndex = requestColor();
 
-    this.character = new CharacterPhysical(
+    this.character = new PlayerCharacterPhysical(
+      playerInfo.name,
       colorIndex,
       objects,
       this.findEmptyPositionForPlayer(),
     );
 
-    this.objectsPreviouslyInViewArea.push(this.character);
-    this.objectsInViewArea.push(this.character);
-
     this.objects.addObject(this.character);
 
     socket.emit(
@@ -138,6 +141,7 @@ export class Player extends CommandReceiver {
     this.sendObjects();
     this.timeSinceLastProjectile += deltaTime;
   }
+
   public sendObjects() {
     const viewArea = calculateViewArea(this.character.center, this.aspectRatio, 1.5);
     const bb = new BoundingBox();
@@ -161,7 +165,11 @@ export class Player extends CommandReceiver {
         TransportEvents.ServerToPlayer,
         serialize(
           new DeleteObjectsCommand([
-            ...new Set(noLongerIntersecting.map((p) => p.gameObject.id)),
+            ...new Set(
+              noLongerIntersecting
+                .filter((p) => p.gameObject !== this.character)
+                .map((p) => p.gameObject.id),
+            ),
           ]),
         ),
       );
@@ -172,20 +180,25 @@ export class Player extends CommandReceiver {
         TransportEvents.ServerToPlayer,
         serialize(
           new CreateObjectsCommand([
-            ...new Set(newlyIntersecting.map((p) => p.gameObject)),
+            ...new Set(
+              newlyIntersecting
+                .map((p) => p.gameObject)
+                .filter((g) => g !== this.character),
+            ),
           ]),
         ),
       );
     }
 
-    this.socket.volatile.emit(
+    this.socket.emit(
       TransportEvents.ServerToPlayer,
       serialize(
-        new UpdateObjectsCommand([
-          ...new Set(
-            this.objectsInViewArea.filter((p) => p.canMove).map((p) => p.gameObject),
-          ),
-        ]),
+        new UpdateObjectsCommand(
+          Array.from(new Set(this.objectsInViewArea))
+            .filter((p) => p.canMove)
+            .map((p) => (p as DynamicPhysical).calculateUpdates())
+            .filter((p) => p !== null) as any,
+        ),
       ),
     );
   }

backend/src/update-game-object-message.ts

@@ -0,0 +1,11 @@
+import { GameObject, serializesTo, UpdateMessage, UpdateObjectMessage } from 'shared';
+
+@serializesTo(UpdateObjectMessage)
+export class UpdateGameObjectMessage<T extends GameObject> extends UpdateObjectMessage {
+  constructor(object: T, keys: Array<string & keyof T>) {
+    super(
+      object.id,
+      keys.map((k) => new UpdateMessage(k, object[k])),
+    );
+  }
+}