Skip to content

Commit

Permalink
add engine to loading
Browse files Browse the repository at this point in the history
  • Loading branch information
iFwu committed Oct 7, 2024
1 parent ce66ad5 commit 38a4b03
Show file tree
Hide file tree
Showing 3 changed files with 15 additions and 12 deletions.
7 changes: 4 additions & 3 deletions src/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -38,8 +38,9 @@ export function App() {
}>();

const { templates, isLoading: isOpenCVLoading } = useOpenCV();
const { bestMove, loading, error, fetchBestMove, setBestMove } = useChessEngine();
const { bestMove, isCalculating, error, fetchBestMove, setBestMove, isEngineReady } = useChessEngine();
const { depth, setDepth } = useDepth();
const isLoading = isOpenCVLoading || !isEngineReady;

useEffect(() => {
if (fenCode) {
Expand Down Expand Up @@ -149,7 +150,7 @@ export function App() {
processImage(img);
};

if (isOpenCVLoading) {
if (isLoading) {
return (
<div className="loading-overlay">
<Spinner />
Expand All @@ -170,7 +171,7 @@ export function App() {
<div className="left-column">
<SolutionDisplay
bestMove={bestMove}
loading={loading}
isCalculating={isCalculating}
error={error}
onNextMove={handleNextMove}
onPreviousMove={handlePreviousMove}
Expand Down
8 changes: 4 additions & 4 deletions src/components/SolutionDisplay.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { moveToChineseNotation } from '../chessboard/moveHelper';

interface SolutionDisplayProps {
bestMove: string;
loading: boolean;
isCalculating: boolean;
error: string | null;
onNextMove: () => void;
onPreviousMove: () => void;
Expand All @@ -14,7 +14,7 @@ interface SolutionDisplayProps {

export function SolutionDisplay({
bestMove,
loading,
isCalculating,
error,
onNextMove,
onPreviousMove,
Expand Down Expand Up @@ -59,13 +59,13 @@ export function SolutionDisplay({
</button>
<button
onClick={onNextMove}
disabled={loading || !bestMove || isGameOver}
disabled={isCalculating || !bestMove || isGameOver}
>
下一步
</button>
</div>
<div className="solution-debug">
{loading && <p>正在计算最佳走法...</p>}
{isCalculating && <p>正在计算最佳走法...</p>}
{error && <p style={{ color: 'red' }}>{error}</p>}
{!isGameOver && bestMove && (
<p>
Expand Down
12 changes: 7 additions & 5 deletions src/hooks/useChessEngine.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,14 +4,16 @@ import { ChessEngine } from '../chessEngine';
export function useChessEngine() {
const [engine, setEngine] = useState<ChessEngine | null>(null);
const [bestMove, setBestMove] = useState('');
const [loading, setLoading] = useState(false);
const [isCalculating, setIsCalculating] = useState(false);
const [error, setError] = useState<string | null>(null);
const [isEngineReady, setIsEngineReady] = useState(false);

useEffect(() => {
const initializeEngine = async () => {
const newEngine = new ChessEngine();
await newEngine.initEngine();
setEngine(newEngine);
setIsEngineReady(true);
};

initializeEngine();
Expand All @@ -20,23 +22,23 @@ export function useChessEngine() {
const fetchBestMove = useCallback(
async (fen: string, depth: number) => {
if (!engine) return;
setLoading(true);
setIsCalculating(true);
setError(null);
try {
const move = await engine.getBestMove(fen, depth);
setBestMove(move);
if (move === 'red_wins' || move === 'black_wins') {
setLoading(false);
setIsCalculating(false);
return;
}
} catch (err: any) {
setError(`Error: ${err.message}`);
} finally {
setLoading(false);
setIsCalculating(false);
}
},
[engine]
);

return { engine, bestMove, loading, error, fetchBestMove, setBestMove };
return { engine, bestMove, isCalculating, error, fetchBestMove, setBestMove, isEngineReady };
}

0 comments on commit 38a4b03

Please sign in to comment.