Drafted use of gravity.

frontend/assets/scripts/AttackingCharacter.js

@@ -5,6 +5,9 @@ window.ATK_CHARACTER_STATE = {
   Walking: [1, "Walking"],
   Atk1: [2, "Atk1"],
   Atked1: [3, "Atked1"],
+  InAirIdle1: [4, "Idle1"],
+  InAirAtk1: [5, "Atk1"],
+  InAirAtked1: [6, "Atked1"],
 };
 
 window.ATK_CHARACTER_STATE_ARR = [];
@@ -15,6 +18,7 @@ for (let k in window.ATK_CHARACTER_STATE) {
 window.ATK_CHARACTER_STATE_INTERRUPT_WAIVE_SET = new Set();
 window.ATK_CHARACTER_STATE_INTERRUPT_WAIVE_SET.add(window.ATK_CHARACTER_STATE.Idle1[0]);
 window.ATK_CHARACTER_STATE_INTERRUPT_WAIVE_SET.add(window.ATK_CHARACTER_STATE.Walking[0]);
+window.ATK_CHARACTER_STATE_INTERRUPT_WAIVE_SET.add(window.ATK_CHARACTER_STATE.InAirIdle1[0]);
 
 /*
 Kindly note that the use of dragonBones anim is an informed choice for the feasibility of "gotoAndPlayByFrame", which is a required feature by "Map.rollbackAndChase". You might find that "cc.Animation" -- the traditional frame anim -- can also suffice this requirement, yet if we want to develop 3D frontend in the future, working with skeletal anim will make a smoother transition.
@@ -37,6 +41,7 @@ cc.Class({
     this.hp = 100;
     this.maxHp = 100;
     this.framesToRecover = 0;
+    this.inAir = true;
   },
 
   setSpecies(speciesName) {

frontend/assets/scripts/Map.js

@@ -274,6 +274,8 @@ cc.Class({
     const mapNode = self.node;
     const canvasNode = mapNode.parent;
 
+    [self.gravityX, self.gravityY] = self.worldToVirtualGridPos(0/self.serverFps, -9.8/self.serverFps);
+
     // Clearing previous info of all players. [BEGINS]
     self.collisionPlayerIndexPrefix = (1 << 17); // For tracking the movements of players 
     if (null != self.playerRichInfoDict) {

frontend/assets/scripts/OfflineMap.js

@@ -34,6 +34,7 @@ cc.Class({
     self.inputFrameUpsyncDelayTolerance = 2;
 
     self.renderCacheSize = 1024;
+    self.serverFps = 60;
     self.rollbackEstimatedDt = 0.016667;
     self.rollbackEstimatedDtMillis = 16.667;
     self.rollbackEstimatedDtNanos = 16666666;
@@ -136,30 +137,36 @@ cc.Class({
       const startRdf = window.pb.protos.RoomDownsyncFrame.create({
         id: window.MAGIC_ROOM_DOWNSYNC_FRAME_ID.BATTLE_START,
         players: {
-          10: {
+          10: window.pb.protos.PlayerDownsync.create({
             id: 10,
             joinIndex: 1,
-            virtualGridX: 0,
-            virtualGridY: 0,
+            virtualGridX: -50 * self.worldToVirtualGridRatio,
+            virtualGridY: -400 * self.worldToVirtualGridRatio,
             speed: 1 * self.worldToVirtualGridRatio,
             colliderRadius: 12,
-            characterState: window.ATK_CHARACTER_STATE.Idle1[0],
+            characterState: window.ATK_CHARACTER_STATE.InAirIdle1[0],
             framesToRecover: 0,
             dirX: 0,
             dirY: 0,
-          },
-          11: {
+            velX: 0,
+            velY: 0,
+            inAir: true,
+          }),
+          11: window.pb.protos.PlayerDownsync.create({
             id: 11,
             joinIndex: 2,
-            virtualGridX: 80 * self.worldToVirtualGridRatio,
-            virtualGridY: 0 * self.worldToVirtualGridRatio,
+            virtualGridX: 100 * self.worldToVirtualGridRatio,
+            virtualGridY: -350 * self.worldToVirtualGridRatio,
             speed: 1 * self.worldToVirtualGridRatio,
             colliderRadius: 12,
-            characterState: window.ATK_CHARACTER_STATE.Idle1[0],
+            characterState: window.ATK_CHARACTER_STATE.InAirIdle1[0],
             framesToRecover: 0,
             dirX: 0,
             dirY: 0,
-          },
+            velX: 0,
+            velY: 0,
+            inAir: true,
+          }),
         }
       });
       self.selfPlayerInfo = {
@@ -202,4 +209,262 @@ cc.Class({
       }
     }
   },
+
+  applyInputFrameDownsyncDynamicsOnSingleRenderFrame(delayedInputFrame, currRenderFrame, collisionSys, collisionSysMap) {
+    const self = this;
+    const nextRenderFramePlayers = {};
+    for (let playerId in currRenderFrame.players) {
+      const currPlayerDownsync = currRenderFrame.players[playerId];
+      nextRenderFramePlayers[playerId] = {
+        id: playerId,
+        virtualGridX: currPlayerDownsync.virtualGridX,
+        virtualGridY: currPlayerDownsync.virtualGridY,
+        dirX: currPlayerDownsync.dirX,
+        dirY: currPlayerDownsync.dirY,
+        velX: currPlayerDownsync.velX,
+        velY: currPlayerDownsync.velY,
+        characterState: currPlayerDownsync.characterState,
+        inAir: true, // will be updated if collided with a barrier with "0 > pushbackY"
+        speed: currPlayerDownsync.speed,
+        battleState: currPlayerDownsync.battleState,
+        score: currPlayerDownsync.score,
+        removed: currPlayerDownsync.removed,
+        joinIndex: currPlayerDownsync.joinIndex,
+        framesToRecover: (0 < currPlayerDownsync.framesToRecover ? currPlayerDownsync.framesToRecover - 1 : 0),
+        hp: currPlayerDownsync.hp,
+        maxHp: currPlayerDownsync.maxHp,
+      };
+    }
+
+    const nextRenderFrameMeleeBullets = [];
+
+    const movements = new Array(self.playerRichInfoArr.length); // Guaranteed determinism regardless of traversal order
+    const bulletPushbacks = new Array(self.playerRichInfoArr.length); // Guaranteed determinism regardless of traversal order
+    const effPushbacks = new Array(self.playerRichInfoArr.length); // Guaranteed determinism regardless of traversal order
+
+    // Reset playerCollider position from the "virtual grid position"
+    for (let j in self.playerRichInfoArr) {
+      const joinIndex = parseInt(j) + 1;
+      movements[joinIndex - 1] = [0.0, 0.0];
+      bulletPushbacks[joinIndex - 1] = [0.0, 0.0];
+      effPushbacks[joinIndex - 1] = [0.0, 0.0];
+      const playerRichInfo = self.playerRichInfoArr[j];
+      const playerId = playerRichInfo.id;
+      const collisionPlayerIndex = self.collisionPlayerIndexPrefix + joinIndex;
+      const playerCollider = collisionSysMap.get(collisionPlayerIndex);
+      const currPlayerDownsync = currRenderFrame.players[playerId];
+      const thatPlayerInNextFrame = nextRenderFramePlayers[playerId];
+
+      const newVx = currPlayerDownsync.virtualGridX;
+      const newVy = currPlayerDownsync.virtualGridY;
+      [playerCollider.x, playerCollider.y] = self.virtualGridToPolygonColliderAnchorPos(newVx, newVy, self.playerRichInfoArr[joinIndex - 1].colliderRadius, self.playerRichInfoArr[joinIndex - 1].colliderRadius);
+
+      // Process gravity before anyother interaction
+      [movements[joinIndex - 1][0], movements[joinIndex - 1][1]] = self.virtualGridToWorldPos(currPlayerDownsync.velX, currPlayerDownsync.velY);
+      playerCollider.x += movements[joinIndex - 1][0];
+      playerCollider.y += movements[joinIndex - 1][1];
+      if (currPlayerDownsync.inAir) {
+        thatPlayerInNextFrame.velX += self.gravityX;
+        thatPlayerInNextFrame.velY += self.gravityY;
+      }
+    }
+
+    // Check bullet-anything collisions first, because the pushbacks caused by bullets might later be reverted by player-barrier collision 
+    const bulletColliders = new Map(); // Will all be removed at the end of `applyInputFrameDownsyncDynamicsOnSingleRenderFrame` due to the need for being rollback-compatible
+    const removedBulletsAtCurrFrame = new Set();
+    for (let k in currRenderFrame.meleeBullets) {
+      const meleeBullet = currRenderFrame.meleeBullets[k];
+      if (
+        meleeBullet.originatedRenderFrameId + meleeBullet.startupFrames <= currRenderFrame.id
+        &&
+        meleeBullet.originatedRenderFrameId + meleeBullet.startupFrames + meleeBullet.activeFrames > currRenderFrame.id
+      ) {
+        const collisionBulletIndex = self.collisionBulletIndexPrefix + meleeBullet.battleLocalId;
+        const collisionOffenderIndex = self.collisionPlayerIndexPrefix + meleeBullet.offenderJoinIndex;
+        const offenderCollider = collisionSysMap.get(collisionOffenderIndex);
+        const offender = currRenderFrame.players[meleeBullet.offenderPlayerId];
+
+        let xfac = 1; // By now, straight Punch offset doesn't respect "y-axis"
+        if (0 > offender.dirX) {
+          xfac = -1;
+        }
+        const [offenderWx, offenderWy] = self.virtualGridToWorldPos(offender.virtualGridX, offender.virtualGridY);
+        const bulletWx = offenderWx + xfac * meleeBullet.hitboxOffset;
+        const bulletWy = offenderWy;
+        const [bulletCx, bulletCy] = self.worldToPolygonColliderAnchorPos(bulletWx, bulletWy, meleeBullet.hitboxSize.x * 0.5, meleeBullet.hitboxSize.y * 0.5),
+          pts = [[0, 0], [meleeBullet.hitboxSize.x, 0], [meleeBullet.hitboxSize.x, meleeBullet.hitboxSize.y], [0, meleeBullet.hitboxSize.y]];
+        const newBulletCollider = collisionSys.createPolygon(bulletCx, bulletCy, pts);
+        newBulletCollider.data = meleeBullet;
+        collisionSysMap.set(collisionBulletIndex, newBulletCollider);
+        bulletColliders.set(collisionBulletIndex, newBulletCollider);
+      // console.log(`A meleeBullet is added to collisionSys at currRenderFrame.id=${currRenderFrame.id} as start-up frames ended and active frame is not yet ended: ${JSON.stringify(meleeBullet)}`);
+      }
+    }
+
+    collisionSys.update();
+    const result1 = collisionSys.createResult(); // Can I reuse a "self.collisionSysResult" object throughout the whole battle?
+
+    bulletColliders.forEach((bulletCollider, collisionBulletIndex) => {
+      const potentials = bulletCollider.potentials();
+      const offender = currRenderFrame.players[bulletCollider.data.offenderPlayerId];
+      let shouldRemove = false;
+      for (const potential of potentials) {
+        if (null != potential.data && potential.data.joinIndex == bulletCollider.data.offenderJoinIndex) continue;
+        if (!bulletCollider.collides(potential, result1)) continue;
+        if (null != potential.data && null !== potential.data.joinIndex) {
+          const joinIndex = potential.data.joinIndex;
+          let xfac = 1;
+          if (0 > offender.dirX) {
+            xfac = -1;
+          }
+          bulletPushbacks[joinIndex - 1][0] += xfac * bulletCollider.data.pushback; // Only for straight punch, there's no y-pushback
+          bulletPushbacks[joinIndex - 1][1] += 0;
+          const thatAckedPlayerInNextFrame = nextRenderFramePlayers[potential.data.id];
+          thatAckedPlayerInNextFrame.characterState = window.ATK_CHARACTER_STATE.Atked1[0];
+          const oldFramesToRecover = thatAckedPlayerInNextFrame.framesToRecover;
+          thatAckedPlayerInNextFrame.framesToRecover = (oldFramesToRecover > bulletCollider.data.hitStunFrames ? oldFramesToRecover : bulletCollider.data.hitStunFrames); // In case the hit player is already stun, we extend it 
+        }
+        shouldRemove = true;
+      }
+      if (shouldRemove) {
+        removedBulletsAtCurrFrame.add(collisionBulletIndex);
+      }
+    });
+
+    // [WARNING] Remove bullets from collisionSys ANYWAY for the convenience of rollback
+    for (let k in currRenderFrame.meleeBullets) {
+      const meleeBullet = currRenderFrame.meleeBullets[k];
+      const collisionBulletIndex = self.collisionBulletIndexPrefix + meleeBullet.battleLocalId;
+      if (collisionSysMap.has(collisionBulletIndex)) {
+        const bulletCollider = collisionSysMap.get(collisionBulletIndex);
+        bulletCollider.remove();
+        collisionSysMap.delete(collisionBulletIndex);
+      }
+      if (removedBulletsAtCurrFrame.has(collisionBulletIndex)) continue;
+      nextRenderFrameMeleeBullets.push(meleeBullet);
+    }
+
+    // Process player inputs
+    if (null != delayedInputFrame) {
+      const delayedInputFrameForPrevRenderFrame = self.getCachedInputFrameDownsyncWithPrediction(self._convertToInputFrameId(currRenderFrame.id - 1, self.inputDelayFrames));
+      const inputList = delayedInputFrame.inputList;
+      for (let j in self.playerRichInfoArr) {
+        const joinIndex = parseInt(j) + 1;
+        effPushbacks[joinIndex - 1] = [0.0, 0.0];
+        const playerRichInfo = self.playerRichInfoArr[j];
+        const playerId = playerRichInfo.id;
+        const collisionPlayerIndex = self.collisionPlayerIndexPrefix + joinIndex;
+        const playerCollider = collisionSysMap.get(collisionPlayerIndex);
+        const currPlayerDownsync = currRenderFrame.players[playerId];
+        const thatPlayerInNextFrame = nextRenderFramePlayers[playerId];
+        if (0 < thatPlayerInNextFrame.framesToRecover) {
+          // No need to process inputs for this player, but there might be bullet pushbacks on this player  
+          playerCollider.x += bulletPushbacks[joinIndex - 1][0];
+          playerCollider.y += bulletPushbacks[joinIndex - 1][1];
+          if (0 != bulletPushbacks[joinIndex - 1][0] || 0 != bulletPushbacks[joinIndex - 1][1]) {
+            console.log(`playerId=${playerId}, joinIndex=${joinIndex} is pushbacked back by ${bulletPushbacks[joinIndex - 1]} by bullet impacts, now its framesToRecover is ${thatPlayerInNextFrame.framesToRecover}`);
+          }
+          continue;
+        }
+
+        const decodedInput = self.ctrl.decodeInput(inputList[joinIndex - 1]);
+
+        const prevDecodedInput = (null == delayedInputFrameForPrevRenderFrame ? null : self.ctrl.decodeInput(delayedInputFrameForPrevRenderFrame.inputList[joinIndex - 1]));
+        const prevBtnALevel = (null == prevDecodedInput ? 0 : prevDecodedInput.btnALevel);
+
+        if (1 == decodedInput.btnALevel && 0 == prevBtnALevel) {
+          // console.log(`playerId=${playerId} triggered a rising-edge of btnA at renderFrame.id=${currRenderFrame.id}, delayedInputFrame.id=${delayedInputFrame.inputFrameId}`);
+          if (self.bulletTriggerEnabled) {
+            const punchSkillId = 1;
+            const punch = window.pb.protos.MeleeBullet.create(self.meleeSkillConfig[punchSkillId]);
+            thatPlayerInNextFrame.framesToRecover = punch.recoveryFrames;
+            punch.battleLocalId = self.bulletBattleLocalIdCounter++;
+            punch.offenderJoinIndex = joinIndex;
+            punch.offenderPlayerId = playerId;
+            punch.originatedRenderFrameId = currRenderFrame.id;
+            nextRenderFrameMeleeBullets.push(punch);
+            // console.log(`A rising-edge of meleeBullet is created at renderFrame.id=${currRenderFrame.id}, delayedInputFrame.id=${delayedInputFrame.inputFrameId}: ${self._stringifyRecentInputCache(true)}`);
+            // console.log(`A rising-edge of meleeBullet is created at renderFrame.id=${currRenderFrame.id}, delayedInputFrame.id=${delayedInputFrame.inputFrameId}`);
+
+            thatPlayerInNextFrame.characterState = window.ATK_CHARACTER_STATE.Atk1[0];
+          }
+        } else if (0 == decodedInput.btnALevel && 1 == prevBtnALevel) {
+          // console.log(`playerId=${playerId} triggered a falling-edge of btnA at renderFrame.id=${currRenderFrame.id}, delayedInputFrame.id=${delayedInputFrame.inputFrameId}`);
+        } else {
+          // No bullet trigger, process movement inputs
+          if (0 != decodedInput.dx || 0 != decodedInput.dy) {
+            // Update directions and thus would eventually update moving animation accordingly
+            thatPlayerInNextFrame.dirX = decodedInput.dx;
+            thatPlayerInNextFrame.dirY = decodedInput.dy;
+            thatPlayerInNextFrame.characterState = window.ATK_CHARACTER_STATE.Walking[0];
+            thatPlayerInNextFrame.velX = currPlayerDownsync.speed * decodedInput.dx;
+          } else {
+            thatPlayerInNextFrame.characterState = window.ATK_CHARACTER_STATE.Idle1[0];
+            thatPlayerInNextFrame.velX = 0; // I believe that while jumping, velX shouldn't be snapped to 0 but let's put it this way for now
+          }
+        }
+      }
+    }
+
+    collisionSys.update(); // by now all "bulletCollider"s are removed
+    const result2 = collisionSys.createResult(); // Can I reuse a "self.collisionSysResult" object throughout the whole battle?
+
+    for (let j in self.playerRichInfoArr) {
+      const joinIndex = parseInt(j) + 1;
+      const playerId = self.playerRichInfoArr[j].id;
+      const collisionPlayerIndex = self.collisionPlayerIndexPrefix + joinIndex;
+      const playerCollider = collisionSysMap.get(collisionPlayerIndex);
+      const potentials = playerCollider.potentials();
+      const currPlayerDownsync = currRenderFrame.players[playerId];
+      const thatPlayerInNextFrame = nextRenderFramePlayers[playerId];
+      let fallStopping = false;
+      let remainsNotInAir = false;
+      for (const potential of potentials) {
+        // Test if the player collides with the wall
+        if (!playerCollider.collides(potential, result2)) continue;
+        // Push the player out of the wall
+        let [pushbackX, pushbackY] = [result2.overlap * result2.overlap_x, result2.overlap * result2.overlap_y];
+        if (null == potential.data) {
+          // "null == potential.data" implies a barrier
+          fallStopping = (currPlayerDownsync.inAir && 0 > pushbackY); // prevents false fall-stopping on the lateral sides  
+          remainsNotInAir = (!currPlayerDownsync.inAir);
+
+          // [WARNING] As when a character is standing on a barrier, if not carefully curated there MIGHT BE a bouncing sequence of "[(inAir -> dropIntoBarrier ->), (notInAir -> pushedOutOfBarrier ->)], [(inAir -> ..."  
+          if (fallStopping) {
+            pushbackY = 0.95 * pushbackY;
+          }
+          if (remainsNotInAir) {
+            pushbackY = 0;
+          }
+        }
+        // What if we're on the edge of 2 barriers? Would adding up make an unexpected bounce?
+        effPushbacks[joinIndex - 1][0] += pushbackX;
+        effPushbacks[joinIndex - 1][1] += pushbackY;
+      }
+      if (fallStopping || remainsNotInAir) {
+        thatPlayerInNextFrame.velY = 0;
+        thatPlayerInNextFrame.inAir = false;
+      }
+      if (false == currPlayerDownsync.inAir && true == thatPlayerInNextFrame.inAir) {
+        console.warn(`curRenderFrameId=${currRenderFrame.id}, playerId=${playerId}, joinIndex=${joinIndex} jumping into air: playerllider._coords=${playerCollider._coords}, playerColliderPotential=${0 >= potentials.length ? null : potentials[0]._coords}
+movement=${movements[joinIndex - 1]}, effPushback=${effPushbacks[joinIndex - 1]}`);
+      }
+    }
+
+    // Get players out of stuck barriers if there's any
+    for (let j in self.playerRichInfoArr) {
+      const joinIndex = parseInt(j) + 1;
+      const playerId = self.playerRichInfoArr[j].id;
+      const collisionPlayerIndex = self.collisionPlayerIndexPrefix + joinIndex;
+      const playerCollider = collisionSysMap.get(collisionPlayerIndex);
+      const thatPlayerInNextFrame = nextRenderFramePlayers[playerId];
+      [thatPlayerInNextFrame.virtualGridX, thatPlayerInNextFrame.virtualGridY] = self.polygonColliderAnchorToVirtualGridPos(playerCollider.x - effPushbacks[joinIndex - 1][0], playerCollider.y - effPushbacks[joinIndex - 1][1], self.playerRichInfoArr[j].colliderRadius, self.playerRichInfoArr[j].colliderRadius);
+    }
+
+    return window.pb.protos.RoomDownsyncFrame.create({
+      id: currRenderFrame.id + 1,
+      players: nextRenderFramePlayers,
+      meleeBullets: nextRenderFrameMeleeBullets,
+    });
+  },
 });

frontend/assets/scripts/modules/room_downsync_frame_proto_bundle.forcemsg.js

@@ -1196,6 +1196,8 @@ $root.protos = (function() {
          * @property {number|null} [virtualGridY] PlayerDownsync virtualGridY
          * @property {number|null} [dirX] PlayerDownsync dirX
          * @property {number|null} [dirY] PlayerDownsync dirY
+         * @property {number|null} [velX] PlayerDownsync velX
+         * @property {number|null} [velY] PlayerDownsync velY
          * @property {number|null} [speed] PlayerDownsync speed
          * @property {number|null} [battleState] PlayerDownsync battleState
          * @property {number|null} [joinIndex] PlayerDownsync joinIndex
@@ -1267,6 +1269,22 @@ $root.protos = (function() {
          */
         PlayerDownsync.prototype.dirY = 0;
 
+        /**
+         * PlayerDownsync velX.
+         * @member {number} velX
+         * @memberof protos.PlayerDownsync
+         * @instance
+         */
+        PlayerDownsync.prototype.velX = 0;
+
+        /**
+         * PlayerDownsync velY.
+         * @member {number} velY
+         * @memberof protos.PlayerDownsync
+         * @instance
+         */
+        PlayerDownsync.prototype.velY = 0;
+
         /**
          * PlayerDownsync speed.
          * @member {number} speed
@@ -1413,34 +1431,38 @@ $root.protos = (function() {
                 writer.uint32(/* id 4, wireType 0 =*/32).int32(message.dirX);
             if (message.dirY != null && Object.hasOwnProperty.call(message, "dirY"))
                 writer.uint32(/* id 5, wireType 0 =*/40).int32(message.dirY);
+            if (message.velX != null && Object.hasOwnProperty.call(message, "velX"))
+                writer.uint32(/* id 6, wireType 0 =*/48).int32(message.velX);
+            if (message.velY != null && Object.hasOwnProperty.call(message, "velY"))
+                writer.uint32(/* id 7, wireType 0 =*/56).int32(message.velY);
             if (message.speed != null && Object.hasOwnProperty.call(message, "speed"))
-                writer.uint32(/* id 6, wireType 0 =*/48).int32(message.speed);
+                writer.uint32(/* id 8, wireType 0 =*/64).int32(message.speed);
             if (message.battleState != null && Object.hasOwnProperty.call(message, "battleState"))
-                writer.uint32(/* id 7, wireType 0 =*/56).int32(message.battleState);
+                writer.uint32(/* id 9, wireType 0 =*/72).int32(message.battleState);
             if (message.joinIndex != null && Object.hasOwnProperty.call(message, "joinIndex"))
-                writer.uint32(/* id 8, wireType 0 =*/64).int32(message.joinIndex);
+                writer.uint32(/* id 10, wireType 0 =*/80).int32(message.joinIndex);
             if (message.colliderRadius != null && Object.hasOwnProperty.call(message, "colliderRadius"))
-                writer.uint32(/* id 9, wireType 1 =*/73).double(message.colliderRadius);
+                writer.uint32(/* id 11, wireType 1 =*/89).double(message.colliderRadius);
             if (message.removed != null && Object.hasOwnProperty.call(message, "removed"))
-                writer.uint32(/* id 10, wireType 0 =*/80).bool(message.removed);
+                writer.uint32(/* id 12, wireType 0 =*/96).bool(message.removed);
             if (message.score != null && Object.hasOwnProperty.call(message, "score"))
-                writer.uint32(/* id 11, wireType 0 =*/88).int32(message.score);
+                writer.uint32(/* id 13, wireType 0 =*/104).int32(message.score);
             if (message.lastMoveGmtMillis != null && Object.hasOwnProperty.call(message, "lastMoveGmtMillis"))
-                writer.uint32(/* id 12, wireType 0 =*/96).int32(message.lastMoveGmtMillis);
+                writer.uint32(/* id 14, wireType 0 =*/112).int32(message.lastMoveGmtMillis);
             if (message.framesToRecover != null && Object.hasOwnProperty.call(message, "framesToRecover"))
-                writer.uint32(/* id 13, wireType 0 =*/104).int32(message.framesToRecover);
+                writer.uint32(/* id 15, wireType 0 =*/120).int32(message.framesToRecover);
             if (message.hp != null && Object.hasOwnProperty.call(message, "hp"))
-                writer.uint32(/* id 14, wireType 0 =*/112).int32(message.hp);
+                writer.uint32(/* id 16, wireType 0 =*/128).int32(message.hp);
             if (message.maxHp != null && Object.hasOwnProperty.call(message, "maxHp"))
-                writer.uint32(/* id 15, wireType 0 =*/120).int32(message.maxHp);
+                writer.uint32(/* id 17, wireType 0 =*/136).int32(message.maxHp);
             if (message.characterState != null && Object.hasOwnProperty.call(message, "characterState"))
-                writer.uint32(/* id 16, wireType 0 =*/128).int32(message.characterState);
+                writer.uint32(/* id 18, wireType 0 =*/144).int32(message.characterState);
             if (message.name != null && Object.hasOwnProperty.call(message, "name"))
-                writer.uint32(/* id 17, wireType 2 =*/138).string(message.name);
+                writer.uint32(/* id 19, wireType 2 =*/154).string(message.name);
             if (message.displayName != null && Object.hasOwnProperty.call(message, "displayName"))
-                writer.uint32(/* id 18, wireType 2 =*/146).string(message.displayName);
+                writer.uint32(/* id 20, wireType 2 =*/162).string(message.displayName);
             if (message.avatar != null && Object.hasOwnProperty.call(message, "avatar"))
-                writer.uint32(/* id 19, wireType 2 =*/154).string(message.avatar);
+                writer.uint32(/* id 21, wireType 2 =*/170).string(message.avatar);
             return writer;
         };
 
@@ -1496,58 +1518,66 @@ $root.protos = (function() {
                         break;
                     }
                 case 6: {
-                        message.speed = reader.int32();
+                        message.velX = reader.int32();
                         break;
                     }
                 case 7: {
-                        message.battleState = reader.int32();
+                        message.velY = reader.int32();
                         break;
                     }
                 case 8: {
-                        message.joinIndex = reader.int32();
+                        message.speed = reader.int32();
                         break;
                     }
                 case 9: {
-                        message.colliderRadius = reader.double();
+                        message.battleState = reader.int32();
                         break;
                     }
                 case 10: {
-                        message.removed = reader.bool();
+                        message.joinIndex = reader.int32();
                         break;
                     }
                 case 11: {
-                        message.score = reader.int32();
+                        message.colliderRadius = reader.double();
                         break;
                     }
                 case 12: {
-                        message.lastMoveGmtMillis = reader.int32();
+                        message.removed = reader.bool();
                         break;
                     }
                 case 13: {
-                        message.framesToRecover = reader.int32();
+                        message.score = reader.int32();
                         break;
                     }
                 case 14: {
-                        message.hp = reader.int32();
+                        message.lastMoveGmtMillis = reader.int32();
                         break;
                     }
                 case 15: {
-                        message.maxHp = reader.int32();
+                        message.framesToRecover = reader.int32();
                         break;
                     }
                 case 16: {
-                        message.characterState = reader.int32();
+                        message.hp = reader.int32();
                         break;
                     }
                 case 17: {
-                        message.name = reader.string();
+                        message.maxHp = reader.int32();
                         break;
                     }
                 case 18: {
-                        message.displayName = reader.string();
+                        message.characterState = reader.int32();
                         break;
                     }
                 case 19: {
+                        message.name = reader.string();
+                        break;
+                    }
+                case 20: {
+                        message.displayName = reader.string();
+                        break;
+                    }
+                case 21: {
                         message.avatar = reader.string();
                         break;
                     }
@@ -1601,6 +1631,12 @@ $root.protos = (function() {
             if (message.dirY != null && message.hasOwnProperty("dirY"))
                 if (!$util.isInteger(message.dirY))
                     return "dirY: integer expected";
+            if (message.velX != null && message.hasOwnProperty("velX"))
+                if (!$util.isInteger(message.velX))
+                    return "velX: integer expected";
+            if (message.velY != null && message.hasOwnProperty("velY"))
+                if (!$util.isInteger(message.velY))
+                    return "velY: integer expected";
             if (message.speed != null && message.hasOwnProperty("speed"))
                 if (!$util.isInteger(message.speed))
                     return "speed: integer expected";
@@ -1668,6 +1704,10 @@ $root.protos = (function() {
                 message.dirX = object.dirX | 0;
             if (object.dirY != null)
                 message.dirY = object.dirY | 0;
+            if (object.velX != null)
+                message.velX = object.velX | 0;
+            if (object.velY != null)
+                message.velY = object.velY | 0;
             if (object.speed != null)
                 message.speed = object.speed | 0;
             if (object.battleState != null)
@@ -1718,6 +1758,8 @@ $root.protos = (function() {
                 object.virtualGridY = 0;
                 object.dirX = 0;
                 object.dirY = 0;
+                object.velX = 0;
+                object.velY = 0;
                 object.speed = 0;
                 object.battleState = 0;
                 object.joinIndex = 0;
@@ -1743,6 +1785,10 @@ $root.protos = (function() {
                 object.dirX = message.dirX;
             if (message.dirY != null && message.hasOwnProperty("dirY"))
                 object.dirY = message.dirY;
+            if (message.velX != null && message.hasOwnProperty("velX"))
+                object.velX = message.velX;
+            if (message.velY != null && message.hasOwnProperty("velY"))
+                object.velY = message.velY;
             if (message.speed != null && message.hasOwnProperty("speed"))
                 object.speed = message.speed;
             if (message.battleState != null && message.hasOwnProperty("battleState"))