From 77514ba9974c2d72e0f0d8b76264a2a65e494f73 Mon Sep 17 00:00:00 2001 From: vivomo <929992114@qq.com> Date: Sat, 25 Nov 2023 01:32:05 +0800 Subject: [PATCH 1/4] feat: open Chests's distance update --- packages/client/src/components/PIXIAPP/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/client/src/components/PIXIAPP/index.tsx b/packages/client/src/components/PIXIAPP/index.tsx index bf35715a..031b008e 100644 --- a/packages/client/src/components/PIXIAPP/index.tsx +++ b/packages/client/src/components/PIXIAPP/index.tsx @@ -206,7 +206,7 @@ const PIXIAPP = () => { break; case 'click': targetChests = treasureChest.filter(item => item.x === coordinate.x && item.y === coordinate.y); - if (targetChests.length > 0 && getDistance(curPlayer, coordinate) <= 1) { + if (targetChests.length > 0 && getDistance(curPlayer, coordinate) < 2) { openTreasureChest(targetChests[0].id); return; } From b6a1e4b316ce48b0eeb0b9fe0722833afd464047 Mon Sep 17 00:00:00 2001 From: LidamaoHub Date: Sun, 26 Nov 2023 20:45:23 +0800 Subject: [PATCH 2/4] deploy new contract --- packages/contracts/worlds.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/contracts/worlds.json b/packages/contracts/worlds.json index 77956675..c9d6f576 100644 --- a/packages/contracts/worlds.json +++ b/packages/contracts/worlds.json @@ -11,8 +11,8 @@ "address": "0xe58cBE144dD5556C84874deC1b3F2d0D6Ac45F1b" }, "33784": { - "address": "0xbf96238698F1e03c39f7cE5C587eeDd4b3aAB642", - "blockNumber": 178 + "address": "0xFA6f772d446569504f77875ddc43815eE57B3a47", + "blockNumber": 176938 }, "421613": { "address": "0x2Bc1034975c3df48D6f3026802f372677844b85d", From 9f496f1a54185d540e80dda387bf0978f0e34c16 Mon Sep 17 00:00:00 2001 From: vivomo <929992114@qq.com> Date: Sun, 26 Nov 2023 21:45:19 +0800 Subject: [PATCH 3/4] feat: user info --- packages/client/src/App.tsx | 8 +++ .../client/src/components/Equipment/index.tsx | 36 ++++++++++ .../src/components/Equipment/styles.scss | 72 +++++++++++++++++++ .../src/components/PIXIPlayers/Player.tsx | 1 + .../client/src/components/UserInfo/index.tsx | 63 ++++++++++------ .../src/components/UserInfo/styles.scss | 55 ++++++++++++-- .../src/components/UserInfoDialog/styles.scss | 1 - .../src/components/UserPackage/index.tsx | 20 ++++-- .../src/components/UserPackage/styles.scss | 11 ++- packages/client/src/pages/game/index.tsx | 2 +- packages/client/src/pages/heroEdit/index.tsx | 2 +- packages/client/src/pages/home/index.tsx | 2 +- packages/client/tsconfig.json | 2 +- 13 files changed, 233 insertions(+), 42 deletions(-) create mode 100644 packages/client/src/components/Equipment/index.tsx create mode 100644 packages/client/src/components/Equipment/styles.scss diff --git a/packages/client/src/App.tsx b/packages/client/src/App.tsx index 23e0d50b..26db21d7 100644 --- a/packages/client/src/App.tsx +++ b/packages/client/src/App.tsx @@ -5,9 +5,17 @@ import Test from './pages/test'; import Home from '@/pages/home'; import HeroEdit from '@/pages/heroEdit'; import PIXIAPP from '@/components/PIXIAPP'; +import { useEffect } from 'react'; export const App = () => { + useEffect(() => { + document.body.addEventListener('contextmenu', (e) => { + e.preventDefault(); + return false; + }) + }, []) + return (
diff --git a/packages/client/src/components/Equipment/index.tsx b/packages/client/src/components/Equipment/index.tsx new file mode 100644 index 00000000..c9c99a09 --- /dev/null +++ b/packages/client/src/components/Equipment/index.tsx @@ -0,0 +1,36 @@ +import React from 'react'; +import './styles.scss'; + +export interface IEquipment { + type: string; + name?: string | undefined; +} + +const Equipment = (props: IEquipment) => { + + const { name, type } = props; + + if (!name) { + return null; + } + + return ( +
+
+
+
    +
  • +
  • +
  • +
+ +

This piece of equipment is synthesized from 3 pieces of loot

+
+
+
+ ); +}; + +export default Equipment; \ No newline at end of file diff --git a/packages/client/src/components/Equipment/styles.scss b/packages/client/src/components/Equipment/styles.scss new file mode 100644 index 00000000..fe64525d --- /dev/null +++ b/packages/client/src/components/Equipment/styles.scss @@ -0,0 +1,72 @@ +.mi-equipment { + position: relative; + width: 64px; + height: 64px; + background-repeat: no-repeat; + image-rendering: pixelated; + background-size: 1600%; + background-position: 2px 4px; + + .equipment-info { + display: none; + position: absolute; + z-index: 1; + top: -80px; + left: 99%; + width: 440px; + padding-left: 20px; + height: 226px; + + + .equipment-info-content { + position: relative; + width: 420px; + height: 100%; + padding: 12px; + border-radius: 10px; + border: 5px solid #DCC7AF; + background: #FFF5E9; + + &::before, &::after { + content: ''; + position: absolute; + right: 100%; + top: 50%; + transform: translate3d(0, -50%, 0); + } + + &::before { + border: 20px solid; + border-color: transparent #DCC7AF transparent transparent; + } + + &::after { + border: 14px solid; + transform: translate3d(1px, -50%, 0); + border-color: transparent #FFF5E9 transparent transparent; + } + } + + .loot-list { + display: flex; + justify-content: space-between; + + .loot-item { + width: 120px; + height: 120px; + background: #000; + } + } + + .equipment-desc { + margin-top: 12px; + font-size: 12px; + line-height: 1.57; + color: #BC8C61; + } + } + + &:hover .equipment-info { + display: block; + } +} \ No newline at end of file diff --git a/packages/client/src/components/PIXIPlayers/Player.tsx b/packages/client/src/components/PIXIPlayers/Player.tsx index 3e2a53a1..ae420faf 100644 --- a/packages/client/src/components/PIXIPlayers/Player.tsx +++ b/packages/client/src/components/PIXIPlayers/Player.tsx @@ -40,6 +40,7 @@ export interface IPlayer { strength: number; space: number; oreBalance: number; + seasonOreBalance: number; treasureBalance: number; state: number; lastBattleTime: number; diff --git a/packages/client/src/components/UserInfo/index.tsx b/packages/client/src/components/UserInfo/index.tsx index 75c0ee0d..1ade7a22 100644 --- a/packages/client/src/components/UserInfo/index.tsx +++ b/packages/client/src/components/UserInfo/index.tsx @@ -6,6 +6,7 @@ import * as PIXI from 'pixi.js'; import { Stage } from '@pixi/react'; import Player, { IPlayer } from '@/components/PIXIPlayers/Player'; import { MapConfig } from '@/config/map'; +import Equipment from '@/components/Equipment'; const { cellSize } = MapConfig; PIXI.settings.SCALE_MODE = PIXI.SCALE_MODES.NEAREST; @@ -27,27 +28,48 @@ const UserInfo = (props: IUserInfo) => { return (
-

User info

+

Equipment

-
-
- - - -
-
-
-
- { - userUrl ? : null - } -
-
- { - lootUrl ? : null - } +
+
    +
  • + +
    • +
  • + +
    • +
  • +
  • +
+
+
+ + + +
+
    +
  • +
  • +
  • + +
    • +
  • +
+ {/*
*/} + {/*
*/} + {/* {*/} + {/* userUrl ? : null*/} + {/* }*/} + {/*
*/} + {/*
*/} + {/* {*/} + {/* lootUrl ? : null*/} + {/* }*/} + {/*
*/} + {/*
*/} +
HP
@@ -79,11 +101,12 @@ const UserInfo = (props: IUserInfo) => {
diff --git a/packages/client/src/components/UserInfo/styles.scss b/packages/client/src/components/UserInfo/styles.scss index 31c1b634..b8664118 100644 --- a/packages/client/src/components/UserInfo/styles.scss +++ b/packages/client/src/components/UserInfo/styles.scss @@ -8,30 +8,61 @@ } .left-main-content { - width: 768px; + //width: 768px; } - .user-detail-wrapper { - height: 378px; + .right-main-content { + margin-left: 85px; + width: 600px; } .user-detail-wrapper { + //height: 378px; + } + + .user-detail-content { display: flex; - justify-content: space-between; + //justify-content: space-between; } .user-appearance-wrapper { display: flex; + margin: 0 12px; justify-content: center; align-items: center; width: 338px; - height: 100%; + height: 338px; background: url("../../assets/img/user_bg.png") no-repeat center / 100% 100%; .user-appearance-box { width: 256px; height: 256px; } + + + } + + .equipments { + width: 72px; + + .equipments-item { + margin-bottom: 12px; + height: 72px; + border: 4px solid #DCC7AF; + background: #FFF5E9; + + &:not(:empty) { + background-color: #6f553c; + } + + &.helmet-item { + border-color: #f00; + } + + &.weapon-item { + border-color: #00FF38; + } + } } .loot-wrapper { @@ -50,21 +81,31 @@ } .user-attr-wrapper { - width: 213px; + display: flex; + flex-wrap: wrap; + margin-top: 20px; + width: 478px; + height: 152px; + padding: 20px 0; font-size: 13px; line-height: 2; + border: 5px solid #BAA48B; + background: #FFF5E9; dl { + min-width: 50%; display: flex; } dt { + padding-left: 20px; margin-right: 10px; + color: #BC8C61; } .base-attr { margin-right: 10px; - color: #fff; + color: #000; } &.loaded { diff --git a/packages/client/src/components/UserInfoDialog/styles.scss b/packages/client/src/components/UserInfoDialog/styles.scss index aa912251..2c8f88f8 100644 --- a/packages/client/src/components/UserInfoDialog/styles.scss +++ b/packages/client/src/components/UserInfoDialog/styles.scss @@ -2,7 +2,6 @@ position: fixed; z-index: 1000; width: 1298px; - height: 585px; padding: 36px 66px; left: 50%; top: 50%; diff --git a/packages/client/src/components/UserPackage/index.tsx b/packages/client/src/components/UserPackage/index.tsx index 8330b7a9..c49b89ce 100644 --- a/packages/client/src/components/UserPackage/index.tsx +++ b/packages/client/src/components/UserPackage/index.tsx @@ -1,14 +1,17 @@ import React from 'react'; import gemImg from '@/assets/img/gem.png'; import './styles.scss'; +import Equipment, { IEquipment } from '@/components/Equipment'; interface IProps { title: string; gem: number; + items?: IEquipment[]; } const UserPackage = (props: IProps) => { + const { items = [], gem = 0 } = props; const arr = new Array(10).fill(0); arr[0] = props.gem; @@ -17,16 +20,19 @@ const UserPackage = (props: IProps) => {

{props.title}

+ { + gem > 0 && ( +
+ +
{gem}
+
+ ) + } { - arr.map((count, index) => { + items.map((item, index) => { return (
- { - count > 0 && (<> - -
{count}
- ) - } +
) }) diff --git a/packages/client/src/components/UserPackage/styles.scss b/packages/client/src/components/UserPackage/styles.scss index c39af267..0312e361 100644 --- a/packages/client/src/components/UserPackage/styles.scss +++ b/packages/client/src/components/UserPackage/styles.scss @@ -5,15 +5,20 @@ display: flex; justify-content: space-between; flex-wrap: wrap; + width: 600px; + padding: 12px; + min-height: 105px; + border: 5px solid #DCC7AF; + background: #FFF5E9; } .package-item { position: relative; margin-bottom: 14px; - width: 62px; - height: 62px; + width: 72px; + height: 72px; background: #FFF5E9; - border: 6px solid transparent; + border: 5px solid #DCC7AF; &:nth-child(-n+3) { border-color: #DCC7AF; diff --git a/packages/client/src/pages/game/index.tsx b/packages/client/src/pages/game/index.tsx index e3abd0c3..9d6e1742 100644 --- a/packages/client/src/pages/game/index.tsx +++ b/packages/client/src/pages/game/index.tsx @@ -475,7 +475,7 @@ const Game = () => { /> setModalVisible(false)} diff --git a/packages/client/src/pages/heroEdit/index.tsx b/packages/client/src/pages/heroEdit/index.tsx index ec72f86d..b3c31842 100644 --- a/packages/client/src/pages/heroEdit/index.tsx +++ b/packages/client/src/pages/heroEdit/index.tsx @@ -27,7 +27,7 @@ const HeroEdit = () => { return (
- + {/*
*/} {/* {*/} diff --git a/packages/client/src/pages/home/index.tsx b/packages/client/src/pages/home/index.tsx index 0a1be83b..7dcdc0b2 100644 --- a/packages/client/src/pages/home/index.tsx +++ b/packages/client/src/pages/home/index.tsx @@ -372,7 +372,7 @@ const Home = () => { ) } setModalVisible(false)} diff --git a/packages/client/tsconfig.json b/packages/client/tsconfig.json index e3762749..5926a059 100644 --- a/packages/client/tsconfig.json +++ b/packages/client/tsconfig.json @@ -6,7 +6,7 @@ "module": "ESNext", "lib": ["ESNext", "DOM"], "moduleResolution": "Node", - "strict": true, + "strict": false, "resolveJsonModule": true, "isolatedModules": true, "esModuleInterop": true, From 8d268d000b1b5fbe87f88eba750fbe3dec4a86be Mon Sep 17 00:00:00 2001 From: vivomo <929992114@qq.com> Date: Sun, 26 Nov 2023 22:01:58 +0800 Subject: [PATCH 4/4] feat: hide loot --- packages/client/src/components/Equipment/styles.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/client/src/components/Equipment/styles.scss b/packages/client/src/components/Equipment/styles.scss index fe64525d..20d5e5dd 100644 --- a/packages/client/src/components/Equipment/styles.scss +++ b/packages/client/src/components/Equipment/styles.scss @@ -67,6 +67,6 @@ } &:hover .equipment-info { - display: block; + //display: block; } } \ No newline at end of file