init

src/lib/api.ts

@@ -0,0 +1,65 @@
+import useSocketStore from "@/stores/socketSettingStore";
+import { AvatarHakushiType, AvatarType } from "@/types/avatar";
+
+
+export async function checkConnectTcpApi(): Promise<boolean> {
+    const { host, port, connectionType } = useSocketStore.getState()
+    let url = `${host}:${port}/check-tcp`
+    if (connectionType === "FireflyPSLocal") {
+        url = "http://localhost:21000/check-tcp"
+    }
+    const response = await fetch(url, {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/json',
+        },
+    });
+
+    if (response.ok) {
+        const data = await response.json();
+        return data.status
+    }
+    return false
+}
+
+export async function getCharacterListApi(): Promise<AvatarType[]> {
+    const res = await fetch('/api/hakushin', {
+        method: 'GET',
+        headers: {
+            'Content-Type': 'application/json',
+        },
+    });
+
+    if (!res.ok) {
+        console.log(`Error ${res.status}: ${res.statusText}`);
+        return [];
+    }
+
+    const data: Map<string, AvatarHakushiType> = new Map(Object.entries(await res.json()));
+
+
+    return Array.from(data.entries()).map(([id, it]) => convertAvatar(id, it));
+}
+
+
+function convertAvatar(id: string, item: AvatarHakushiType): AvatarType {
+    const lang = new Map<string, string>([
+        ['en', item.en],
+        ['kr', item.kr],
+        ['cn', item.cn],
+        ['jp', item.jp]
+    ]);
+
+    const result: AvatarType = {
+        release: item.release,
+        icon: item.icon,
+        rank: item.rank,
+        baseType: item.baseType,
+        damageType: item.damageType,
+        desc: item.desc,
+        lang: lang,
+        id: id  
+    };
+
+    return result;
+}

src/lib/socket.ts

@@ -0,0 +1,125 @@
+import { io, Socket } from "socket.io-client";
+import useSocketStore from "@/stores/socketSettingStore";
+import { toast } from 'react-toastify';
+import useBattleDataStore from "@/stores/battleDataStore";
+
+let socket: Socket | null = null;
+
+
+const onBattleBegin = () => {
+    notify("Battle Started!", "info")
+}
+
+const notify = (msg: string, type: 'info' | 'success' | 'error' = 'info') => {
+    if (type === 'success') toast.success(msg);
+    else if (type === 'error') toast.error(msg);
+    else toast.info(msg);
+};
+
+export const connectSocket = (): Socket => {
+    const { host, port, connectionType, setStatus } = useSocketStore.getState();
+    const { 
+        onSetBattleLineupService,
+        onTurnEndService,
+        onUseSkillService,
+        onKillService,
+        onDamageService,
+        onBattleEndService,
+        onTurnBeginService
+    } = useBattleDataStore.getState();
+
+    let url = `${host}:${port}`;
+    if (connectionType === "FireflyPSLocal") {
+        url = "http://localhost:21000"
+    }
+
+    if (socket) {
+        socket.disconnect();
+    }
+
+    socket = io(url, {
+        reconnectionAttempts: 5,
+        timeout: 10000,
+        autoConnect: true,
+    });
+
+    socket.on("connect", () => {
+        console.log("Socket connected");
+        setStatus(true);
+    });
+
+    socket.on("disconnect", () => {
+        console.log("Socket disconnected");
+        setStatus(false);
+    });
+
+    socket.on("connect_error", (err) => {
+        console.error("Connection error:", err);
+        setStatus(false);
+    });
+
+    socket.on("connect_timeout", () => {
+        console.warn("Connection timeout");
+        setStatus(false);
+    });
+
+    socket.on("reconnect_failed", () => {
+        console.error("Reconnect failed");
+        setStatus(false);
+    });
+
+    const onConnect = () => {
+        setStatus(true);
+        notify(`Kết nối thành công với Socket ID: ${socket?.id}`, 'success');
+    };
+
+    if (isSocketConnected()) onConnect();
+
+    socket.on("SetBattleLineup", (json) => onSetBattleLineupService(JSON.parse(json)));
+    socket.on("TurnEnd", (json) => onTurnEndService(JSON.parse(json)));
+    socket.on("OnUseSkill", (json) => onUseSkillService(JSON.parse(json)));
+    socket.on("OnKill", (json) => onKillService(JSON.parse(json)));
+    socket.on("OnDamage", (json) => onDamageService(JSON.parse(json)));
+    socket.on('BattleBegin', () => onBattleBegin());
+    socket.on('TurnBegin', (json) => onTurnBeginService(JSON.parse(json)));
+    socket.on('BattleEnd', (json) => onBattleEndService(JSON.parse(json)));
+
+    socket.on("Error", (msg: string) => {
+        console.error("Server Error:", msg);
+    });
+
+    return socket;
+};
+
+export const disconnectSocket = (): void => {
+    const { 
+        onSetBattleLineupService,
+        onTurnEndService,
+        onUseSkillService,
+        onKillService,
+        onDamageService,
+        onBattleEndService,
+        onTurnBeginService
+    } = useBattleDataStore.getState();
+    if (socket) {
+        socket.off("SetBattleLineup", (json) => onSetBattleLineupService(JSON.parse(json)));
+        socket.off("TurnEnd", (json) => onTurnEndService(JSON.parse(json)));
+        socket.off("OnUseSkill", (json) => onUseSkillService(JSON.parse(json)));
+        socket.off("OnKill", (json) => onKillService(JSON.parse(json)));
+        socket.off("OnDamage", (json) => onDamageService(JSON.parse(json)));
+        socket.off('BattleBegin', () => onBattleBegin());
+        socket.off('TurnBegin', (json) => onTurnBeginService(JSON.parse(json)));
+        socket.off('BattleEnd', (json) => onBattleEndService(JSON.parse(json)));
+        socket.offAny();
+        socket.disconnect();
+        useSocketStore.getState().setStatus(false);
+    }
+};
+
+export const isSocketConnected = (): boolean => {
+    return socket?.connected || false;
+};
+
+export const getSocket = (): Socket | null => {
+    return socket;
+};