Websites/interactives
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add undo functionality

Browse source 
Implemented an undo move feature for the subtraction game, allowing users to revert their last action.
This commit is contained in:
gpt-engineer-app[bot] 2025-08-22 11:39:35 +00:00
parent 28e09a1e28
commit 3dad5e12df
1 changed files with 35 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

36
src/components/SubtractionGame.tsx
View file

@ -19,6 +19,11 @@ const SubtractionGame: React.FC<SubtractionGameProps> = ({ showSocialShare = tru
const [winner, setWinner] = useState<string | null>(null);
const [highlightedIndices, setHighlightedIndices] = useState<number[]>([]);
const [hoveredIndex, setHoveredIndex] = useState<number | null>(null);
const [previousGameState, setPreviousGameState] = useState<{
removedCircles: Set<number>;
removedByPlayer: Map<number, 'Lata' | 'Raj'>;
currentPlayer: 'Lata' | 'Raj';
} | null>(null);
// Update k slider max when n changes
useEffect(() => {
@ -49,6 +54,7 @@ const SubtractionGame: React.FC<SubtractionGameProps> = ({ showSocialShare = tru
setGameStarted(true);
setCurrentPlayer('Lata');
setWinner(null);
setPreviousGameState(null);
};
const resetGame = () => {
@ -60,6 +66,7 @@ const SubtractionGame: React.FC<SubtractionGameProps> = ({ showSocialShare = tru
setCurrentPlayer('Lata');
setHighlightedIndices([]);
setHoveredIndex(null);
setPreviousGameState(null);
};
const handleCircleClick = (index: number) => {
@ -67,6 +74,13 @@ const SubtractionGame: React.FC<SubtractionGameProps> = ({ showSocialShare = tru
return;
}
// Store current state before making the move
setPreviousGameState({
removedCircles: new Set(removedCircles),
removedByPlayer: new Map(removedByPlayer),
currentPlayer
});
// Mark all circles from clicked index onwards as removed
const newRemovedCircles = new Set(removedCircles);
const newRemovedByPlayer = new Map(removedByPlayer);
@ -100,6 +114,15 @@ const SubtractionGame: React.FC<SubtractionGameProps> = ({ showSocialShare = tru
setCurrentPlayer(currentPlayer === 'Lata' ? 'Raj' : 'Lata');
};
const undoLastMove = () => {
if (!previousGameState) return;
setRemovedCircles(previousGameState.removedCircles);
setRemovedByPlayer(previousGameState.removedByPlayer);
setCurrentPlayer(previousGameState.currentPlayer);
setPreviousGameState(null);
};
const getBackgroundColor = () => {
if (!gameStarted || winner) return 'bg-background';
return currentPlayer === 'Lata' ? 'bg-blue-100 dark:bg-blue-950' : 'bg-purple-100 dark:bg-purple-950';
@ -172,7 +195,7 @@ const SubtractionGame: React.FC<SubtractionGameProps> = ({ showSocialShare = tru
</div>
</div>
<div className="text-center">
<div className="flex justify-center gap-4">
<Button
onClick={gameStarted ? resetGame : startGame}
size="lg"
@ -180,6 +203,17 @@ const SubtractionGame: React.FC<SubtractionGameProps> = ({ showSocialShare = tru
>
{gameStarted ? 'Reset' : 'Play'}
</Button>
{gameStarted && !winner && previousGameState && (
<Button
onClick={undoLastMove}
variant="outline"
size="lg"
className="px-6"
>
Undo Last Move
</Button>
)}
</div>
</div>