85 lines
1.5 KiB
TypeScript
85 lines
1.5 KiB
TypeScript
import { useEffect } from 'react';
|
|
import { socket } from '@/socket';
|
|
import throttle from '@/tools/throttle';
|
|
|
|
import type { GameUpdate, Tilt } from '@/types';
|
|
|
|
interface UseSocketProps {
|
|
gameID: string;
|
|
setGameData: (gameUpdate: GameUpdate) => void;
|
|
setNoGame: (noGame: boolean) => void;
|
|
}
|
|
|
|
export default function useSocket({ gameID, setGameData, setNoGame }: UseSocketProps) {
|
|
useEffect(() => {
|
|
if (gameID) {
|
|
socket.emit('join', gameID);
|
|
|
|
socket.on('init', (data: GameUpdate) => {
|
|
setGameData(data);
|
|
});
|
|
|
|
socket.on('game-update', (data: GameUpdate) => {
|
|
setGameData(data);
|
|
});
|
|
|
|
socket.on('join-error', (error) => {
|
|
console.error('Error:', error);
|
|
setNoGame(true);
|
|
});
|
|
|
|
socket.on('flip-error', (error) => {
|
|
console.error('Error:', error);
|
|
});
|
|
}
|
|
|
|
return () => {
|
|
socket.removeAllListeners();
|
|
};
|
|
}, [gameID]);
|
|
|
|
const flipCard = (cardIndex: number) => {
|
|
socket.emit('flip-card', {
|
|
gameID,
|
|
cardIndex,
|
|
});
|
|
};
|
|
|
|
const handleSettings = (gameData: GameUpdate) => {
|
|
socket.emit('settings', {
|
|
gameID,
|
|
gameData,
|
|
});
|
|
};
|
|
|
|
const redraw = (cardIndex: number) => {
|
|
socket.emit('redraw', {
|
|
gameID,
|
|
cardIndex,
|
|
});
|
|
};
|
|
|
|
const select = (cardIndex: number, cardID: string) => {
|
|
socket.emit('select', {
|
|
gameID,
|
|
cardIndex,
|
|
cardID,
|
|
});
|
|
};
|
|
|
|
const emitTilt = throttle((cardIndex: number, tilt: Tilt) => {
|
|
socket.emit('tilt', {
|
|
cardIndex,
|
|
tilt,
|
|
});
|
|
}, 33.3);
|
|
|
|
return {
|
|
flipCard,
|
|
handleSettings,
|
|
redraw,
|
|
select,
|
|
emitTilt,
|
|
};
|
|
}
|