up

2026-01-24 13:35:11 +07:00
parent 6c3e93636e
commit 65fd0158a3
145 changed files with 10262 additions and 0 deletions
--- a/G102-sequence/sdk/package/dist/esm/kit/react/GameTestPlayer.js
+++ b/G102-sequence/sdk/package/dist/esm/kit/react/GameTestPlayer.js
@@ -0,0 +1,112 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef, useEffect, useState } from 'react';
+import { useGameIframeSDK } from '../../useGameIframeSDK';
+/**
+ * GameTestPlayer - Component test đơn giản
+ *
+ * Chỉ load game data vào iframe, KHÔNG gọi API
+ * Dùng để test game iframe locally
+ *
+ * @example
+ * ```tsx
+ * <GameTestPlayer
+ *   gameUrl="http://localhost:3000/game"
+ *   gameData={[
+ *     { id: 1, question: "What is 2+2?", options: ["3","4","5"], answer: "4" },
+ *     { id: 2, question: "Capital of France?", options: ["London","Paris","Berlin"], answer: "Paris" }
+ *   ]}
+ *   debug={true}
+ *   onLog={(msg, type) => console.log(`[${type}] ${msg}`)}
+ *   onAnswer={(data) => console.log('Answer:', data)}
+ *   onComplete={(result) => console.log('Complete:', result)}
+ * />
+ * ```
+ */
+export const GameTestPlayer = ({ gameUrl, gameData, userId = 'test_user', gameId = 'test_game', extraData, endTimeIso, className, style, debug = false, onAnswer, onComplete, onLog, onLeaderboardRequest, mockLeaderboard }) => {
+    const iframeRef = useRef(null);
+    const [isLoading, setIsLoading] = useState(true);
+    // SDK Hook
+    const { isReady, sendGameData, sendLeaderboard } = useGameIframeSDK({
+        iframeRef,
+        iframeOrigin: '*',
+        debug,
+        onGameReady: () => {
+            if (onLog)
+                onLog('[TEST] Iframe Ready', 'success');
+            setIsLoading(false);
+        },
+        onAnswerReport: (data) => {
+            if (onLog)
+                onLog(`[TEST] Answer: ${JSON.stringify(data)}`, 'info');
+            if (onAnswer)
+                onAnswer(data);
+        },
+        onFinalResult: (result) => {
+            if (onLog)
+                onLog(`[TEST] Complete: ${JSON.stringify(result)}`, 'success');
+            if (onComplete)
+                onComplete(result);
+        },
+        onLeaderboardRequest: (top) => {
+            if (onLog)
+                onLog(`[TEST] Leaderboard Request: top=${top}`, 'info');
+            if (onLeaderboardRequest)
+                onLeaderboardRequest(top);
+            // Auto send mock leaderboard if provided
+            if (mockLeaderboard) {
+                if (onLog)
+                    onLog(`[TEST] Sending mock leaderboard`, 'info');
+                sendLeaderboard(mockLeaderboard);
+            }
+        }
+    });
+    // Auto send game data when ready
+    useEffect(() => {
+        if (isReady && gameData) {
+            const payload = {
+                game_id: String(gameId),
+                user_id: userId,
+                data: gameData,
+                completed_question_ids: [],
+                ...(extraData || {})
+            };
+            if (endTimeIso) {
+                payload.end_time_iso = endTimeIso;
+            }
+            if (onLog)
+                onLog(`[TEST] Sending Game Data: ${gameData.length} items`, 'info');
+            sendGameData(payload);
+        }
+    }, [isReady, gameData, gameId, userId, extraData, endTimeIso, sendGameData, onLog]);
+    return (_jsxs("div", { style: { position: 'relative', width: '100%', height: '100%', ...style }, children: [isLoading && (_jsx("div", { style: {
+                    position: 'absolute',
+                    top: 0,
+                    left: 0,
+                    right: 0,
+                    bottom: 0,
+                    display: 'flex',
+                    alignItems: 'center',
+                    justifyContent: 'center',
+                    backgroundColor: 'rgba(255,255,255,0.9)',
+                    zIndex: 10
+                }, children: _jsxs("div", { style: { textAlign: 'center' }, children: [_jsx("div", { style: {
+                                width: '40px',
+                                height: '40px',
+                                border: '4px solid #e9ecef',
+                                borderTop: '4px solid #007bff',
+                                borderRadius: '50%',
+                                animation: 'spin 1s linear infinite',
+                                margin: '0 auto 1rem'
+                            } }), _jsx("p", { style: { color: '#6c757d' }, children: "Loading game..." }), _jsx("style", { children: `
+                            @keyframes spin {
+                                0% { transform: rotate(0deg); }
+                                100% { transform: rotate(360deg); }
+                            }
+                        ` })] }) })), _jsx("iframe", { ref: iframeRef, src: gameUrl, className: className, style: {
+                    width: '100%',
+                    height: '100%',
+                    border: 'none'
+                }, allowFullScreen: true })] }));
+};
+export default GameTestPlayer;
+//# sourceMappingURL=GameTestPlayer.js.map