import { useState, useEffect } from 'react';
import { ArrowRight } from 'lucide-react';
const CarGame = () => {
const [carPosition, setCarPosition] = useState(0);
const [obstaclePosition, setObstaclePosition] = useState(100);
const [score, setScore] = useState(0);
const [gameOver, setGameOver] = useState(false);
useEffect(() => {
const intervalId = setInterval(() => {
if (!gameOver) {
setObstaclePosition(obstaclePosition - 10);
if (obstaclePosition < 0) {
setObstaclePosition(100);
setScore(score + 1);
}
if (obstaclePosition < 20 && carPosition === 0) {
setGameOver(true);
}
}
}, 100);
return () => clearInterval(intervalId);
}, [obstaclePosition, gameOver, carPosition, score]);
const handleMoveCar = (direction: number) => {
if (carPosition + direction >= 0 && carPosition + direction < 2) {
setCarPosition(carPosition + direction);
}
};
const handleRestartGame = () => {
setCarPosition(0);
setObstaclePosition(100);
setScore(0);
setGameOver(false);
};
return (
Car Game
{carPosition === 0 ? (
) : (
)}
{carPosition === 1 ? (
) : (
)}
{obstaclePosition < 50 ? (
) : (
)}
Score: {score}
{gameOver ? (
Game Over!
) : (
)}
);
};
export default CarGame;
