Colyseus.js - patch handling comparison from v0.5.x to v0.6.x (not released yet)

new.ts

  // ...
  registerListeners () {
      this.room.state.listen("cars/:id", "add", (clientId: string, value: any) => {
          this.addCar(clientId, value);
      });

      this.room.state.listen("cars/:id", "remove", (clientId: string) => {
          this.view.removeCar(clientId);
      });

      this.room.state.listen("cars/:id/angle", "replace", (clientId: string, value: any) => {
          this.view.cars[ clientId ].nextRotation = value;
      });

      this.room.state.listen("cars/:id/laps", "replace", (clientId: string, value: any) => {
          this.view.cars[ clientId ].laps = value;
          if (clientId === this.client.id) {
              // trigger lap signal for UI
              this.onLapSignal.dispatch(value);
          }
      });

      this.room.state.listen("cars/:id/hp", "replace", (clientId: string, value: any) => {
          this.view.cars[ clientId ].hp = value;

          if (clientId === this.client.id) {
              // trigger life change signal for UI
              this.onLifeSignal.dispatch(value);
          }
      });

      this.room.state.listen("cars/:id/skillsAvailable/:skill", "replace", (clientId: string, skill: string, value: any) => {
          // skill usage acknowledge
          if (clientId === this.client.id) {
              this.onSkillSignal.dispatch(parseInt(skill), value);
          }
      });

      this.room.state.listen(["cars", ":id", /^([xy])$/], "replace", (clientId: string, attr: string, value: any) => {
          console.log(clientId, attr, value);
          this.view.cars[ clientId ].nextPosition[ attr ] = value;
      });

      this.room.state.listen("entities/:id", "add", (entityId: string, value: any) => {
          let entity: Entity = null;

          if (value.type === "mine") {
              entity = new Mine();

          } else if (value.type === "missile") {
              entity = new Missile();
              entity.rotation = value.angle;
          }

          entity.position.x = value.x;
          entity.position.y = value.y;

          entity.nextPosition.x = entity.position.x;
          entity.nextPosition.y = entity.position.y;

          this.view.addEntity(entityId, entity);
      });

      this.room.state.listen(["entities", ":id", /([xy])/], "replace", (entityId: string, attr: string, value: any) => {
          this.view.entities[ entityId ].nextPosition[ attr ] = value;
      });

      this.room.state.listen("entities/:id", "remove", (entityId: string) => {
          this.view.removeEntity(entityId);
      });
  }
  // ...

old.ts

  // ...

  onPatch = (patches) => {
      for (let i=0, l=patches.length; i<l; i++) {
          let patch = patches[i];

          if (patch.op === "add" && patch.path.indexOf("/cars") !== -1 ) {
              let [ , clientId ] = patch.path.match(/\/cars\/([a-zA-Z0-9\-_]+)/m);
              this.addCar(clientId, patch.value);

          } else if (patch.op === "remove" && patch.path.indexOf("/cars") !== -1 ) {
              let [ , clientId ] = patch.path.match(/\/cars\/([a-zA-Z0-9\-_]+)/m);
              this.view.removeCar(clientId);

          } else if (patch.op === "replace" && patch.path.indexOf("/cars") !== -1 ) {
              // update car position
              let matches = patch.path.match(/\/cars\/([a-zA-Z0-9\-_]+)\/([a-zA-Z0-9]+)(.[0-9]+)?/m);

              if (!matches) { continue; }

              let clientId = matches[1];
              let attr = matches[2];

              if (attr === "angle") {
                  this.view.cars[ clientId ].nextRotation = patch.value;

              } else if (attr === "x" || attr === "y") {
                  this.view.cars[ clientId ].nextPosition[ attr ] = patch.value;

              } else if (attr === "laps") {
                  this.view.cars[ clientId ][ attr ] = patch.value;

                  if (clientId === this.client.id) {
                      // trigger lap signal for UI
                      this.onLapSignal.dispatch(patch.value);
                  }

              } else if (attr === "skillsAvailable") {
                  // skill usage acknowledge
                  if (clientId === this.client.id) {
                      this.onSkillSignal.dispatch(parseInt(matches[3].substr(1)), patch.value);
                  }

              } else if (attr === "hp") {
                  this.view.cars[ clientId ][ attr ] = patch.value;

                  if (clientId === this.client.id) {
                      // trigger life change signal for UI
                      this.onLifeSignal.dispatch(patch.value);
                  }
              }

          } else if (patch.op === "add" && patch.path.indexOf("/entities") !== -1 ) {
              let [ , entityId ] = patch.path.match(/\/entities\/([a-zA-Z0-9\-_]+)/m);
              let entity: Entity = null;

              if (patch.value.type === "mine") {
                  entity = new Mine();

              } else if (patch.value.type === "missile") {
                  entity = new Missile();
                  entity.rotation = patch.value.angle;
              }

              entity.position.x = patch.value.x;
              entity.position.y = patch.value.y;

              entity.nextPosition.x = entity.position.x;
              entity.nextPosition.y = entity.position.y;

              this.view.addEntity(entityId, entity);

          } else if (patch.op === "replace" && patch.path.indexOf("/entities") !== -1 ) {
              // update entity position
              let matches = patch.path.match(/\/entities\/([a-zA-Z0-9\-_]+)\/([a-z]+)/m);

              if (!matches) { continue; }

              let entityId = matches[1];
              let attr = matches[2];

              if (attr === "x" || attr === "y") {
                  this.view.entities[ entityId ].nextPosition[ attr ] = patch.value;
              }

          } else if (patch.op === "remove" && patch.path.indexOf("/entities") !== -1 ) {
              let [ , entityId ] = patch.path.match(/\/entities\/([a-zA-Z0-9\-_]+)/m);
              this.view.removeEntity(entityId);
          }
      }
  }

  // ...