From f04310b7776b7728ffc9e27b61667d70865dd237 Mon Sep 17 00:00:00 2001 From: Dat Hoang Date: Mon, 23 Oct 2023 10:22:20 +0700 Subject: [PATCH 1/3] prevent send on the same move --- app/(basic)/rooms/[id]/Game.tsx | 24 ++++++++++++++---------- 1 file changed, 14 insertions(+), 10 deletions(-) diff --git a/app/(basic)/rooms/[id]/Game.tsx b/app/(basic)/rooms/[id]/Game.tsx index a81141e..dd207f1 100644 --- a/app/(basic)/rooms/[id]/Game.tsx +++ b/app/(basic)/rooms/[id]/Game.tsx @@ -1,10 +1,11 @@ 'use client' -import StoreKeys from '@/lib/constants/storeKeys' +import LoadingBBQ from '@/components/ui/LoadingBBQ' +import useGetRoomById from '@/features/room/useGetRoomById' +import { User } from '@/features/user/user.types' import GameBoard from '@/lib/game/Board' import GamePiece from '@/lib/game/QuanCo/Piece' import useSignalR from '@/lib/hooks/useSignalR' -import localStorageService from '@/lib/services/localStorage.service' import { DndContext, DragEndEvent, @@ -13,20 +14,16 @@ import { } from '@dnd-kit/core' import { HubConnectionState } from '@microsoft/signalr' import { AxiosError } from 'axios' -import { useCallback, useEffect, useMemo, useRef, useState } from 'react' +import { enqueueSnackbar } from 'notistack' +import { useCallback, useEffect, useRef, useState } from 'react' import Board from './Board' import Cell from './Cell' import ChatBox from './LeftArea/ChatBox' +import { MessageProps } from './LeftArea/ChatBubble' import MenuBox from './LeftArea/MenuBox' import Piece, { DraggablePiece } from './Piece' -import WaitingContainer from './WaitingContainer' -import { MessageProps } from './LeftArea/ChatBubble' -import { useStore } from '@/lib/zustand/store' import PlayerArea from './RightArea/PlayerArea' -import { enqueueSnackbar } from 'notistack' -import { User } from '@/features/user/user.types' -import useGetRoomById from '@/features/room/useGetRoomById' -import LoadingBBQ from '@/components/ui/LoadingBBQ' +import WaitingContainer from './WaitingContainer' type GameProps = { roomCode: string @@ -234,6 +231,13 @@ function Game({ roomCode, accessToken, user }: GameProps) { setMovingPiece(null) + if ( + sourceCoord.x === destinationCoord.x && + sourceCoord.y === destinationCoord.y + ) { + return + } + if (!movingPiece.piece.isValidMove(destinationCoord, board)) { // setBoard((b) => // b.movePiece(movingPiece.piece, { x: cellX, y: cellY }) From 313d085d86a95d2fec542ddfeb3fe7f2e52061b0 Mon Sep 17 00:00:00 2001 From: Dat Hoang Date: Mon, 23 Oct 2023 10:26:06 +0700 Subject: [PATCH 2/3] removed some useless codes --- app/(basic)/rooms/[id]/Game.tsx | 5 ----- 1 file changed, 5 deletions(-) diff --git a/app/(basic)/rooms/[id]/Game.tsx b/app/(basic)/rooms/[id]/Game.tsx index dd207f1..b05aa6f 100644 --- a/app/(basic)/rooms/[id]/Game.tsx +++ b/app/(basic)/rooms/[id]/Game.tsx @@ -227,8 +227,6 @@ function Game({ roomCode, accessToken, user }: GameProps) { y: cellY, } - // const potentialExistingPiece = board.squares[cellY][cellX] - setMovingPiece(null) if ( @@ -239,9 +237,6 @@ function Game({ roomCode, accessToken, user }: GameProps) { } if (!movingPiece.piece.isValidMove(destinationCoord, board)) { - // setBoard((b) => - // b.movePiece(movingPiece.piece, { x: cellX, y: cellY }) - // ) return enqueueSnackbar('Nước đi không hợp lệ!', { variant: 'error', }) From 3f3bc0bdc21fdf55cc899d2ee79277719e741f38 Mon Sep 17 00:00:00 2001 From: Dat Hoang Date: Mon, 23 Oct 2023 11:05:45 +0700 Subject: [PATCH 3/3] added move sfx --- app/(basic)/rooms/[id]/Game.tsx | 12 ++++++++++++ public/sfx/piece-move.mp3 | Bin 0 -> 4248 bytes 2 files changed, 12 insertions(+) create mode 100644 public/sfx/piece-move.mp3 diff --git a/app/(basic)/rooms/[id]/Game.tsx b/app/(basic)/rooms/[id]/Game.tsx index b05aa6f..71fe2d1 100644 --- a/app/(basic)/rooms/[id]/Game.tsx +++ b/app/(basic)/rooms/[id]/Game.tsx @@ -41,6 +41,7 @@ const systemMsgProps = { function Game({ roomCode, accessToken, user }: GameProps) { const audioMsgRef = useRef(null) + const audioMoveRef = useRef(null) const audioWonRef = useRef(null) const [board, setBoard] = useState(new GameBoard()) const [movingPiece, setMovingPiece] = useState<{ @@ -134,6 +135,7 @@ function Game({ roomCode, accessToken, user }: GameProps) { destination: CoordinationType, isRedTurn: boolean ) => { + audioMoveRef.current?.play() setBoard((b) => b.move(source, destination, isRedTurn)) } ) @@ -201,6 +203,15 @@ function Game({ roomCode, accessToken, user }: GameProps) { }, ]) }) + + connection.on('HostLeft', (seconds: number) => { + enqueueSnackbar( + `Phòng sẽ bị xóa sau ${seconds} giây nếu chủ phòng không vào lại`, + { + variant: 'warning', + } + ) + }) }, []) useEffect(() => { @@ -411,6 +422,7 @@ function Game({ roomCode, accessToken, user }: GameProps) { > +
9M3AN^AU*UdC?dT{7X=lR z9zd!TDT)+9MMNZEK`_7M-plXJ+&|vjnK$n<2MZ|4Vo`gBh9nAr=)Q*GN6z{N%AbhAWJC#aFMQ~^^NtD!;ZgODus)#ANc#P zcSbzDRR@gI?Tr7lv%@5)lu{xyW0*LHAAr^k_-lNd8Njh?>>gdl{~*TRBAL@SzxHsr z?<;<*Lp~*KW890JEm)nC-_d0hozErg;`9fQ$D_Mf6N(3nbyxyW=6FYxQ%As<;Snf+ z3&P`m^*T_)+`3ZT!?Un_%MbH|t9gA{?6y~}E?dJ>p+~u4DQ#dSxc70;vZ5SkfmjLS zbg^B$Y>@~XccbRVLAIVU9&%~oTZQi&nQ1;nH>MDix|SM`H#LeecHswO^Q~1aZ{Jc6 z!l~4RmV_X!(Xw9uwoIN2AlSl&>o@A&6N*qniC=(MzOZJnPiJ(Rr&8S;T~x8sqbCY6 zkO+T`&giBa-(*47)&NtOc)RZ<{X7@u8XGq%C5yOw90`X>`>?hht`DH78=mXG+?7=6 z?8{s`yPXwEzVoOYuQ{FG=@FFefixU5_M`d=6bAX`Ev>cXvT7C@ zJMRjBV`tC_((Zi7H22E5Wk$xBkqa`XR*dkK$MriDTLDf`i1kaqkO@#$F>Vy1xDYSP zC_iD8?TeP2)!|_o^Dc#i09W#&Iipgo`hK@n1z{6N-~dEZ7vWa&@20`!9Vb&}jXQp% zQlFH3Z7#4PxYuc$!TLf*B#Ur&qz(3N0rCwYDO+jESi~-9Ip~_0sM&{oG_&>{K8tHq zN)Pdi-&SziTi52u=ksD(CyBOmxS}2x$aslPTC5Cej{!J&>@Iq~7|Lze>O+wWwNt?E z_pD*XuWtAz6qd#869SJI++0@8=C7{#!g_V%I4Bp}lkI)?hn}CALi3nF3;Vu%^};8G z>WwL-;oYtM+;msDTw$x9=qz67TM(yfKJZd`l{9rA~Uuq5?MY_+|0!w zQ^g&qJUF0I>6YdS|lkJh52Y zQX%V+zJ)Hz*YcB@^5@$=;yg102?iu7YwLijC~wq&ol|%65tcEPk8(&g0ckDwQ_iZI zCLJ-~SQK^c+c+5MddcA;lW)dzdYIxu^C%Dr8Ef4r=Z;?EW8^Y`Tp;SU*_nD~3oYAZ z{8cbC9_{^J?j0UY`h3FP+BY6-+T0yXDZC^Yd_iX{5YWeH!D009@+>iZF|mG%sd?|U zmw#)SaFaccGGCc8XEF-1W$0VuE*kM3`3Zx6#hd@+vFXIH&Z(9dz7*=jD=RruNEp=7 zpT6H-O1|VJqz=7HqsKci0su&s9MFlEZ*b+g1!-@5c#ElK5Cd7A&AZS4Kpqt zW3p+1KSZXud7rg5G@i*2LxJMX5-$3Sv2ErpF21e`NDl3c@0g${NGzF8bYn;hrK6AT z+vLB!)F|aAYGk0?`f(t4ph>T3tCor6hV!2RR0gLHb65o8VXz~NhnA1wQZ~7|S zDajT4dRo5xmDKIJH^DusOoore(GtgFEwb%K&L}KZS;|X?J8U?QZUnV|_H?NHkuMv0 zoPElB|2#f7e~GAHCn>3w;-7&oGmd6sN|#UWtmRb5k!U7e{z|EcEPJT8L)$FOeTW>EL1e>|a=#EjnH>rEisq5JoS(0VE6}D65 zd91Kdc_V0MQLOTvv!;dO)CzsSO>^I1HIvv72GHXj*Z}~bfE9TRd?@cYTaEZRO~^+5U(>4pGXc-r2OTF zS~G-oOKL@pyv+K053G}nt6jt( zyJ4c5i2dRDR{F6~e&DFE2Uf&IH$gPM@Vm#OD)YojF6R_~->*?qmd$YiRRd9uSLW^W z<)G>~Xr`N2ARqsTX~}r`u2jN2OHvUc5NoAy51R2!N%sK(bh&j81B=vXOM}3SoC)CD#qzDG2~g( zU1Mq9J4Z!!=f)?$AtDuoV^jO$9n(m(d?1?m5n;@(eN9cw^HBfMrk?b8ZMY2yK^QC`mPbVQl9f}T?AK->7O zpEFwO#-45#BVu_Lc(tbiFq|!Qzk2OPN^UhTM23=8QidS8WM9#mXgzo)Rn50DdwdFX z%OT5*K(efZz)q(EEuUNriBUO20FD*aVso$-nKOK5Toh_o}deSK^4jH17bD@C0wj=hB24Kum-lJf+Xr zLr^CmanJc;)=`9hpjeLir$Op9f>HY9(#uvi#f-LxL9Z(0DdN1t`~D90YA~;1Ds|0$ z>W9JOYKXZwgh5uT5LO9Nfk!D>8i1*q%2HYh{?sL#>P%J{lgnQ0Ld+Qwb{H#kS=0DW zaev#Dj+r0buD+cM&~RlEM1kAWmt2itR@%>0Je zk(Z?LC4MevPL6JPJuJ&?tZ=N@zQ^B)Fb)+xs9Wc~`yr>_sW(arIhocJ z2S;YUP(tcGXM#U?*)p`YYOBJax$;ssGTkh)!**x~>7JYLsMvfKntSlWB3Q2`x#sdBC$Sl%Yz#{@jHyc~?)7x+2Sk?X>au9wQ9-17BZpvm z5u;)4oj>)%mV6{%;Y11nf8Xzz$xne_%P|U~OynHp0Q_y;Mq7*iT~oRA@-f{0PKDXX zhk=IdL8G}3FPwTyj+_WHI3mS4ezQc|3(!+Fy)xLWx4!c!ID$9P-Q2hOXd)usvJ@qi zn-Zn*%atA5wZX{-@1ziX8;F;W*Mz1;xJMZ9FefA*iEiLy81}?R zk;ffK2%jbw*0+eLWs5pNU7lW{&V{)t_VRYLfye24SmaV(y{o%VP^2Fdt~aL9aWJh4 z3e$+XHUafk8&#fI54Gy2Qmzo+A8j`jqUo_a)T6`?%(q2Yrj2CBrxuIDeT}}~Jn=5V zrv!E9{p^k-U(mJgxrFu+aW$ba(F|0T~pyj%T$UbaUW7MdqM!?-f*b%GnvIxbDoX;hL1%}f$Rex z)j9)3*~ZmmBgcCQ&RV&IhkeN>esAB<