fix: the map offset

Mississippi-Labs · Nov 23, 2023 · bb52bdb · bb52bdb
1 parent 577fa1d
commit bb52bdb
Show file tree

Hide file tree

Showing 7 changed files with 1,909 additions and 1,926 deletions.
diff --git a/packages/client/src/components/PIXIAPP/index.tsx b/packages/client/src/components/PIXIAPP/index.tsx
@@ -12,7 +12,7 @@ import { IPlayer } from '@/components/PIXIPlayers/Player';
 import GameContext from '@/context';
 import { ICoordinate } from '@/components/MapCell';
 import { CellType } from '@/constants';
-import { bfs, getDistance, isDelivery, isMovable, triggerOffsetUpdate } from '@/utils/map';
+import { bfs, calculateOffset, getDistance, isDelivery, isMovable } from '@/utils/map';
 import {
   createPathInterpolator,
   getPlayersCache,
@@ -69,6 +69,9 @@ const PIXIAPP = () => {
         }
       } else {
         renderPlayersArr.push({ ...player });
+        if (player.addr === curAddr) {
+          setOffset(calculateOffset(player));
+        }
         console.log(`load player ${player.name}`)
       }
     });
@@ -101,7 +104,7 @@ const PIXIAPP = () => {
         return;
       }
       if (movingPlayer.addr === curPlayer?.addr) {
-        setOffset(triggerOffsetUpdate(linePath[index], movingPlayer, simpleMapData, offset));
+        setOffset(calculateOffset(linePath[index]));
       }
       updatePlayerPosition(movingPlayer, linePath[index]);
       movingPlayer.action = 'run';

diff --git a/packages/client/src/config/map.ts b/packages/client/src/config/map.ts
@@ -3,17 +3,6 @@ export const DELIVERY = {
   y: 5
 };
 
-export const MapConfig = {
-  visualWidth: 24,
-  visualHeight: 16,
-  cellSize: 48,
-  spriteCellSize: 16,
-}
-
-export const LimitSpace = {
-  x: ~~(MapConfig.visualWidth / 2),
-  y: ~~(MapConfig.visualHeight / 2)
-}
 
 const MAP_CFG = [
   [101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101],
@@ -81,3 +70,18 @@ const MAP_CFG = [
   [101, 101, 101, 101, 101, 101, 100, 100, 100, 100, 100, 100, 100, 100, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101],
   [101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101, 101]]
 export default MAP_CFG;
+
+
+export const MapConfig = {
+  visualWidth: 24,
+  visualHeight: 16,
+  cellSize: 48,
+  spriteCellSize: 16,
+  width: MAP_CFG[0].length,
+  height: MAP_CFG.length,
+}
+
+export const LimitSpace = {
+  x: ~~(MapConfig.visualWidth / 2),
+  y: ~~(MapConfig.visualHeight / 2)
+}
diff --git a/packages/client/src/utils/map.ts b/packages/client/src/utils/map.ts
@@ -408,37 +408,13 @@ export const triggerVertexUpdate = (cur, before, mapData, vertexCoordinate) => {
   });
 };
 
-export const triggerOffsetUpdate = (cur, before, mapData, offset) => {
-  const xDegree = cur.x - before.x;
-  const yDegree = cur.y - before.y;
-  if (xDegree > 0) {
-    const limitExceeded = cur.x > LimitSpace.x;
-    const lessBoundary = cur.x + LimitSpace.x < mapData[0].length - 1;
-    if (limitExceeded && lessBoundary) {
-      offset.x = (LimitSpace.x - cur.x) * cellSize;
-    }
-  } else if (xDegree < 0>) {
-    const limitExceeded = cur.x > LimitSpace.x;
-    if (limitExceeded) {
-      offset.x = (LimitSpace.x - cur.x ) * cellSize;
-    }
-  } else if (yDegree > 0) {
-    const limitExceeded = cur.y > LimitSpace.y;
-    const lessBoundary = cur.y + LimitSpace.y < mapData[0].length - 1;
-    if (limitExceeded && lessBoundary) {
-      offset.y = (LimitSpace.y - cur.y) * cellSize;
-    }
-  } else if (yDegree < 0) {
-    const limitExceeded = cur.y > LimitSpace.y;
-    if (limitExceeded) {
-      offset.y = (LimitSpace.y - cur.y) * cellSize;
-    }
-  }
-
-  return({
-    ...offset,
-  });
-};
+export const calculateOffset = (coordinate: ICoordinate) => {
+  const { x, y } = coordinate;
+  const { visualWidth, visualHeight, width, height, cellSize } = MapConfig;
+  const offsetX = Math.max(0, Math.min(x - visualWidth / 2, width - visualWidth));
+  const offsetY = Math.max(0, Math.min(y - visualHeight / 2, height - visualHeight));
+  return { x: -offsetX * cellSize, y: -offsetY * cellSize };
+}
 
 export const getDistance = (p1, p2) => {
   return Math.sqrt(Math.pow(p2.x - p1.x, 2) + Math.pow(p2.y - p1.y, 2));

diff --git a/packages/contracts/out/IWorld.sol/IWorld.json b/packages/contracts/out/IWorld.sol/IWorld.json
diff --git a/packages/contracts/out/Loot.sol/MLoot.json b/packages/contracts/out/Loot.sol/MLoot.json