GameMap: Preserve unit information on resize/reload

client/src/Unit.ts

@@ -114,48 +114,54 @@ export class Unit extends ActorGroup {
   private actions: UnitAction[];
   private queuedMovementTiles: Tile[];
 
-  constructor(options: options) {
+  constructor(tile: Tile, unitJSON: JSON) {
     super({
-      x: options.tile.getCenterPosition()[0] - 28 / 2,
-      y: options.tile.getCenterPosition()[1] - 28 / 2,
+      x: tile.getCenterPosition()[0] - 28 / 2,
+      y: tile.getCenterPosition()[1] - 28 / 2,
       z: 2,
       width: 28,
       height: 28,
     });
 
+    this.tile = tile;
+    this.name = unitJSON["name"];
+
     this.unitActor = new Actor({
       image: Game.getImage(GameImage.SPRITESHEET),
-      spriteRegion: SpriteRegion[options.name.toUpperCase()],
-      x: options.tile.getCenterPosition()[0] - 28 / 2,
-      y: options.tile.getCenterPosition()[1] - 28 / 2,
+      spriteRegion: SpriteRegion[this.name.toUpperCase()],
+      x: tile.getCenterPosition()[0] - 28 / 2,
+      y: tile.getCenterPosition()[1] - 28 / 2,
       z: 2,
       width: 28,
       height: 28,
     });
 
     this.addActor(this.unitActor);
 
-    this.name = options.name;
-    this.id = options.id;
-    this.tile = options.tile;
-    this.attackType = options.attackType;
+    this.id = unitJSON["id"];
+    this.attackType = unitJSON["attackType"];
+    this.availableMovement = unitJSON["remainingMovement"];
+    this.defaultMoveDistance = unitJSON["defaultMoveDistance"];
+
+    this.queuedMovementTiles = [];
+    for (const jsonTile of unitJSON["queuedTiles"]) {
+      this.queuedMovementTiles.push(
+        GameMap.getInstance().getTiles()[jsonTile["x"]][jsonTile["y"]]
+      );
+    }
+
     this.selectionActors = [];
-    this.defaultMoveDistance = 2; // TODO: Have server define this.
-    this.availableMovement = this.defaultMoveDistance;
     this.actions = [];
-    this.queuedMovementTiles = [];
 
-    if (options.actionsJSONList) {
-      for (const actionJSON of options.actionsJSONList) {
-        this.actions.push(
-          new UnitAction(
-            actionJSON.name,
-            actionJSON.desc,
-            actionJSON.requirements,
-            SpriteRegion[actionJSON.icon]
-          )
-        );
-      }
+    for (const actionJSON of unitJSON["actions"]) {
+      this.actions.push(
+        new UnitAction(
+          actionJSON.name,
+          actionJSON.desc,
+          actionJSON.requirements,
+          SpriteRegion[actionJSON.icon]
+        )
+      );
     }
 
     console.log("new unit with id: " + this.id);

client/src/map/GameMap.ts

@@ -40,7 +40,6 @@ export class GameMap {
 
   private topLayerMapChunks: Map<Actor, Tile[]>;
   private topLayerTileActorList: Tile[] = [];
-  private unitActorList: Unit[] = [];
 
   public static getInstance() {
     return this.instance;
@@ -238,6 +237,7 @@ export class GameMap {
     const baseLayerTiles = [];
     const riverActors = [];
     const cityJSONS: JSON[] = [];
+    const unitJSONS: JSON[] = [];
 
     WebsocketClient.sendMessage({ event: "requestMap" });
 
@@ -345,15 +345,7 @@ export class GameMap {
           }
 
           for (const jsonUnit of jsonUnits) {
-            const unit = new Unit({
-              name: jsonUnit["name"],
-              id: jsonUnit["id"],
-              attackType: jsonUnit["attackType"],
-              tile: tile,
-              actionsJSONList: jsonUnit["actions"],
-            });
-            tile.addUnit(unit);
-            this.unitActorList.push(unit);
+            unitJSONS.push(jsonUnit);
           }
         }
 
@@ -407,7 +399,11 @@ export class GameMap {
             scene.addActor(chunkActor);
           });
 
-          for (const unit of this.unitActorList) {
+          // Now create any units that already exist on the map
+          for (const unitJSON of unitJSONS) {
+            const tile = this.tiles[unitJSON["tileX"]][unitJSON["tileY"]];
+            const unit = new Unit(tile, unitJSON);
+            tile.addUnit(unit);
             scene.addActor(unit);
           }
 

client/src/player/ClientPlayer.ts

@@ -29,7 +29,6 @@ export class ClientPlayer extends AbstractPlayer {
       this.hoveredTile = new HoveredTile(9999, 9999);
       this.hoveredTile.loadImage().then(() => {
         Game.getCurrentScene().addActor(this.hoveredTile);
-        console.log("update hovered tile.");
         this.updateHoveredTile(Game.getMouseX(), Game.getMouseY());
       });
     });
@@ -170,6 +169,15 @@ export class ClientPlayer extends AbstractPlayer {
         this.unselectUnit();
       }
     });
+
+    NetworkEvents.on({
+      eventName: "newTurn",
+      parentObject: this,
+      callback: (data) => {
+        this.unselectUnit();
+        this.clearMovementPath();
+      },
+    });
   }
 
   private onMouseRightClick() {
@@ -238,7 +246,6 @@ export class ClientPlayer extends AbstractPlayer {
     unit.select();
     this.selectedUnit = unit;
 
-    // TOOD: Draw full outline of final queued tile or hovered tile.
     if (this.selectedUnit.hasMovementQueue()) {
       const isQueuedMovement = this.drawMovementPathFromTiles([
         unit.getTile(),

client/src/scene/type/InGameScene.ts

@@ -86,7 +86,6 @@ export class InGameScene extends Scene {
         height: 42,
         fontColor: "white",
         onClicked: () => {
-          console.log("next turn!");
           WebsocketClient.sendMessage({ event: "nextTurnRequest" });
         },
       });

server/src/Unit.ts

@@ -236,11 +236,21 @@ export class Unit {
   }
 
   public asJSON() {
+    const queuedTilesJSON = this.queuedMovementTiles.map((tile) => ({
+      x: tile.getX(),
+      y: tile.getY(),
+    }));
+
     return {
       name: this.name,
+      tileX: this.tile.getX(),
+      tileY: this.tile.getY(),
       attackType: this.attackType,
       id: this.id,
       actions: this.getUnitActionsJSON(),
+      queuedTiles: queuedTilesJSON,
+      remainingMovement: this.availableMovement,
+      defaultMoveDistance: this.defaultMoveDistance,
     };
   }