Puntos: {score}
import { useState } from ‘react’
import { Button } from «/components/ui/button»
import { Card, CardContent, CardHeader, CardTitle } from «/components/ui/card»
import { ArrowRight } from «lucide-react»
import { motion, useAnimation } from «framer-motion»
export default function BasketballGame() {
const [score, setScore] = useState(0)
const [ballPosition, setBallPosition] = useState({ x: 0, y: 0 })
const [isBallInBasket, setIsBallInBasket] = useState(false)
const ballControls = useAnimation()
const launchBall = () => {
const targetX = Math.random() * 300 – 150 // Random horizontal position
const targetY = Math.random() * 200 – 200 // Random vertical position
ballControls.start({
x: targetX,
y: targetY,
transition: {
duration: 1,
ease: «easeInOut»,
onComplete: () => {
checkIfBallInBasket(targetX, targetY)
resetBallPosition()
},
},
})
}
const checkIfBallInBasket = (x: number, y: number) => {
// Simple check to see if the ball is within the basket area
if (x >= -20 && x <= 20 && y <= -150) {
setScore(score + 10)
setIsBallInBasket(true)
} else {
setIsBallInBasket(false)
}
}
const resetBallPosition = () => {
ballControls.start({ x: 0, y: 0 })
}
return (
Juego de Tiro al Baloncesto
)
}
Share
Refresh
Version 1 of 1